Openstatus www.openstatus.dev

fix: static pages (#1672)

authored by

Maximilian Kaske and committed by
GitHub
9f611918 a88da60c

+38 -27
+2
apps/web/src/app/(landing)/[slug]/page.tsx
··· 5 5 import { notFound } from "next/navigation"; 6 6 import type { WebPage, WithContext } from "schema-dts"; 7 7 8 + export const dynamicParams = false; 9 + 8 10 export async function generateMetadata({ 9 11 params, 10 12 }: {
+2
apps/web/src/app/(landing)/blog/[slug]/page.tsx
··· 8 8 import type { BlogPosting, WithContext } from "schema-dts"; 9 9 import { ContentPagination } from "../../content-pagination"; 10 10 11 + export const dynamicParams = false; 12 + 11 13 export async function generateStaticParams() { 12 14 const posts = getBlogPosts(); 13 15
+2 -2
apps/web/src/app/(landing)/blog/category/[slug]/page.tsx
··· 28 28 }, 29 29 }; 30 30 31 + export const dynamicParams = false; 32 + 31 33 export async function generateStaticParams() { 32 34 const posts = getBlogPosts(); 33 35 const categories = [...new Set(posts.map((post) => post.metadata.category))]; 34 - 35 - console.log(categories); 36 36 37 37 return categories.map((category) => ({ 38 38 slug: category.toLowerCase(),
+2
apps/web/src/app/(landing)/changelog/[slug]/page.tsx
··· 8 8 9 9 const baseUrl = "http://localhost:3000"; 10 10 11 + export const dynamicParams = false; 12 + 11 13 export async function generateStaticParams() { 12 14 const posts = getChangelogPosts(); 13 15
+4 -4
apps/web/src/app/(landing)/changelog/category/[slug]/page.tsx
··· 5 5 ogMetadata, 6 6 twitterMetadata, 7 7 } from "@/app/shared-metadata"; 8 - import { getBlogPosts, getChangelogPosts } from "@/content/utils"; 8 + import { getChangelogPosts } from "@/content/utils"; 9 9 import type { Metadata } from "next"; 10 10 11 11 const TITLE = "Changelog Category"; ··· 28 28 }, 29 29 }; 30 30 31 + export const dynamicParams = false; 32 + 31 33 export async function generateStaticParams() { 32 - const posts = getBlogPosts(); 34 + const posts = getChangelogPosts(); 33 35 const categories = [...new Set(posts.map((post) => post.metadata.category))]; 34 - 35 - console.log(categories); 36 36 37 37 return categories.map((category) => ({ 38 38 slug: category.toLowerCase(),
+2
apps/web/src/app/(landing)/compare/[slug]/page.tsx
··· 4 4 import type { Metadata } from "next"; 5 5 import { notFound } from "next/navigation"; 6 6 7 + export const dynamicParams = false; 8 + 7 9 export async function generateMetadata({ 8 10 params, 9 11 }: {
+23 -17
apps/web/src/content/footer-status.tsx
··· 1 + "use client"; 2 + 1 3 import { cn } from "@/lib/utils"; 2 - import { getStatus } from "@openstatus/react"; 4 + import type { StatusResponse } from "@openstatus/react"; 5 + import { useQuery } from "@tanstack/react-query"; 3 6 import Link from "next/link"; 4 7 5 - export async function FooterStatus() { 6 - const status = await getStatus("status"); 8 + export function FooterStatus() { 9 + const { data } = useQuery({ 10 + queryKey: ["footer-status"], 11 + queryFn: async () => { 12 + const res = await fetch( 13 + "https://api.openstatus.dev/public/status/status", 14 + ); 15 + if (!res.ok) return { status: "unknown" as const }; 16 + return (await res.json()) as StatusResponse; 17 + }, 18 + refetchInterval: 60000, // Refetch every 60 seconds 19 + staleTime: 60000, 20 + }); 21 + 22 + const status = data?.status ?? "unknown"; 23 + 7 24 return ( 8 25 <Link 9 26 href="https://status.openstatus.dev" 10 27 className={cn( 11 28 "flex w-full items-center gap-2 p-4 hover:bg-muted", 12 - STATUS[status.status].color, 29 + STATUS[status].color, 13 30 )} 14 31 > 15 - {STATUS[status.status].label} 32 + {STATUS[status].label} 16 33 </Link> 17 34 ); 18 35 } ··· 28 45 under_maintenance: { color: "text-info", label: "Under Maintenance" }, 29 46 unknown: { color: "text-gray-500", label: "Unknown" }, 30 47 incident: { color: "text-warning", label: "Incident" }, 31 - } satisfies Record< 32 - Awaited<ReturnType<typeof getStatus>>["status"], 33 - { color: string; label: string } 34 - >; 35 - 36 - export function FooterStatusFallback() { 37 - return ( 38 - <div className="flex w-full items-center gap-2 p-4 hover:bg-muted"> 39 - Loading... 40 - </div> 41 - ); 42 - } 48 + } satisfies Record<StatusResponse["status"], { color: string; label: string }>;
+1 -4
apps/web/src/content/footer.tsx
··· 1 1 import { Link } from "@/content/link"; 2 2 import { ThemeToggle } from "@/content/theme-toggle"; 3 3 import { footerLinks } from "@/data/content"; 4 - import { Suspense } from "react"; 5 4 import { FooterStatus } from "./footer-status"; 6 5 7 6 export function Footer() { ··· 36 35 </Link> 37 36 </div> 38 37 <div> 39 - <Suspense fallback="Loading..."> 40 - <FooterStatus /> 41 - </Suspense> 38 + <FooterStatus /> 42 39 </div> 43 40 <div className="sm:col-span-2 md:col-span-1"> 44 41 <ThemeToggle className="rounded-none" />