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

Polished and fixed Edit note page not displaying properly while loading

Browse source
This commit is contained in:
keannu125 2023-03-25 12:31:43 +08:00
parent eff9ebcbfa
commit 33ea3f8080
1 changed files with 7 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/Routes/ViewEditNote/ViewEditNote.tsx
View file

@ -3,9 +3,8 @@ import { Button } from "@mui/material";
import { useNavigate, useParams } from "react-router-dom"; import { useNavigate, useParams } from "react-router-dom";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import Header from "../../Components/Header/Header"; import Header from "../../Components/Header/Header";
import { AddNote, GetNote, UpdateNote } from "../../Components/Api/Api"; import { GetNote, UpdateNote } from "../../Components/Api/Api";
import { useMutation, useQuery, useQueryClient } from "react-query"; import { useMutation, useQuery, useQueryClient } from "react-query";
import { NoteProps } from "../../Interfaces/Interfaces";
export interface input { export interface input {
e: React.ChangeEvent; e: React.ChangeEvent;
@ -34,7 +33,7 @@ export default function ViewNote() {
}); });
useEffect(() => { useEffect(() => {
setNote(data); setNote(data);
}, []); }, [data]);
if (error) { if (error) {
return ( return (
<div style={styles.background}> <div style={styles.background}>
@ -47,8 +46,10 @@ export default function ViewNote() {
} }
if (isLoading) { if (isLoading) {
return ( return (
<div style={styles.note}> <div style={styles.background}>
<p style={styles.text_medium}>Loading Note...</p> <div style={styles.note}>
<p style={styles.text_medium}>Loading Note...</p>
</div>
</div> </div>
); );
} }
@ -112,4 +113,4 @@ export default function ViewNote() {
); );
} }
return <div>heh</div>; return <div>heh</div>;
} }