feat: add countdown timer structure

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';

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}
     />
   );

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}
     />
   );
 }

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')}

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',
     },
     {

src/components/toolbox/index.ts

@@ -1,2 +1,3 @@
 export { Notepad } from './notepad';
 export { Pomodoro } from './pomodoro';
+export { Timer } from './timer';

src/components/toolbox/timer/index.ts

@@ -0,0 +1 @@
+export { Timer } from './timer';

src/components/toolbox/timer/timer.module.css

@@ -0,0 +1 @@
+/* WIP */

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>
+  );
+}