Added logic to support adding and editing of public notes

This commit is contained in:
keannu125 2023-03-29 19:37:17 +08:00
parent 9bd19b2baf
commit 906063a2a2
5 changed files with 37 additions and 8 deletions

View file

@ -13,6 +13,7 @@ export default function Note(props: NoteProps) {
mutationFn: DeleteNote,
onSuccess: () => {
queryClient.invalidateQueries("notes");
queryClient.invalidateQueries("public_notes");
},
});
return (
@ -30,6 +31,7 @@ export default function Note(props: NoteProps) {
<p style={styles.text_medium}>
Timestamp: {String(props.date_created)}
</p>
<p style={styles.text_medium}>Public: {props.public ? "Yes" : "No"}</p>
<div style={styles.flex_row}>
<Button
style={styles.button_red}

View file

@ -16,9 +16,7 @@ export default function Notes() {
isLoading,
error,
} = useQuery("notes", GetNotes, { retry: 0 });
const logged_in = useSelector(
(state: RootState) => state.logged_in.value
);
const logged_in = useSelector((state: RootState) => state.logged_in.value);
if (isLoading) {
return (
<div style={styles.note}>
@ -65,6 +63,7 @@ export default function Notes() {
content={note.content}
date_created={note.date_created}
owner={note.owner}
public={note.public}
/>
);
})}

View file

@ -6,6 +6,7 @@ export interface NoteProps {
id: number;
date_created: Date;
owner: string;
public: boolean;
}
export interface IconProps {
@ -34,10 +35,12 @@ export interface ActivationParams {
export interface AddNoteParams {
title: string;
content: string;
public: boolean;
}
export interface UpdateNoteParams {
id: number;
title: string;
content: string;
public: boolean;
}

View file

@ -1,5 +1,5 @@
import styles from "../../styles";
import { Button } from "@mui/material";
import { Button, Checkbox } from "@mui/material";
import { useNavigate } from "react-router-dom";
import { useState } from "react";
import Header from "../../Components/Header/Header";
@ -14,12 +14,14 @@ export default function NewNote() {
const [note, setNote] = useState({
title: "",
content: "",
public: false,
});
const queryClient = useQueryClient();
const mutation = useMutation({
mutationFn: AddNote,
onSuccess: () => {
queryClient.invalidateQueries("notes");
queryClient.invalidateQueries("public_notes");
},
});
@ -47,6 +49,15 @@ export default function NewNote() {
}}
/>
</div>
<div style={styles.flex_row}>
<p style={styles.text_small}>Public Note?</p>
<input
type="checkbox"
onClick={() => {
setNote({ ...note, public: !note.public });
}}
/>
</div>
<Button
style={styles.button_green}
variant="contained"
@ -55,6 +66,7 @@ export default function NewNote() {
await mutation.mutate({
title: note.title,
content: note.content,
public: note.public,
});
navigate("/");
} catch (error) {}

View file

@ -1,5 +1,5 @@
import styles from "../../styles";
import { Button } from "@mui/material";
import { Button, Checkbox } from "@mui/material";
import { useNavigate, useParams } from "react-router-dom";
import { useEffect, useState } from "react";
import Header from "../../Components/Header/Header";
@ -17,11 +17,13 @@ export default function ViewNote() {
mutationFn: UpdateNote,
onSuccess: () => {
queryClient.invalidateQueries("notes");
queryClient.invalidateQueries("public_notes");
},
});
const [note, setNote] = useState({
title: "test",
content: "test",
title: "",
content: "",
public: true,
});
async function retrieve() {
let a = await GetNote(Number(id));
@ -53,7 +55,7 @@ export default function ViewNote() {
</div>
);
}
if (data) {
if (data && note) {
return (
<div style={styles.background}>
<Header />
@ -80,6 +82,16 @@ export default function ViewNote() {
}}
/>
</div>
<div style={styles.flex_row}>
<p style={styles.text_small}>Public Note?</p>
<input
type="checkbox"
defaultChecked={note.public}
onClick={() => {
setNote({ ...note, public: !note.public });
}}
/>
</div>
<Button
style={styles.button_green}
variant="contained"
@ -89,6 +101,7 @@ export default function ViewNote() {
id: Number(id),
title: note.title,
content: note.content,
public: note.public,
});
navigate("/");
} catch (error) {}