feat: show more infos for questionnaires in admin

Author: stampaaaron

apps/backend/src/research/questionnaires/questionnaires.service.ts

@@ -51,17 +51,19 @@ export class QuestionnairesService {
       throw e;
     }
 
-    return (await questionnaire.populate(["entries", "entries.carer", "entries.entryLanguages.language", "participant"])).toObject();
+    return (await questionnaire.populate(["entries", "entries.carer", "entries.entryLanguages.language", "participant", "study"])).toObject();
   }
 
   async findAll() {
-    return (await this.questionnaireRepository.findAll()).map((questionnaire) => questionnaire.toObject());
+    return (await this.questionnaireRepository.findAll({ populate: ["study", "participant"] })).map((questionnaire) =>
+      questionnaire.toObject()
+    );
   }
 
   async findOne(id: number) {
     return (
       await this.questionnaireRepository.findOneOrFail(id, {
-        populate: ["entries", "entries.carer", "entries.entryLanguages.language", "participant"],
+        populate: ["entries", "entries.carer", "entries.entryLanguages.language", "participant", "study"],
       })
     ).toObject();
   }
@@ -76,7 +78,7 @@ export class QuestionnairesService {
 
   async update(id: number, questionnaireMutationDto: QuestionnaireMutationDto) {
     const questionnaire = await this.questionnaireRepository.findOneOrFail(id, {
-      populate: ["entries", "entries.carer", "entries.entryLanguages.language", "participant"],
+      populate: ["entries", "entries.carer", "entries.entryLanguages.language", "participant", "study"],
     });
     questionnaire.assign(questionnaireMutationDto);
 

apps/frontend/src/api.gen.ts

@@ -296,23 +296,6 @@ export interface paths {
         patch: operations["QuestionnairesController_update"];
         trace?: never;
     };
-    "/questionnaires/{id}/complete": {
-        parameters: {
-            query?: never;
-            header?: never;
-            path?: never;
-            cookie?: never;
-        };
-        get?: never;
-        put?: never;
-        post?: never;
-        delete?: never;
-        options?: never;
-        head?: never;
-        /** Completes the questionnaire by ID */
-        patch: operations["QuestionnairesController_complete"];
-        trace?: never;
-    };
     "/entry-languages": {
         parameters: {
             query?: never;
@@ -2003,27 +1986,6 @@ export interface operations {
             };
         };
     };
-    QuestionnairesController_complete: {
-        parameters: {
-            query?: never;
-            header?: never;
-            path: {
-                id: string;
-            };
-            cookie?: never;
-        };
-        requestBody?: never;
-        responses: {
-            200: {
-                headers: {
-                    [name: string]: unknown;
-                };
-                content: {
-                    "application/json": Record<string, never>;
-                };
-            };
-        };
-    };
     EntryLanguagesController_index: {
         parameters: {
             query?: never;

apps/frontend/src/routes/_auth/administration/questionnaires/edit.$id.tsx

@@ -1,10 +1,10 @@
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { $api } from "../../../../stores/api";
 import { useQueryClient, useSuspenseQuery } from "@tanstack/react-query";
-import { Button, DateInput, Divider, Group, Stack, Textarea, TextInput, useForm } from "@quassel/ui";
+import { Button, DateInput, Divider, Group, Stack, Table, Textarea, TextInput, useForm } from "@quassel/ui";
 import { useEffect } from "react";
 import { QuestionnaireEntries } from "../../../../components/questionnaire/QuestionnaireEntries";
-import { i18n } from "../../../../stores/i18n";
+import { format, i18n } from "../../../../stores/i18n";
 import { useStore } from "@nanostores/react";
 
 type FormValues = {
@@ -19,6 +19,8 @@ const messages = i18n("questionnairesEdit", {
   labelTitle: "Title",
   labelEndedAt: "End date",
   labelStartedAt: "Start date",
+  labelParticipant: "Participant",
+  labelStudy: "Study",
 });
 
 function AdministrationQuestionnairesEdit() {
@@ -27,6 +29,7 @@ function AdministrationQuestionnairesEdit() {
   const q = useQueryClient();
 
   const t = useStore(messages);
+  const { time } = useStore(format);
 
   const { data, isSuccess } = useSuspenseQuery(
     $api.queryOptions("get", "/questionnaires/{id}", {
@@ -60,6 +63,21 @@ function AdministrationQuestionnairesEdit() {
 
   return (
     <Stack gap="xl">
+      <Table>
+        <Table.Tbody>
+          <Table.Tr>
+            <Table.Th>{t.labelParticipant}</Table.Th>
+            <Table.Td>{data.participant.id}</Table.Td>
+            <Table.Td>{data.participant.birthday && time(new Date(data.participant.birthday))}</Table.Td>
+          </Table.Tr>
+          <Table.Tr>
+            <Table.Th>{t.labelStudy}</Table.Th>
+            <Table.Td>{data?.study.id}</Table.Td>
+            <Table.Td>{data?.study.title}</Table.Td>
+          </Table.Tr>
+        </Table.Tbody>
+      </Table>
+
       <form autoComplete="off" onSubmit={f.onSubmit(handleSubmit)}>
         <Stack>
           <TextInput {...f.getInputProps("title")} label={t.labelTitle} />

apps/frontend/src/routes/_auth/administration/questionnaires/index.tsx

@@ -1,6 +1,6 @@
 import { createFileRoute, Link } from "@tanstack/react-router";
 import { $api } from "../../../../stores/api";
-import { Button, Table } from "@quassel/ui";
+import { Button, Group, Table } from "@quassel/ui";
 import { $session } from "../../../../stores/session";
 import { useStore } from "@nanostores/react";
 
@@ -16,29 +16,36 @@ function AdministrationQuestionnairesIndex() {
       <Table.Thead>
         <Table.Tr>
           <Table.Th>Id</Table.Th>
-          <Table.Th>Name</Table.Th>
+          <Table.Th>Child</Table.Th>
+          <Table.Th>Title</Table.Th>
+          <Table.Th>Study</Table.Th>
         </Table.Tr>
       </Table.Thead>
       <Table.Tbody>
         {data?.map((q) => (
           <Table.Tr key={q.id}>
             <Table.Td>{q.id}</Table.Td>
+            <Table.Td>{q.participant.id}</Table.Td>
+            <Table.Td>{q.title}</Table.Td>
+            <Table.Td>{q.study.title}</Table.Td>
             <Table.Td>
-              <Button variant="default" renderRoot={(props) => <Link to={`/administration/questionnaires/edit/${q.id}`} {...props} />}>
-                Edit
-              </Button>
-              {sessionStore.role === "ADMIN" && (
-                <Button
-                  variant="default"
-                  onClick={() =>
-                    deleteQuestionnaireMutation.mutate({
-                      params: { path: { id: q.id.toString() } },
-                    })
-                  }
-                >
-                  Delete
+              <Group>
+                <Button variant="default" renderRoot={(props) => <Link to={`/administration/questionnaires/edit/${q.id}`} {...props} />}>
+                  Edit
                 </Button>
-              )}
+                {sessionStore.role === "ADMIN" && (
+                  <Button
+                    variant="default"
+                    onClick={() =>
+                      deleteQuestionnaireMutation.mutate({
+                        params: { path: { id: q.id.toString() } },
+                      })
+                    }
+                  >
+                    Delete
+                  </Button>
+                )}
+              </Group>
             </Table.Td>
           </Table.Tr>
         ))}