Skip to content

Details

A daily activity timer for focusing, batching everyday tasks, and guarding your time. Learn how it works and where its code and data live.

Daily activities

Timer shows today’s activities in Asia/Jakarta time. Add an activity with a name, an optional description, and a duration in hours, minutes, and seconds. The duration must be between one second and 24 hours.

Each card shows time spent against its duration. Start begins an activity, Pause stops it, and Continue resumes from the saved time. Only one activity runs at once; starting another pauses the current one. At its duration, the activity stops and is marked Reached. With Autoplay enabled, Done or a duration completion starts the next unfinished activity, prioritizing paused activities. Autoplay runs while the site is open and stops when all activities are complete.

X and House keeping appear every day with a one-hour budget each. X is for bookmarks and scrolling; House keeping covers sweeping, mopping, watering plants, washing dishes, and cooking rice. Activities you add belong to that day only.

Task colors

Task colors show each activity’s current state: danger means it is running, attention means it is paused, and success means it has not started. Completed activities use muted colors and appear in the completed tasks table. The progress bar uses the same state color as the timer.

  • Running

    danger

    Time is counting toward the duration.

  • Paused

    attention

    Time is saved. Continue when you are ready.

  • Not started

    success

    The activity is ready to start.

Time and notifications

Running time is calculated from saved timestamps, so it can recover after navigating away, reloading, or closing the browser. Time spent never exceeds the activity’s duration. At midnight in Jakarta, the previous day stops counting and a new day begins with the recurring activities.

Completion appears as an on-screen message. You can also enable browser notifications. Alerts may arrive late while the browser is closed or suspended; there is no background scheduler or push service. Clicking a system notification opens or focuses Timer.

Statistics

Open Statistics to choose a date and review every activity’s description, duration, time spent, and status. The chart shows total time spent each day across 30 dates ending on the selected date. Dates without records contribute zero time.

Storage and sample data

In local development, one JSON file stores each day under data/timer/. Records include each activity’s duration, accumulated time, running timestamp, and completion information. Writes are serialized by one local server process and saved atomically. These personal files are ignored by Git.

Run bun run seed:timer to create realistic sample history for the previous 30 completed days. Existing records are preserved. Sample history is generated data, rather than measured activity.

The deployed app displays a read-only generated preview. It does not read personal JSON files or accept activity changes. Personal records are also excluded from deployment tracing.

Implementation files

Paths are relative to the project root.

Timer implementation file locations
File locationPurpose
app/timer/page.tsxTimer page header, introduction, and navigation.
app/timer/TimerClient.tsxPage composition: Today, toolbar, feedback, and task collection.
app/timer/components/TimerToolbar.tsxNotification and Autoplay switches, Cards/List selection, and Add Task.
app/timer/components/TaskList.tsxTask sorting and the responsive card/list collection.
app/timer/components/TaskCard.tsxCard composition, title, description, progress, and completion message.
app/timer/components/TaskProgress.tsxCurrent time, duration, percentage, and progress bar.
app/timer/components/TaskActions.tsxStart, Continue, Pause, and Done buttons and their sounds.
app/timer/components/TaskDescription.tsxDescription hover target, popover, and empty message.
app/timer/components/TaskDialog.tsxAdd/Edit triggers, form submission, and validation.
app/timer/components/TaskFormDialog.tsxShared Add/Edit modal, name and description fields, Cancel, and Save.
app/timer/components/DurationFields.tsxDuration number fields and the preset grid.
app/timer/components/taskPresentation.tsCard/list layout, spacing, borders, shadows, and state colors.
app/timer/components/useTaskState.tsThe ticking clock and derived running, paused, and completed state.
app/timer/store.tsDaily JSON storage, task operations, midnight rollover, and history.
app/timer/statistic/page.tsxStatistics page header and metadata.
app/timer/statistic/Statistics.tsxDate selection, the 30-day chart, and activity history.
app/timer/details/page.tsxThis explanation and file inventory.
app/api/timer/route.tsGET and POST handlers for Timer data and actions.
components/TimerProvider.tsxShared state, server synchronization, and completion notifications.
utils/timer.tsTypes, time calculations, recurring defaults, and sample data generation.
utils/timerValidation.tsValidation schemas for stored records and API messages.
scripts/seed-timer.tsCreates sample history for the previous 30 completed days.

Integration files

Shared files that connect Timer to the rest of the site.

Timer integration file locations
File locationPurpose
app/layout.tsxMounts TimerProvider so a running activity survives page navigation.
app/page.tsxLinks to Timer from the Home Tools section.
app/api/page.tsxDocuments the Timer API.
app/sitemap.tsIncludes the public Timer pages in the sitemap.
data/routes.tsMakes Timer pages available in site search.
public/sw.jsOpens or focuses Timer when a completion notification is clicked.
next.config.tsExcludes personal Timer records from deployment tracing.
package.jsonDefines the seed:timer command.
knip.jsoncRegisters the seed script as an operational entry point.
.gitignoreExcludes daily JSON records and temporary storage files from Git.
README.mdDocuments Timer behavior, storage, and notification support.

Daily data files

File names follow the calendar date, so the inventory grows as you use Timer.

Timer daily data file locations
File locationPurpose
data/timer/YYYY-MM-DD.jsonOne record per Jakarta calendar day, containing the date, revision, and activities.
data/timer/*.tmpTemporary files used during atomic writes, removed after saving.

For example, data/timer/2026-10-16.json stores activities for 16 October 2026 in Jakarta time. Each date uses the same naming pattern; personal records are not listed or loaded by this page.