diff --git a/eslint.config.ts b/eslint.config.ts
index da6658e..8efcc3a 100644
--- a/eslint.config.ts
+++ b/eslint.config.ts
@@ -4,6 +4,7 @@ import css from '@eslint/css';
import eslint from '@eslint/js';
import html from '@html-eslint/eslint-plugin';
import stylistic from '@stylistic/eslint-plugin';
+import { createTypeScriptImportResolver } from 'eslint-import-resolver-typescript';
import { importX } from 'eslint-plugin-import-x';
import jsonc from 'eslint-plugin-jsonc';
import jsxA11y from 'eslint-plugin-jsx-a11y';
@@ -56,6 +57,9 @@ export default defineConfig(
{ allowNumber: true },
],
},
+ settings: {
+ 'import-x/resolve-next': [createTypeScriptImportResolver()],
+ },
},
{
extends: [
diff --git a/package.json b/package.json
index 746ee6f..afb16fa 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,6 @@
},
"pnpm": {
"onlyBuiltDependencies": [
- "@tailwindcss/oxide",
"esbuild",
"unrs-resolver"
]
diff --git a/src/ClockHands.tsx b/src/ClockHands.tsx
index b1f0405..c41c08c 100644
--- a/src/ClockHands.tsx
+++ b/src/ClockHands.tsx
@@ -1,14 +1,29 @@
-import { onCleanup } from 'solid-js';
+import { createMemo, createSignal, onCleanup } from 'solid-js';
import { ClockLine as ClockHand } from '@/ClockLine';
-import { time } from '@/time';
+import { rotate, seconds } from '@/common';
import { getTestId } from '@/utilities';
+const hours = seconds / 5;
+const getSecondsSinceMidnight = (): number =>
+ (Date.now() - new Date().setHours(0, 0, 0, 0)) / 1000;
+
+const [time, setTime] = createSignal(getSecondsSinceMidnight());
+
+let frame = requestAnimationFrame(function loop() {
+ setTime(getSecondsSinceMidnight());
+ frame = requestAnimationFrame(loop);
+});
+
export const ClockHands = () => {
- let frame = requestAnimationFrame(function loop() {
- time.update();
- frame = requestAnimationFrame(loop);
- });
+ const hour = createMemo(() =>
+ rotate(((time() / seconds ** 2) % hours) / hours),
+ );
+ const minute = createMemo(() =>
+ rotate(((time() / seconds) % seconds) / seconds),
+ );
+ const second = createMemo(() => rotate((time() % seconds) / seconds));
+ const subsecond = createMemo(() => rotate(time() % 1, 0));
onCleanup(() => {
cancelAnimationFrame(frame);
@@ -20,22 +35,22 @@ export const ClockHands = () => {
class="stroke-zinc-200 stroke-3 dark:stroke-zinc-600"
data-testid={getTestId('subsecond')}
length={82}
- transform={time.milisecond}
+ transform={subsecond()}
/>
>
);
diff --git a/src/time.ts b/src/time.ts
deleted file mode 100644
index b570897..0000000
--- a/src/time.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { createSignal } from 'solid-js';
-
-import { rotate, seconds } from '@/common';
-
-const hours = seconds / 5;
-const getSecondsSinceMidnight = (): number =>
- (Date.now() - new Date().setHours(0, 0, 0, 0)) / 1000;
-
-const [clock, setClock] = createSignal(getSecondsSinceMidnight());
-
-export const time = {
- get hour() {
- return rotate(((clock() / seconds ** 2) % hours) / hours);
- },
- get milisecond() {
- return rotate(clock() % 1, 0);
- },
- get minute() {
- return rotate(((clock() / seconds) % seconds) / seconds);
- },
- get second() {
- return rotate((clock() % seconds) / seconds);
- },
- update: () => {
- setClock(getSecondsSinceMidnight());
- },
-};