Merge branch 'main' into duosi/fix/mainPageLogo

package.json

@@ -26,7 +26,7 @@
     "@tanstack/react-query": "^5.20.1",
     "@turf/center-of-mass": "^7.0.0",
     "@vercel/analytics": "^1.2.2",
-    "@vercel/flags": "^2.3.0",
+    "@vercel/flags": "^2.5.1",
     "@vercel/speed-insights": "^1.0.10",
     "@vercel/toolbar": "^0.1.14",
     "class-variance-authority": "^0.7.0",
@@ -60,13 +60,13 @@
   "devDependencies": {
     "@eslint/js": "^9.8.0",
     "@total-typescript/ts-reset": "^0.5.1",
+    "@types/geojson": "^7946.0.14",
     "@types/js-cookie": "^3.0.6",
     "@types/luxon": "^3.4.2",
+    "@types/mapbox__mapbox-gl-draw": "^1.4.7",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
-    "@types/geojson": "^7946.0.14",
-    "@types/mapbox__mapbox-gl-draw": "^1.4.7",
     "autoprefixer": "^10.0.1",
     "eslint": "^9.8.0",
     "eslint-config-next": "14.1.0",

src/app/.well-known/vercel/flags/route.ts

@@ -1,10 +1,14 @@
-import { type ApiData } from "@vercel/flags"
-import { NextResponse } from "next/server"
+import { verifyAccess, type ApiData } from "@vercel/flags"
+import { NextRequest, NextResponse } from "next/server"
 import { FEATURE_FLAG_DEFINITIONS } from "../../../../feature_flags"
 
-export async function GET() {
+export async function GET(request: NextRequest) {
+  const access = await verifyAccess(request.headers.get("Authorization"))
+  if (!access) return NextResponse.json(null, { status: 401 })
+
   const apiData = {
     definitions: FEATURE_FLAG_DEFINITIONS
   }
+
   return NextResponse.json<ApiData>(apiData)
 }

src/app/layout.tsx

@@ -1,4 +1,5 @@
 import Providers from "@/app/providers"
+import { Footer } from "@/components/shared/Footer"
 import { Analytics } from "@vercel/analytics/react"
 import { SpeedInsights } from "@vercel/speed-insights/next"
 import { DateTime } from "luxon"
@@ -71,6 +72,7 @@ export default function RootLayout({
         <SpeedInsights />
         <Providers>{children}</Providers>
         <DevToolbar />
+        <Footer />
       </body>
     </html>
   )

src/app/student/events/[id]/page.tsx

@@ -42,7 +42,7 @@ export default async function EventDetailsPage({
 }: {
   params: { id: string }
 }) {
-  if (!feature("EVENT_PAGE")) {
+  if (!(await feature("EVENT_PAGE"))) {
     return notFound()
   }
 

src/app/student/events/page.tsx

@@ -5,7 +5,7 @@ import { fetchEvents } from "@/components/shared/hooks/api/useEvents"
 import { notFound } from "next/navigation"
 
 export default async function StudentEventPage() {
-  if (!feature("EVENT_PAGE")) {
+  if (!(await feature("EVENT_PAGE"))) {
     return notFound()
   }
   const events = await fetchEvents()

src/app/student/map/page.tsx

@@ -11,7 +11,7 @@ import { notFound } from "next/navigation"
 import { Suspense } from "react"
 
 export default async function Page() {
-  if (!feature("MAP_PAGE")) {
+  if (!(await feature("MAP_PAGE"))) {
     return notFound()
   }
 

src/components/shared/Footer.tsx

@@ -0,0 +1,66 @@
+import { InstagramIcon, LinkedinIcon, Music2Icon } from "lucide-react"
+
+export function Footer() {
+  return (
+    /* IF WIDTH < 768, SET TO VERTICAL, OTHERWISE KEEP HORIZONTAL */
+    <div className="w-100 flex flex-col items-center justify-center md:flex-row md:items-start">
+      <hr className="static mt-2 h-1 w-2/3 rounded border-0 bg-slate-500 bg-opacity-30 md:absolute" />
+      <div className="m-5 mb-3 mt-7 w-1/4 place-items-center text-center md:place-items-start md:text-start">
+        <p>
+          <b>Follow us on:</b>
+        </p>
+        <a
+          href="https://www.linkedin.com/company/armada"
+          className="flex space-x-1">
+          <LinkedinIcon size="20" />
+          <p className="mb-0">LinkedIn</p>
+        </a>
+        <a
+          href="https://www.instagram.com/thsarmada/"
+          className="flex space-x-1">
+          <InstagramIcon size="20" />
+          <p>Instagram</p>
+        </a>
+        <a href="https://www.tiktok.com/@ths.armada" className="flex space-x-1">
+          <Music2Icon size="20" />
+          <p>TikTok</p>
+        </a>
+      </div>
+
+      <div className="m-5 mb-3 mt-7 w-1/4 place-items-center text-center md:place-items-start md:text-left">
+        <p>
+          <b>STUDENTS</b>
+        </p>
+        <a href="/student/exhibitors">Exhibitors</a>
+        <br />
+        <a href="/student/recruitment">Recruitment</a>
+        <br />
+        <a href="/student/events">Events</a>
+      </div>
+      <div className="m-5 mb-3 mt-7 w-1/4 place-items-center text-center md:place-items-start md:text-left">
+        <p>
+          <b>EXHIBITORS</b>
+        </p>
+        <a href="https://register.armada.nu/register">Registration</a>
+        <br />
+        <a href="/exhibitor/packages">Packages</a>
+        <br />
+        <a href="/exhibitor">Why Armada</a>
+        <br />
+        <a href="/exhibitor/timeline">Timeline</a>
+      </div>
+
+      <div className="m-5 mb-3 mt-7 w-1/4 place-items-center text-center md:place-items-start md:text-left">
+        <p>
+          <b>ARMADA</b>
+        </p>
+        <p>
+          <i>Drottning Kristinas väg 15</i>
+        </p>
+        <p>
+          <i>114 28, Stockholm</i>
+        </p>
+      </div>
+    </div>
+  )
+}

src/components/shared/feature.ts

@@ -1,29 +1,18 @@
-import featureFlags from "@/feature_flags"
+import featureFlags, { FEATURE_FLAGS } from "@/feature_flags"
+import { decrypt, FlagOverridesType } from "@vercel/flags"
 import { cookies } from "next/headers"
 
-export function feature(feature: keyof typeof featureFlags) {
-  const cookie = cookies()
-
-  const result = cookie.get("vercel-flag-overrides")
-  if (result != null) {
-    return parseCookie(feature, result.value)
+export async function features() {
+  const overrideCookie = cookies().get("vercel-flag-overrides")?.value
+  const overrides = overrideCookie
+    ? await decrypt<FlagOverridesType>(overrideCookie)
+    : {}
+  return {
+    ...FEATURE_FLAGS,
+    ...overrides
   }
-  return false
 }
 
-function parseCookie(
-  feature: keyof typeof featureFlags,
-  rawOverrides: string | undefined
-) {
-  const overrides =
-    rawOverrides == null
-      ? {}
-      : (JSON.parse(rawOverrides) as Record<string, boolean>)
-
-  if (overrides[feature] != null) {
-    return overrides[feature]
-  } else if (featureFlags[feature] != null) {
-    return featureFlags[feature]
-  }
-  return false
+export async function feature(feature: keyof typeof featureFlags) {
+  return (await features())[feature] ?? false
 }

src/components/shared/hooks/useFeature.tsx

@@ -0,0 +1,16 @@
+import { features } from "@/components/shared/feature"
+import FEATURE_FLAGS from "@/feature_flags"
+import { useQuery } from "@tanstack/react-query"
+
+export function useFeature(feature?: keyof typeof FEATURE_FLAGS) {
+  const { data, isLoading } = useQuery({
+    queryKey: ["feature-flags"],
+    queryFn: async () => await features()
+  })
+
+  return {
+    isLoading,
+    enabled: feature ? data?.[feature] : null,
+    flags: data
+  }
+}