GovTech's Talent Identification System (Flask + Supabase)

This is a Flask web application integrated with Supabase to help managers assess and manage employee potential and performance. The system features a live-updating 9-box grid, editable employee data, and secure authentication, providing an interactive view of talent across the organization.

🚀 Features

• ✅ Secure login with Supabase Auth
• ✅ Manager-specific dashboards showing assigned employees
• ✅ Editable performance and derailers scores
• ✅ Undo and redo edits before saving
• ✅ Finalize changes and update Supabase in real time
• ✅ Interactive 9-box grid visualization:
  • Color-coded based on performance/potential
  • Live updates as scores are edited
  • Detailed tooltips showing:
    • Employee Name
    • Potential Score
    • Performance Grade
    • Organisation
    • Job Role
    • Job Grade
• ✅ Display employee profile pictures from Supabase Storage
• ✅ Responsive and clean UI
• ✅ Employee Category Tags:
  • Each employee card shows a color-coded tag – "Blue", "Green", or "Red" – determined by comparing the employee’s performance grade and average potential-based score on the nine-box grid. This tag is visible on both the Individual and Benchmark views.
• ✅ Enhanced Filtering:
  • Filters for Organisation, Job Role, Job Grade, and Watchlist (Favorites Only) have been integrated with Supabase to dynamically update the employee list and charts.
• ✅ Updated Radar Chart:
  • The radar chart now reflects both individual employee criteria and job role benchmarks with updated animations, legends, and tooltips.

🎨 9-Box Grid Color Coding

The 9-box grid categorizes employees into high, medium, and low potential and performance segments with the following color scheme:

Top Row (High Potential):     Yellow | Green | GreenMiddle Row (Medium Potential): Red | Yellow | GreenBottom Row (Low Potential):   Red | Red | Yellow

⚙️ Setup

1. Clone the repository:

   bash

   git clone https://github.com/yourusername/employee-dashboard-flask.gitcd employee-dashboard-flask

2. Create a virtual environment:

   bash

   python -m venv venvsource venv/bin/activate   # On Windows use: venv\Scripts\activate

3. Install dependencies:

   bash

   pip install -r requirements.txt

4. Configure Supabase:

   • Create a .env file at the project root with your Supabase credentials:
     properties

     // filepath: d:\Repos\employee-dashboard-flask\.envSUPABASE_URL=https://your-supabase-urlSUPABASE_KEY=your-supabase-key

   • Make sure to add the .env file to .gitignore so that sensitive data is not committed.
   • Your Flask app will load these values automatically.

5. Run the application:

   bash

   python app.py

6. Access the app:

   http://127.0.0.1:5000/

🏗️ Supabase Schema

🔹 employees Table

🔹 auth.users

Handles user login and authentication via Supabase Auth.

🖼️ Employee Pictures

• Stored in Supabase Storage under a bucket (e.g., employee-pictures).
• Images are linked to employees via their EmpIdHash (e.g., abc123.jpg).
• Displayed automatically on the dashboard if available.

💡 Future Enhancements

• Employee profile picture uploads
• Notifications after saving/finalizing
• CSV export of employee data
• Dark mode support
• Multi-language support