[questions][fix] show question type in badge

apps/portal/src/components/questions/FullScreenSpinner.tsx

@@ -0,0 +1,9 @@
+import { Spinner } from '@tih/ui';
+
+export default function FullScreenSpinner() {
+  return (
+    <div className="flex h-full w-full items-center justify-center">
+      <Spinner size="lg" />
+    </div>
+  );
+}

apps/portal/src/components/questions/card/FullQuestionCard.tsx

@@ -19,6 +19,7 @@ export type FullQuestionCardProps = UpvoteProps & {
   receivedCount: number;
   role: string;
   timestamp: string;
+  type: string;
 };
 
 export default function FullQuestionCard({
@@ -29,6 +30,7 @@ export default function FullQuestionCard({
   timestamp,
   role,
   location,
+  type,
 }: FullQuestionCardProps) {
   const altText = company + ' logo';
   return (
@@ -41,7 +43,7 @@ export default function FullQuestionCard({
         </div>
         <div className="flex items-baseline justify-between">
           <div className="flex items-center gap-2 text-slate-500">
-            <Badge label="Technical" variant="primary" />
+            <Badge label={type} variant="primary" />
             <p className="text-xs">
               {timestamp} · {location} · {role}
             </p>
@@ -53,14 +55,4 @@ export default function FullQuestionCard({
       </div>
     </article>
   );
-
-  // Return href ? (
-  //   <a
-  //     className="ring-primary-500 rounded-md hover:bg-slate-50 focus:ring-2 focus-visible:outline-none active:bg-slate-100"
-  //     href={href}>
-  //     {mainCard}
-  //   </a>
-  // ) : (
-  //   mainCard
-  // );
 }

apps/portal/src/components/questions/card/QuestionCard.tsx

@@ -47,12 +47,14 @@ export type QuestionCardProps = ActionButtonProps &
     receivedCount: number;
     role: string;
     timestamp: string;
+    type: string;
   };
 
 export default function QuestionCard({
   answerCount,
   content,
   // ReceivedCount,
+  type,
   showVoteButtons,
   showUserStatistics,
   showActionButton,
@@ -69,7 +71,7 @@ export default function QuestionCard({
       <div className="flex flex-col gap-2">
         <div className="flex items-baseline justify-between">
           <div className="flex items-center gap-2 text-slate-500">
-            <Badge label="Technical" variant="primary" />
+            <Badge label={type} variant="primary" />
             <p className="text-xs">
               {timestamp} · {location} · {role}
             </p>

apps/portal/src/pages/questions/[questionId]/[questionSlug]/answer/[answerId]/[answerSlug]/index.tsx

@@ -5,6 +5,7 @@ import { Button, Select, TextArea } from '@tih/ui';
 
 import FullAnswerCard from '~/components/questions/card/FullAnswerCard';
 import CommentListItem from '~/components/questions/CommentListItem';
+import FullScreenSpinner from '~/components/questions/FullScreenSpinner';
 
 import {
   SAMPLE_ANSWER,
@@ -67,8 +68,7 @@ export default function QuestionPage() {
   };
 
   if (!answer) {
-    // TODO: Make this look nicer
-    return <div>Answer not found</div>;
+    return <FullScreenSpinner />;
   }
 
   return (

apps/portal/src/pages/questions/[questionId]/[questionSlug]/index.tsx

@@ -1,11 +1,12 @@
 import { useRouter } from 'next/router';
 import { useForm } from 'react-hook-form';
 import { ArrowSmallLeftIcon } from '@heroicons/react/24/outline';
-import { Button, Collapsible, Select, Spinner, TextArea } from '@tih/ui';
+import { Button, Collapsible, Select, TextArea } from '@tih/ui';
 
 import AnswerCard from '~/components/questions/card/AnswerCard';
 import FullQuestionCard from '~/components/questions/card/FullQuestionCard';
 import CommentListItem from '~/components/questions/CommentListItem';
+import FullScreenSpinner from '~/components/questions/FullScreenSpinner';
 
 import {
   SAMPLE_ANSWER,
@@ -96,11 +97,7 @@ export default function QuestionPage() {
   };
 
   if (!question) {
-    return (
-      <div className="flex h-full w-full items-center justify-center">
-        <Spinner size="lg" />
-      </div>
-    );
+    return <FullScreenSpinner />;
   }
 
   return (

apps/portal/src/pages/questions/index.tsx

@@ -248,6 +248,7 @@ export default function QuestionsHomePage() {
                   receivedCount={0} // TODO: Implement received count
                   role={question.role}
                   timestamp={question.seenAt.toLocaleDateString()}
+                  type={question.type}
                   upvoteCount={question.numVotes}
                 />
               ))}

apps/portal/src/server/router/questions-question-router.ts

@@ -88,6 +88,7 @@ export const questionsQuestionRouter = createProtectedRouter()
             numVotes: votes,
             role: data.encounters[0].role ?? 'Unknown role',
             seenAt: data.encounters[0].seenAt,
+            type: data.questionType,
             updatedAt: data.updatedAt,
             user: data.user?.name ?? '',
           };
@@ -160,6 +161,7 @@ export const questionsQuestionRouter = createProtectedRouter()
         numVotes: votes,
         role: questionData.encounters[0].role ?? 'Unknown role',
         seenAt: questionData.encounters[0].seenAt,
+        type: questionData.questionType,
         updatedAt: questionData.updatedAt,
         user: questionData.user?.name ?? '',
       };

apps/portal/src/types/questions.d.ts

@@ -9,6 +9,7 @@ export type Question = {
   numVotes: number;
   role: string;
   seenAt: Date;
+  type: stringl;
   updatedAt: Date;
   user: string;
 };