Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit6c76e74

Browse files
sorting the data
1 parentafe4dd0 commit6c76e74

File tree

9 files changed

+50
-45
lines changed

9 files changed

+50
-45
lines changed

‎db.json‎

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,25 @@
11
{
22
"notes": [
33
{
4-
"text":"This isnote5 ***",
4+
"text":"note1 (updated now)",
55
"priority":"low",
6-
"id":"5"
6+
"id":"b31926f0-3ede-4c67-867d-aca9830ed8b0",
7+
"createdAt":"2022-09-17T16:15:54.984Z",
8+
"updatedAt":"2022-09-17T16:21:15.119Z"
79
},
810
{
9-
"text":"test note ******",
10-
"priority":"high",
11-
"id":"d666326a-a06f-44c8-8dad-b6fba11dbb70"
11+
"text":"note 2 (updated now)",
12+
"priority":"low",
13+
"id":"7f77e872-f7f8-4617-ab9d-8f32a46780fb",
14+
"createdAt":"2022-09-17T16:15:59.545Z",
15+
"updatedAt":"2022-09-17T18:08:23.343Z"
1216
},
1317
{
14-
"text":"new note ****************",
15-
"priority":"medium",
16-
"id":"1936edf9-bfbb-4c58-a3fa-3b2f8c94ae54"
18+
"text":"note 3 (updated)",
19+
"priority":"high",
20+
"id":"78486737-f03f-4da1-a40c-460149e7cf87",
21+
"createdAt":"2022-09-17T16:16:02.765Z",
22+
"updatedAt":"2022-09-17T16:18:04.640Z"
1723
}
1824
]
1925
}

‎src/App.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import Switch from 'react-switch';
55
import{FaSun,FaMoon}from'react-icons/fa';
66
import{useEffect,useReducer,useState}from'react';
77
import{StateContext,StateType}from'./context/state/state';
8-
import{Notes}from'./components/note/data';
98
import{
109
ADD_NOTE,
1110
DELETE_NOTE,
@@ -43,7 +42,8 @@ function App() {
4342
(note)=>note.id===action.payload.id
4443
);
4544
leteditedNotesUpdated=[...state.notes];
46-
editedNotesUpdated.splice(indexUpdated,1,action.payload);
45+
editedNotesUpdated.splice(indexUpdated,1);
46+
editedNotesUpdated.unshift(action.payload);
4747
return{ ...state,notes:editedNotesUpdated};
4848
default:
4949
returnstate;

‎src/components/add-note/add-note.tsx‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,8 @@ function AddNote(props: AddNoteProps) {
4040
text,
4141
priority,
4242
id:state.noteToBeEdited.id,
43+
createdAt:state.noteToBeEdited.createdAt,
44+
updatedAt:newDate(),
4345
};
4446
constupdatedNote=awaitupdateNote(
4547
state.noteToBeEdited.id,
@@ -55,6 +57,8 @@ function AddNote(props: AddNoteProps) {
5557
text,
5658
priority,
5759
id:uuidv4(),
60+
createdAt:newDate(),
61+
updatedAt:newDate(),
5862
};
5963
constnote=awaitaddNote(noteData);
6064
dispatch({

‎src/components/note/data.ts‎

Lines changed: 0 additions & 30 deletions
This file was deleted.

‎src/components/note/note-type.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@ export type Priority = 'high' | 'medium' | 'low';
33
exporttypeNoteType={
44
id:string,
55
text:string,
6-
priority :Priority
6+
priority :Priority,
7+
createdAt :Date,
8+
updatedAt :Date
79
}
810

911
exportenumColorLight{

‎src/components/note/note.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,13 @@
44
bottom:0;
55
right:0;
66
padding:0.5rem;
7+
}
8+
.left-corner{
9+
position: absolute;
10+
bottom:0;
11+
left:0;
12+
padding:0.5rem;
13+
}
14+
.date{
15+
font-size:0.3rem;
716
}

‎src/components/note/note.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ type NoteProps = {
1313
id:string;
1414
text:string;
1515
priority?:Priority;
16+
createdAt:Date;
17+
updatedAt:Date;
1618
note:NoteType;
1719
};
1820

@@ -42,6 +44,7 @@ function Note(props: NoteProps) {
4244
>
4345
<>
4446
<div>{props.text}</div>
47+
<divclassName='left-corner date'>{props.updatedAt.toLocaleString()}</div>
4548
<divclassName="right-corner">
4649
<FaEditonClick={()=>editNote(props.note)}></FaEdit>
4750
<FaTrashonClick={handleDelete}></FaTrash>

‎src/pages/home/home.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ function Home() {
2020
id={note.id}
2121
priority={note.priority}
2222
text={note.text}
23+
createdAt={note.createdAt}
24+
updatedAt={note.updatedAt}
2325
note={note}
2426
></Note>
2527
))}

‎src/services/notes-service.tsx‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,22 @@
11
import{NoteType}from'../components/note/note-type';
22

33
exportasyncfunctiongetNotes(){
4-
constresponse=awaitfetch('/notes');
5-
returnawaitresponse.json();
4+
constresponse=awaitfetch('/notes?_sort=updatedAt&_order=desc');
5+
constnotes=awaitresponse.json();
6+
returnnotes.map((note:NoteType)=>
7+
({...note,createdAt:newDate(note.createdAt),updatedAt:newDate(note.updatedAt)}))
8+
69
}
710
exportasyncfunctionaddNote(note:NoteType){
811
constresponse=awaitfetch('/notes',{
912
method:'post',
1013
headers:{'Content-Type':'application/json'},
1114
body:JSON.stringify(note),
1215
});
13-
returnawaitresponse.json();
16+
constnoteFromDB=awaitresponse.json();
17+
return{...noteFromDB,
18+
createdAt:newDate(noteFromDB.createdAt),
19+
updatedAt:newDate(noteFromDB.updatedAt)}
1420
}
1521
exportasyncfunctiondeleteNote(id:string){
1622
constresponse=awaitfetch(`/notes/${id}`,{
@@ -24,5 +30,8 @@ export async function updateNote(id: string, note: NoteType) {
2430
headers:{'Content-Type':'application/json'},
2531
body:JSON.stringify(note),
2632
});
27-
returnawaitresponse.json();
33+
constnoteFromDB=awaitresponse.json();
34+
return{...noteFromDB,
35+
createdAt:newDate(noteFromDB.createdAt),
36+
updatedAt:newDate(noteFromDB.updatedAt)}
2837
}

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp