update changelog, bux fixes

j-palindrome · Aug 6, 2023 · b0c0a06 · b0c0a06
1 parent 81cbf55
commit b0c0a06
Show file tree

Hide file tree

Showing 9 changed files with 97 additions and 118 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -11,13 +11,17 @@
 - Right-click option to [schedule tasks for now](https://github.com/joshuatazrein/obsidian-time-ruler/issues/16#event-9959008621)
 - More specific Dataview custom filter [at task level](https://github.com/joshuatazrein/obsidian-time-ruler/issues/18)
 - Options to drag [deadlines and reminder times](https://github.com/joshuatazrein/obsidian-time-ruler/issues/20) in addition to scheduled time
+- A [simple mode](https://github.com/joshuatazrein/obsidian-time-ruler/issues/21) with `HH:mm-HH:mm` formatting for scheduled times.
 
 ## Considering
 - Providing [names for time blocks](https://github.com/joshuatazrein/obsidian-time-ruler/issues/11#issuecomment-1655862428) (perhaps by moving tasks with durations to the "name" field of a time block)
 
 # Changelog
 
 ## 1.0.5 (Upcoming)
+- **Improved:** Timer focus mode
+- **Fixed:** Error with drag `id`s for all-day  headings
+- **Fixed:** Scheduled tasks with deadlines disappearing
 
 ## 1.0.4 (8/4/2023)
 - **Fixed:** `Unscheduled` button is now full-width in Day view

diff --git a/src/components/App.tsx b/src/components/App.tsx
@@ -75,7 +75,6 @@ export default function App({ apis }: { apis: Required<AppState['apis']> }) {
       startISO: today.toISODate() as string,
       endISO: today.plus({ days: 1 }).toISODate() as string,
       type: 'minutes',
-      includePast: true,
     },
     ..._.range(1, datesShown).map((i) => ({
       startISO: today.plus({ days: i }).toISODate() as string,
@@ -181,6 +180,8 @@ export default function App({ apis }: { apis: Required<AppState['apis']> }) {
 
   const getDragElement = () => {
     if (!activeDrag) return <></>
+    console.log(activeDrag)
+
     switch (activeDrag.dragType) {
       case 'task':
         return <Task {...activeDrag} />
@@ -259,7 +260,7 @@ export default function App({ apis }: { apis: Required<AppState['apis']> }) {
   }, [])
 
   const calendarMode = useAppStore((state) => state.calendarMode)
-  useEffect(scrollToNow, [calendarMode])
+  useEffect(scrollToNow, [])
 
   return (
     <DndContext

diff --git a/src/components/Event.tsx b/src/components/Event.tsx
@@ -5,7 +5,7 @@ import { isDateISO } from '../services/util'
 import Block from './Block'
 import Droppable from './Droppable'
 import Times, { TimeSpanTypes } from './Times'
-import TimeSpan, { BlockData } from './TimeSpan'
+import TimeSpan from './TimeSpan'
 import Logo from './Logo'
 import Button from './Button'
 import $ from 'jquery'
@@ -94,7 +94,7 @@ export default function Event({
           </div>
         )}
 
-        <hr className='w-full border-t border-faint'></hr>
+        <hr className='my-0 w-full border-t border-faint'></hr>
 
         <span className='ml-2 whitespace-nowrap'>{formatStart(startISO)}</span>
         {!DateTime.fromISO(startISO).diff(DateTime.fromISO(endISO)) && (

diff --git a/src/components/Group.tsx b/src/components/Group.tsx
@@ -54,7 +54,9 @@ export default function Group({
 
   const { setNodeRef, attributes, listeners, setActivatorNodeRef } =
     useDraggable({
-      id: `${id}::${dragContainer}::${type}`,
+      id: `${id}::${tasks[0].path}${
+        level === 'heading' ? '::' + tasks[0].heading : ''
+      }::${dragContainer}::${type}`,
       data: dragData,
     })
 
@@ -88,7 +90,7 @@ export default function Group({
       )}
 
       {level === 'group'
-        ? sortedHeadings.map(([name, tasks], i) => (
+        ? sortedHeadings.map(([name, tasks]) => (
             <Group
               level='heading'
               key={name}

diff --git a/src/components/TimeSpan.tsx b/src/components/TimeSpan.tsx
@@ -4,31 +4,29 @@ import { Fragment, useEffect, useState } from 'react'
 import { shallow } from 'zustand/shallow'
 import { setters, useAppStore } from '../app/store'
 import { openTaskInRuler } from '../services/obsidianApi'
-import { isDateISO } from '../services/util'
+import { isDateISO, processLength } from '../services/util'
 import Button from './Button'
 import Droppable from './Droppable'
 import Event from './Event'
 import Times, { TimeSpanTypes } from './Times'
 
-export type BlockData = [string, (EventProps | TaskProps)[]]
 export default function TimeSpan({
   startISO,
   endISO,
   blocks,
   type,
   startWithHours = false,
   chopStart = false,
+  hideTimes = false,
 }: {
   startISO: string
   endISO: string
   blocks: BlockData[]
   type: TimeSpanTypes
   startWithHours?: boolean
   chopStart?: boolean
+  hideTimes?: boolean
 }) {
-  const now = DateTime.now().toISO() as string
-  const calendarMode = useAppStore((state) => state.calendarMode)
-
   const formattedBlocks: {
     startISO: string
     endISO: string
@@ -37,42 +35,6 @@ export default function TimeSpan({
     blocks: BlockData[]
   }[] = []
 
-  const processLength = ([time, items]: BlockData) => {
-    const events: EventProps[] = []
-    const tasks: TaskProps[] = []
-
-    for (let item of items) {
-      if (item.type === 'event') events.push(item)
-      else tasks.push(item)
-    }
-    const tasksWithLength = tasks.filter(
-      (task) => task.length
-    ) as (TaskProps & {
-      length: NonNullable<TaskProps['length']>
-    })[]
-    const totalLength =
-      events.length > 0
-        ? (DateTime.fromISO(events[0].endISO)
-            .diff(DateTime.fromISO(events[0].startISO))
-            .shiftTo('hour', 'minute')
-            .toObject() as { hour: number; minute: number })
-        : tasksWithLength.reduce(
-            ({ hour, minute }, task) => ({
-              hour: hour + task.length.hour,
-              minute: minute + task.length.minute,
-            }),
-            { hour: 0, minute: 0 }
-          )
-
-    const endTime = DateTime.fromISO(time).plus(totalLength).toISO({
-      includeOffset: false,
-      suppressMilliseconds: true,
-      suppressSeconds: true,
-    }) as string
-
-    return { events, tasks, endISO: endTime }
-  }
-
   for (let i = 0; i < blocks.length; i++) {
     const [startISO, _tasks] = blocks[i]
 
@@ -102,7 +64,7 @@ export default function TimeSpan({
 
   return (
     <div className='pb-1'>
-      {!calendarMode && (
+      {!hideTimes && (
         <Times
           dragContainer={startISO}
           type={startWithHours ? 'hours' : type}
@@ -140,9 +102,7 @@ export default function TimeSpan({
                 blocks={thisBlocks}
               />
 
-              {calendarMode ? (
-                <div className='h-2'></div>
-              ) : (
+              {!hideTimes && (
                 <Times
                   dragContainer={startISO}
                   type={type}

diff --git a/src/components/Timeline.tsx b/src/components/Timeline.tsx
@@ -11,16 +11,18 @@ import Event from './Event'
 import Times, { TimeSpanTypes } from './Times'
 import TimeSpan from './TimeSpan'
 import Task from './Task'
+import invariant from 'tiny-invariant'
 
 export default function Timeline({
   startISO,
   endISO,
   type,
+  hideTimes = false,
 }: {
-  includePast?: boolean
   startISO: string
   endISO: string
   type: TimeSpanTypes
+  hideTimes?: boolean
 }) {
   const now = DateTime.now().toISO() as string
   const events = useAppStore((state) => {
@@ -35,18 +37,18 @@ export default function Timeline({
     )
   }, shallow)
 
-  const filterAllDayChildren = (tasks: TaskProps[]) => {
-    const tasksMap = _.fromPairs(tasks.map((task) => [task.id, task]))
-    return tasks.filter(
-      (task) =>
-        !(
-          task.parent &&
-          tasksMap[task.parent] &&
-          task.scheduled &&
-          isDateISO(task.scheduled)
-        )
-    )
-  }
+  // const filterAllDayChildren = (tasks: TaskProps[]) => {
+  //   const thisTaskIds = new Set(tasks.map((task) => task.id))
+  //   return tasks.filter(
+  //     (task) =>
+  //       !(
+  //         task.parent &&
+  //         thisTaskIds.has(task.parent) &&
+  //         task.scheduled &&
+  //         isDateISO(task.scheduled)
+  //       )
+  //   )
+  // }
 
   const isToday =
     startISO.slice(0, 10) === (DateTime.now().toISODate() as string)
@@ -56,24 +58,26 @@ export default function Timeline({
     const dueTasks: TaskProps[] = []
     const allDayTasks: TaskProps[] = []
     _.forEach(state.tasks, (task) => {
+      const scheduledForToday =
+        task.scheduled &&
+        task.scheduled < endISO &&
+        (isToday || task.scheduled >= startISO)
       if (
-        (!task.scheduled || task.scheduled < startISO) &&
+        !scheduledForToday &&
         task.due &&
         (task.due >= startISO || (isToday && task.due < endISO))
       ) {
         dueTasks.push(task)
-      } else if (task.scheduled && task.scheduled < endISO) {
+      } else if (scheduledForToday) {
+        invariant(task.scheduled)
         if (task.scheduled > startISO) {
           tasks.push(task)
-        } else if (
-          task.scheduled === startISO ||
-          (isToday && task.scheduled <= startISO)
-        ) {
+        } else {
           allDayTasks.push(task)
         }
       }
     })
-    return [filterAllDayChildren(tasks), dueTasks, allDayTasks]
+    return [tasks, dueTasks, allDayTasks]
   }, shallow)
 
   const allDayEvents: EventProps[] = []
@@ -99,15 +103,17 @@ export default function Timeline({
 
   const calendarMode = useAppStore((state) => state.calendarMode)
 
+  const hidingTimes = hideTimes || calendarMode
+
   const timeSpan = (
     <TimeSpan
       {...{ startISO, endISO, type, blocks: timeBlocks }}
       startWithHours={startISO !== DateTime.now().toISODate()}
+      hideTimes={hidingTimes}
     />
   )
 
   const [expanded, setExpanded] = useState(true)
-  const isExpanded = calendarMode || expanded
 
   const foundTaskInAllDay = useAppStore((state) => {
     return state.findingTask &&
@@ -117,7 +123,7 @@ export default function Timeline({
   })
 
   const expandIfFound = () => {
-    if (foundTaskInAllDay && !isExpanded) {
+    if (foundTaskInAllDay && !expanded) {
       setExpanded(true)
       const foundTask = allDayTasks.find(
         (task) => task.id === foundTaskInAllDay
@@ -143,13 +149,11 @@ export default function Timeline({
             }}
           />
           <div className='w-full rounded-lg px-1'>{title || ''}</div>
-          {!calendarMode && (
-            <Button
-              className='aspect-square h-full'
-              onClick={() => setExpanded(!isExpanded)}
-              src={isExpanded ? 'chevron-up' : 'chevron-down'}
-            />
-          )}
+          <Button
+            className='aspect-square h-full'
+            onClick={() => setExpanded(!expanded)}
+            src={expanded ? 'chevron-up' : 'chevron-down'}
+          />
         </div>
       </Droppable>
       <div
@@ -158,7 +162,7 @@ export default function Timeline({
         }`}
         data-auto-scroll={calendarMode ? 'y' : undefined}
       >
-        {isExpanded && (
+        {expanded && (
           <div
             className={`relative mt-2 w-full space-y-2 overflow-y-auto overflow-x-hidden rounded-lg ${
               calendarMode ? '' : 'max-h-[50%] flex-none'

diff --git a/src/components/Timer.tsx b/src/components/Timer.tsx
@@ -5,10 +5,11 @@ import Button from './Button'
 import Block from './Block'
 import { useAppStore } from '../app/store'
 import _ from 'lodash'
-import { isDateISO } from '../services/util'
+import { isDateISO, processLength } from '../services/util'
 import { shallow } from 'zustand/shallow'
 import Event from './Event'
 import invariant from 'tiny-invariant'
+import Timeline from './Timeline'
 
 export function Timer() {
   const pauseExpiration = useRef(true)
@@ -121,29 +122,6 @@ export function Timer() {
     }
   }
 
-  const currentTasks: TaskProps[][] = useAppStore((state) => {
-    if (!expanded) return []
-    const now = DateTime.now().plus({ minutes: 15 }).toISO() as string
-    const tasks = _.sortBy(
-      _.entries(
-        _.groupBy(
-          _.filter(
-            state.tasks,
-            (task) =>
-              !!(
-                task.scheduled &&
-                (state.calendarMode || !isDateISO(task.scheduled)) &&
-                task.scheduled < now
-              )
-          ),
-          'scheduled'
-        )
-      ),
-      0
-    ).map((x) => x[1])
-    return tasks
-  }, shallow)
-
   return (
     <div
       className={`${
@@ -204,18 +182,12 @@ export function Timer() {
       </div>
       {expanded && (
         <div className='h-full w-full space-y-2 overflow-y-auto py-2 text-base'>
-          {currentTasks.map((tasks) => {
-            invariant(tasks[0].scheduled)
-            return (
-              <Event
-                key={tasks[0].scheduled}
-                tasks={tasks}
-                startISO={tasks[0].scheduled}
-                endISO={tasks[0].scheduled}
-                blocks={[]}
-              />
-            )
-          })}
+          <Timeline
+            startISO={DateTime.now().toISODate() as string}
+            endISO={DateTime.now().plus({ day: 1 }).toISODate() as string}
+            hideTimes
+            type='minutes'
+          />
         </div>
       )}
     </div>