Develop

README.md

@@ -16,3 +16,4 @@ npm run dev
 ```bash
 npm run test
 ```
+

app/error.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import { Card } from "@/components/ui/card";
+import { Button } from "@/components/ui/button";
+import { HeaderIcon, HeaderText } from "@/components/ui/text";
+import { TriangleAlert } from "lucide-react";
+import { useEffect } from "react";
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error;
+  reset: () => void;
+}) {
+  useEffect(() => {
+    // Log the error to an error reporting service like Sentry
+    console.error(error);
+  }, [error]);
+
+  return (
+    <div className="flex min-h-screen flex-col items-center justify-center gap-4">
+      <Card className="flex flex-col gap-4 p-12">
+        <img src="/error.png" alt="Error" className="mx-auto w-96" />
+        <div className="flex items-center gap-3">
+          <HeaderIcon icon={TriangleAlert} />
+          <HeaderText>Something went wrong.</HeaderText>
+        </div>
+        <span>
+          Sorry for the inconvenience. Please{" "}
+          <a href="https://www.facebook.com/betterinternship.sherwin">
+            contact us for support
+          </a>
+          .
+        </span>
+        {error && (
+          <div className="flex flex-col gap-4">
+            <span className="text-muted-foreground">
+              Error: {error.message}
+            </span>
+          </div>
+        )}
+        <div className="flex justify-between">
+          <Button
+            onClick={
+              // Attempt to recover by trying to re-render the segment
+              () => reset()
+            }
+          >
+            Try again
+          </Button>
+        </div>
+      </Card>
+    </div>
+  );
+}

app/hire/authctx.tsx

@@ -7,7 +7,6 @@ import { EmployerAuthService } from "@/lib/api/hire.api";
 import { getFullName } from "@/lib/profile";
 import { FetchResponse } from "@/lib/api/use-fetch";
 import { useQueryClient } from "@tanstack/react-query";
-import { usePocketbase } from "@/lib/pocketbase";
 import { EmployerService } from "@/lib/api/services";
 import { useRef } from "react";
 
@@ -30,7 +29,7 @@ interface IAuthContext {
   ) => Promise<{ existing_user: boolean; verified_user: boolean }>;
   logout: () => Promise<void>;
   isAuthenticated: () => boolean;
-  refreshAuthentication: () => void;
+  refreshAuthentication: () => Promise<Partial<PublicEmployerUser> | null>;
   redirectIfNotLoggedIn: () => void;
   redirectIfLoggedIn: () => void;
 }
