Feat/project detail page

[Pranavkale11]

No description provided.

[Pranavkale11]

Hi @abhishek-nexgen-dev 👋

Refactored the Project module to align with the existing React feature-based architecture used across the repository.

✅ Changes made

• Moved the entire feature into src/features/Projects
• Updated folder/file structure to match the Events module pattern
• Refactored imports and routing
• Added dedicated service, utils, types, and mock layers
• Preserved all lifecycle, scoring, moderation, and permission logic

The feature is now structured as a production-ready React module.

Please let me know if any further refinements are needed 🚀

[gemini-code-assist]

Code Review

This pull request implements a comprehensive project management feature, including a detailed project page with components for overview, team, timeline, and submission tracking, alongside specialized panels for judging and moderation. It also includes a mock API service and a robust permission utility to handle various user roles. The review feedback suggests improving UI consistency by using library components instead of raw HTML, enhancing security for external links with 'noopener', preventing potential 'NaN' issues in numeric inputs, and optimizing React component lifecycle management by avoiding unnecessary remounts via the 'key' prop.

[abhishek-nexgen-dev]

[Pranavkale11]

Hi @abhishek-nexgen-dev 👋

Got it bro, checking the routing/data mapping issue.
Looks like the page is falling into the "Project not found" state unexpectedly.

I’ll debug and push the fix shortly 🚀

[abhishek-nexgen-dev]

@Pranavkale11 Okay

[abhishek-nexgen-dev]

For debugging run pnpm run tauri dev

[Pranavkale11]

Hi @abhishek-nexgen-dev 👋

I’ve fixed the “Project not found” issue and refactored the route/data resolution flow properly.

Main fixes:

• Hardened route param resolution after the feature refactor
• Added fallback route matching and defensive project lookup
• Fixed stale async state overwrite issues
• Improved role/query param handling
• Separated unauthorized state from actual not-found state
• Added safer permission handling and diagnostics

Verified routes:

• /projects/project-nebula?role=participant
• /projects/project-orbit?role=judge
• /projects/project-orbit?role=organizer
• /projects/project-orbit?role=admin

Also verified invalid and unauthorized flows separately.

The remaining TypeScript warnings are unrelated existing auth-page import issues and not caused by the Projects feature.

[Pranavkale11]

Hi @abhishek-nexgen-dev 👋

I verified the issue by running the app locally using pnpm run tauri dev and pnpm dev.

The Project not found issue is now resolved successfully.

Verified flows:

• Valid project routes load correctly
• Unauthorized access is handled separately from not-found state
• Judge / Organizer / Admin role flows are working
• Scoring and moderation panels are functional
• Project detail lifecycle flow is working as expected

Also verified the refactored production-ready structure inside src/features/Projects.

Please review once when you get time 🙌

[abhishek-nexgen-dev]

@Pranavkale11 The ui didn't looks good make sure the ui looks best and attractive

Render Component permission wise create a permission array which contain object like this

{
    name: "Create Event",
    action: "create",
    resource: Event_Permissions.CREATE_EVENT,
    description: "Permission to create events",
    userId: null,
  },

permision constant

• Permission constant looks like this

export const Event_Permissions = {
  CREATE_EVENT: "event:create",
  UPDATE_EVENT: "event:update",
  DELETE_EVENT: "event:delete",
  VIEW_EVENT: "event:view",
  PUBLISH_EVENT: "event:publish",
  JOIN_EVENT: "event:join",
  LEAVE_EVENT: "event:leave",
};

• Check the user permision is user have permission to edit then show edit button

• If the user have permission to delete then show delete button

Make front-end like this

Backend Schema

import mongoose from "mongoose";

export type PermissionSchemaType = {
  name: string;
  action: "create" | "read" | "update" | "delete"; // create, read, update, delete
  resource: string; // create event , read event, update event, delete event
  description?: string;
  userId: string | null; // Reference to the user who created the permission
};

const permissionSchema = new mongoose.Schema<PermissionSchemaType>(
  {
    name: {
      type: String,
      required: true,
      unique: true,
    },
    action: {
      type: String, // create, read, update, delete
      required: true,
    },
    resource: {
      type: String, // create event , read event, update event, delete event
      required: true,
    },
    description: String,

    userId: {
      type: mongoose.Schema.Types.ObjectId,
      ref: "Auth",
      required: true,
    },
  },
  { timestamps: true },
);

export const Permission = mongoose.model("Permission", permissionSchema);

[Pranavkale11]

Hi @abhishek-nexgen-dev 👋

Implemented the requested UI and permission-system improvements.

✅ Changes completed

• Redesigned the Project Detail Page with a more modern and premium dashboard-style UI

• Improved spacing, typography, hierarchy, cards, timeline, and action panels

• Added centralized permission constants and reusable permission objects

• Replaced hardcoded role-based rendering with a scalable hasPermission system

• Permission-based rendering now controls:

  • Edit/Delete actions
  • Score panel visibility
  • Moderation controls

• Verified responsive behavior and role-based UI flows

Also re-verified the project lifecycle flow after the refactor.

Please review the latest updates 🙌

[abhishek-nexgen-dev]

@Pranavkale11 bro are you human or ai

[Pranavkale11]

Haha 😄
Human bro, just using AI tools properly for research, debugging, testing, and speeding up development workflow.

Still reviewing, understanding, and integrating everything manually before pushing 🙌

[abhishek-nexgen-dev]

@Pranavkale11 okay but most of the ai loot are expensive all the ai have limited free Context window

[Pranavkale11]

True 😅
I’m currently just a 2nd year CSE student, so I’m trying to learn as much as possible and automate parts of my workflow to improve productivity and understand real-world development better.

I mainly use AI tools for debugging, testing, architecture ideas, and speeding up repetitive tasks — but I still review, understand, and integrate everything manually while learning from the process 🙌

[abhishek-nexgen-dev]

Please fix these issue

[Pranavkale11]

Hi @abhishek-nexgen-dev 👋

I’ve fixed the routing issue and refactored the Project Detail route to properly work inside the protected /org layout.

Changes made

• Moved the Project Detail route inside the /org protected routes
• Updated route structure to:
  /org/projects/:id
• Preserved sidebar/dashboard layout
• Fixed route param handling
• Preserved permission-based rendering system
• Preserved lifecycle, scoring, moderation, and state handling

Verified

✅ /org/projects/project-nebula
✅ /org/projects/project-orbit
✅ invalid project handling
✅ unauthorized access flow
✅ dashboard/sidebar visibility
✅ responsive UI
✅ TypeScript verification (pnpm exec tsc --noEmit)

The Project Detail Page is now fully integrated with the org dashboard architecture.

Please review the latest updates 🙌