Merge pull request #15 from eatgrass/pin_task

feat: pin task
eatgrass · Jan 4, 2024 · 540c857 · 540c857
2 parents 7d180e6 + f8b1449
commit 540c857
Show file tree

Hide file tree

Showing 2 changed files with 75 additions and 5 deletions.
diff --git a/src/Timer.ts b/src/Timer.ts
@@ -44,6 +44,7 @@ interface TimerState {
     count: number
     duration: number
     task?: Task
+    pinTask: boolean
 }
 
 interface TimerControl {
@@ -55,6 +56,7 @@ interface TimerControl {
     timeup: () => void
     toggleMode: (callback?: (state: TimerState) => void) => void
     toggleTimer: () => void
+    togglePin: () => void
 }
 
 export type TimerStore = Writable<TimerState> & TimerControl
@@ -77,6 +79,7 @@ const state: Writable<TimerState> | TimerStore = writable({
     count: 25 * 60 * 1000,
     duration: 25,
     task: undefined,
+    pinTask: false,
 })
 
 const stateUnsubribe = state.subscribe((s) => (running = s.running))
@@ -127,7 +130,9 @@ const methods: TimerControl = {
                 s.duration = s.mode === 'WORK' ? s.workLen : s.breakLen
                 s.count = s.duration * 60 * 1000
                 s.startTime = now
-                s.task = resolveFocused(task)
+                if (!s.pinTask) {
+                    s.task = resolveFocused(task)
+                }
             }
             s.lastTick = now
             s.inSession = true
@@ -164,6 +169,7 @@ const methods: TimerControl = {
             clock.postMessage(false)
             s.startTime = null
             s.elapsed = 0
+            s.pinTask = false
             return s
         })
     },
@@ -236,6 +242,12 @@ const methods: TimerControl = {
         s.elapsed = 0
         return s
     },
+    togglePin() {
+        update((s) => {
+            s.pinTask = !s.pinTask
+            return s
+        })
+    },
 }
 
 Object.keys(methods).forEach((key) => {
@@ -310,7 +322,7 @@ export class TimerLog {
 
             if (settings.logFormat === 'VERBOSE') {
                 let emoji = TimerLog.EMOJI[this.mode]
-                return `- ${emoji}(pomodoro::${this.mode}) (duration:: ${
+                return `- ${emoji} (pomodoro::${this.mode}) (duration:: ${
                     this.duration
                 }m) (begin:: ${this.begin.format(
                     'YYYY-MM-DD HH:mm',
@@ -333,7 +345,7 @@ const saveLog = async (log: TimerLog): Promise<void> => {
     }
 
     // log to focused file
-    if (settings.logFocused && log.task?.path) {
+    if (settings.logFocused && log.task?.path && log.task.path.endsWith('md')) {
         let text = await log.text(log.task.path)
         if (text) {
             await appendFile(log.task?.path, `\n${text}`)

diff --git a/src/TimerViewComponent.svelte b/src/TimerViewComponent.svelte
@@ -32,6 +32,10 @@ const toggleMode = () => {
     timer.toggleMode()
 }
 
+const togglePin = () => {
+    timer.togglePin()
+}
+
 const toggleExtra = (value: 'settings' | 'logs' | 'close') => {
     if (extra === value) {
         extra = 'close'
@@ -200,7 +204,51 @@ const updateBreakLen = (e: Event) => {
     </div>
     {#if $timer.task}
         <div class="pomodoro-task">
-            <span class="pomodoro-task-name">{$timer.task.name}</span>
+            <div class="pomodoro-task-header">
+                <span class="pomodoro-task-name">
+                    {$timer.task.name}
+                </span>
+                <span class="pomodoro-task-pin" on:click={togglePin}>
+                    {#if !$timer.pinTask}
+                        <svg
+                            xmlns="http://www.w3.org/2000/svg"
+                            width="12"
+                            height="12"
+                            viewBox="0 0 24 24"
+                            fill="none"
+                            stroke="currentColor"
+                            stroke-width="2"
+                            stroke-linecap="round"
+                            stroke-linejoin="round"
+                            class="lucide lucide-pin"
+                            ><line x1="12" x2="12" y1="17" y2="22" /><path
+                                d="M5 17h14v-1.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V6h1a2 2 0 0 0 0-4H8a2 2 0 0 0 0 4h1v4.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24Z"
+                            /></svg
+                        >
+                    {:else}
+                        <svg
+                            xmlns="http://www.w3.org/2000/svg"
+                            width="12"
+                            height="12"
+                            viewBox="0 0 24 24"
+                            fill="none"
+                            stroke="currentColor"
+                            stroke-width="2"
+                            stroke-linecap="round"
+                            stroke-linejoin="round"
+                            class="lucide lucide-pin-off"
+                            ><line x1="2" x2="22" y1="2" y2="22" /><line
+                                x1="12"
+                                x2="12"
+                                y1="17"
+                                y2="22"
+                            /><path
+                                d="M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V17h12"
+                            /><path d="M15 9.34V6h1a2 2 0 0 0 0-4H7.89" /></svg
+                        >
+                    {/if}
+                </span>
+            </div>
             <div class="pomodoro-task-path">
                 <input
                     id="pomodoro-auto-start"
@@ -399,11 +447,21 @@ const updateBreakLen = (e: Event) => {
     padding: 1rem;
 }
 
+.pomodoro-task-header {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 5px;
+}
+
 .pomodoro-task-name {
     font-size: 1rem;
     color: var(--text-muted);
     font-weight: bold;
-    margin-bottom: 5px;
+}
+
+.pomodoro-task-pin {
+    cursor: pointer;
 }
 
 .pomodoro-task-path {