changed add to google tasks button to sync to google button. Implemented auto creation and auto deletion in Google when node is created/deleted in dash

1 files changed, 87 insertions, 10 deletions

diff --git a/src/client/views/nodes/TaskBox.tsx b/src/client/views/nodes/TaskBox.tsx
index b59599052..7df3876c3 100644
--- a/src/client/views/nodes/TaskBox.tsx
+++ b/src/client/views/nodes/TaskBox.tsx
@@ -159,13 +159,62 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         makeObservable(this);
     }
 
+    _googleTaskCreateDisposer?: IReactionDisposer;
     _heightDisposer?: IReactionDisposer;
     _widthDisposer?: IReactionDisposer;
 
     componentDidMount() {
         this.setTaskDateRange();
-
         const doc = this.props.Document;
+
+        // adding task on creation to google
+
+        (async () => {
+            if (!doc.$googleTaskId && doc.title) {
+                try {
+                    const token = await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken();
+                    if (!token) return;
+
+                    const body: any = {
+                        title: doc.title || 'Untitled Task',
+                        notes: doc.text || '',
+                        status: doc.$task_completed ? 'completed' : 'needsAction',
+                        completed: doc.$task_completed ? new Date().toISOString() : undefined,
+                    };
+
+                    if (doc.$task_allDay && typeof doc.$task_dateRange === 'string') {
+                        const datePart = doc.$task_dateRange.split('|')[0];
+                        if (datePart && !isNaN(new Date(datePart).getTime())) {
+                            const baseDate = datePart.includes('T') ? datePart : datePart + 'T00:00:00Z';
+                            body.due = new Date(baseDate).toISOString();
+                        }
+                    } else if (doc.$task_endTime instanceof DateField) {
+                        body.due = doc.$task_endTime.date.toISOString();
+                    }
+
+                    const res = await fetch('/googleTasks/create', {
+                        method: 'POST',
+                        credentials: 'include',
+                        headers: {
+                            'Content-Type': 'application/json',
+                            Authorization: `Bearer ${token}`,
+                        },
+                        body: JSON.stringify(body),
+                    });
+
+                    const result = await res.json();
+                    if (result?.id) {
+                        doc.$googleTaskId = result.id;
+                        console.log('✅ Google Task created on mount:', result);
+                    } else {
+                        console.warn('❌ Google Task creation failed:', result);
+                    }
+                } catch (err) {
+                    console.error('❌ Error creating Google Task:', err);
+                }
+            }
+        })();
+
         this._heightDisposer = reaction(
             () => Number(doc._height),
             height => {
@@ -188,8 +237,32 @@ export class TaskBox extends React.Component<TaskBoxProps> {
     }
 
     componentWillUnmount() {
+        const doc = this.props.Document;
+        this._googleTaskCreateDisposer?.();
         this._heightDisposer?.();
         this._widthDisposer?.();
+
+        // task deletion
+        if (doc.$googleTaskId) {
+            (async () => {
+                try {
+                    const token = await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken();
+                    if (!token) return;
+
+                    await fetch(`/googleTasks/${doc.$googleTaskId}`, {
+                        method: 'DELETE',
+                        credentials: 'include',
+                        headers: {
+                            Authorization: `Bearer ${token}`,
+                        },
+                    });
+
+                    console.log(`✅ Deleted Google Task ${doc.$googleTaskId}`);
+                } catch (err) {
+                    console.warn('❌ Failed to delete Google Task:', err);
+                }
+            })();
+        }
     }
 
     /**
@@ -213,7 +286,7 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         const startTime = doc.$task_startTime instanceof DateField && doc.$task_startTime.date instanceof Date ? toLocalDateTimeString(doc.$task_startTime.date) : '';
         const endTime = doc.$task_endTime instanceof DateField && doc.$task_endTime.date instanceof Date ? toLocalDateTimeString(doc.$task_endTime.date) : '';
 
-        const handleGoogleTaskClick = async () => {
+        const handleGoogleTaskSync = async () => {
             console.log('GT button clicked');
 
             try {
@@ -221,9 +294,9 @@ export class TaskBox extends React.Component<TaskBoxProps> {
                 if (!token) {
                     const listener = () => {
                         window.removeEventListener('focusin', listener);
-                        if (confirm('✅ Authorization complete. Try adding the task again?')) {
+                        if (confirm('✅ Authorization complete. Try syncing the task again?')) {
                             // you could refactor the click handler here
-                            handleGoogleTaskClick();
+                            handleGoogleTaskSync();
                         }
                         window.removeEventListener('focusin', listener);
                     };
@@ -252,8 +325,12 @@ export class TaskBox extends React.Component<TaskBoxProps> {
                     due = undefined;
                 }
 
-                const response = await fetch('/googleTasks/create', {
-                    method: 'POST',
+                const isUpdate = !!doc.$googleTaskId;
+                const endpoint = isUpdate ? `/googleTasks/${doc.$googleTaskId}` : '/googleTasks/create';
+                const method = isUpdate ? 'PATCH' : 'POST';
+
+                const response = await fetch(endpoint, {
+                    method,
                     credentials: 'include',
                     headers: {
                         'Content-Type': 'application/json',
@@ -272,13 +349,13 @@ export class TaskBox extends React.Component<TaskBoxProps> {
                 console.log('Google Task result:', result);
 
                 if (result?.id) {
-                    alert('✅ Task sent to Google Tasks!');
+                    alert('✅ Task synced with Google Tasks!');
                 } else {
                     alert(`❌ Failed: ${result?.error?.message || 'Unknown error'}`);
                 }
             } catch (err) {
                 console.error('Fetch error:', err);
-                alert('❌ Task creation failed.');
+                alert('❌ Task syncing failed.');
             }
         };
 
@@ -327,9 +404,9 @@ export class TaskBox extends React.Component<TaskBoxProps> {
                         className="task-manager-google"
                         onClick={event => {
                             event.preventDefault();
-                            handleGoogleTaskClick();
+                            handleGoogleTaskSync();
                         }}>
-                        Add to Google Tasks
+                        Sync to Google
                     </button>
                 </div>