Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Project Detail View Page (Full Lifecycle — View + Submit + Judge + Moderate)

Open
  • Is something wrong?
#20 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
5/5
Estimated time
Over a week
Newbie friendliness
25/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Quiet
Tech stack
typescript
Domain
api, authorization, full-stack

Research direction

Start with the proposed /projects/[id]/page.tsx entry point and the listed components: Header.tsx, Overview.tsx, Team.tsx, Submission.tsx, ScorePanel.tsx, ModerationPanel.tsx, and Timeline.tsx. Trace the existing project APIs and permission handling before planning the lifecycle, scoring, moderation, loading, error, and timeline behavior; done means the stated role-based workflows and test cases are implemented.

Written by the indexing model from the issue text.

Description

enhancement good first issue level3 NSoC'26

🧠 What are we building?

A complete Project Detail Page that is not just for viewing, but for:

  • 📦 Submission (Participant)
  • ⭐ Scoring (Judge)
  • 🛡️ Moderation (Organizer/Admin)
  • 📊 Evaluation tracking

👉 This is the core execution layer of hackathons/events

🎯 Goal

Build a fully functional, role-aware Project Page that:

  • shows complete project data
  • supports submission flow
  • supports judging & scoring
  • supports moderation
  • handles real-world workflows

🧠 Core Concept

Project Page = View + Actions + Evaluation + Moderation

🏗️ Route

/projects/:projectId

📦 Page Layout

Header (Title + Status + Actions)
---------------------------------
Project Overview
---------------------------------
Team Info
---------------------------------
Submission Details
---------------------------------
Attachments / Links
---------------------------------
Scoring & Feedback (Judge)
---------------------------------
Moderation Panel (Organizer/Admin)
---------------------------------
Activity / Timeline

🔹 1. Header

Show:

  • Project Title

  • Status Badge:

    • Draft
    • Submitted
    • Under Review
    • Approved
    • Rejected

  • Event Name + Type

  • Action Buttons (role-based)

🔹 2. Project Overview

  • Description
  • Tech Stack (skills)
  • GitHub Repo
  • Live Demo URL

🔹 3. Team Section

  • Team Name / Solo
  • Members list

🔹 4. Submission Details

  • Submission Status
  • Submitted At
  • Last Updated
  • Version (draft vs final)

🔹 5. Attachments

  • Screenshots
  • Docs
  • Links

⭐ 6. Scoring System (CRITICAL)

Only for Judges

Scoring UI

Fields:

Innovation (0–10)
Technical Complexity (0–10)
Design / UX (0–10)
Impact (0–10)

Total Score

Auto calculated

Feedback

  • text area for judge comments

Submit Score

  • button → submit score

API

POST /api/v1/projects/:id/score

Data Model (Example)

Score {
  projectId
  judgeId

  innovation
  technical
  design
  impact

  totalScore

  feedback

  submittedAt
}

Rules

  • judge can score only assigned projects
  • score editable until deadline
  • multiple judges → average score

🧑‍💻 7. Participant Actions

  • Edit Project (only draft)
  • Delete Project (only draft)
  • Submit Project

Submit Flow

Click Submit
 ↓
Validation check
 ↓
Status → submitted
 ↓
Lock editing

API

POST /api/v1/projects/:id/submit

🏢 8. Organizer Moderation Panel

Actions

  • View all submissions
  • Approve / Reject project
  • Delete inappropriate project

API

POST /api/v1/projects/:id/approve
POST /api/v1/projects/:id/reject
DELETE /api/v1/projects/:id

🛡️ 9. Admin Controls

  • Delete project
  • Suspend project
  • Ban user

📊 10. Score Aggregation

Show:

  • average score
  • number of judges
  • ranking (optional)
avgScore = totalScore / numberOfJudges

📜 11. Activity Timeline

Show events:

  • project created
  • edited
  • submitted
  • scored
  • approved/rejected

⚙️ API (FULL)

Get Project

GET /api/v1/projects/:id

Submit Project

POST /api/v1/projects/:id/submit

Score Project

POST /api/v1/projects/:id/score

Moderate

POST /api/v1/projects/:id/approve
POST /api/v1/projects/:id/reject
DELETE /api/v1/projects/:id

🔐 Permissions (VERY IMPORTANT)

Participant → own project only
Organizer → community projects
Judge → assigned projects
Admin → full access

🧩 States

Loading

  • skeleton

Error

  • retry

Not Found

  • project not found

Unauthorized

  • access denied

🛡️ Edge Cases

  • scoring after deadline
  • duplicate scoring
  • editing after submission
  • unauthorized judge access
  • project deleted mid-view

🎨 UI Requirements

  • clean sections
  • clear scoring inputs
  • responsive layout
  • action buttons visible by role
  • status badges

🧪 Test Cases

  • participant submit works
  • judge scoring works
  • multiple judges handled
  • organizer moderation works
  • admin actions work
  • permissions enforced
  • timeline updates

📂 File Structure

/projects/[id]
  ├── page.tsx
  ├── components/
  │    ├── Header.tsx
  │    ├── Overview.tsx
  │    ├── Team.tsx
  │    ├── Submission.tsx
  │    ├── ScorePanel.tsx
  │    ├── ModerationPanel.tsx
  │    └── Timeline.tsx

🚀 Future Enhancements

  • live scoring updates
  • judge discussion panel
  • AI scoring assistance
  • leaderboard

✅ Done When

  • full project lifecycle handled
  • scoring system works
  • moderation works
  • permissions enforced
  • UI responsive

🎯 Priority

🔥 CRITICAL — Core evaluation system

🏁 Final Note

This page is the heart of your platform.

This is where projects are built, judged, and validated.

👉 Build it like a real hackathon system, not just a detail page.

Dominant language
TypeScript
Stars
7
Forks
17
No merged PRs in 30d

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from NexGenStudioDev/CommDesk

All issues in NexGenStudioDev/CommDesk

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.