$ show LifeArchiveProject/BiliHistoryFrontend
BiliHistoryFrontend is a Vue 3 + Vite single-page application with an optional Tauri desktop shell. Its production role is to act as the user-facing client for a self-hosted Bilibili history backend (BilibiliHistoryFetcher): it lets users log in with a Bilibili QR flow, browse and filter watch history, manage favorites, export/import history data, download videos and dynamic feeds through the Yutto backend, schedule recurring API tasks, and explore analytics such as monthly viewing, watch streaks, completion rates, title sentiment, and popularity predictions. The repository is primarily an application, although its analytics-heavy pages and JSON/SQLite synchronization workflows give it a hybrid application and data-tool character. Architecturally, the entry points are src/main.js for Vue bootstrap and Tauri initialization, src/router/router.js for page routing, and src/App.vue plus src/components/tailwind/layout/MainLayout.vue for the main shell. Data flows through a centralized axios client in src/api/api.js that calls many local REST endpoints, with sessionStorage caching for history records and localStorage-backed settings. The UI is a large collection of Vue components: history lists, video player dialogs with danmaku support, download dialogs with SSE progress, scheduler task forms, and an annual-report-style analytics dashboard. External runtime dependencies include the self-hosted backend, Bilibili web APIs, Yutto for downloads, FFmpeg on the server, and optional email/MCP services. No automated tests are present in the repository, and the codebase contains duplicated formatting and remark logic, large single-file components, direct localStorage access, and a Tauri config with CSP disabled, so maintainability is mixed despite the modern stack.
The LLM identified 4 files worth highlighting for reuse:
A dependency-light select/dropdown component used across the app to replace native selects in Tailwind/Vant contexts. It exposes a standard value and change contract and is styled for dark/light modes, so it can be lifted into another Vue project with almost no internal coupling.
Generic pagination component with standard current-page and page-size events, used by history, download, and analytics views. It is self-contained and not tied to Bilibili domain logic, making it a safe reusable UI primitive.
Wraps ArtPlayer and adds Bilibili ASS danmaku rendering while preserving normal video controls and lifecycle. It demonstrates a non-obvious media-wrapper pattern; a future project needing web video with subtitle or danmaku overlays can adapt it with minimal domain changes.
Utility functions for normalizing Bilibili cover and avatar URLs and toggling local image mode. It solves a recurring CDN, local-path, and query-string normalization problem and is small enough to extract as a standalone helper for other media-rich frontends.