Frontend

Frontend is RAGA's web dashboard — a Vue 3 + TypeScript application that serves as the main user interface for chat, workspace and knowledge management, and administration (users, roles, models, etc.). This repository lives under the dashboard namespace (tarantula-v2/dashboard/tarantula-frontend), separate from the backend services which live under the service namespace.

Frontend talks directly to User Service for authentication, and to API Tarantula for all workspace, knowledge, and chat operations.

Tech Stack

Component	Technology
Framework	Vue 3 (Composition API) + TypeScript
Build Tool	Vite 6
State Management	Pinia (with pinia-plugin-persistedstate)
Routing	Vue Router 4, mounted per module
UI Components	shadcn-vue ("New York" style) + Tailwind CSS + Lucide icons
Forms & Validation	vee-validate + zod
Data Fetching	Tanstack Vue Query, axios
Rich Text / Editor	Tiptap, md-editor-v3, markdown-it
Visualization	D3, Unovis, Highcharts, Vue Flow (flow diagrams), Superset (embedded BI)

Full environment variable, module map, and authentication architecture details are on the Technical page.

How It Works

1. The user logs in via the Auth page — the token is issued by User Service, stored encrypted in the browser (encrypt-storage), and automatically attached as the Authorization header on every axios request.
2. Every route/menu is shown or hidden based on the user's map_policies (from User Service's RBAC) — UI components call usePermission() to check per-endpoint+method permission before rendering an action (create/read/update/delete).
3. App features are split into ~26 independent modules (workspace, chat, document, audio, rdbms, api, etc.), each owning its own router, store, and components.
4. When the access token expires, an axios interceptor automatically calls /auth/refresh-token on User Service before retrying the failed request.

Summary

Frontend is the single human interface to the RAGA platform — bringing together User Service authentication, data and chat from API Tarantula, and embedded BI from Superset into one modular Vue 3 dashboard.