From eb9c93a635191ef9ec842592c4a85262811cf108 Mon Sep 17 00:00:00 2001
From: Skitty1238 <157652284+Skitty1238@users.noreply.github.com>
Date: Wed, 4 Jun 2025 21:05:47 -0400
Subject: allowed for incomplete tasks + fix for all day tasks not being added
 correctly + button styling

---
 src/client/views/nodes/TaskBox.scss |  30 +++++++--
 src/client/views/nodes/TaskBox.tsx  | 130 ++++++++++++------------------------
 2 files changed, 68 insertions(+), 92 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/TaskBox.scss b/src/client/views/nodes/TaskBox.scss
index 6ef0c6454..a7f75acdb 100644
--- a/src/client/views/nodes/TaskBox.scss
+++ b/src/client/views/nodes/TaskBox.scss
@@ -40,7 +40,7 @@
     resize: none;
     line-height: 1.4;
     resize: none;
-    flex-grow: 1
+    flex-grow: 1;
 }
 
 .task-manager-checkboxes {
@@ -49,7 +49,8 @@
     gap: 16px;
 }
 
-.task-manager-allday, .task-manager-complete {
+.task-manager-allday,
+.task-manager-complete {
     display: flex;
     align-items: center;
     gap: 6px;
@@ -71,11 +72,32 @@
     gap: 4px;
 }
 
-input[type="datetime-local"] {
+input[type='datetime-local'] {
     width: 100%;
     font-size: 0.9rem;
     padding: 6px 8px;
     border: 1px solid #ccc;
     border-radius: 6px;
     box-sizing: border-box;
-}
\ No newline at end of file
+}
+
+.task-manager-checkboxes {
+    display: flex;
+    flex-wrap: wrap; /* allows wrapping on small screens */
+    align-items: center;
+    gap: 16px;
+    row-gap: 8px; /* optional: tighter vertical spacing if it wraps */
+}
+
+.task-manager-google {
+    font-size: 0.85rem;
+    padding: 6px 12px;
+    border-radius: 6px;
+    background-color: #4285f4;
+    color: white;
+    border: none;
+    cursor: pointer;
+    white-space: nowrap;
+    transition: background-color 0.2s ease;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+}
diff --git a/src/client/views/nodes/TaskBox.tsx b/src/client/views/nodes/TaskBox.tsx
index 8855e43c8..0d4fb622b 100644
--- a/src/client/views/nodes/TaskBox.tsx
+++ b/src/client/views/nodes/TaskBox.tsx
@@ -255,6 +255,48 @@ export class TaskBox extends React.Component<TaskBoxProps> {
                         <input type="checkbox" checked={isCompleted} onChange={this.toggleComplete} />
                         Complete
                     </label>
+
+                    <button
+                        className="task-manager-google"
+                        onClick={async event => {
+                            event.preventDefault();
+
+                            console.log('GT button clicked');
+                            try {
+                                const token = await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken();
+                                console.log('Got token', token);
+
+                                const response = await fetch('/googleTasks/create', {
+                                    method: 'POST',
+                                    credentials: 'include',
+                                    headers: {
+                                        'Content-Type': 'application/json',
+                                        Authorization: `Bearer ${token}`,
+                                    },
+                                    body: JSON.stringify({
+                                        title: taskTitle || 'Untitled Task',
+                                        notes: taskDesc,
+                                        due: allDay ? new Date(String(doc.$task_dateRange)?.split('|')[0]).toISOString() : (doc.$task_endTime instanceof DateField && doc.$task_endTime.date?.toISOString()) || undefined,
+                                        status: doc.$task_completed ? 'completed' : 'needsAction',
+                                        completed: doc.$task_completed ? new Date().toISOString() : undefined,
+                                    }),
+                                });
+
+                                const result = await response.json();
+                                console.log('Google Task result:', result);
+
+                                if (result?.id) {
+                                    alert('✅ Task sent to Google Tasks!');
+                                } else {
+                                    alert(`❌ Failed: ${result?.error?.message || 'Unknown error'}`);
+                                }
+                            } catch (err) {
+                                console.error('Fetch error:', err);
+                                alert('❌ Task creation failed.');
+                            }
+                        }}>
+                        Add to Google
+                    </button>
                 </div>
 
                 {!allDay && (
@@ -269,94 +311,6 @@ export class TaskBox extends React.Component<TaskBoxProps> {
                         </label>
                     </div>
                 )}
-
-                {/** test button */}
-                {/* <button
-                    className="task-manager-google"
-                    onClick={async () => {
-                        console.log('GT button clicked');
-                        const token = await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken();
-                        console.log('Got token', token);
-
-                        try {
-                            const response = await fetch('/googleTasks/create', {
-                                method: 'POST',
-                                credentials: 'include',
-                                headers: {
-                                    'Content-Type': 'application/json',
-                                    Authorization: `Bearer ${token}`,
-                                },
-                                body: JSON.stringify({
-                                    title: taskTitle || 'Untitled Task',
-                                    notes: taskDesc,
-                                    due: allDay ? String(doc.$task_dateRange)?.split('|')[0] + 'T23:59:00Z' : (doc.$task_endTime instanceof DateField && doc.$task_endTime.date?.toISOString()) || undefined,
-                                }),
-                            });
-
-                            const result = await response.text();
-                            console.log('Google Task result:', result);
-                            alert(result?.id ? 'Task sent to Google Tasks!' : `Failed: ${result?.error?.message || 'Unknown error'}`);
-                        } catch (err) {
-                            console.error('Fetch error:', err);
-                            alert('Fetch failed: ');
-                        }
-                    }}>
-                    GT
-                </button> */}
-
-                {/* <button
-                className="task-manager-google"
-                onClick={async () => {
-                    console.log('GT button clicked');
-                    const url = await Networking.FetchFromServer('/readGoogleAccessToken');
-                    console.log('🔗 Redirecting to Google auth:', url);
-                    window.location.href = url; // Redirect user to authenticate
-                }}
-                >
-                GT
-                </button> */}
-
-                <button
-                    className="task-manager-google"
-                    onClick={async event => {
-                        event.preventDefault();
-
-                        console.log('GT button clicked');
-                        try {
-                            const token = await GoogleAuthenticationManager.Instance.fetchOrGenerateAccessToken();
-                            console.log('Got token', token);
-
-                            const response = await fetch('/googleTasks/create', {
-                                method: 'POST',
-                                credentials: 'include',
-                                headers: {
-                                    'Content-Type': 'application/json',
-                                    Authorization: `Bearer ${token}`,
-                                },
-                                body: JSON.stringify({
-                                    title: taskTitle || 'Untitled Task',
-                                    notes: taskDesc,
-                                    due: allDay ? String(doc.$task_dateRange)?.split('|')[0] + 'T23:59:00Z' : (doc.$task_endTime instanceof DateField && doc.$task_endTime.date?.toISOString()) || undefined,
-                                    status: doc.$task_completed ? 'completed' : 'needsAction',
-                                    completed: doc.$task_completed ? new Date().toISOString() : undefined,
-                                }),
-                            });
-
-                            const result = await response.json();
-                            console.log('Google Task result:', result);
-
-                            if (result?.id) {
-                                alert('✅ Task sent to Google Tasks!');
-                            } else {
-                                alert(`❌ Failed: ${result?.error?.message || 'Unknown error'}`);
-                            }
-                        } catch (err) {
-                            console.error('Fetch error:', err);
-                            alert('❌ Task creation failed.');
-                        }
-                    }}>
-                    GT
-                </button>
             </div>
         );
     }
-- 
cgit v1.2.3-70-g09d2