From f0c99df0fb8c5e3717fc6234dc5a81608bc245ee Mon Sep 17 00:00:00 2001 From: chichinumber222 Date: Tue, 3 Feb 2026 23:13:43 +0300 Subject: [PATCH 1/3] [chichi] fix --- client/src/App.css | 38 ---------------------- client/src/App.tsx | 1 - client/src/components/TodoItem.tsx | 7 ++-- client/src/components/TodoList.tsx | 2 +- client/src/services/TodoService.ts | 1 - client/src/viewmodels/TodoItemViewModel.ts | 15 ++++++++- client/src/viewmodels/TodoListViewModel.ts | 33 +++++++------------ server/db.json | 6 ++-- 8 files changed, 35 insertions(+), 68 deletions(-) delete mode 100644 client/src/App.css diff --git a/client/src/App.css b/client/src/App.css deleted file mode 100644 index 74b5e05..0000000 --- a/client/src/App.css +++ /dev/null @@ -1,38 +0,0 @@ -.App { - text-align: center; -} - -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - -.App-link { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} diff --git a/client/src/App.tsx b/client/src/App.tsx index 7be22ae..5c4bc14 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,5 +1,4 @@ import React from 'react'; -import './App.css'; import TodoService from './services/TodoService'; import TodoList from './components/TodoList'; import TodoListViewModel from './viewmodels/TodoListViewModel'; diff --git a/client/src/components/TodoItem.tsx b/client/src/components/TodoItem.tsx index 7530088..f6ef310 100644 --- a/client/src/components/TodoItem.tsx +++ b/client/src/components/TodoItem.tsx @@ -4,11 +4,10 @@ import TodoItemViewModel from '../viewmodels/TodoItemViewModel'; type TodoItemProps = { viewModel: TodoItemViewModel, - deleteItem: () => void } export default observer( - ({viewModel, deleteItem} : TodoItemProps) => { + ({viewModel} : TodoItemProps) => { const [isEditing, setIsEditing] = useState(false); const [content, setContent] = useState(viewModel.content); @@ -32,6 +31,10 @@ export default observer( setIsEditing(false); } + function deleteItem() { + viewModel.deleteTodoItem(); + } + return (
  • {viewModel.isAwaiting diff --git a/client/src/components/TodoList.tsx b/client/src/components/TodoList.tsx index 498f4e3..d89fe2b 100644 --- a/client/src/components/TodoList.tsx +++ b/client/src/components/TodoList.tsx @@ -29,7 +29,7 @@ export default observer(

    Todo Items: {viewModel.todosCount}

      - {viewModel.todoItems?.map(item => await viewModel.deleteTodoItem(item.id)}/>)} + {viewModel.todoItems?.map(item => )}
    diff --git a/client/src/services/TodoService.ts b/client/src/services/TodoService.ts index 4e11894..54d1d18 100644 --- a/client/src/services/TodoService.ts +++ b/client/src/services/TodoService.ts @@ -1,6 +1,5 @@ import TodoItem from '../models/TodoItem'; import ServerResponseInterface from './ServerResponseInterface'; -import { Server } from 'http'; const url = "http://localhost:4963/todos"; diff --git a/client/src/viewmodels/TodoItemViewModel.ts b/client/src/viewmodels/TodoItemViewModel.ts index 7fb0e72..a3d93ae 100644 --- a/client/src/viewmodels/TodoItemViewModel.ts +++ b/client/src/viewmodels/TodoItemViewModel.ts @@ -7,7 +7,8 @@ export default class TodoItemViewModel extends PromiseAwareViewModelBase { constructor( private service: TodoService, - model : TodoItem + model : TodoItem, + private remove: () => void ) { super(); this.id = model.id; @@ -61,6 +62,18 @@ export default class TodoItemViewModel extends PromiseAwareViewModelBase { } }); } + public async deleteTodoItem() { + await this.runWithAwareness(async () => { + var response = await this.service.deleteTodo(this.id); + + if (response.didFail) { + this.didRequestFail = true; + this.failReason = response.failReason; + } else { + this.remove() + } + }); + } //#endregion diff --git a/client/src/viewmodels/TodoListViewModel.ts b/client/src/viewmodels/TodoListViewModel.ts index 1517728..07cb651 100644 --- a/client/src/viewmodels/TodoListViewModel.ts +++ b/client/src/viewmodels/TodoListViewModel.ts @@ -30,7 +30,8 @@ export default class TodoListViewModel extends PromiseAwareViewModelBase { this.didRequestFail = true; this.failReason = response.failReason; } else { - this.todoItems = (response.data as Array).map(item => new TodoItemViewModel(this.service, item)); + this.todoItems = (response.data as Array) + .map(item => new TodoItemViewModel(this.service, item, () => this.remove(item.id))); } }); } @@ -50,31 +51,21 @@ export default class TodoListViewModel extends PromiseAwareViewModelBase { this.didRequestFail = true; this.failReason = response.failReason; } else { - this.todoItems.push( - new TodoItemViewModel( - this.service, - new TodoItem( - response.data as number, - content, - false - ) - ) - ); + this.insert(new TodoItemViewModel( + this.service, + new TodoItem(response.data as number, content, false), + () => this.remove(response.data as number) + )); } }); } - public async deleteTodoItem(id: number) { - await this.runWithAwareness(async () => { - var response = await this.service.deleteTodo(id); + public insert(item: TodoItemViewModel) { + this.todoItems.push(item); + } - if (response.didFail) { - this.didRequestFail = true; - this.failReason = response.failReason; - } else { - this.todoItems = this.todoItems.filter(item => item.id !== id); - } - }); + public remove(id: number) { + this.todoItems = this.todoItems.filter(item => item.id !== id); } //#endregion diff --git a/server/db.json b/server/db.json index f02d41b..ba2f1df 100644 --- a/server/db.json +++ b/server/db.json @@ -1,9 +1,9 @@ { "todos": [ { - "id": 1, - "content": "There's a lot to be done...", - "isDone": false + "content": "sfs 3453 dfgdfg", + "isDone": false, + "id": 5 } ] } \ No newline at end of file From 665c67f67e9700c50f6f5a055fb6e6a62cf0c8f4 Mon Sep 17 00:00:00 2001 From: chichinumber222 Date: Wed, 4 Feb 2026 12:46:57 +0300 Subject: [PATCH 2/3] [chichi] fix TodoItem component --- client/src/components/TodoItem.tsx | 18 ++++++++++---- client/src/viewmodels/TodoItemViewModel.ts | 3 ++- client/src/viewmodels/TodoListViewModel.ts | 6 ++--- server/db.json | 29 ++++++++++++++++++++-- 4 files changed, 45 insertions(+), 11 deletions(-) diff --git a/client/src/components/TodoItem.tsx b/client/src/components/TodoItem.tsx index f6ef310..3cb7043 100644 --- a/client/src/components/TodoItem.tsx +++ b/client/src/components/TodoItem.tsx @@ -10,14 +10,14 @@ export default observer( ({viewModel} : TodoItemProps) => { const [isEditing, setIsEditing] = useState(false); - const [content, setContent] = useState(viewModel.content); + const [draftContent, setDraftContent] = useState(''); function onCheckboxChanged(e: React.FormEvent) { viewModel.setIsDone(e.currentTarget.checked); } function onInputChanged(e: React.FormEvent) { - setContent(e.currentTarget.value); + setDraftContent(e.currentTarget.value); } function onInputKeyUp(e: React.KeyboardEvent) { @@ -27,7 +27,7 @@ export default observer( } function update() { - viewModel.updateContent(content); + viewModel.updateContent(draftContent); setIsEditing(false); } @@ -35,6 +35,11 @@ export default observer( viewModel.deleteTodoItem(); } + function startDrafting() { + setDraftContent(viewModel.content); + setIsEditing(true); + } + return (
  • {viewModel.isAwaiting @@ -43,11 +48,14 @@ export default observer( {viewModel.isAwaiting ? Loading... : isEditing - ? - : setIsEditing(true)}>{content}} + ? + : {viewModel.content}} {isEditing ? : } + {viewModel.didRequestFail + ? {viewModel.failReason} + : null}
    • ); } diff --git a/client/src/viewmodels/TodoItemViewModel.ts b/client/src/viewmodels/TodoItemViewModel.ts index a3d93ae..7ec6001 100644 --- a/client/src/viewmodels/TodoItemViewModel.ts +++ b/client/src/viewmodels/TodoItemViewModel.ts @@ -62,7 +62,8 @@ export default class TodoItemViewModel extends PromiseAwareViewModelBase { } }); } - public async deleteTodoItem() { + + public async deleteTodoItem() { await this.runWithAwareness(async () => { var response = await this.service.deleteTodo(this.id); diff --git a/client/src/viewmodels/TodoListViewModel.ts b/client/src/viewmodels/TodoListViewModel.ts index 07cb651..338d6a3 100644 --- a/client/src/viewmodels/TodoListViewModel.ts +++ b/client/src/viewmodels/TodoListViewModel.ts @@ -30,7 +30,7 @@ export default class TodoListViewModel extends PromiseAwareViewModelBase { this.didRequestFail = true; this.failReason = response.failReason; } else { - this.todoItems = (response.data as Array) + this.todoItems = (response.data!) .map(item => new TodoItemViewModel(this.service, item, () => this.remove(item.id))); } }); @@ -53,8 +53,8 @@ export default class TodoListViewModel extends PromiseAwareViewModelBase { } else { this.insert(new TodoItemViewModel( this.service, - new TodoItem(response.data as number, content, false), - () => this.remove(response.data as number) + new TodoItem(response.data!, content, false), + () => this.remove(response.data!) )); } }); diff --git a/server/db.json b/server/db.json index ba2f1df..a20553f 100644 --- a/server/db.json +++ b/server/db.json @@ -1,9 +1,34 @@ { "todos": [ { - "content": "sfs 3453 dfgdfg", + "content": "u678 ", "isDone": false, - "id": 5 + "id": 11 + }, + { + "content": "54675765", + "isDone": false, + "id": 13 + }, + { + "content": "435345345", + "isDone": false, + "id": 14 + }, + { + "content": "rtyrtyrt ", + "isDone": false, + "id": 15 + }, + { + "content": "rtyrtyrt ", + "isDone": true, + "id": 16 + }, + { + "content": "y34 43534 ssdf ", + "isDone": true, + "id": 17 } ] } \ No newline at end of file From 322e7ea40bcf8bc2892fd7da50543dcb69b4af8f Mon Sep 17 00:00:00 2001 From: chichinumber222 Date: Wed, 4 Feb 2026 22:56:47 +0300 Subject: [PATCH 3/3] [chichi] back db --- server/db.json | 31 +++---------------------------- 1 file changed, 3 insertions(+), 28 deletions(-) diff --git a/server/db.json b/server/db.json index a20553f..f02d41b 100644 --- a/server/db.json +++ b/server/db.json @@ -1,34 +1,9 @@ { "todos": [ { - "content": "u678 ", - "isDone": false, - "id": 11 - }, - { - "content": "54675765", - "isDone": false, - "id": 13 - }, - { - "content": "435345345", - "isDone": false, - "id": 14 - }, - { - "content": "rtyrtyrt ", - "isDone": false, - "id": 15 - }, - { - "content": "rtyrtyrt ", - "isDone": true, - "id": 16 - }, - { - "content": "y34 43534 ssdf ", - "isDone": true, - "id": 17 + "id": 1, + "content": "There's a lot to be done...", + "isDone": false } ] } \ No newline at end of file