Skip to main content

Getting Started with FS Garage Utilisation (FE)

Prerequisites​

  • Node.js 20+
  • npm / yarn / pnpm / bun
  • Access to TeamFleetStudio/base-fs-garage-fe
  • Local or remote PocketBase URL from fs-garage-base (typically http://127.0.0.1:8091)

Installation​

Step 1: Clone​

git clone https://github.com/TeamFleetStudio/base-fs-garage-fe.git
cd base-fs-garage-fe

Step 2: Install dependencies​

npm install

Step 3: Configure environment​

Create .env.local with PocketBase and timesheet settings (exact keys are in repo docs/ / env samples):

# Example shape - confirm names in the FE repo
NEXT_PUBLIC_POCKETBASE_URL=http://127.0.0.1:8091
# Timesheet base URL used by lib/timesheet helpers

Step 4: Run​

npm run dev
# next dev --turbopack

Open the app (default Next.js port) and sign in through Garage auth. Utilisation is under the header icon after Timesheet (/utilization).

Useful scripts​

ScriptPurpose
npm run devLocal Next.js (Turbopack)
npm run build / npm startProduction build/serve
npm testVitest
npm run test:e2ePlaywright
npm run preview / npm run deployOpenNext Cloudflare

Verification​

  • Login works via PocketBase users
  • Header shows Utilisation icon
  • /utilization loads scorecard shell without FE calc errors
Backend required

Scorecard data comes from fs-garage-base hooks. Start PocketBase locally before testing Run Now / scorecard.

Troubleshooting​

Issue: Auth redirect loop

  • Solution: Check middleware.js and PocketBase URL in .env.local

Issue: Empty scorecard

  • Solution: Confirm BE /api/utilisation/scorecard and published allocations exist

Next Steps​