Skip to content

agusandeepa/weekly-report-app

Repository files navigation

Weekly Report Generator & Team Dashboard

A full-stack web application for teams to submit structured weekly work reports and for managers to view, filter, and analyze reports across the team through a consolidated dashboard.

Tech Stack

  • Frontend & Backend: Next.js 16 (App Router) + JavaScript
  • Styling: Tailwind CSS
  • Database: PostgreSQL (hosted on Neon)
  • ORM: Prisma
  • Authentication: NextAuth.js (Credentials provider, JWT sessions)
  • Charts: Recharts
  • AI Assistant: Google Gemini API (gemini-2.5-flash)

Features

  • Role-based authentication (Team Member / Manager)
  • Personal weekly report page (create, edit, submit, view history)
  • Team dashboard for managers (filters by member/project/date, submission status tracking)
  • Projects/categories management (CRUD)
  • Visual insights: submission charts, workload distribution, hours trend
  • AI Chat Assistant for managers to query team activity (bonus feature)

Prerequisites

  • Node.js v18 or higher
  • A Neon PostgreSQL database (free tier) or any PostgreSQL instance
  • A Google AI Studio API key (free, for the AI Chat Assistant)

Setup Instructions

1) Installing Dependencies

Clone the repository and install all required packages:

git clone <your-repo-url>
cd weekly-report-app
npm install

Create a .env file in the root directory with the following:

DATABASE_URL="your_postgresql_connection_string"
NEXTAUTH_SECRET="a_random_secret_string"
NEXTAUTH_URL="http://localhost:3000"
GEMINI_API_KEY="your_google_gemini_api_key"
  • DATABASE_URL: Get this from your Neon dashboard (or any PostgreSQL provider).
  • NEXTAUTH_SECRET: Any random string (used to encrypt sessions).
  • GEMINI_API_KEY: Get a free key from Google AI Studio (used for the AI Chat Assistant).

2) Running the Database

This project uses PostgreSQL via Prisma ORM. Run the migration to create all tables (User, Project, Report, ProjectMember) on your database:

npx prisma migrate dev --name init

This connects to the PostgreSQL database specified in DATABASE_URL and creates the schema automatically. No separate local database installation is required if using a cloud provider like Neon.

3) Running the Backend

This project uses Next.js API Routes as the backend (REST API), which live in the same codebase as the frontend. The backend starts automatically as part of the same dev server command below — there is no separate backend process to run.

Backend API routes are located in src/app/api/ (auth, register, projects, reports, users, chat).

4) Running the Frontend

Start the Next.js development server, which serves both the frontend (React pages) and backend (API routes) together:

npm run dev

Open http://localhost:3000 in your browser.

First-time Usage

  • Go to /register and create a Manager account and a Team Member account.
  • Log in as Manager to add Projects (/dashboard/projects) before team members submit reports.
  • Log in as a Team Member to submit weekly reports (/reports).
  • Log in as Manager to view the Team Dashboard (/dashboard/team) with charts and the AI Chat Assistant.

Project Structure

src/
├── app/
│   ├── api/              # Backend REST API routes
│   │   ├── auth/         # NextAuth login/logout
│   │   ├── register/     # User registration
│   │   ├── projects/     # Projects CRUD
│   │   ├── reports/      # Reports CRUD + status
│   │   ├── users/        # Team member list (Manager only)
│   │   └── chat/         # AI Chat Assistant endpoint
│   ├── components/       # Reusable UI components (ChatWidget)
│   ├── dashboard/
│   │   ├── projects/     # Projects management page
│   │   └── team/         # Manager's team dashboard
│   ├── login/            # Login page
│   ├── register/         # Registration page
│   └── reports/          # Personal weekly report page (Team Member)
├── auth.js                # NextAuth configuration
├── lib/prisma.js          # Prisma client singleton
├── middleware.js          # Route protection
prisma/
└── schema.prisma          # Database schema

Database Schema

  • User — id, name, email, password (hashed), role (MEMBER/MANAGER)
  • Project — id, name (categories like Client A, Marketing, R&D)
  • Report — id, userId, projectId, weekStartDate, weekEndDate, tasksCompleted, tasksPlanned, blockers, hoursWorked, notes, status
  • ProjectMember — join table linking users to projects (optional assignment)

Roles & Access Control

Feature Team Member Manager
Submit/edit own reports
View own report history
View all team reports
Create/edit/delete projects
View team dashboard & charts
Use AI Chat Assistant

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages