Logtrace

Logtrace is a secure audit trail and logging platform built for compliance and security. It gives developers and organizations a simple API and dashboard for capturing, storing, and querying what happens in their systems: who did what, when, from where, and how.

This directory contains the Logtrace web application. The backend service that powers the API is maintained separately in the repository's backend directory.

What Logtrace Tracks

Events

HTTP activity including action names, methods, status codes, endpoints, client IP addresses, user agents, and geolocation.

Sessions

Login and logout activity enriched with device, IP, and location data. Sessions have an ACTIVE or INACTIVE status for auditing access history and detecting anomalies.

Audit Logs

Structured entries with an action, timestamp, user identity, IP address, and arbitrary JSON metadata. Use them for database queries, configuration changes, billing actions, and other important operations.

All records belong to an organization, giving each customer or team an isolated and searchable audit trail.

Frontend Features

• Multi-tenant organization switching with role-based access control
• Dashboards for events, sessions, audit logs, users, API keys, and billing
• Authentication with JWT-backed sessions and OAuth-ready flows
• Searchable, filterable data tables with pagination and bulk actions
• Responsive layouts with light and dark themes
• Automatic handling for expired sessions, authorization errors, and server failures

Tech Stack

• React 19 and TypeScript
• Vite for development and production builds
• TanStack Router for file-based application routing
• TanStack Query for server state and API caching
• Axios for HTTP requests
• Tailwind CSS and Radix UI primitives
• Zustand for client-side state

Getting Started

Requirements

• Node.js 22 or newer
• npm or any package manager
• A running Logtrace backend, unless you are working only on static UI

Install and Run

npm install
npm run dev

Vite prints the local development URL, normally http://localhost:5173.

Common Commands

npm run build         # type-check and create a production build
npm run preview       # preview the production build locally
npm run lint          # run ESLint
npm run lint:fix      # fix ESLint issues where possible
npm run format:check  # check Prettier formatting
npm run format        # format the project
npm run knip          # find unused files and exports

API Types

The frontend API client types can be generated from the backend Swagger specification:

npm run swagger

This command expects the backend repository to be available at ../backend and reads ../backend/swagger/swagger.yaml. Generated types are written to src/types.

Configuration

Runtime configuration is read through Vite's environment mechanism. Put local overrides in an uncommitted .env.local file and use the VITE_ prefix for values exposed to the browser. Never place secrets in frontend environment variables.

The backend is responsible for the PostgreSQL database, migrations, tenant isolation, and API authentication. See the backend README for migration and service setup instructions.