@@ -54,12 +53,11 @@ export const AuthContextProvider = ({
   const [loading, setLoading] = useState(true);
   const [isAuthenticated, setIsAuthenticated] = useState(false);
   const queryClient = useQueryClient();
-  const pocketbase = usePocketbase();
   const [god, setGod] = useState(false);
   const [user, setUser] = useState<Partial<PublicEmployerUser> | null>(() => {
     if (typeof window === "undefined") return null;
     const user = sessionStorage.getItem("user");
-    return user ? JSON.parse(user) : null;
+    return user ? (JSON.parse(user) as PublicEmployerUser) : null;
   });
 
   // Whenever user is updated, cache in localStorage
@@ -87,7 +85,8 @@ export const AuthContextProvider = ({
 
       setUser(response.user as PublicEmployerUser);
 
-      // @ts-ignore
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-expect-error
       if (response.god) setGod(true);
 
       setIsAuthenticated(true);
@@ -112,6 +111,7 @@ export const AuthContextProvider = ({
     setUser(response.user as PublicEmployerUser);
     setIsAuthenticated(true);
 
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-expect-error
     if (response.god) setGod(true);
 
@@ -125,7 +125,6 @@ export const AuthContextProvider = ({
       return null;
     }
 
-    await pocketbase.refresh();
     await queryClient.invalidateQueries({ queryKey: ["my-employer-profile"] });
     setProxy(getFullName(response.user));
     setUser(response.user);
@@ -138,7 +137,6 @@ export const AuthContextProvider = ({
   };
 
   const logout = async () => {
-    await pocketbase.logout();
     await EmployerAuthService.logout();
 
     await queryClient.invalidateQueries({ queryKey: ["my-employer-profile"] });
@@ -162,17 +160,17 @@ export const AuthContextProvider = ({
 
     useEffect(() => {
       if (effectRan.current && !loading && isAuthenticated) {
-        router.push("/dashboard")
-      };
+        router.push("/dashboard");
+      }
 
       if (!loading) {
         effectRan.current = true;
       }
     }, [isAuthenticated, loading]);
-  }
+  };
 
   useEffect(() => {
-    refreshAuthentication();
+    void refreshAuthentication();
   }, []);
 
   return (
@@ -181,9 +179,11 @@ export const AuthContextProvider = ({
         user,
         god,
         proxy,
-        // @ts-ignore
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-expect-error
         register,
-        // @ts-ignore
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-expect-error
         login,
         loginAs,
         loading,

app/hire/dashboard/applicant/page.tsx

@@ -6,84 +6,30 @@ import { ApplicantPage } from "@/components/features/hire/dashboard/ApplicantPag
 import { type ActionItem } from "@/components/ui/action-item";
 import { useEmployerApplications } from "@/hooks/use-employer-api";
 import { UserService } from "@/lib/api/services";
-import { EmployerApplication } from "@/lib/db/db.types";
 import { useDbRefs } from "@/lib/db/use-refs";
 import { useSearchParams } from "next/navigation";
 import { Suspense, useEffect, useState } from "react";
 import useApplicationActions from "@/hooks/use-application-actions";
 
 function ApplicantPageContent() {
   const searchParams = useSearchParams();
-  const userId = searchParams.get("userId");
-  const isDummyProfile = searchParams.get("dummy") === "1";
+  const applicationId = searchParams.get("applicationId");
   const [loading, setLoading] = useState(true);
   const applications = useEmployerApplications();
   const { app_statuses } = useDbRefs();
 
   const { triggerAction } = useApplicationActions(applications.review);
 
-  const dummyApplication: EmployerApplication = {
-    id: "dummy-super-application",
-    job_id: jobId ?? "dummy-super-job",
-    status: 0,
-    applied_at: "2026-03-09T00:00:00.000Z",
-    cover_letter:
-      "I am excited to apply and contribute with thoughtful solutions.",
-    challenge_submission:
-      "This is a sample challenge submission used for previewing super listing flows.",
-    job: {
-      title: "Super Listing - Sample Role",
-      internship_preferences: {
-        require_cover_letter: true,
-      },
-    },
-    user: {
-      id: "dummy-super-user",
-      first_name: "Sample",
-      last_name: "Applicant",
-      phone_number: "+63 900 000 0000",
-      edu_verification_email: "sample.applicant@school.edu",
-      degree: "BS Computer Science",
-      bio: "I build practical products and enjoy solving product and UX problems.",
-      github_link: "https://github.com/sample-applicant",
-      portfolio_link: "https://sample-applicant.dev",
-      linkedin_link: "https://linkedin.com/in/sample-applicant",
-      internship_preferences: {
-        internship_type: "credited",
-        expected_start_date: 1751328000000,
-        expected_duration_hours: 400,
-      },
-      expected_graduation_date: 1767225600000,
-    },
-  };
-
-  let userApplication = applications?.employer_applications.find(
-    (a) => userId === a.user_id,
+  const userApplication = applications?.employer_applications.find(
+    (a) => applicationId === a.id,
   );
-  let otherApplications = applications?.employer_applications.filter(
-    (a) => userId === a.user_id,
+  const otherApplications = applications?.employer_applications.filter(
+    (a) => a.user_id === userApplication?.user_id,
   );
-
-  if (jobId) {
-    userApplication = applications?.employer_applications.find(
-      (a) => userId === a.user_id && a.job_id === jobId,
-    );
-    otherApplications = applications?.employer_applications.filter(
-      (a) => userId === a.user_id && a.id !== userApplication?.id,
-    );
-  }
-
-  if (isDummyProfile) {
-    userApplication = dummyApplication;
-    otherApplications = [];
-  }
+  const userId = userApplication?.user_id;
 
   useEffect(() => {
     const fetchUserData = async () => {
-      if (isDummyProfile) {
-        setLoading(false);
-        return;
-      }
       if (!userId) {
         setLoading(false);
         return;
@@ -97,12 +43,14 @@ function ApplicantPageContent() {
         setLoading(false);
       }
     };
-    fetchUserData();
-  }, [isDummyProfile, userId]);
+    void fetchUserData();
+  }, [userId]);
 
   if (!app_statuses) return null;
 
-  const unique_app_statuses = app_statuses.reduce(
+  const unique_app_statuses = (
+    app_statuses as { id: number; name: string }[]
+  ).reduce(
     (acc: { id: number; name: string }[], cur: { id: number; name: string }) =>
       acc.find((a) => a.name === cur.name) ? acc : [...acc, cur],
     [],
@@ -135,10 +83,7 @@ function ApplicantPageContent() {
       <div className="w-full h-full">
         <ApplicantPage
           application={userApplication}
-          jobID={jobId || ""}
-          statuses={
-            isDummyProfile ? [] : getStatuses(userApplication?.id || "")
-          }
+          statuses={getStatuses(userApplication?.id || "")}
           userApplications={otherApplications}
           onArchive={() => {
             if (!userApplication) return;