keannu125/React-NotesApp
1
0
Fork 0
mirror of https://github.com/lemeow125/React-NotesApp.git synced 2024-11-17 06:29:28 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixed prompts for when there no connection to backend

Browse source
This commit is contained in:
keannu125 2023-03-04 23:04:02 +08:00
parent eea71c8370
commit cfc9a7e1f0
3 changed files with 41 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/Components/Api/Api.tsx
View file

@ -10,7 +10,7 @@ import {
// Note APIs
export function GetNotes() {
const token = JSON.parse(localStorage.getItem("token") || "");
const token = JSON.parse(localStorage.getItem("token") || "{}");
return axios
.get("http://localhost:8000/api/v1/notes/", {
headers: {
@ -23,7 +23,7 @@ export function GetNotes() {
}
export function GetNote(id: number) {
const token = JSON.parse(localStorage.getItem("token") || "");
const token = JSON.parse(localStorage.getItem("token") || "{}");
return axios
.get("http://localhost:8000/api/v1/notes/" + id + "/", {
headers: {
@ -36,7 +36,7 @@ export function GetNote(id: number) {
}
export function UpdateNote(note: UpdateNoteParams) {
const token = JSON.parse(localStorage.getItem("token") || "");
const token = JSON.parse(localStorage.getItem("token") || "{}");
return axios
.patch("http://localhost:8000/api/v1/notes/" + note.id + "/", note, {
headers: {
@ -53,7 +53,7 @@ export function UpdateNote(note: UpdateNoteParams) {
}
export function AddNote(note: AddNoteParams) {
const token = JSON.parse(localStorage.getItem("token") || "");
const token = JSON.parse(localStorage.getItem("token") || "{}");
return axios
.post("http://localhost:8000/api/v1/notes/", note, {
headers: {
@ -62,15 +62,24 @@ export function AddNote(note: AddNoteParams) {
})
.then((response) => {
return response.data;
})
.catch((error) => {
console.log("Error adding note", error);
return error;
});
}
export function DeleteNote(id: number) {
const token = JSON.parse(localStorage.getItem("token") || "");
return axios.delete("http://localhost:8000/api/v1/notes/" + id + "/", {
const token = JSON.parse(localStorage.getItem("token") || "{}");
return axios
.delete("http://localhost:8000/api/v1/notes/" + id + "/", {
headers: {
Authorization: "Token " + token,
},
})
.catch((error) => {
console.log("Error deleting note", error);
return error;
});
}
@ -96,7 +105,7 @@ export function UserLogin(user: LoginParams) {
localStorage.setItem("token", JSON.stringify(response.data.auth_token));
console.log(
"Login Success! Stored Token: ",
JSON.parse(localStorage.getItem("token") || "")
JSON.parse(localStorage.getItem("token") || "{}")
);
return true;
})
@ -107,7 +116,7 @@ export function UserLogin(user: LoginParams) {
}
export function UserInfo() {
const token = JSON.parse(localStorage.getItem("token") || "");
const token = JSON.parse(localStorage.getItem("token") || "{}");
return axios
.get("http://localhost:8000/api/v1/accounts/users/me/", {
headers: {
@ -117,10 +126,6 @@ export function UserInfo() {
.then((response) => {
console.log(response.data);
return response.data;
})
.catch((error) => {
console.log("Error in fetching user data");
console.log(error);
});
}

13
src/Components/Notes/Notes.tsx
View file

@ -22,18 +22,18 @@ export default function Notes() {
<p style={styles.text_medium}>Loading Notes...</p>
</div>
);
} else if (!logged_in && !error) {
return (
<div style={styles.note}>
<p style={styles.text_medium}>Please login to use Clip Notes</p>
</div>
);
} else if (error) {
return (
<div style={styles.note}>
<p style={styles.text_medium_red}>Error contacting Notes server</p>
</div>
);
} else if (!logged_in) {
return (
<div style={styles.note}>
<p style={styles.text_medium}>Please login to use Clip Notes</p>
</div>
);
} else if (notes.length === 0) {
return (
<div style={styles.note}>
@ -51,7 +51,6 @@ export default function Notes() {
</div>
);
}
return (
<>
{notes.map((note: NoteProps, index: number) => {

8
src/Routes/UserPage/UserPage.tsx
View file

@ -12,30 +12,38 @@ export default function UserPage() {
return (
<div style={styles.background}>
<Header />
<div style={styles.note}>
<p style={styles.text_medium}>Loading...</p>
</div>
</div>
);
} else if (error) {
return (
<div style={styles.background}>
<Header />
<div style={styles.note}>
<p style={styles.text_medium_red}>An error has occured</p>
</div>
</div>
);
} else if (!logged_in) {
return (
<div style={styles.background}>
<Header />
<div style={styles.note}>
<p style={styles.text_medium_red}>Please login to view user info</p>
</div>
</div>
);
}
return (
<div style={styles.background}>
<Header />
<div style={styles.note}>
<p style={styles.text_medium}>Username: {data.username}</p>
<p style={styles.text_medium}>Email: {data.email}</p>
<p style={styles.text_medium}>User ID: {data.id}</p>
</div>
</div>
);
}