refactor: 🚚 refactor om-oss to route module

package.json

@@ -34,7 +34,7 @@
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@icons-pack/react-simple-icons": "^11.2.0",
-    "@radix-ui/react-accordion": "^1.2.1",
+    "@radix-ui/react-accordion": "^1.2.3",
     "@radix-ui/react-dropdown-menu": "^2.1.5",
     "@radix-ui/react-icons": "^1.3.0",
     "@radix-ui/react-separator": "^1.1.0",

src/pages/public/OmOss/components/Accordion.tsx → src/components/ui/accordion.tsx

@@ -1,12 +1,10 @@
-"use client";
+import * as React from "react"
+import * as AccordionPrimitive from "@radix-ui/react-accordion"
+import { ChevronDown } from "lucide-react"
 
-import * as AccordionPrimitive from "@radix-ui/react-accordion";
-import { ChevronDown } from "lucide-react";
-import * as React from "react";
+import { cn } from "@/lib/utils"
 
-import { cn } from "@/lib/utils";
-
-const Accordion = AccordionPrimitive.Root;
+const Accordion = AccordionPrimitive.Root
 
 const AccordionItem = React.forwardRef<
   React.ElementRef<typeof AccordionPrimitive.Item>,
@@ -15,47 +13,50 @@ const AccordionItem = React.forwardRef<
   <AccordionPrimitive.Item
     ref={ref}
     className={cn(
-      "border-b border-vektor-DARKblue dark:border-vektor-bg border-opacity-10 ",
-      className,
-    )}
+      "border-b",
+      // vektor styling
+      "border-vektor-DARKblue dark:border-vektor-bg border-opacity-10", 
+      className)}
     {...props}
   />
-));
-AccordionItem.displayName = "AccordionItem";
+))
+AccordionItem.displayName = "AccordionItem"
 
 const AccordionTrigger = React.forwardRef<
   React.ElementRef<typeof AccordionPrimitive.Trigger>,
   React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
 >(({ className, children, ...props }, ref) => (
-  <AccordionPrimitive.Header className="flex ">
+  <AccordionPrimitive.Header className="flex">
     <AccordionPrimitive.Trigger
       ref={ref}
       className={cn(
-        "flex flex-1 text-md md:text-lg text-vektor-DARKblue items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
-        className,
+        "flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
+        // vektor styling
+        "text-md md:text-lg text-vektor-DARKblue",
+        className
       )}
       {...props}
     >
       {children}
       <ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
     </AccordionPrimitive.Trigger>
   </AccordionPrimitive.Header>
-));
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
+))
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
 
 const AccordionContent = React.forwardRef<
   React.ElementRef<typeof AccordionPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
 >(({ className, children, ...props }, ref) => (
   <AccordionPrimitive.Content
     ref={ref}
-    className="overflow-hidden text-sm md:text-md transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+    className="overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
     {...props}
   >
     <div className={cn("pb-4 pt-0", className)}>{children}</div>
   </AccordionPrimitive.Content>
-));
+))
 
-AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+AccordionContent.displayName = AccordionPrimitive.Content.displayName
 
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }

src/pages/public/OmOss/components/OmOss.tsx → src/pages/om-oss.tsx

@@ -6,14 +6,14 @@ import {
   AccordionContent,
   AccordionItem,
   AccordionTrigger,
-} from "./Accordion";
+} from "@/components/ui/accordion";
 
 interface AccordionType {
   title: string;
   content: string;
 }
 
-const assistantAccordions: AccordionType[] = [
+const assistantAccordions: Array<AccordionType> = [
   {
     title: "Er verv i Vektorprogrammet betalt?",
     content:
@@ -63,7 +63,7 @@ const assistantAccordions: AccordionType[] = [
   },
 ];
 
-const teamAccordions: AccordionType[] = [
+const teamAccordions: Array<AccordionType> = [
   {
     title: "Hvordan søker jeg team?",
     content:
@@ -85,7 +85,8 @@ const teamAccordions: AccordionType[] = [
   },
 ];
 
-const OmOss = () => {
+// biome-ignore lint/style/noDefaultExport: Route Modules require default export https://reactrouter.com/start/framework/route-module
+export default function OmOss () {
   const { title, ingress, bottomText, bottomHeader, bottomImage, cards } =
     getContent();
   const accordionSection = (
@@ -163,5 +164,3 @@ const OmOss = () => {
     </div>
   );
 };
-
-export default OmOss;

src/routes.ts

@@ -21,7 +21,7 @@ export const navRoutes = [
 export default [
   layout("pages/layout.tsx", [
     index("pages/public/mainPage.tsx"),
-    route("om-oss", "pages/public/OmOss/index.ts"),
+    route("om-oss", "pages/om-oss.tsx"),
     route("assistenter", "pages/assistenter.tsx"),
     // team
     ...prefix("team", [