How flowz5/dashboard works
DevBoard Kanban is a React app for development teams to create and track tickets across five board stages, with accounts, shared boards, and member invitations. The main workflow is authentication → project selection or creation → board view → ticket creation, editing, deletion, and drag-and-drop status changes. Zustand provides the shared board/ticket state and Firestore persistence and live updates. README capabilities are represented; source not sampled beyond the excerpts is included only where the tree and documentation support it.
Main entry points: App.jsx Board view · firebase.js Firebase setup · useBoardStore.js Board and ticket store · Home.jsx Project dashboard
Components 15
Access
- App routing
src/App.jsx - Login and signup
src/pages/Login/Login.jsx
Projects
- Project dashboard
src/pages/Home/Home.jsx - Board navigation
src/components/Navbar/Navbar.jsx - Member invitation
src/components/InviteModal/InviteModal.jsx
Kanban
- Board view
src/App.jsx - Status columns
src/components/Column/Column.jsx - Ticket card
src/components/Ticket/Ticket.jsx - Ticket editor
src/components/TicketModal/TicketModal.jsx - Shared button
src/components/Button/Button.jsx
Data
- Board and ticket store
src/store/useBoardStore.js - Firebase setup
src/firebase.js - Firebase Auth
- Cloud Firestore
Other components
- Team member
Connections 31
- Team member → App routing: opens app
- App routing → Firebase Auth: checks session
src/App.jsx - App routing → Login and signup: routes unauthenticated
src/App.jsx - Login and signup → Firebase Auth: signs in or registers
src/pages/Login/Login.jsx - App routing → Project dashboard: routes signed-in
src/App.jsx - Project dashboard → Board and ticket store: loads and manages boards
src/pages/Home/Home.jsx - Project dashboard → App routing: navigates to board
src/pages/Home/Home.jsx - App routing → Board view: routes board URL
src/App.jsx - Board view → Board and ticket store: listens and updates
src/App.jsx - Board view → Board navigation: renders board context
src/App.jsx - Board view → Status columns: renders five statuses
src/App.jsx - Board view → Ticket card: renders filtered tickets
src/App.jsx - Board view → Ticket editor: opens editor
src/App.jsx - Ticket editor → Board view: submits ticket data
src/components/TicketModal/TicketModal.jsx - Status columns → Board and ticket store: moves ticket
src/components/Column/Column.jsx - Board navigation → Member invitation: opens invitation
src/App.jsx - Member invitation → Board view: submits email
src/components/InviteModal/InviteModal.jsx - Board view → Board and ticket store: invites or removes member
src/App.jsx - Login and signup → Shared button: uses
src/pages/Login/Login.jsx - Project dashboard → Shared button: uses
src/pages/Home/Home.jsx - Board navigation → Shared button: uses
src/components/Navbar/Navbar.jsx - Ticket editor → Shared button: uses
src/components/TicketModal/TicketModal.jsx - Member invitation → Shared button: uses
src/components/InviteModal/InviteModal.jsx - Board and ticket store → Firebase setup: uses database client
src/store/useBoardStore.js - Project dashboard → Firebase setup: uses authentication
src/pages/Home/Home.jsx - Board navigation → Firebase setup: uses authentication
src/components/Navbar/Navbar.jsx - Login and signup → Firebase setup: uses authentication
src/pages/Login/Login.jsx - App routing → Firebase setup: uses authentication
src/App.jsx - Firebase setup → Firebase Auth: initializes
src/firebase.js - Firebase setup → Cloud Firestore: initializes
src/firebase.js - Board and ticket store → Cloud Firestore: reads and writes boards and tickets
src/store/useBoardStore.js