Skip to content

Conversation

@Spkap
Copy link

@Spkap Spkap commented Sep 6, 2025

Google Calendar Integration for SIG Events

Overview

Fixes: #60

Adds Google Calendar integration to display Special Interest Group (SIG) events directly on related blog pages. Calendars render conditionally if the linked SIG has a valid google_calendar_id.


Backend

  • Schema: Added google_calendar_id field to SIG content type (schema.json).
  • API:
    • GET /api/sigs – List SIGs with calendar IDs
    • GET /api/sigs/:id – Fetch SIG with calendar data
    • GET /api/sigs?filters[blogs][id][$eq]=:blogId – Fetch SIG by blog

Frontend

  • GoogleCalendar Component (GoogleCalendar.jsx)
    • Takes calendarId as input
    • Builds and sanitizes embed URL (Asia/Kolkata timezone)
    • Responsive iframe with lazy loading
    • Returns null if ID is missing/invalid

Data Fetching

  • Helpers (getSIGs.js)
    • getSIGByBlogId(blogId) → Fetch SIG linked to a blog
    • getAllSIGs() → Fetch all SIGs (sorted)
    • getSIG(sigId) → Fetch individual SIG with calendar data
    • Error handling + Next.js revalidation for caching

Blog Page Integration (page.js)

  1. Load blog data using getBlog(slug) → Extract blog ID
  2. Fetch associated SIG via getSIGByBlogId(blog.id)
  3. If SIG has google_calendar_id, render GoogleCalendar below blog content
  4. Layout preserved with graceful fallback when no calendar exists

Data Flow

Blog Slug →    getBlog(slug) →    Blog Object (ID)
     ↓
Blog ID →    getSIGByBlogId(blog.id) →    SIG Object
     ↓
SIG.google_calendar_id →    Calendar Component →    Embedded Google Calendar

Usage

  • Admins add google_calendar_id in Strapi SIG entry.
  • Link SIG to blog posts.
  • Calendar auto-renders on those blogs.

Files Modified

File Change
schema.json Add google_calendar_id field
contentTypes.d.ts Update type definitions
GoogleCalendar.jsx New component
getSIGs.js New helper functions
page.js Blog page integration

Introduces a Google Calendar embed component and helper functions to fetch SIG data, including a new 'google_calendar_id' field in the backend schema. Blog pages now display the relevant SIG's events calendar if available.
@netlify
Copy link

netlify bot commented Sep 6, 2025

Deploy Preview for webclubnitk failed.

Name Link
🔨 Latest commit e5460f4
🔍 Latest deploy log https://app.netlify.com/projects/webclubnitk/deploys/68bc6e415c63330008f205e2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Google Calendar for each SIG

2 participants