app/api/services/[id]/route.ts

@@ -1,9 +1,6 @@
 const BACKEND_URL = process.env.BACKEND_URL;
 
-export async function GET(
+export async function GET({ params }: { params: Promise<{ id: string }> }) {
-  _request: Request,
-  { params }: { params: Promise<{ id: string }> },
-) {
   const { id } = await params;
   const response = await fetch(`${BACKEND_URL}/services/${id}`);
 
@@ -18,10 +15,7 @@ export async function GET(
   return Response.json(data);
 }
 
-export async function DELETE(
+export async function DELETE({ params }: { params: Promise<{ id: string }> }) {
-  _request: Request,
-  { params }: { params: Promise<{ id: string }> },
-) {
   const { id } = await params;
   const response = await fetch(`${BACKEND_URL}/services/${id}`, {
     method: "DELETE",

app/api/services/route.ts

@@ -1,6 +1,8 @@
 const BACKEND_URL = process.env.BACKEND_URL;
 
 export async function GET() {
+  console.log("Made it to the GET SERVICES ROUTE!");
+
   const response = await fetch(`${BACKEND_URL}/services/all`);
 
   if (!response.ok) {

components/layout/Header.tsx

@@ -1,7 +1,3 @@
-"use client";
-
-import { useEffect, useState } from "react";
-
 import Hyperlink from "@/components/ui/Hyperlink";
 import { getServices } from "@/lib/api/helpers/services";
 import { Service } from "@/lib/api/types";
@@ -44,19 +40,11 @@ const defaultServices: Service[] = [
   },
 ];
 
-export default function Header() {
+export default async function Header() {
-  const [services, setServices] = useState<Service[]>(defaultServices);
+  let services = await getServices();
-  useEffect(() => {
+  if (services.length < 1) {
-    getServices()
+    services = defaultServices;
-      .then((services) => {
+  }
-        if (services.length > 0) {
-          setServices(services);
-        }
-      })
-      .catch(() => {
-        // Keep default services if the backend is not reached :C
-      });
-  }, []);
   return (
     <header className="w-full h-full bg-slate-500 dark:bg-slate-900 flex items-center justify-between">
       <nav className="flex items-center justify-around w-full h-full px-6 py-4">