From c5657d06425aea84a4ba9a4b2f48e312be8b0271 Mon Sep 17 00:00:00 2001
From: MAZE <remvze@proton.me>
Date: Sun, 16 Jun 2024 18:40:13 +0430
Subject: [PATCH] feat: add countdown timer structure

---
 src/components/menu/items/index.ts                 |  2 +-
 src/components/menu/items/sleep-timer.tsx          |  2 +-
 .../menu/items/{countdown-timer.tsx => timer.tsx}  |  9 +++++++--
 src/components/menu/menu.tsx                       | 11 +++++++----
 src/components/modals/shortcuts/shortcuts.tsx      |  4 ++++
 src/components/toolbox/index.ts                    |  1 +
 src/components/toolbox/timer/index.ts              |  1 +
 src/components/toolbox/timer/timer.module.css      |  1 +
 src/components/toolbox/timer/timer.tsx             | 14 ++++++++++++++
 9 files changed, 37 insertions(+), 8 deletions(-)
 rename src/components/menu/items/{countdown-timer.tsx => timer.tsx} (55%)
 create mode 100644 src/components/toolbox/timer/index.ts
 create mode 100644 src/components/toolbox/timer/timer.module.css
 create mode 100644 src/components/toolbox/timer/timer.tsx

diff --git a/src/components/menu/items/index.ts b/src/components/menu/items/index.ts
index e5c2904..9a42e95 100644
--- a/src/components/menu/items/index.ts
+++ b/src/components/menu/items/index.ts
@@ -7,4 +7,4 @@ export { Pomodoro as PomodoroItem } from './pomodoro';
 export { Presets as PresetsItem } from './presets';
 export { Shortcuts as ShortcutsItem } from './shortcuts';
 export { SleepTimer as SleepTimerItem } from './sleep-timer';
-export { CountdownTimer as CountdownTimerItem } from './countdown-timer';
+export { Timer as TimerItem } from './timer';
diff --git a/src/components/menu/items/sleep-timer.tsx b/src/components/menu/items/sleep-timer.tsx
index 18fead6..0ecfa9b 100644
--- a/src/components/menu/items/sleep-timer.tsx
+++ b/src/components/menu/items/sleep-timer.tsx
@@ -15,7 +15,7 @@ export function SleepTimer({ open }: SleepTimerProps) {
       active={active}
       icon={<IoMoonSharp />}
       label="Sleep Timer"
-      shortcut="Shift + T"
+      shortcut="Shift + Alt + T"
       onClick={open}
     />
   );
diff --git a/src/components/menu/items/countdown-timer.tsx b/src/components/menu/items/timer.tsx
similarity index 55%
rename from src/components/menu/items/countdown-timer.tsx
rename to src/components/menu/items/timer.tsx
index 51e3714..371330c 100644
--- a/src/components/menu/items/countdown-timer.tsx
+++ b/src/components/menu/items/timer.tsx
@@ -2,12 +2,17 @@ import { MdOutlineTimer } from 'react-icons/md/index';
 
 import { Item } from '../item';
 
-export function CountdownTimer() {
+interface SleepTimerProps {
+  open: () => void;
+}
+
+export function Timer({ open }: SleepTimerProps) {
   return (
     <Item
-      href="https://timesy.app"
       icon={<MdOutlineTimer />}
       label="Countdown Timer"
+      shortcut="Shift + T"
+      onClick={open}
     />
   );
 }
diff --git a/src/components/menu/menu.tsx b/src/components/menu/menu.tsx
index be5eb1a..ace84cf 100644
--- a/src/components/menu/menu.tsx
+++ b/src/components/menu/menu.tsx
@@ -11,17 +11,17 @@ import {
   NotepadItem,
   SourceItem,
   PomodoroItem,
+  TimerItem,
   PresetsItem,
   ShortcutsItem,
   SleepTimerItem,
-  CountdownTimerItem,
 } from './items';
 import { Divider } from './divider';
 import { ShareLinkModal } from '@/components/modals/share-link';
 import { PresetsModal } from '@/components/modals/presets';
 import { ShortcutsModal } from '@/components/modals/shortcuts';
 import { SleepTimerModal } from '@/components/modals/sleep-timer';
-import { Notepad, Pomodoro } from '@/components/toolbox';
+import { Notepad, Pomodoro, Timer } from '@/components/toolbox';
 import { fade, mix, slideY } from '@/lib/motion';
 import { useSoundStore } from '@/stores/sound';
 
@@ -42,6 +42,7 @@ export function Menu() {
       shareLink: false,
       shortcuts: false,
       sleepTimer: false,
+      timer: false,
     }),
     [],
   );
