[#338] Components refactor

apps/2025/next.config.js

@@ -1,5 +1,5 @@
 import { fileURLToPath } from "url";
-import createJiti from 'jiti';
+import createJiti from "jiti";
 
 // Import env files to validate at build time. Use jiti so we can load .ts files in here.
 await createJiti(fileURLToPath(import.meta.url)).import("./src/env", {});

apps/2025/src/app/_components/about/about.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import useScrollAnimation from "../hooks/useScrollAnimation";
+import useScrollAnimation from "~/hooks/useScrollAnimation";
 import AboutComicSVG from "./about-comic-svg";
 import AboutText from "./about-text";
 
@@ -11,7 +11,7 @@ export default function About() {
   return (
     <section
       id="about"
-      className="z-10 mt-0 mb-[150px] flex min-h-[1200px] w-full justify-center px-4 pt-0 sm:mb-0 sm:min-h-0 sm:px-6 sm:pt-8 md:px-8 md:pt-8 lg:px-12 lg:pt-12"
+      className="z-10 mt-0 mb-37.5 flex min-h-300 w-full justify-center px-4 pt-0 sm:mb-0 sm:min-h-0 sm:px-6 sm:pt-8 md:px-8 md:pt-8 lg:px-12 lg:pt-12"
     >
       <div className="relative w-[95%] sm:w-[90%] md:w-[80%] lg:w-[70%] xl:w-[60%]">
         <h2 className="sr-only">About Knight Hacks</h2>

apps/2025/src/app/_components/faq/faq.tsx

@@ -5,7 +5,7 @@ import { ChevronDownIcon } from "@radix-ui/react-icons";
 import Image from "next/image";
 import Link from "next/link";
 import { useState } from "react";
-import useStaggeredAnimation from "../hooks/useStaggeredAnimation";
+import useStaggeredAnimation from "~/hooks/useStaggeredAnimation";
 
 /* Radix aliases ----------------------------------------------------------- */
 const Accordion = AccordionPrimitive.Root;
@@ -375,7 +375,7 @@ export default function Faq() {
         <div className="w-full px-4 py-4 sm:px-2">
           <div className="mx-auto max-w-4xl">
             {/* Fixed height container to prevent background shifting */}
-            <div className="min-h-[1000px] sm:min-h-[1100px] md:min-h-[1200px] lg:min-h-[1300px]">
+            <div className="min-h-250 sm:min-h-275 md:min-h-300 lg:min-h-325">
               <Accordion type="single" collapsible className="w-full space-y-4">
                 {filteredFaqData.map((faq) => (
                   <div key={faq.id} className="stagger-item animate-pop-out">

apps/2025/src/app/_components/partners/partnerPosters.tsx

@@ -94,7 +94,7 @@ const partners: Partner[] = [
   },
 ];
 
-import useStaggeredAnimation from "../hooks/useStaggeredAnimation";
+import useStaggeredAnimation from "~/hooks/useStaggeredAnimation";
 
 export default function PartnerPosters() {
   const partnersGridRef = useStaggeredAnimation(80);
@@ -121,7 +121,7 @@ export default function PartnerPosters() {
                   {/* Main card */}
                   <div className="relative flex h-full w-full items-center justify-center rounded-none bg-[#F7F0C6] outline-2 -outline-offset-3 outline-black transition-transform duration-100 group-hover:-translate-x-1 group-hover:-translate-y-1 hover:scale-[1.02] hover:shadow-2xl hover:ring-4 hover:shadow-[#FBB03B]/80 hover:ring-[#FBB03B]/50">
                     {/* subtle dot pattern */}
-                    <div className="absolute inset-0 bg-[radial-gradient(circle_at_50%_50%,rgba(0,0,0,0.03)_1px,transparent_1px)] bg-[length:20px_20px] opacity-30" />
+                    <div className="absolute inset-0 bg-[radial-gradient(circle_at_50%_50%,rgba(0,0,0,0.03)_1px,transparent_1px)] bg-size-[20px_20px] opacity-30" />
 
                     {/* logo container */}
                     <div className="relative flex h-full w-full items-center justify-center">

apps/2025/src/app/_components/partners/partners.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import useStaggeredAnimation from "../hooks/useStaggeredAnimation";
+import useStaggeredAnimation from "~/hooks/useStaggeredAnimation";
 import PartnerPosters from "./partnerPosters";
 import PartnersTitle from "./partnersTitle";
 
@@ -12,7 +12,7 @@ const Partners = () => {
       <section
         id="partners"
         ref={partnersRef}
-        className="mt-0 mb-[100px] min-h-[800px] w-[90%] pt-0 sm:mt-40 sm:mb-20 sm:min-h-0 sm:pt-0 md:mb-24 lg:mb-32 xl:mb-40"
+        className="mt-0 mb-25 min-h-200 w-[90%] pt-0 sm:mt-40 sm:mb-20 sm:min-h-0 sm:pt-0 md:mb-24 lg:mb-32 xl:mb-40"
       >
         <div className="stagger-item animate-pop-out">
           <PartnersTitle />

apps/2025/src/app/_components/sponsors/sponsorPosters.tsx

@@ -37,7 +37,7 @@
 import Image from "next/image";
 import Link from "next/link";
 
-import useStaggeredAnimation from "../hooks/useStaggeredAnimation";
+import useStaggeredAnimation from "~/hooks/useStaggeredAnimation";
 
 type Tier = "Platinum" | "Gold" | "Silver" | "Bronze";
 
@@ -262,7 +262,7 @@ export default function SponsorPosters() {
                       className={`relative flex h-full w-full items-center justify-center rounded-none bg-[#F7F0C6] outline-2 -outline-offset-3 outline-black transition-transform duration-100 group-hover:-translate-x-1 group-hover:-translate-y-1 ${tierConfig.hover}`}
                     >
                       {/* subtle dot pattern */}
-                      <div className="absolute inset-0 bg-[radial-gradient(circle_at_50%_50%,rgba(0,0,0,0.03)_1px,transparent_1px)] bg-[length:20px_20px] opacity-30" />
+                      <div className="absolute inset-0 bg-[radial-gradient(circle_at_50%_50%,rgba(0,0,0,0.03)_1px,transparent_1px)] bg-size-[20px_20px] opacity-30" />
 
                       {/* logo container */}
                       <div className="relative flex h-full w-full items-center justify-center">

apps/2025/src/app/_components/sponsors/sponsors.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import useStaggeredAnimation from "../hooks/useStaggeredAnimation";
+import useStaggeredAnimation from "~/hooks/useStaggeredAnimation";
 import SponsorPosters from "./sponsorPosters";
 import SponsorsTitle from "./sponsorsTitle";
 
@@ -12,7 +12,7 @@ const Sponsors = () => {
       <section
         id="sponsors"
         ref={sponsorsRef}
-        className="mt-0 mb-[100px] min-h-[800px] w-[90%] pt-0 sm:mt-40 sm:mb-20 sm:min-h-0 sm:pt-0 md:mb-24 lg:mb-32 xl:mb-40"
+        className="mt-0 mb-25 min-h-200 w-[90%] pt-0 sm:mt-40 sm:mb-20 sm:min-h-0 sm:pt-0 md:mb-24 lg:mb-32 xl:mb-40"
       >
         <div className="stagger-item animate-pop-out">
           <SponsorsTitle />

apps/2025/src/app/_components/tracks/tracks.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import useScrollAnimation from "../hooks/useScrollAnimation";
+import useScrollAnimation from "~/hooks/useScrollAnimation";
 import TextBox from "../textbox";
 import Comic from "./comic";
 
@@ -11,7 +11,7 @@ export default function Tracks() {
     <section
       id="tracks"
       ref={tracksRef}
-      className="animate-on-scroll z-10 mt-0 mb-[50px] flex min-h-[800px] flex-col items-center space-y-1 overflow-x-hidden pt-0 sm:mt-40 sm:mb-20 sm:min-h-0 sm:space-y-2 sm:pt-0 md:space-y-3 lg:mb-32 xl:mb-40"
+      className="animate-on-scroll z-10 mt-0 mb-12.5 flex min-h-200 flex-col items-center space-y-1 overflow-x-hidden pt-0 sm:mt-40 sm:mb-20 sm:min-h-0 sm:space-y-2 sm:pt-0 md:space-y-3 lg:mb-32 xl:mb-40"
     >
       <div className="flex w-full flex-col items-center pt-0 sm:pt-12 md:pt-16 lg:pt-20 xl:pt-24">
         <div className="relative w-[95%] sm:w-[90%] md:w-[80%] lg:w-[70%] xl:w-[60%]">

apps/2025/src/styles/globals.css

@@ -1,7 +1,8 @@
 @import "tailwindcss";
 
 @theme {
-  --font-sans: var(--font-geist-sans), ui-sans-serif, system-ui, sans-serif,
+  --font-sans:
+    var(--font-geist-sans), ui-sans-serif, system-ui, sans-serif,
     "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 

apps/blade/package.json

@@ -61,6 +61,7 @@
     "@forge/prettier-config": "workspace:*",
     "@forge/tailwind-config": "workspace:*",
     "@forge/tsconfig": "workspace:*",
+    "@types/canvas-confetti": "^1.9.0",
     "@types/node": "^20.16.11",
     "@types/react": "catalog:react18",
     "@types/react-dom": "catalog:react18",

apps/blade/src/app/admin/banquet-raffle/components/raffle-draw.tsx → apps/blade/src/app/_components/admin/banquet-raffle/raffle-draw.tsx

@@ -4,6 +4,7 @@
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 /* eslint-disable @typescript-eslint/no-unnecessary-condition */
 /* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable @typescript-eslint/no-unsafe-call */
 "use client";
 
 import { useEffect, useRef, useState } from "react";
@@ -236,7 +237,7 @@ export default function RaffleDraw({ entries }: { entries: RaffleEntry[] }) {
         // Confetti
         if (containerRef.current) {
           const rect = containerRef.current.getBoundingClientRect();
-          confetti({
+          void confetti({
             particleCount: 150,
             spread: 90,
             origin: {

apps/blade/src/app/admin/club/check-in/_components/check-in-page.tsx → apps/blade/src/app/_components/admin/club/check-in/check-in-page.tsx

@@ -11,8 +11,8 @@ import {
 } from "@forge/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@forge/ui/tabs";
 
-import ScannerPopUp from "../../../club/members/_components/scanner";
-import { ManualEntryForm } from "./manual-entry-form";
+import { ManualEntryForm } from "~/app/_components/admin/club/check-in/manual-entry-form";
+import ScannerPopUp from "~/app/_components/shared/scanner";
 
 export function CheckInPage() {
   return (

apps/blade/src/app/admin/club/data/_components/MemberDemographics.tsx → apps/blade/src/app/_components/admin/club/data/MemberDemographics.tsx

@@ -1,10 +1,10 @@
 "use client";
 
+import AgeBarChart from "~/app/_components/admin/charts/AgeBarChart";
+import MajorBarChart from "~/app/_components/admin/charts/MajorBarChart";
+import RaceOrEthnicityPie from "~/app/_components/admin/charts/RaceOrEthnicityPie";
+import SchoolYearPie from "~/app/_components/admin/charts/SchoolYearPie";
 import { api } from "~/trpc/react";
-import AgeBarChart from "../../../_components/AgeBarChart";
-import MajorBarChart from "../../../_components/MajorBarChart";
-import RaceOrEthnicityPie from "../../../_components/RaceOrEthnicityPie";
-import SchoolYearPie from "../../../_components/SchoolYearPie";
 import DuesOverTimeBarChart from "./member-data/DuesOverTimeBarChart";
 import EngagementInfo from "./member-data/EngagementInfo";
 import GenderPie from "./member-data/GenderPie";

apps/blade/src/app/admin/club/events/_components/events-table.tsx → apps/blade/src/app/_components/admin/club/events/events-table.tsx

@@ -16,7 +16,7 @@ import {
   TableRow,
 } from "@forge/ui/table";
 
-import SortButton from "~/app/admin/_components/SortButton";
+import SortButton from "~/app/_components/shared/SortButton";
 import { getFormattedDate } from "~/lib/utils";
 import { api } from "~/trpc/react";
 import { CreateEventButton } from "./create-event";

apps/blade/src/app/admin/club/events/_components/view-attendance-button.tsx → apps/blade/src/app/_components/admin/club/events/view-attendance-button.tsx

@@ -12,9 +12,9 @@ import {
   DialogTrigger,
 } from "@forge/ui/dialog";
 
-import HackerProfileButton from "~/app/admin/hackathon/hackers/_components/hacker-profile";
+import MemberProfileButton from "~/app/_components/admin/club/members/member-profile";
+import HackerProfileButton from "~/app/_components/admin/hackathon/hackers/hacker-profile";
 import { api } from "~/trpc/react";
-import MemberProfileButton from "../../members/_components/member-profile";
 
 export function ViewAttendanceButton({
   event,

apps/blade/src/app/admin/club/members/_components/members-table.tsx → apps/blade/src/app/_components/admin/club/members/members-table.tsx

@@ -17,9 +17,9 @@ import {
   TableRow,
 } from "@forge/ui/table";
 
-import CustomPagination from "~/app/admin/_components/CustomPagination";
-import CustomPaginationSelect from "~/app/admin/_components/CustomPaginationSelect";
-import SortButton from "~/app/admin/_components/SortButton";
+import CustomPagination from "~/app/_components/admin/charts/CustomPagination";
+import CustomPaginationSelect from "~/app/_components/admin/charts/CustomPaginationSelect";
+import SortButton from "~/app/_components/shared/SortButton";
 import { useDebounce } from "~/app/admin/_hooks/debounce";
 import { api } from "~/trpc/react";
 import ClearDuesButton from "./clear-dues";

apps/blade/src/app/admin/club/members/_components/scanner.tsx → apps/blade/src/app/_components/admin/club/members/scanner.tsx

@@ -27,9 +27,9 @@ import {
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@forge/ui/tabs";
 import { toast } from "@forge/ui/toast";
 
+import ToggleButton from "~/app/_components/admin/hackathon/hackers/toggle-button";
 import { getClassTeam } from "~/lib/utils";
 import { api } from "~/trpc/react";
-import ToggleButton from "../../../../admin/hackathon/hackers/_components/toggle-button";
 
 const ScannerPopUp = ({ eventType }: { eventType: "Member" | "Hacker" }) => {
   const { data: events } = api.event.getEvents.useQuery();

apps/blade/src/app/admin/forms/[slug]/client.tsx → apps/blade/src/app/_components/admin/forms/editor/client.tsx

@@ -45,8 +45,8 @@
 
 import type { MatchingType } from "./linker";
 import type { ProcedureMeta } from "~/lib/utils";
-import { InstructionEditCard } from "~/components/admin/forms/instruction-edit-card";
-import { QuestionEditCard } from "~/components/admin/forms/question-edit-card";
+import { InstructionEditCard } from "~/app/_components/forms/shared/instruction-edit-card";
+import { QuestionEditCard } from "~/app/_components/forms/shared/question-edit-card";
 import { api } from "~/trpc/react";
 import { ConnectionViewer } from "./con-viewer";
 import ListMatcher from "./linker";
@@ -249,7 +249,7 @@
       allowEdit,
       responseRoleIds,
     });
   }, [
     isLoading,
     isFetching,
     formTitle,

apps/blade/src/app/_components/admin/forms/homepage.tsx

@@ -5,9 +5,9 @@ import { useRouter } from "next/navigation";
 
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@forge/ui/tabs";
 
-import { CreateFormCard } from "~/components/forms/create-form-card";
-import { FormCard } from "~/components/forms/form-card";
-import { SectionManagerDialog } from "~/components/forms/section-manager-dialog";
+import { CreateFormCard } from "~/app/_components/forms/shared/create-form-card";
+import { FormCard } from "~/app/_components/forms/shared/form-card";
+import { SectionManagerDialog } from "~/app/_components/forms/shared/section-manager-dialog";
 import { api } from "~/trpc/react";
 
 export default function FormsClient() {

apps/blade/src/app/admin/hackathon/check-in/_components/check-in-page.tsx → apps/blade/src/app/_components/admin/hackathon/check-in/check-in-page.tsx

@@ -11,8 +11,8 @@ import {
 } from "@forge/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@forge/ui/tabs";
 
-import ScannerPopUp from "../../../club/members/_components/scanner";
-import { ManualEntryForm } from "./manual-entry-form";
+import { ManualEntryForm } from "~/app/_components/admin/hackathon/check-in/manual-entry-form";
+import ScannerPopUp from "~/app/_components/shared/scanner";
 
 export function CheckInPage() {
   return (

apps/blade/src/app/admin/hackathon/check-in/_components/manual-entry-form.tsx → apps/blade/src/app/_components/admin/hackathon/check-in/manual-entry-form.tsx

@@ -27,8 +27,8 @@ import { Popover, PopoverContent, PopoverTrigger } from "@forge/ui/popover";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@forge/ui/tabs";
 import { toast } from "@forge/ui/toast";
 
+import ToggleButton from "~/app/_components/admin/hackathon/hackers/toggle-button";
 import { api } from "~/trpc/react";
-import ToggleButton from "../../../hackathon/hackers/_components/toggle-button";
 
 export function ManualEntryForm() {
   const { data: events } = api.event.getEvents.useQuery();

apps/blade/src/app/admin/hackathon/control-room/_components/control-room-client.tsx → apps/blade/src/app/_components/admin/hackathon/control-room/control-room-client.tsx

@@ -6,7 +6,7 @@ import { Alert, AlertDescription } from "@forge/ui/alert";
 import { Button } from "@forge/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@forge/ui/card";
 
-import CsvImporter from "~/app/_components/csv-importer";
+import CsvImporter from "~/app/_components/shared/csv-importer";
 import { api } from "~/trpc/react";
 
 export default function ControlRoomClient() {

apps/blade/src/app/admin/hackathon/data/_components/HackerCharts.tsx → apps/blade/src/app/_components/admin/hackathon/data/HackerCharts.tsx

@@ -3,14 +3,14 @@ import { useState } from "react";
 import { FORMS } from "@forge/consts";
 import { ToggleGroup, ToggleGroupItem } from "@forge/ui/toggle-group";
 
-import AgeBarChart from "~/app/admin/_components/AgeBarChart";
-import FirstTimeHackersPie from "~/app/admin/_components/FirstTimeHackersPie";
-import FoodAllergiesBarChart from "~/app/admin/_components/FoodAllergiesBarChart";
-import GenderPie from "~/app/admin/_components/GenderPie";
-import MajorBarChart from "~/app/admin/_components/MajorBarChart";
-import RaceOrEthnicityPie from "~/app/admin/_components/RaceOrEthnicityPie";
-import SchoolBarChart from "~/app/admin/_components/SchoolBarChart";
-import SchoolYearPie from "~/app/admin/_components/SchoolYearPie";
+import AgeBarChart from "~/app/_components/admin/charts/AgeBarChart";
+import FirstTimeHackersPie from "~/app/_components/admin/charts/FirstTimeHackersPie";
+import FoodAllergiesBarChart from "~/app/_components/admin/charts/FoodAllergiesBarChart";
+import GenderPie from "~/app/_components/admin/charts/GenderPie";
+import MajorBarChart from "~/app/_components/admin/charts/MajorBarChart";
+import RaceOrEthnicityPie from "~/app/_components/admin/charts/RaceOrEthnicityPie";
+import SchoolBarChart from "~/app/_components/admin/charts/SchoolBarChart";
+import SchoolYearPie from "~/app/_components/admin/charts/SchoolYearPie";
 import { api } from "~/trpc/react";
 import ApplicationsOverTimeBarChart from "./ApplicationsOverTimeBarChart";
 import FirstTimeInfo from "./FirstTimeInfo";

apps/blade/src/app/admin/hackathon/events/_components/events-table.tsx → apps/blade/src/app/_components/admin/hackathon/events/events-table.tsx

@@ -16,7 +16,7 @@ import {
   TableRow,
 } from "@forge/ui/table";
 
-import SortButton from "~/app/admin/_components/SortButton";
+import SortButton from "~/app/_components/shared/SortButton";
 import { getFormattedDate } from "~/lib/utils";
 import { api } from "~/trpc/react";
 import { CreateEventButton } from "./create-event";

apps/blade/src/app/admin/hackathon/events/_components/view-attendance-button.tsx → apps/blade/src/app/_components/admin/hackathon/events/view-attendance-button.tsx

@@ -12,7 +12,7 @@ import {
   DialogTrigger,
 } from "@forge/ui/dialog";
 
-import HackerProfileButton from "~/app/admin/hackathon/hackers/_components/hacker-profile";
+import HackerProfileButton from "~/app/_components/admin/hackathon/hackers/hacker-profile";
 import { api } from "~/trpc/react";
 
 export function ViewAttendanceButton({

apps/blade/src/app/admin/hackathon/hackers/hacker-client.tsx → apps/blade/src/app/_components/admin/hackathon/hackers/hacker-client.tsx

@@ -2,9 +2,9 @@
 
 import { useState } from "react";
 
+import HackerStatusCounter from "~/app/_components/admin/hackathon/hackers/hacker-status-counter";
+import HackerTable from "~/app/_components/admin/hackathon/hackers/hackers-table";
 import { HACKER_STATUS_MAP } from "~/consts";
-import HackerStatusCounter from "./_components/hacker-status-counter";
-import HackerTable from "./_components/hackers-table";
 
 export default function HackersClient({
   currentActiveHackathon,

apps/blade/src/app/admin/hackathon/hackers/_components/hackers-table.tsx → apps/blade/src/app/_components/admin/hackathon/hackers/hackers-table.tsx

@@ -27,7 +27,7 @@ import {
   TableRow,
 } from "@forge/ui/table";
 
-import SortButton from "~/app/admin/_components/SortButton";
+import SortButton from "~/app/_components/shared/SortButton";
 import { HACKER_STATUS_MAP } from "~/consts";
 import { api } from "~/trpc/react";
 import DeleteHackerButton from "./delete-hacker";

apps/blade/src/app/dashboard/_components/hackathon-dashboard/hackathon-data.tsx → apps/blade/src/app/_components/dashboard/hackathon-dashboard/hackathon-data.tsx

@@ -14,10 +14,10 @@ import {
 } from "@forge/ui/dialog";
 
 import type { api as serverCall } from "~/trpc/server";
+import { HackerQRCodePopup } from "~/app/_components/dashboard/hacker-dashboard/hacker-qr-button";
+import { DownloadQRPass } from "~/app/_components/dashboard/member-dashboard/download-qr-pass";
 import { HACKER_STATUS_MAP } from "~/consts";
 import { api } from "~/trpc/react";
-import { HackerQRCodePopup } from "../hacker-dashboard/hacker-qr-button";
-import { DownloadQRPass } from "../member-dashboard/download-qr-pass";
 import AlertButton from "./issue-dialog";
 import { PointLeaderboard } from "./point-leaderboard";
 

apps/blade/src/app/dashboard/_components/member-dashboard/event/event-feedback.tsx → apps/blade/src/app/_components/dashboard/member-dashboard/event/event-feedback.tsx

@@ -6,7 +6,7 @@ import type { InsertMember, SelectEvent } from "@forge/db/schemas/knight-hacks";
 import { Button } from "@forge/ui/button";
 import { Dialog, DialogContent, DialogTrigger } from "@forge/ui/dialog";
 
-import { FormResponderWrapper } from "~/app/forms/[formName]/_components/form-responder-client";
+import { FormResponderWrapper } from "~/app/_components/forms/form-responder-client";
 
 export function EventFeedbackForm({
   event,

apps/blade/src/app/forms/[formName]/_components/form-responder-client.tsx → apps/blade/src/app/_components/forms/form-responder-client.tsx

@@ -10,7 +10,7 @@ import { Card } from "@forge/ui/card";
 
 import type { FormResponsePayload } from "./utils";
 import { api } from "~/trpc/react";
-import { useSubmissionSuccess } from "../_hooks/useSubmissionSuccess";
+import { useSubmissionSuccess } from "./_hooks/useSubmissionSuccess";
 import { handleCallbacks } from "./connection-handler";
 import FormNotFound from "./form-not-found";
 import { FormRunner } from "./form-runner";

apps/blade/src/app/forms/[formName]/_components/form-runner.tsx → apps/blade/src/app/_components/forms/form-runner.tsx

@@ -7,8 +7,8 @@ import { Button } from "@forge/ui/button";
 import { Card } from "@forge/ui/card";
 
 import type { FormResponsePayload, FormResponseUI } from "./utils";
-import { InstructionResponseCard } from "~/app/forms/[formName]/_components/instruction-response-card";
-import { QuestionResponseCard } from "~/app/forms/[formName]/_components/question-response-card";
+import { InstructionResponseCard } from "~/app/_components/forms/instruction-response-card";
+import { QuestionResponseCard } from "~/app/_components/forms/question-response-card";
 import { getValidationError, isFormValid, normalizeResponses } from "./utils";
 
 /**