diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/nodes/TaskBox.scss | 30 | ||||
| -rw-r--r-- | src/client/views/nodes/TaskBox.tsx | 140 |
2 files changed, 68 insertions, 102 deletions
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 df81d9c69..e755c6fe3 100644 --- a/src/client/views/nodes/TaskBox.tsx +++ b/src/client/views/nodes/TaskBox.tsx @@ -254,6 +254,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 && ( @@ -268,104 +310,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(); - if (token === undefined) { - const listener = () => { - if (confirm('✅ Try again?')) { - // refactor this click function and call it again - } - window.removeEventListener('focusin', listener); - }; - setTimeout(() => window.addEventListener('focusin', listener), 100); - return; - } - 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> ); } |