diff --git a/src/Components/Note/Note.tsx b/src/Components/Note/Note.tsx
index f86bbc8..376170a 100644
--- a/src/Components/Note/Note.tsx
+++ b/src/Components/Note/Note.tsx
@@ -1,10 +1,12 @@
import * as React from "react";
import styles from "../../styles";
import { Button } from "@mui/material";
+import axios from "axios";
export interface props {
title: string;
content: string;
+ id: number;
}
export default function Note(props: props) {
return (
@@ -18,7 +20,7 @@ export default function Note(props: props) {
style={styles.button_remove}
variant="contained"
onClick={() => {
- console.log("foo");
+ axios.delete("http://localhost:8000/notes/" + props.id + "/");
}}
>
Remove Note
diff --git a/src/Components/NoteMapper/NoteMapper.tsx b/src/Components/NoteMapper/NoteMapper.tsx
index 6ce0630..e2ec199 100644
--- a/src/Components/NoteMapper/NoteMapper.tsx
+++ b/src/Components/NoteMapper/NoteMapper.tsx
@@ -11,7 +11,7 @@ export default function NoteMapper() {
const [notes, setNotes] = useState([]);
const [error, setError] = useState(false);
const [errormessage, seterrormessage] = useState("");
- useEffect(() => {
+ function server_get() {
axios
.get("http://localhost:8000/notes/")
.then((res) => {
@@ -22,6 +22,13 @@ export default function NoteMapper() {
setError(true);
seterrormessage(err);
});
+ }
+ useEffect(() => {
+ server_get();
+ const interval = setInterval(() => {
+ server_get();
+ }, 1000);
+ return () => clearInterval(interval);
}, []);
if (error) {
return (
@@ -50,9 +57,16 @@ export default function NoteMapper() {
}
return (
<>
- {notes.map((note: { title: string; content: string }, i) => {
+ {notes.map((note: { title: string; content: string; id: number }, i) => {
console.log(note);
- return ;
+ return (
+
+ );
})}