[offers][feat] Add token check in submission results page

apps/portal/src/pages/offers/profile/[offerProfileId].tsx

@@ -6,6 +6,7 @@ import { Spinner, useToast } from '@tih/ui';
 
 import { useGoogleAnalytics } from '~/components/global/GoogleAnalytics';
 import { ProfileDetailTab } from '~/components/offers/constants';
+import { HOME_URL } from '~/components/offers/constants';
 import ProfileComments from '~/components/offers/profile/ProfileComments';
 import ProfileDetails from '~/components/offers/profile/ProfileDetails';
 import ProfileHeader from '~/components/offers/profile/ProfileHeader';
@@ -13,7 +14,6 @@ import type {
   BackgroundDisplayData,
   OfferDisplayData,
 } from '~/components/offers/types';
-import { HOME_URL } from '~/components/offers/types';
 import type { JobTitleType } from '~/components/shared/JobTitles';
 import { getLabelForJobTitleType } from '~/components/shared/JobTitles';
 

apps/portal/src/pages/offers/submit/result/[offerProfileId].tsx

@@ -1,3 +1,4 @@
+import Error from 'next/error';
 import { useRouter } from 'next/router';
 import { useEffect, useRef, useState } from 'react';
 import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/20/solid';
@@ -21,12 +22,21 @@ export default function OffersSubmissionResult() {
   token = token as string;
   const [step, setStep] = useState(0);
   const [analysis, setAnalysis] = useState<ProfileAnalysis | null>(null);
+  const [isValidToken, setIsValidToken] = useState(false);
 
   const pageRef = useRef<HTMLDivElement>(null);
   const scrollToTop = () =>
     pageRef.current?.scrollTo({ behavior: 'smooth', top: 0 });
 
-  // TODO: Check if the token is valid before showing this page
+  const checkToken = trpc.useQuery(
+    ['offers.profile.isValidToken', { profileId: offerProfileId, token }],
+    {
+      onSuccess(data) {
+        setIsValidToken(data);
+      },
+    },
+  );
+
   const getAnalysis = trpc.useQuery(
     ['offers.analysis.get', { profileId: offerProfileId }],
     {
@@ -69,7 +79,7 @@ export default function OffersSubmissionResult() {
 
   return (
     <>
-      {getAnalysis.isLoading && (
+      {(checkToken.isLoading || getAnalysis.isLoading) && (
         <div className="flex h-screen w-screen">
           <div className="m-auto mx-auto w-screen justify-center font-medium text-slate-500">
             <Spinner display="block" size="lg" />
@@ -77,7 +87,13 @@ export default function OffersSubmissionResult() {
           </div>
         </div>
       )}
-      {!getAnalysis.isLoading && (
+      {checkToken.isSuccess && !isValidToken && (
+        <Error
+          statusCode={403}
+          title="You do not have permissions to access this page"
+        />
+      )}
+      {getAnalysis.isSuccess && (
         <div ref={pageRef} className="w-full">
           <div className="flex justify-center">
             <div className="block w-full max-w-screen-md overflow-hidden rounded-lg sm:shadow-lg md:my-10">