@@ -1,47 +0,0 @@# CLAUDE.mdThis file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.## Project OverviewTimelite is a browser-based app for casual time tracking. All data is stored locally in the browser using localForage (IndexedDB) — there is no backend or database. Once loaded, the app works offline. It is not installable as a PWA: the service worker and `next-pwa` integration were removed; the `manifest.json` is retained for icon/theme metadata only, and any previously registered service worker is unregistered on load.## Commands- `bun install` — install dependencies- `bun start` — run dev server on port 8000- `bun run next:build` — production build- `docker-compose up -d --build` — build and run via DockerThere are no tests or linting configured in this project.## Architecture**Framework:** Next.js (Pages Router) with React. Plain JavaScript (no TypeScript).**State management:** Single React Context + useReducer pattern in `components/context.js`. All app state (timer, pause state, log entries, note draft, language, selection, edit mode) lives here and is persisted to localForage on every reducer action. Actions include `ADD_LOG`, `ADD_MANUAL_LOG`, `IMPORT_LOG`, `EDIT_LOG`, `REMOVE_LOG`, `CLEAR_LOG`, `CLEAR_TAG`, `NEW_TIMER`, `PAUSE_TIMER`, `RESUME_TIMER`, `NOTE_UPDATED`, `SET_LANGUAGE`, `NEXT_LOG_ITEM`, `PREVIOUS_LOG_ITEM`, `SELECT_LOG_ITEM`, `TOGGLE_EDITION`, `LOCALDATA_READY`.**Pages** (`pages/`): index (timer), log, summary, about. `_app.js` wraps everything with `ContextProvider`, `HotKeysMapping`, `ToastContainer`, and `Sidebar`, plus route-level page transitions via `react-transition-group`. `L10n` (language picker) is only rendered on the About page, not globally.**Components** (`components/`):- `timer.js` — timer display + note input + reset/pause/add buttons- `entry.js` — one log row, inline-editable via `react-hook-form`- `newEntryForm.js` — manual entry form with datetime-local inputs- `tagNoteInput.js` — text input with `#tag` autocomplete dropdown- `sidebar.js` — left nav with brand mark + page icons- `HotKeysMapping.js` — global hotkey handlers via `react-hotkeys`- `keyHelpOverlay.js` — `?` shortcut cheat-sheet modal- `l10n.js` — language `<select>` (used on About page)- `page.js` — shared `<Head>` + page wrapper**Localization** (`l10n/`): Uses `react-localization`. Each component/page has a corresponding l10n file with strings for en, jp, and pl.**Styling:** CSS Modules in `styles/components/` and `styles/pages/`. Global styles and the full theme (CSS custom properties, palette, transitions, toast overrides) live in `styles/globals.css`.**Import/export** (`utils/importExport.js`): CSV, JSON, and Markdown export; CSV/JSON import with de-duplication and tag re-extraction. CSV cells are prefixed with `'` when they start with `=+-@` to neutralize formula-injection in spreadsheets.**IDs:** `crypto.randomUUID()` with a `Date.now()`-based fallback for environments without it (see `newId` in `context.js`).**Key libraries:** `chart.js` (summary charts), `react-hook-form` (entry editing), `react-hotkeys` (keyboard shortcuts), `react-csv` (CSV export), `react-toastify` (notifications), `react-transition-group` (page + entry transitions), `localforage` (IndexedDB persistence), `prop-types` (runtime prop checks).**Log entries** have: `id`, `start`, `end`, `note`, and `tags` (lowercased `#hashtag` words extracted from the note text).
@@ -18,17 +18,27 @@ https://timelite.bythewood.me/I want to casually track the time I spend on things without any overhead ofsigning into a service or even being online. All data stays in your browser(IndexedDB via localForage), there is no backend, and nothing is tracked orsent anywhere.sent anywhere. Once the page has loaded it keeps working offline.Timelite has been a pretty great companion for me with more aggressive teammanagement software solutions that sometimes don't allow me to swap betweenprojects quickly and track time easily. I tend to hop from project to projectand task to task regularly. Larger solutions have a lot of overhead for basictime tracking. I tend to track my time here and then input that time at the endof the day or increments that make more sense.Timelite has been a great companion alongside more aggressive team-managementsoftware that sometimes doesn't let me swap between projects quickly and tracktime easily. I tend to hop from project to project and task to task regularly.Larger solutions carry a lot of overhead for basic time tracking. I track mytime here and then enter it into those tools at the end of the day, inincrements that make more sense.For an overview of how to get this project running and why it's useful check outthe DB Tech video on it here: https://www.youtube.com/watch?v=woG6qOmxlOAFor an overview of how to get this project running and why it's useful, checkout the DB Tech video on it here: https://www.youtube.com/watch?v=woG6qOmxlOA## Privacy and offlineThere is no account, no server, and no network call for your data. Every entrylives in your browser's IndexedDB. That also means your data is tied to thatbrowser on that device: clearing site data wipes it, so use the JSON export ifyou want a backup or want to move between machines. Timelite is not installableas a PWA; the service worker was removed, but the app still functions offlinebecause the data never leaves the browser.## Features
@@ -37,61 +47,70 @@ the DB Tech video on it here: https://www.youtube.com/watch?v=woG6qOmxlOA- **Log** with per-day grouping, tag filtering, inline edit, manual entry, and import/export (CSV, JSON, Markdown)- **Summary** with charts for hours-per-tag and hours-per-day- **Keyboard shortcuts** — press `?` anywhere to see the full map- **Local-only, offline-capable** — all data stays in IndexedDB and never- **Keyboard shortcuts**, press `?` anywhere to see the full map- **Localized** in English, Japanese, and Polish (language picker on the About page)- **Local-only and offline-capable**, all data stays in IndexedDB and never leaves the browser## Tech stack- Next.js (Pages Router) and React, plain JavaScript (no TypeScript)- Bun as the runtime and package manager- localForage for IndexedDB persistence- CSS Modules with a single global theme in `styles/globals.css`- chart.js, react-hook-form, react-hotkeys, react-toastify, react-transition-group, react-csv, and react-localizationAll app state (timer, log, language, edit mode, and so on) lives in one ReactContext plus reducer in `components/context.js` and is saved to IndexedDB onevery change, so there is no save button.## CloneFor any possible way of running Timelite yourself you'll need a copy of therepo:Whichever way you run Timelite, start by grabbing the repo: git clone https://github.com/overshard/timelite.gitAfter you get the repo it's up to you how you want to use it.## DevelopmentYou will need to have `bun` installed. If you don't have it yet, visithttps://bun.sh/ for installation instructions. After that you can run:You will need `bun` installed. If you don't have it yet, see https://bun.sh/for installation instructions. Then run: bun install bun startThis will spin up Timelite to run on port 8000 which you can access via abrowser at `http://localhost:8000`.This serves Timelite on port 8000, reachable at `http://localhost:8000`. Toproduce a production build, run `bun run next:build`.## ProductionInstall Docker and docker-compose, then run the container on any server.`restart: unless-stopped` is configured so the container comes back up aftersystem restarts or crashes. Appending `-d` runs it in detached mode:restarts or crashes. Appending `-d` runs it detached: docker-compose up -d## PortsTo change which ports things run on you can update the `package.json` file'sscripts. You will also need to update the `docker-compose.yml` file, if you usethat, to properly publish the new port.To change which ports things run on, update the scripts in `package.json`. Ifyou use Docker, also update `docker-compose.yml` to publish the new port.## TroubleshootingYou may need to manually rebuild your docker container at times depending onchanges that have been made that may not automatically trigger a rebuild. To dothat you can run:Some changes won't automatically trigger a Docker rebuild. To force one: docker-compose up -d --buildThe `up` implies that you want to start the server again, `--build` will rebuildthe container and `-d`, as stated above, starts us in detached mode so you canset it and forget it.Here `up` starts the server, `--build` rebuilds the container, and `-d` runs itdetached so you can set it and forget it.If you previously used an older version and now see stale service-worker /If you previously used an older version and now see stale service-worker orfilesystem errors in the console, the app now unregisters any old serviceworkers on load. A hard refresh (Ctrl+Shift+R) will clear them after one visit.workers on load. A hard refresh (Ctrl+Shift+R) clears them after one visit.