Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

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

Aperta
#20 4 commenti 0 reazioni 0 assegnatari Vedi su GitHub

@Pranavkale11 ci sta già lavorando.

Dal 16/4/2026.

  • #79 di @vivek0028 — chiusa senza merge

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
25/100
Tipo di issue
Funzionalità
Chiarezza
Abbastanza chiara
Stato di attività
Tranquilla
Stack tecnologico
typescript

Direzione di ricerca

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.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

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.

Lingua principale
TypeScript
Stelle
7
Fork
17
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di NexGenStudioDev/CommDesk

Tutte le issue di NexGenStudioDev/CommDesk

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.