implement sports category page and badminton court slots topic pages

dominicarrojado · dominicarrojado · commit ecf4cff1fa03 · 2026-05-18T21:47:42.000+08:00
diff --git a/app/categories/dining/page.tsx b/app/categories/dining/page.tsx
@@ -10,7 +10,7 @@ import { DINING_NOTIFICATION_SETTINGS } from "@/lib/content";
 
 const title = "Dining in Singapore";
 const description =
-  "Subscribe to get notified to topics related to dining in Singapore such as table reservation slots.";
+  "Subscribe to get notified on topics related to dining in Singapore such as table reservation slots.";
 const url = Routes.DiningCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/driving/bukit-batok-driving-centre/page.tsx b/app/categories/driving/bukit-batok-driving-centre/page.tsx
@@ -10,7 +10,7 @@ import { BBDC_TELEGRAM_CHANNELS } from "@/lib/content";
 
 const title = "Bukit Batok Driving Centre";
 const description =
-  "Subscribe to get notified to topics related to Bukit Batok Driving Centre such as appointment slots and announcements.";
+  "Subscribe to get notified on topics related to Bukit Batok Driving Centre such as appointment slots and announcements.";
 const url = Routes.BukitBatokDrivingCentre;
 
 export const metadata: Metadata = {
diff --git a/app/categories/driving/comfortdelgro-driving-centre/page.tsx b/app/categories/driving/comfortdelgro-driving-centre/page.tsx
@@ -10,7 +10,7 @@ import { CDC_TELEGRAM_CHANNELS } from "@/lib/content";
 
 const title = "ComfortDelGro Driving Centre";
 const description =
-  "Subscribe to get notified to topics related to ComfortDelGro Driving Centre such as practical lessons, appointment slots and more.";
+  "Subscribe to get notified on topics related to ComfortDelGro Driving Centre such as practical lessons, appointment slots and more.";
 const url = Routes.ComfortDelGroDrivingCentre;
 
 export const metadata: Metadata = {
diff --git a/app/categories/driving/page.tsx b/app/categories/driving/page.tsx
@@ -23,7 +23,7 @@ import {
 
 const title = "Driving in Singapore";
 const description =
-  "Subscribe to get notified to topics related to driving in Singapore such as appointment slots, practical lessons and more.";
+  "Subscribe to get notified on topics related to driving in Singapore such as appointment slots, practical lessons and more.";
 const url = Routes.DrivingCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/driving/singapore-safety-driving-centre/page.tsx b/app/categories/driving/singapore-safety-driving-centre/page.tsx
@@ -15,7 +15,7 @@ import {
 
 const title = "Singapore Safety Driving Centre";
 const description =
-  "Subscribe to get notified to topics related to Singapore Safety Driving Centre such as practical tests and announcements.";
+  "Subscribe to get notified on topics related to Singapore Safety Driving Centre such as practical tests and announcements.";
 const url = Routes.SingaporeSafetyDrivingCentre;
 
 export const metadata: Metadata = {
diff --git a/app/categories/entertainment/page.tsx b/app/categories/entertainment/page.tsx
@@ -10,7 +10,7 @@ import { ENTERTAINMENT_NOTIFICATION_SETTINGS } from "@/lib/content";
 
 const title = "Entertainment in Singapore";
 const description =
-  "Subscribe to get notified to topics related to entertainment in Singapore such as new movie releases.";
+  "Subscribe to get notified on topics related to entertainment in Singapore such as new movie releases.";
 const url = Routes.EntertainmentCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/events/page.tsx b/app/categories/events/page.tsx
@@ -10,7 +10,7 @@ import { EVENTS_NOTIFICATION_SETTINGS } from "@/lib/content";
 
 const title = "Events in Singapore";
 const description =
-  "Subscribe to get notified to topics related to events in Singapore such as community blood donation drives.";
+  "Subscribe to get notified on topics related to events in Singapore such as community blood donation drives.";
 const url = Routes.EventsCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/japan-visa/page.tsx b/app/categories/japan-visa/page.tsx
@@ -15,7 +15,7 @@ import {
 
 const title = "Apply for Japan Visa in Singapore";
 const description =
-  "Subscribe to get notified to topics related to visa applications at the Embassy of Japan in Singapore.";
+  "Subscribe to get notified on topics related to visa applications at the Embassy of Japan in Singapore.";
 const url = Routes.JapanVisaCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/money/page.tsx b/app/categories/money/page.tsx
@@ -10,7 +10,7 @@ import { MONEY_TELEGRAM_CHANNELS } from "@/lib/content";
 
 const title = "Money in Singapore";
 const description =
-  "Subscribe to get notified to topics related to money in Singapore such as fixed deposit rates and TOTO snowballs.";
+  "Subscribe to get notified on topics related to money in Singapore such as fixed deposit rates and TOTO snowballs.";
 const url = Routes.MoneyCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/sports/page.tsx b/app/categories/sports/page.tsx
@@ -0,0 +1,50 @@
+import { Metadata } from "next";
+import React from "react";
+import { Container } from "@/components/ui/container";
+import Heading from "@/components/ui/heading";
+import Subheading from "@/components/ui/subheading";
+import TelegramChannels from "@/components/telegram-channels";
+import { Routes } from "@/lib/enums";
+import { META_OPEN_GRAPH, META_TWITTER } from "@/app/shared-metadata";
+import { SPORTS_TELEGRAM_CHANNELS } from "@/lib/content";
+
+const title = "Sports in Singapore";
+const description =
+  "Subscribe to get notified on topics related to sports in Singapore such as badminton court bookings.";
+const url = Routes.SportsCategory;
+
+export const metadata: Metadata = {
+  title,
+  description,
+  alternates: {
+    canonical: url,
+  },
+  openGraph: {
+    ...META_OPEN_GRAPH,
+    title,
+    description,
+    url,
+  },
+  twitter: {
+    ...META_TWITTER,
+    title,
+    description,
+  },
+};
+
+export default function Sports() {
+  return (
+    <>
+      <Container>
+        <div className="mb-6 space-y-2">
+          <Heading>{title}</Heading>
+          <Subheading>{description}</Subheading>
+        </div>
+        <TelegramChannels
+          channels={SPORTS_TELEGRAM_CHANNELS}
+          backButtonRoute={Routes.Home}
+        />
+      </Container>
+    </>
+  );
+}
diff --git a/app/categories/theme-parks/page.tsx b/app/categories/theme-parks/page.tsx
@@ -10,7 +10,7 @@ import { THEME_PARK_TELEGRAM_CHANNELS } from "@/lib/content";
 
 const title = "Theme Parks Attraction Updates";
 const description =
-  "Subscribe to get notified to topics related to popular theme parks visited by Singapore residents such as Tokyo Disneyland and Tokyo DisneySea.";
+  "Subscribe to get notified on topics related to popular theme parks visited by Singapore residents such as Tokyo Disneyland and Tokyo DisneySea.";
 const url = Routes.ThemeParksCategory;
 
 export const metadata: Metadata = {
diff --git a/app/categories/travel/page.tsx b/app/categories/travel/page.tsx
@@ -10,7 +10,7 @@ import { TRAVEL_TELEGRAM_CHANNELS } from "@/lib/content";
 
 const title = "Travel in Singapore";
 const description =
-  "Subscribe to get notified to topics related to travel in Singapore such as train tickets, flight prices, travel deals and more.";
+  "Subscribe to get notified on topics related to travel in Singapore such as train tickets, flight prices, travel deals and more.";
 const url = Routes.TravelCategory;
 
 export const metadata: Metadata = {
diff --git a/app/topics/badminton-court-slots-heartbeat-bedok/page.tsx b/app/topics/badminton-court-slots-heartbeat-bedok/page.tsx
@@ -0,0 +1,110 @@
+import { Metadata } from "next";
+import React from "react";
+import { Container } from "@/components/ui/container";
+import { Anchor } from "@/components/ui/anchor";
+import Heading from "@/components/ui/heading";
+import Subheading from "@/components/ui/subheading";
+import Paragraph from "@/components/ui/paragraph";
+import TelegramLinkButton from "@/components/telegram-link-button";
+import AdUnit from "@/components/ad-unit";
+import {
+  FacilityService,
+  Routes,
+  TelegramChannel,
+  TopicTitle,
+} from "@/lib/enums";
+import { META_OPEN_GRAPH, META_TWITTER } from "@/app/shared-metadata";
+import { FacilitySlotsTable } from "@/components/facility-slots-table";
+
+const title = "Badminton Court Slots (Heartbeat @ Bedok)";
+const description =
+  "Get notified when peak hour badminton court slots at Heartbeat @ Bedok ActiveSG Sport Hall become available for instant booking.";
+const url = Routes.BadmintonCourtSlotsHeartbeatBedok;
+
+export const metadata: Metadata = {
+  title,
+  description,
+  alternates: {
+    canonical: url,
+  },
+  openGraph: {
+    ...META_OPEN_GRAPH,
+    title,
+    description,
+    url,
+  },
+  twitter: {
+    ...META_TWITTER,
+    title,
+    description,
+  },
+};
+
+export default function BadmintonCourtSlotsHeartbeatBedok() {
+  return (
+    <Container>
+      <div className="space-y-2">
+        <Heading>{title}</Heading>
+        <Subheading>{description}</Subheading>
+      </div>
+      <FacilitySlotsTable
+        service={FacilityService.ACTIVE_SG_BADMINTON_COURT_HEARTBEAT}
+      />
+      <Paragraph>
+        <span className="font-medium">
+          Heartbeat @ Bedok ActiveSG Sport Hall
+        </span>{" "}
+        is a popular badminton venue managed by ActiveSG in the east of
+        Singapore. Peak hour slots are in high demand and are allocated through
+        a ballot system. Peak hours are{" "}
+        <strong className="font-medium">
+          Mondays to Fridays, 6 pm to 10 pm
+        </strong>{" "}
+        and{" "}
+        <strong className="font-medium">
+          Saturdays, Sundays and Public Holidays, 7 am to 10 pm
+        </strong>
+        .
+      </Paragraph>
+      <Paragraph>
+        Balloting for peak hour slots opens{" "}
+        <strong className="font-medium">14 days in advance</strong> from 12
+        midnight and closes at 11:59 pm on the same day. Results are sent the
+        next day, with slots randomly assigned to give everyone an equal chance.
+        However, not all balloted slots are taken — any unassigned ballot slots
+        are released for{" "}
+        <strong className="font-medium">instant booking</strong> on a
+        first-come, first-served basis{" "}
+        <strong className="font-medium">12 days in advance</strong> from 12 noon
+        via the{" "}
+        <Anchor
+          href="https://activesg.gov.sg/facility-bookings/activities/YLONatwvqJfikKOmB5N9U/venues/2vQVXKogKPojlagjzNxeX/timeslots?activityId=YLONatwvqJfikKOmB5N9U&venueId=2vQVXKogKPojlagjzNxeX"
+          isExternal
+        >
+          ActiveSG website
+        </Anchor>
+        .
+      </Paragraph>
+      <AdUnit />
+      <Paragraph>
+        <span className="font-medium">SG Alerts</span> monitors the ActiveSG
+        facility booking system and sends a Telegram notification as soon as an
+        unassigned peak hour slot at Heartbeat @ Bedok ActiveSG Sport Hall
+        becomes available for instant booking. This saves you time and effort
+        from having to manually check the ActiveSG website to find out if any
+        peak hour slots have become available for instant booking.
+      </Paragraph>
+      <Paragraph>
+        To get started, simply click the button below to join the Telegram
+        channel and start receiving notifications.
+      </Paragraph>
+      <div className="sticky bottom-6 z-50 mt-8 text-center">
+        <TelegramLinkButton
+          topicTitle={TopicTitle.BadmintonCourtSlotsHeartbeatBedok}
+          channel={TelegramChannel.BadmintonCourtSlotsHeartbeatBedok}
+          linkText="Subscribe Now"
+        />
+      </div>
+    </Container>
+  );
+}
diff --git a/app/topics/badminton-court-slots-our-tampines-hub/page.tsx b/app/topics/badminton-court-slots-our-tampines-hub/page.tsx
@@ -0,0 +1,110 @@
+import { Metadata } from "next";
+import React from "react";
+import { Container } from "@/components/ui/container";
+import { Anchor } from "@/components/ui/anchor";
+import Heading from "@/components/ui/heading";
+import Subheading from "@/components/ui/subheading";
+import Paragraph from "@/components/ui/paragraph";
+import TelegramLinkButton from "@/components/telegram-link-button";
+import AdUnit from "@/components/ad-unit";
+import {
+  FacilityService,
+  Routes,
+  TelegramChannel,
+  TopicTitle,
+} from "@/lib/enums";
+import { META_OPEN_GRAPH, META_TWITTER } from "@/app/shared-metadata";
+import { FacilitySlotsTable } from "@/components/facility-slots-table";
+
+const title = "Badminton Court Slots (Our Tampines Hub)";
+const description =
+  "Get notified when peak hour badminton court slots at Our Tampines Hub - Community Auditorium become available for instant booking.";
+const url = Routes.BadmintonCourtSlotsOurTampinesHub;
+
+export const metadata: Metadata = {
+  title,
+  description,
+  alternates: {
+    canonical: url,
+  },
+  openGraph: {
+    ...META_OPEN_GRAPH,
+    title,
+    description,
+    url,
+  },
+  twitter: {
+    ...META_TWITTER,
+    title,
+    description,
+  },
+};
+
+export default function BadmintonCourtSlotsOurTampinesHub() {
+  return (
+    <Container>
+      <div className="space-y-2">
+        <Heading>{title}</Heading>
+        <Subheading>{description}</Subheading>
+      </div>
+      <FacilitySlotsTable
+        service={FacilityService.ACTIVE_SG_BADMINTON_COURT_OTH}
+      />
+      <Paragraph>
+        <span className="font-medium">
+          Our Tampines Hub - Community Auditorium
+        </span>{" "}
+        is a popular badminton venue managed by ActiveSG in the east of
+        Singapore. Peak hour slots are in high demand and are allocated through
+        a ballot system. Peak hours are{" "}
+        <strong className="font-medium">
+          Mondays to Fridays, 6 pm to 10 pm
+        </strong>{" "}
+        and{" "}
+        <strong className="font-medium">
+          Saturdays, Sundays and Public Holidays, 7 am to 10 pm
+        </strong>
+        .
+      </Paragraph>
+      <Paragraph>
+        Balloting for peak hour slots opens{" "}
+        <strong className="font-medium">14 days in advance</strong> from 12
+        midnight and closes at 11:59 pm on the same day. Results are sent the
+        next day, with slots randomly assigned to give everyone an equal chance.
+        However, not all balloted slots are taken — any unassigned ballot slots
+        are released for{" "}
+        <strong className="font-medium">instant booking</strong> on a
+        first-come, first-served basis{" "}
+        <strong className="font-medium">12 days in advance</strong> from 12 noon
+        via the{" "}
+        <Anchor
+          href="https://activesg.gov.sg/facility-bookings/activities/YLONatwvqJfikKOmB5N9U/venues/nqBpgnMrPN8u5LLfvyN2T/timeslots?activityId=YLONatwvqJfikKOmB5N9U&venueId=nqBpgnMrPN8u5LLfvyN2T"
+          isExternal
+        >
+          ActiveSG website
+        </Anchor>
+        .
+      </Paragraph>
+      <AdUnit />
+      <Paragraph>
+        <span className="font-medium">SG Alerts</span> monitors the ActiveSG
+        facility booking system and sends a Telegram notification as soon as an
+        unassigned peak hour slot at Our Tampines Hub - Community Auditorium
+        becomes available for instant booking. This saves you time and effort
+        from having to manually check the ActiveSG website to find out if any
+        peak hour slots have become available for instant booking.
+      </Paragraph>
+      <Paragraph>
+        To get started, simply click the button below to join the Telegram
+        channel and start receiving notifications.
+      </Paragraph>
+      <div className="sticky bottom-6 z-50 mt-8 text-center">
+        <TelegramLinkButton
+          topicTitle={TopicTitle.BadmintonCourtSlotsOurTampinesHub}
+          channel={TelegramChannel.BadmintonCourtSlotsOurTampinesHub}
+          linkText="Subscribe Now"
+        />
+      </div>
+    </Container>
+  );
+}
diff --git a/app/topics/badminton-court-slots-pasir-ris/page.tsx b/app/topics/badminton-court-slots-pasir-ris/page.tsx
diff --git a/components/facility-slots-table.tsx b/components/facility-slots-table.tsx
diff --git a/lib/api-hooks.ts b/lib/api-hooks.ts
diff --git a/lib/content.tsx b/lib/content.tsx
diff --git a/lib/enums.ts b/lib/enums.ts
diff --git a/lib/types.ts b/lib/types.ts
