From c1ebafcbe29140da7c1e260bab88921964dd82b0 Mon Sep 17 00:00:00 2001 From: aaravkumar Date: Wed, 30 Apr 2025 20:45:16 -0400 Subject: fixed height / width restrictions and added date selector for all day tasks --- src/client/util/CurrentUserUtils.ts | 2 +- src/client/views/nodes/TaskManagerTask.tsx | 61 ++++++++++++++++++++-- src/client/views/nodes/calendarBox/CalendarBox.tsx | 3 -- 3 files changed, 58 insertions(+), 8 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 1288abd3e..d378ca02f 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -407,7 +407,7 @@ pie title Minerals in my tap water {key: "DataViz", creator: opts => Docs.Create.DataVizDocument("", opts), opts: { _width: 300, _height: 300, }}, // AARAV ADD // {key: "DailyJournal",creator:opts => Docs.Create.DailyJournalDocument("", opts),opts: { _width: 300, _height: 300, }}, - {key: "Task", creator: opts => Docs.Create.TaskDocument("", opts), opts: { _width: 250, _height: 100, _layout_autoHeight: true, title: "Task", }}, + {key: "Task", creator: opts => Docs.Create.TaskDocument("", opts), opts: { _width: 300, _height: 300, _layout_autoHeight: true, title: "Task", }}, {key: "Scrapbook", creator: opts => Docs.Create.ScrapbookDocument([], opts), opts: { _width: 300, _height: 300}}, //{key: "Scrapbook",creator:opts => Docs.Create.ScrapbookDocument([], opts),opts:{ _width: 300, _height: 300}}, {key: "Chat", creator: Docs.Create.ChatDocument, opts: { _width: 500, _height: 500, _layout_fitWidth: true, }}, diff --git a/src/client/views/nodes/TaskManagerTask.tsx b/src/client/views/nodes/TaskManagerTask.tsx index 2d2444275..d8c1430d4 100644 --- a/src/client/views/nodes/TaskManagerTask.tsx +++ b/src/client/views/nodes/TaskManagerTask.tsx @@ -1,4 +1,4 @@ -import { action, observable, makeObservable } from 'mobx'; +import { action, observable, makeObservable, IReactionDisposer, reaction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; import { Docs } from '../../documents/Documents'; @@ -14,7 +14,7 @@ interface TaskManagerProps { } @observer -export class TaskManagerTask extends React.Component { +export class TaskManagerTask extends React.Component { public static LayoutString(fieldStr: string) { return FieldView.LayoutString(TaskManagerTask, fieldStr); } @@ -125,10 +125,38 @@ export class TaskManagerTask extends React.Component { makeObservable(this); } + _heightDisposer?: IReactionDisposer; + _widthDisposer?: IReactionDisposer; + componentDidMount() { this.setTaskDateRange(); + + const doc = this.props.Document; + this._heightDisposer = reaction( + () => Number(doc._height), + height => { + const minHeight = Number(doc.height_min ?? 0); + if (!isNaN(height) && height < minHeight) { + doc._height = minHeight; + } + } + ); + + this._widthDisposer = reaction( + () => Number(doc._width), + width => { + const minWidth = Number(doc.width_min ?? 0); + if (!isNaN(width) && width < minWidth) { + doc._width = minWidth; + } + } + ); + } + + componentWillUnmount() { + this._heightDisposer?.(); + this._widthDisposer?.(); } - render() { @@ -195,6 +223,29 @@ export class TaskManagerTask extends React.Component { disabled={isCompleted} /> All day + + {allDay && ( + { + const rawRange = doc.date_range; + if (typeof rawRange !== 'string') return ''; + const datePart = rawRange.split('|')[0]; + if (!datePart) return ''; + const d = new Date(datePart); + return !isNaN(d.getTime()) ? d.toISOString().split('T')[0] : ''; + })()} + onChange={e => { + const newDate = new Date(e.target.value); + if (!isNaN(newDate.getTime())) { + const iso = newDate.toISOString().split('T')[0]; + doc.date_range = `${iso}T00:00:00.000Z|${iso}T00:00:00.000Z`; + } + }} + disabled={isCompleted} + style={{ marginLeft: '8px' }} + /> + )}