Tímmál

A privacy-first work time tracking application

Track time spent on tickets, generate Excel-compatible reports, and streamline your work report workflow. Built for developers and consultants who need accurate time tracking with data integrity guarantees.

Features

• Smart Timer: Start/stop timers on tasks with automatic persistence across page refreshes and browser crashes
• Ticket Organization: Link tasks to ticket IDs (PROJECT-123 format) with version tracking and categorization
• Manual Time Entry: Add forgotten work sessions with automatic overlap detection
• Excel-Compatible Reports: Generate time grid reports showing percentages of your workday (0.0-1.0 format)
• Privacy-First: OAuth authentication with Pocketbase backend - your data stays yours
• Data Integrity: Automatic validation prevents overlapping entries, enforces duration limits, and ensures accurate time data

Tech Stack

• Nuxt 4 - Vue 3 meta-framework with auto-imports and file-based routing
• Nuxt UI - Component library with Nord-inspired color scheme
• Pocketbase - Backend-as-a-Service for auth, database (SQLite), and real-time updates
• Pinia - State management
• TypeScript - Type safety throughout
• Vitest - Unit testing with happy-dom
• Playwright - E2E testing

Setup

Prerequisites

• Node.js 22+
• pnpm 10.23.0
• Nix with devenv (for Pocketbase management)

Installation

# Install dependencies
pnpm install

Pocketbase Setup

Pocketbase runs automatically via devenv (nix shell):

# Enter development environment
nix develop

# Pocketbase will be available at:
# - API: http://localhost:8090
# - Admin UI: http://localhost:8090/_/
# - Data stored in: pb_data/

Configure OAuth providers (Google, Microsoft) in the admin UI.

Development

Start the development server:

pnpm dev

The application will be available at http://localhost:3000.

Available Commands

# Development
pnpm dev              # Start dev server
pnpm build            # Build for production
pnpm preview          # Preview production build

# Code Quality
pnpm lint             # Run ESLint
pnpm typecheck        # Run TypeScript type checking

# Testing
pnpm test             # Run unit tests
pnpm test:watch       # Run tests in watch mode
pnpm test:coverage    # Run tests with coverage report
pnpm test:e2e         # Run E2E tests
pnpm test:e2e:ui      # Run E2E tests in UI mode

Project Structure

timmal/
├── app/                    # Nuxt 4 app directory
│   ├── app.config.ts       # Nuxt UI configuration
│   ├── app.vue             # Root layout
│   ├── components/         # Vue components (auto-imported)
│   ├── composables/        # Vue composables (auto-imported)
│   ├── layouts/            # Nuxt layouts
│   ├── middleware/         # Route middleware
│   ├── pages/              # File-based routing
│   ├── server/             # Server API routes
│   ├── stores/             # Pinia stores (auto-imported)
│   └── utils/              # Utility functions (auto-imported)
├── pb_data/                # Pocketbase data (gitignored)
└── nix/                    # Nix development environment

Configuration

ESLint

ESLint is configured with Nuxt's recommended settings plus stylistic rules:

• commaDangle: 'never'
• braceStyle: '1tbs'

TypeScript

Strict mode is enabled. Type checking runs via pnpm typecheck.

Nuxt UI Theme

Color scheme configured in app/app.config.ts:

• Primary: green
• Neutral: slate

Deployment

The application is designed to be deployed with:

• Frontend: Cloudflare Pages (or any static hosting)
• Backend: Pocketbase on a VPS or cloud provider

Check out the Nuxt deployment documentation for more information.

License

This repository is under the AGPL-3.0 licence.