diff options
-rw-r--r-- | src/client/views/nodes/TaskBox.scss | 10 | ||||
-rw-r--r-- | src/client/views/nodes/TaskBox.tsx | 27 |
2 files changed, 26 insertions, 11 deletions
diff --git a/src/client/views/nodes/TaskBox.scss b/src/client/views/nodes/TaskBox.scss index 071fe1f7c..e129e75d1 100644 --- a/src/client/views/nodes/TaskBox.scss +++ b/src/client/views/nodes/TaskBox.scss @@ -82,6 +82,8 @@ input[type='datetime-local'] { } .task-manager-google { + align-self: flex-start; + width: auto; font-size: 0.85rem; padding: 6px 12px; border-radius: 6px; @@ -105,3 +107,11 @@ input[type='datetime-local'] { pointer-events: none; } } + +.task-box-blur-wrapper { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + min-width: 0; +} diff --git a/src/client/views/nodes/TaskBox.tsx b/src/client/views/nodes/TaskBox.tsx index 6c966a59d..8e269a21a 100644 --- a/src/client/views/nodes/TaskBox.tsx +++ b/src/client/views/nodes/TaskBox.tsx @@ -19,6 +19,7 @@ export class TaskBox extends ViewBoxBaseComponent<FieldViewProps>() { _heightDisposer?: IReactionDisposer; _widthDisposer?: IReactionDisposer; @observable _needsSync = false; // Whether the task needs to be synced with Google Tasks + @observable _syncing = false; // Whether the task is currently syncing with Google Tasks // contains the last synced task information private _lastSyncedTask: { @@ -236,6 +237,7 @@ export class TaskBox extends ViewBoxBaseComponent<FieldViewProps>() { const token = await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken(); if (!token) return; + this._syncing = true; const doc = this.Document; const taskTitle = StrCast(doc.title); const taskDesc = StrCast(doc[this.fieldKey]); @@ -268,6 +270,8 @@ export class TaskBox extends ViewBoxBaseComponent<FieldViewProps>() { } else { console.warn('❌ Auto-sync failed:', result); } + + this._syncing = false; }; /** @@ -442,8 +446,8 @@ export class TaskBox extends ViewBoxBaseComponent<FieldViewProps>() { return; } + this._syncing = true; const body = this.buildGoogleTaskBody(); - const isUpdate = !!doc.$googleTaskId; const endpoint = isUpdate ? `/googleTasks/${doc.$googleTaskId}` : '/googleTasks/create'; const method = isUpdate ? 'PATCH' : 'POST'; @@ -479,6 +483,7 @@ export class TaskBox extends ViewBoxBaseComponent<FieldViewProps>() { console.error('Fetch error:', err); alert('❌ Task syncing failed.'); } + this._syncing = false; }; return ( @@ -520,18 +525,18 @@ export class TaskBox extends ViewBoxBaseComponent<FieldViewProps>() { <input type="checkbox" checked={isCompleted} onChange={this.toggleComplete} /> Complete </label> - - <button - className="task-manager-google" - disabled={!this.needsSync} - onClick={event => { - event.preventDefault(); - handleGoogleTaskSync(); - }}> - Sync to Google - </button> </div> + <button + className="task-manager-google" + disabled={!this.needsSync} + onClick={event => { + event.preventDefault(); + handleGoogleTaskSync(); + }}> + {this._syncing ? 'Syncing...' : (this.needsSync ? 'Sync to Google' : 'Synced to Google')} + </button> + {!allDay && ( <div className="task-manager-times" style={{ opacity: isCompleted ? 0.7 : 1 }}> <label> |