@@ -67,10 +68,11 @@ export function Menu() {
   useHotkeys('shift+m', () => setIsOpen(prev => !prev));
   useHotkeys('shift+n', () => open('notepad'));
   useHotkeys('shift+p', () => open('pomodoro'));
+  useHotkeys('shift+t', () => open('timer'));
   useHotkeys('shift+alt+p', () => open('presets'));
   useHotkeys('shift+h', () => open('shortcuts'));
   useHotkeys('shift+s', () => open('shareLink'), { enabled: !noSelected });
-  useHotkeys('shift+t', () => open('sleepTimer'));
+  useHotkeys('shift+alt+t', () => open('sleepTimer'));
 
   useCloseListener(closeAll);
 
@@ -111,7 +113,7 @@ export function Menu() {
                     <Divider />
                     <NotepadItem open={() => open('notepad')} />
                     <PomodoroItem open={() => open('pomodoro')} />
-                    <CountdownTimerItem />
+                    <TimerItem open={() => open('timer')} />
 
                     <Divider />
                     <ShortcutsItem open={() => open('shortcuts')} />
@@ -142,6 +144,7 @@ export function Menu() {
         show={modals.pomodoro}
         onClose={() => close('pomodoro')}
       />
+      <Timer show={modals.timer} onClose={() => close('timer')} />
       <SleepTimerModal
         show={modals.sleepTimer}
         onClose={() => close('sleepTimer')}
diff --git a/src/components/modals/shortcuts/shortcuts.tsx b/src/components/modals/shortcuts/shortcuts.tsx
index 786a3c1..3b705fd 100644
--- a/src/components/modals/shortcuts/shortcuts.tsx
+++ b/src/components/modals/shortcuts/shortcuts.tsx
@@ -31,6 +31,10 @@ export function ShortcutsModal({ onClose, show }: ShortcutsModalProps) {
     },
     {
       keys: ['Shift', 'T'],
+      label: 'Countdown Timer',
+    },
+    {
+      keys: ['Shift', 'Alt', 'T'],
       label: 'Sleep Timer',
     },
     {
diff --git a/src/components/toolbox/index.ts b/src/components/toolbox/index.ts
index b4b226a..07e92e8 100644
--- a/src/components/toolbox/index.ts
+++ b/src/components/toolbox/index.ts
@@ -1,2 +1,3 @@
 export { Notepad } from './notepad';
 export { Pomodoro } from './pomodoro';
+export { Timer } from './timer';
diff --git a/src/components/toolbox/timer/index.ts b/src/components/toolbox/timer/index.ts
new file mode 100644
index 0000000..91b3f08
--- /dev/null
+++ b/src/components/toolbox/timer/index.ts
@@ -0,0 +1 @@
+export { Timer } from './timer';
diff --git a/src/components/toolbox/timer/timer.module.css b/src/components/toolbox/timer/timer.module.css
new file mode 100644
index 0000000..fdbd99d
--- /dev/null
+++ b/src/components/toolbox/timer/timer.module.css
@@ -0,0 +1 @@
+/* WIP */
diff --git a/src/components/toolbox/timer/timer.tsx b/src/components/toolbox/timer/timer.tsx
new file mode 100644
index 0000000..f4fac85
--- /dev/null
+++ b/src/components/toolbox/timer/timer.tsx
@@ -0,0 +1,14 @@
+import { Modal } from '@/components/modal';
+
+interface TimerProps {
+  onClose: () => void;
+  show: boolean;
+}
+
+export function Timer({ onClose, show }: TimerProps) {
+  return (
+    <Modal show={show} onClose={onClose}>
+      <h1>Hello World</h1>
+    </Modal>
+  );
+}