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

🚀 Member Event-Based Task System (Permission-Controlled)

Aperta
#24 5 commenti 0 reazioni 1 assegnatario Vedi su GitHub

@vivek0028 ci sta già lavorando.

Dal 6/5/2026.

  • #47 di @vivek0028 — chiusa senza merge

Valutazione

Questa issue non è ancora stata valutata.

Descrizione

level3 NSoC'26

This project is a production-grade Member Task System where members operate with organizer-level capabilities, controlled via a permission-based system.

✨ Features
  • Event-based task management
  • Permission-driven UI & actions
  • Full task lifecycle:
Create → Assign → Submit → Review → Update
  • Shared UI across roles (Organizer & Member)

🧠 Core Philosophy

Same UI for everyone → Different capabilities via permissions

  • ❌ No restricted/limited UI for members
  • ✅ One powerful system controlled via permissions

🧠 Architecture

Sidebar → Event → Tasks → Submissions → Review → Progress

🔐 Permission System

Default Permissions (All Members)
  • View assigned tasks
  • View task details
  • Submit work
  • Comment

Advanced Permissions (Organizer-Controlled)
Permission Description
CREATE_TASK Create new tasks
ASSIGN_TASK Assign tasks to others
UPDATE_STATUS Update task status
EDIT_TASK Edit tasks
DELETE_TASK Delete tasks
MULTIPLE_SUBMISSION Allow multiple submissions
LATE_SUBMISSION Allow late submissions
VIEW_ALL_TASKS View all event tasks

🧭 Feature Flow

  1. Select Event
  2. View tasks (assigned OR all based on permission)
  3. Create task (if allowed)
  4. Assign task (if allowed)
  5. Submit work
  6. Review tasks (if allowed)
  7. Edit / delete tasks (if allowed)

🧱 Layout Structure


<MainLayout>
  <SideBar />
  <Content />
</MainLayout>

📂 Sidebar

Default Routes

SideBar.tsx

/member/dashboard
/member/tasks
Permission-Based Rendering
if (permissions.includes("CREATE_TASK")) {
  show("Create Task");
}

if (permissions.includes("VIEW_ALL_TASKS")) {
  show("All Tasks");
}

Requirements
  • Active route highlighting

  • Responsive (mobile drawer)

  • Collapsible

  • Permission-aware UI


📄 Pages & Features

📋 Task List Page

Route: /member/tasks

Behavior
if (permissions.includes("VIEW_ALL_TASKS")) {
fetchAllTasks();
} else {
fetchAssignedTasks();
}
Filters
  • Status (Todo / In Progress / Completed)

  • Time (Upcoming / Past)

  • Priority

  • Member (if allowed)

  • Search (debounced)

Actions

Action Permission
View Default
Edit EDIT_TASK
Delete DELETE_TASK

🔍 Task Detail Page

Route: /member/tasks/:taskId

Submission Rules
if (!permissions.includes("MULTIPLE_SUBMISSION")) {
  restrictSingleSubmission();
}

if (deadlinePassed && !permissions.includes("LATE_SUBMISSION")) {
disableSubmission();
}

Sections
  • Task Info

  • Submission Panel

  • Submission History

  • Status Update (if allowed)

  • Comments

  • Review Panel (if allowed)


➕ Create Task

Route: /member/tasks/create

if (!permissions.includes("CREATE_TASK")) {
redirect("/member/tasks");
}

✏️ Edit Task
if (!permissions.includes("EDIT_TASK")) {
blockAccess();
}

🗑️ Delete Task
if (!permissions.includes("DELETE_TASK")) {
blockAction();
}

🧱 Component Structure

components/
layout/
SideBar.tsx
MainLayout.tsx

event/
EventDropdown.jsx

task/
TaskTable.jsx
TaskDetail.jsx
TaskForm.jsx
SubmissionForm.jsx
CommentSection.jsx

common/
StatusBadge.jsx
PriorityBadge.jsx
ConfirmModal.jsx
SkeletonLoader.jsx


🔄 State Management

Library: React Query (TanStack Query)

State
  • selectedEventId

  • tasks

  • taskDetails

  • submissions

  • permissions


🌐 API

GET /api/tasks?eventId=&assignedTo=me
POST /api/tasks
PATCH /api/tasks/:id
DELETE /api/tasks/:id

POST /api/tasks/:id/submissions
POST /api/tasks/:id/comments


🎨 UI/UX Guidelines

  • Same UI as organizer

  • Only actions differ

  • Hide restricted features

  • Highlight urgent tasks


⚠️ Edge Cases

  • No event selected

  • No tasks available

  • Deadline passed

  • Permission changes dynamically

  • Direct URL access without permission


⚡ Performance

  • Cache tasks per event

  • Debounced search

  • Lazy loading


🔐 Security

  • Validate permissions on frontend

  • Backend must enforce RBAC


🧪 Testing Checklist

Permissions
  • Actions visible only if allowed

  • Create/Edit/Delete protected

Functional
  • Task CRUD works

  • Submission flow works

  • Filters work

UI
  • Responsive design

  • Loading states

  • Error handling


🚀 Implementation Plan

  • Phase 1: Layout + Sidebar

  • Phase 2: Task List + Filters

  • Phase 3: Task Detail + Submission

  • Phase 4: Permission System

  • Phase 5: Create/Edit/Delete

  • Phase 6: Final Polish


✅ Acceptance Criteria

  • Shared UI across roles

  • Permissions fully enforced

  • No unauthorized access

  • Clean, responsive UX


🏁 Final Note

This is a role-flexible system design:

  • Organizer → Full control

  • Member → Controlled power

Both operate on the same UI, enabling scalability and consistency.


If this still breaks when you paste somewhere, tell me where (VS Code, GitHub, Notion, etc.)—the fix depends on the tool.

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.