Updates for 2.5.0

manifest.json

@@ -1,7 +1,7 @@
 {
   "id": "time-ruler",
   "name": "Time Ruler",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "minAppVersion": "0.15.0",
   "description": "A drag-and-drop time ruler combining the best of a task list and a calendar view (integrates with Tasks, Full Calendar, and Dataview).",
   "author": "Joshua Tazman Reinier",

src/components/App.tsx

@@ -290,7 +290,8 @@ export default function App({ apis }: { apis: Required<AppState['apis']> }) {
   }, [])
 
   useEffect(() => {
-    const childNodes = $('#time-ruler-times')[0].childNodes
+    const childNodes = $('#time-ruler-times')[0]?.childNodes
+    if (!childNodes) return
     const firstElement = childNodes.item(
       showingPastDates ? childNodes.length - 2 : 1
     ) as HTMLElement

src/components/Block.tsx

@@ -39,6 +39,7 @@ export type BlockProps = {
   tasks: TaskProps[]
   events: EventProps[]
   blocks: BlockProps[]
+  title?: string
 }
 
 export default function Block({
@@ -53,6 +54,7 @@ export default function Block({
   events,
   dragging,
   blocks,
+  title,
 }: BlockComponentProps) {
   let showingTasks = useAppStore((state) => {
     const children = _.flatMap(tasks, (task) => getChildren(task, state.tasks))
@@ -252,7 +254,7 @@ export default function Block({
                   <hr className='border-t border-t-faint opacity-50 h-0 my-0 w-full'></hr>
                   {startISO && (
                     <span className='ml-2 whitespace-nowrap flex-none'>
-                      {formatStart(startISO)}
+                      {title ?? formatStart(startISO)}
                     </span>
                   )}
                   {hideTimes &&
@@ -289,6 +291,7 @@ export default function Block({
                   type,
                   hidePaths: onlyPath ? [...hidePaths, onlyPath] : hidePaths,
                   dragContainer: `${dragContainer}::${startISO}`,
+                  startISO,
                 }}
               />
             ))}

src/components/Day.tsx

@@ -44,7 +44,7 @@ export default function Day({
   /**
    * find the nearest scheduled date in parents (include ALL tasks which will be in this block). Day -> Hours -> Block all take a single flat list of scheduled tasks, which they use to calculate total length of the block. Blocks group them by parent -> filepath/heading, calculating queries and unscheduled parents.
    */
-  const [allDay, blocksByTime] = useAppStore((state) => {
+  const [allDay, blocksByTime, pastTasks] = useAppStore((state) => {
     const allDay: BlockProps = {
       startISO: startDate,
       endISO: startDate,
@@ -114,13 +114,17 @@ export default function Day({
       }
     })
 
-    for (let event of _.filter(state.events, (event) =>
-      isDateISO(event.startISO)
-        ? event.startISO <= startDate && event.endISO >= startDate
-        : event.endISO > startISO &&
-          event.startISO < endISO &&
+    for (let event of _.filter(state.events, (event) => {
+      if (event.startISO === '2024-09-28')
+        console.log(event.startISO, event.endISO)
+
+      const shouldInclude = isDateISO(event.startISO)
+        ? event.startISO <= startDate && event.endISO > startDate
+        : event.startISO < endISO &&
+          event.endISO > startISO &&
           (showingPastDates ? event.startISO <= now : event.endISO >= now)
-    )) {
+      return shouldInclude
+    })) {
       if (isDateISO(event.startISO)) allDay.events.push(event)
       else if (blocksByTime[event.startISO])
         blocksByTime[event.startISO].events.push(event)
@@ -133,11 +137,8 @@ export default function Day({
           blocks: [],
         }
     }
-
-    debugger
-    return [pastTasks, allDay, blocksByTime]
+    return [allDay, blocksByTime, pastTasks]
   }, shallow)
-  console.log(allDay, blocksByTime, startDate)
 
   let blocks = _.map(_.sortBy(_.entries(blocksByTime), 0), 1)
 
@@ -238,7 +239,8 @@ export default function Day({
         }`}
         data-auto-scroll={calendarMode ? 'y' : undefined}
       >
-        {allDay.tasks.length + allDay.events.length > 0 && (
+        {allDay.tasks.length + allDay.events.length + pastTasks.tasks.length >
+          0 && (
           <div
             className={`relative w-full child:mb-1 overflow-x-hidden rounded-icon mt-1 ${
               {
@@ -279,6 +281,18 @@ export default function Day({
                 blocks={[]}
               />
             )}
+            {pastTasks.tasks.length > 0 && (
+              <Block
+                type='all-day'
+                title='past'
+                events={[]}
+                tasks={pastTasks.tasks}
+                startISO={startDate}
+                endISO={startDate}
+                dragContainer={dragContainer}
+                blocks={[]}
+              />
+            )}
           </div>
         )}
         <div

src/components/Group.tsx

@@ -25,6 +25,7 @@ export type GroupComponentProps = {
   tasks: TaskProps[]
   type: BlockType
   dragContainer: string
+  startISO?: string
 }
 
 export default function Group({
@@ -33,6 +34,7 @@ export default function Group({
   type,
   hidePaths,
   dragContainer,
+  startISO,
 }: GroupComponentProps) {
   const dragData: DragData = {
     dragType: 'group',
@@ -142,7 +144,12 @@ export default function Group({
 
       {!collapsed &&
         sortedTasks.map((task) => (
-          <Task key={task.id} dragContainer={dragContainer} {...task} />
+          <Task
+            key={task.id}
+            dragContainer={dragContainer}
+            {...task}
+            startISO={startISO}
+          />
         ))}
     </div>
   )

src/components/Hours.tsx

@@ -27,7 +27,6 @@ export default function Hours({
   for (let i = 0; i < blocks.length; i++) {
     let nestedBlocks: BlockProps[] = []
     const thisBlock = blocks[i]
-    console.log('this block', thisBlock, blocks)
 
     const thisEndISO = getEndISO(thisBlock)
 

src/components/Task.tsx

@@ -15,6 +15,7 @@ import { TaskPriorities, priorityNumberToSimplePriority } from '../types/enums'
 import Block from './Block'
 import Button from './Button'
 import Logo from './Logo'
+import invariant from 'tiny-invariant'
 
 export type TaskComponentProps = TaskProps & {
   subtasks?: TaskProps[]
@@ -31,7 +32,7 @@ export default function Task({
 }: TaskComponentProps) {
   const completeTask = () => {
     setters.patchTasks([task.id], {
-      completion: toISO(roundMinutes(DateTime.now())),
+      completion: toISO(roundMinutes(DateTime.now()), true),
       completed: true,
     })
   }
@@ -111,6 +112,15 @@ export default function Task({
   const hasLengthDrag =
     task.duration || (task.scheduled && !isDateISO(task.scheduled))
 
+  if (task.due) {
+    console.log(
+      DateTime.fromISO(startISO as string),
+      DateTime.fromISO(task.due)
+        .diff(DateTime.fromISO(startISO as string))
+        .shiftTo('days').days
+    )
+  }
+
   return (
     <div
       className={`relative rounded-icon py-0.5 transition-colors duration-300 w-full min-h-line`}
@@ -190,7 +200,11 @@ export default function Task({
               >
                 {!task.due
                   ? 'due'
-                  : DateTime.fromISO(task.due).toFormat('EEEEE M/d')}
+                  : `${
+                      DateTime.fromISO(task.due)
+                        .diff(DateTime.fromISO(startISO as string))
+                        .shiftTo('days').days
+                    }d`}
               </div>
             )}
 

src/plugin/SettingsTab.tsx

@@ -42,7 +42,6 @@ function Calendars({
             style={{ marginRight: '4px' }}
             onClick={() => {
               if (!confirm('Remove this calendar?')) return
-              console.log('updated version')
 
               plugin.settings.calendars = _.pull(
                 [...plugin.settings.calendars],

src/services/parser.ts

@@ -226,10 +226,6 @@ export function textToTask(
       ) as string
     }
 
-    if (item['startTime']) {
-      console.log('full cal:', item, scheduled, duration)
-    }
-
     return { scheduled, length: duration }
   }
 
@@ -732,7 +728,6 @@ export function taskToPage(task: TaskProps, frontmatter: Record<string, any>) {
 
   for (let property of [
     'due',
-    'completion',
     'reminder',
     'completed',
     'completion',

src/services/util.ts

@@ -192,12 +192,15 @@ export const removeNestedChildren = (id: string, taskList: TaskProps[]) => {
 export const parseTaskDate = (task: TaskProps): string | undefined =>
   task.scheduled || task.completion
 
-export const toISO = (date: DateTime) =>
-  date.toISO({
+export const toISO = (date: DateTime, isDate?: boolean) => {
+  const d = date.toISO({
     suppressMilliseconds: true,
     suppressSeconds: true,
     includeOffset: false,
   }) as string
+  if (isDate) return d.slice(0, 10)
+  else return d
+}
 
 export const useHourDisplay = (hours: number) => {
   const twentyFourHourFormat = useAppStore(