Day 22: Building a Workspace-Centric Calendar System
Nader Fkih Hassen

Nader Fkih Hassen @nader_fh

About: Newly graduated computer science student exploring full-stack development. Interested in clean design, practical solutions, and growing one step at a time.

Joined:
Jun 12, 2025

Day 22: Building a Workspace-Centric Calendar System

Publish Date: Jul 8
0 0

🗓️ Why Calendars Matter in a Lawyer Management System
Lura, the app we’re building during my internship, is built around workspaces where legal professionals manage cases, documents, and more. One thing they all needed? A centralized, collaborative calendar.

But it’s not just about putting dates on a page — it’s about communication, accountability, and structure.

💡 Feature Goals for the Calendar:

  • Create and edit case-related events (meetings, court dates, deadlines)
  • Events should be linked to a workspace, not globally shared
  • Only workspace members can view and manage their calendar
  • Support recurring events (future enhancement)
  • Simple, intuitive UI

🔧 Technical Breakdown
📦 Backend (NestJS + Prisma)
Created an Event model:

ts
model Event {
  id          String   @id @default(uuid())
  title       String
  description String?
  date        DateTime
  workspaceId String
  createdBy   String
  createdAt   DateTime @default(now())
}
Enter fullscreen mode Exit fullscreen mode
  • Added routes for:

    • POST /events: Create a new event
    • GET /workspaces/:id/events: List events per workspace
    • PUT /events/🆔 Edit event
    • DELETE /events/🆔 Delete event
  • Used class-validator to handle input DTOs with proper date formatting.

💻 Frontend (Next.js + FullCalendar)

  • Integrated FullCalendar to render a beautiful, interactive calendar.
  • Used React hooks and context to handle user roles and event permissions.
  • Built a modal form to add/edit events and hook into API routes.
tsx
const handleSubmit = async () => {
  const res = await fetch('/api/events', {
    method: 'POST',
    body: JSON.stringify({ title, date }),
    headers: { 'Content-Type': 'application/json' },
  });
  const data = await res.json();
  mutate(); // refresh event list
};
Enter fullscreen mode Exit fullscreen mode

🔐 Role-Based Access

  • Only workspace members can view/edit calendar events.
  • Admins and Super Admins can delete any event.
  • Used middleware on the backend to validate token and role on each action.

✅ Key Takeaways

  • 📆 Calendars look simple but hide lots of edge cases (time zones, ownership, validation).
  • 👨‍💻 FullCalendar is a powerful library, but integrating with custom APIs takes care.
  • 🔐 Role-based logic really adds value to team collaboration features.
  • 🧠 Legal apps need precision and traceability — even in UI elements like calendars.

❓Question for You
How do you usually handle shared calendar systems in your apps? Do you prefer an in-app solution or integrations like Google Calendar?

Thanks for following along this journey — we’re nearing the finish line! 💪
Stay tuned for Day 23.

Comments 0 total

    Add comment