Files
kite/.planning/phases/04-folders-sharing-quotas-document-ux/04-08-SUMMARY.md
T

4.5 KiB

phase, plan, subsystem, tags, dependency_graph, tech_stack, key_files, decisions, metrics
phase plan subsystem tags dependency_graph tech_stack key_files decisions metrics
04-folders-sharing-quotas-document-ux 08 frontend-data-layer
api-client
pinia
vue-router
folders
shares
preferences
search
requires provides affects
04-07
frontend-data-contracts-for-04-09
frontend/src/api/client.js
frontend/src/stores/folders.js
frontend/src/stores/documents.js
frontend/src/router/index.js
added patterns
Pinia Composition API store
debounced watcher without lodash
lazy route imports
created modified
frontend/src/stores/folders.js
frontend/src/api/client.js
frontend/src/stores/documents.js
frontend/src/router/index.js
listDocuments extended in-place (not replaced) to preserve backward compatibility with existing callers
getDocumentContentUrl returns a plain string (no fetch) for use as iframe src or window.open target
searchQuery watcher enforces 2-char minimum before API call — shorter inputs restore full list without hitting backend
New routes use same implicit beforeEach auth guard as existing routes (check !meta.public && !accessToken)
duration completed tasks_completed tasks_total files_changed
12 minutes 2026-05-25 2 2 4

Phase 4 Plan 08: Frontend Data Layer Summary

One-liner: Wired all Phase 4 backend endpoints to the frontend via 13 new API client functions, a new useFoldersStore (Pinia Composition API), extended useDocumentsStore with folder/search/sort/share state, and two new authenticated routes.

Tasks Completed

# Task Commit Files
1 Add Phase 4 API functions to client.js and create folders store 5417f26 frontend/src/api/client.js, frontend/src/stores/folders.js
2 Extend documents store with folder/search/share actions + add Vue Router routes 5417f26 frontend/src/stores/documents.js, frontend/src/router/index.js

What Was Built

API Client Extensions (frontend/src/api/client.js)

listDocuments updated to accept folderId, q, sort, order params — passed via URLSearchParams when non-null/non-empty.

13 new functions added:

Group Functions
Folders listFolders, createFolder, getFolder, renameFolder, deleteFolder, moveDocument
Shares createShare, listShares, deleteShare, getSharedWithMe
Preferences getMyPreferences, updateMyPreferences
Proxy URL getDocumentContentUrl

Folders Store (frontend/src/stores/folders.js)

New Pinia Composition API store (useFoldersStore) following the exact useTopicsStore pattern:

  • State: folders, currentFolderId, breadcrumb, loading, error
  • Actions: fetchFolders, createFolder, renameFolder, deleteFolder, navigateTo
  • navigateTo fetches folder detail for breadcrumb population; handles null (root) cleanly

Documents Store Extensions (frontend/src/stores/documents.js)

  • Added watch import from 'vue'
  • New state refs: currentFolderId, searchQuery, sortField, sortOrder
  • fetchDocuments extended to accept and pass folderId, q, sort, order to api.listDocuments
  • Debounced searchQuery watcher: 300ms delay, 2-char minimum (T-04-08-03 mitigated)
  • New share actions: shareDocument, revokeShare, listShares
  • Return statement extended with all new state and actions

Router Routes (frontend/src/router/index.js)

Two new lazy-loaded authenticated routes appended:

  • /folders/:folderIdFolderView.vue (named folder)
  • /sharedSharedView.vue (named shared)

Both use meta: { requiresAuth: true } and are guarded by the existing beforeEach hook.

Deviations from Plan

None — plan executed exactly as written.

Threat Mitigations Applied

Threat Mitigation
T-04-08-01 — unguarded routes Both new routes have meta: { requiresAuth: true }
T-04-08-03 — premature search searchQuery watcher checks newVal.length < 2 before firing API call

Known Stubs

None. This plan creates data layer only — no UI components with rendering stubs.

Self-Check: PASSED

  • frontend/src/api/client.js — FOUND, 45 export functions (13 new)
  • frontend/src/stores/folders.js — FOUND, exports useFoldersStore
  • frontend/src/stores/documents.js — FOUND, contains all new refs and actions
  • frontend/src/router/index.js — FOUND, contains /folders/:folderId and /shared routes
  • Commit 5417f26 — FOUND in git log