How phyothukha/learnflow-frontend works
Learnflow is a learning-workspace web application with topic-scoped notes and library content, study timelines, dashboards, and admin management for courses and enrollments. The main runtime pattern is a user working through the Next.js UI and API routes, which authenticate requests and proxy data to a backend service; the sampled routes show this directly for documents, enrollments, and study blocks. The graph also retains the documented topic-context workflow and major unsampled product areas. Evidence is limited to the README, source index, and excerpts; unverified UI-to-API links are omitted.
Main entry points: study-blocks/route.ts Study-block API · axios.ts HTTP clients · enrollments/route.ts Enrollment API · auth.ts Authentication
Components 26
Workspace UI
- Workspace shell
src/layout/main-layout.tsx - Workspace header
src/layout/header.tsx - Topic context
src/components/topic-context-switcher.tsx - Document library
src/app/(admin)/library - Notes workspace
src/app/(admin)/notes - Study timeline
src/app/(admin)/timeline/page.tsx - Learning dashboard
src/app/(admin)/dashboard - UI primitives
src/components/ui - Confirmation hook
src/hooks/use-confirm-dialog.ts
Admin tools
- Course management
src/app/(admin)/courses - Enrollment management
src/app/(admin)/enrollments
Access and API
- Authentication
src/lib/auth.ts - Document API
src/app/api/documents - Enrollment API
src/app/api/enrollments/route.ts - Study-block API
src/app/api/study-blocks/route.ts - Course API
src/app/api/courses/route.ts - Notes API
src/app/api/notes/route.ts - Topics API
src/app/api/topics/route.ts - Topic-folder API
src/app/api/topic-folders - Tags API
src/app/api/tags/route.ts
Client and query state
- Client workspace state
src/store/client/use-store.ts - Topic queries
src/store/server/topics/queries.ts - Query builder
src/utils/query.ts - HTTP clients
src/lib/axios.ts
Other components
- Workspace user
- Backend service
Connections 33
- Workspace user → Workspace shell: uses
- Workspace shell → Workspace header: hosts
- Workspace header → Topic context: renders
src/layout/header.tsx - Topic context → Topic queries: fetches topics
src/components/topic-context-switcher.tsx - Topic context → Client workspace state: updates context
src/components/topic-context-switcher.tsx - Workspace header → Topic queries: loads breadcrumbs
src/layout/header.tsx - Workspace header → Confirmation hook: requests logout confirmation
src/layout/header.tsx - Topic queries → HTTP clients: uses
src/store/server/topics/queries.ts - Study-block API → Authentication: checks session
src/app/api/study-blocks/route.ts - Study-block API → Query builder: builds query
src/app/api/study-blocks/route.ts - Study-block API → HTTP clients: requests data
src/app/api/study-blocks/route.ts - Study-block API → Backend service: proxies requests
src/app/api/study-blocks/route.ts - Document API → Authentication: checks session
src/app/api/documents/route.ts - Document API → HTTP clients: requests data
src/app/api/documents/route.ts - Document API → Backend service: proxies requests
src/app/api/documents/route.ts - Enrollment API → Authentication: checks session
src/app/api/enrollments/route.ts - Enrollment API → Query builder: builds query
src/app/api/enrollments/route.ts - Enrollment API → HTTP clients: requests data
src/app/api/enrollments/route.ts - Enrollment API → Backend service: proxies requests
src/app/api/enrollments/route.ts - Authentication → HTTP clients: authenticates via
src/lib/auth.ts - Authentication → Backend service: submits credentials
src/lib/auth.ts - HTTP clients → Backend service: targets service
src/lib/axios.ts - Course API → Backend service: proxies requests
- Notes API → Backend service: proxies requests
- Topics API → Backend service: proxies requests
- Topic-folder API → Backend service: proxies requests
- Tags API → Backend service: proxies requests
- Course management → Course API: manages via
- Enrollment management → Enrollment API: manages via
- Document library → Document API: works with
- Notes workspace → Notes API: works with
- Study timeline → Study-block API: works with
- Learning dashboard → Study-block API: uses activity data