SafeX Weekly Task Tracker

A role-based weekly task tracker for the SafeX internship program. Interns, group leaders, and admins each get a tailored view of the board, backed by server-side permissions, analytics, and a clean drag-and-drop workflow.

Overview

This project was built to support the weekly rhythm of the SafeX internship process. Tasks move across a kanban board, comments capture context, and the weekly pulse gives a quick read on completed work across the week.

Live Features

• JWT authentication with three roles: intern, group_leader, admin
• Kanban board with drag-and-drop task movement
• Server-enforced role scoping, not just hidden UI
• Weekly Pulse strip for Mon–Fri completion activity
• Task comments and task detail modal
• Analytics dashboard with completion and overdue insights
• Dark mode and responsive layout

Features by role

• Interns: view assigned tasks and leave comments
• Group leaders: manage tasks inside their group
• Admins: see and manage all groups and tasks

Tech Stack

Layer	Stack
Backend	FastAPI, SQLAlchemy, Alembic
Auth	JWT, bcrypt
Frontend	React 18, TypeScript, Vite
Styling	Tailwind CSS
Drag and drop	@dnd-kit
Charts	Recharts
Database	PostgreSQL

Setup

Backend

cd backend
python -m venv venv
venv\Scripts\activate
pip install -r requirements.txt
python seed.py
uvicorn app.main:app --reload

API: http://localhost:8000 Docs: http://localhost:8000/docs

Frontend

cd frontend
npm install
npm run dev

App: http://localhost:5173

Demo Accounts

Use these seeded accounts after running the backend seed script:

Email	Role	Password
admin@safex.com	Admin	password123
leader@safex.com	Group Leader	password123
intern1@safex.com	Intern	password123
intern2@safex.com	Intern	password123

Deployment

• Backend: Render
• Frontend: Vercel
• Set VITE_API_URL on the frontend to your backend URL
• Set FRONTEND_URL on the backend to your deployed frontend origin

Project Structure

safex-task-tracker/
├── backend/
│   ├── app/
│   ├── alembic/
│   ├── seed.py
│   └── render.yaml
└── frontend/
    ├── src/
    └── vercel.json

Notes

• Database migrations are managed with Alembic.
• The UI uses a custom design system instead of a default component library look.
• The Weekly Pulse strip is the signature board element.

Roadmap

• Live updates with WebSockets
• File attachments on tasks
• CSV/PDF exports for weekly reporting

License

MIT License. See LICENSE.