refactor: simplify application queries

apps/admin-ui/src/spa/applications/queries.tsx

@@ -8,6 +8,10 @@ export const APPLICATION_ADMIN_QUERY = gql`
     application(id: $id) {
       ...ApplicationAdmin
       workingMemo
+      user {
+        id
+        email
+      }
     }
   }
 `;

apps/ui/components/application/ApplicantInfoPreview.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { useTranslation } from "next-i18next";
-import { ApplicantTypeChoice, type ApplicationQuery } from "@gql/gql-types";
+import { type ApplicantFragment, ApplicantTypeChoice } from "@gql/gql-types";
 import {
   ApplicationInfoContainer,
   InfoItemContainer,
@@ -25,11 +25,13 @@ const LabelValue = ({
     </InfoItemContainer>
   );
 };
-type Node = NonNullable<ApplicationQuery["application"]>;
+
+type ApplicantT = Omit<ApplicantFragment, "homeCity" | "additionalInformation">;
+
 export function ApplicantInfoPreview({
   application,
 }: {
-  application: Node;
+  application: ApplicantT;
 }): JSX.Element {
   const { t } = useTranslation();
   const applicant = {

apps/ui/components/application/ApplicationEventList.tsx

@@ -3,11 +3,12 @@ import type { TFunction } from "i18next";
 import { useTranslation } from "next-i18next";
 import {
   type AgeGroupNode,
-  type ApplicationQuery,
   type Maybe,
   type SuitableTimeRangeNode,
   Priority,
   ApplicationSectionStatusChoice,
+  type ApplicationSectionUiFragment,
+  type ApplicationCommonFragment,
 } from "@gql/gql-types";
 import { getTranslation } from "common/src/common/util";
 import { convertWeekday } from "common/src/conversion";
@@ -103,15 +104,17 @@ const InfoListItem = ({ label, value }: { label: string; value: string }) => (
   </li>
 );
 
-const SingleApplicationSection = ({
+type ApplicationSectionT = ApplicationSectionUiFragment;
+
+function SingleApplicationSection({
   applicationEvent,
   primaryTimes,
   secondaryTimes,
 }: {
-  applicationEvent: NonNullable<Node["applicationSections"]>[0];
+  applicationEvent: ApplicationSectionT;
   primaryTimes: ApplicationEventScheduleFormType[];
   secondaryTimes: ApplicationEventScheduleFormType[];
-}) => {
+}) {
   const { t } = useTranslation();
   const reservationUnits = filterNonNullable(
     applicationEvent.reservationUnitOptions
@@ -208,15 +211,16 @@ const SingleApplicationSection = ({
       </ApplicationInfoContainer>
     </ApplicationSection>
   );
-};
+}
 
 // NOTE: used by Preview and View
 // No form context unlike the edit pages, use application query result
-type Node = NonNullable<ApplicationQuery["application"]>;
+type ApplicationT = Pick<ApplicationCommonFragment, "applicationSections">;
+
 export function ApplicationEventList({
   application,
 }: {
-  application: Node;
+  application: ApplicationT;
 }): JSX.Element {
   const sections = filterNonNullable(application.applicationSections).map(
     (applicationEvent) => {
@@ -241,6 +245,7 @@ export function ApplicationEventList({
       );
     }
   );
+
   return <>{sections}</>;
 }
 

apps/ui/components/application/ViewApplication.tsx

@@ -2,12 +2,11 @@ import React from "react";
 import { Checkbox } from "hds-react";
 import { useTranslation } from "next-i18next";
 import {
-  type ApplicationQuery,
+  type ApplicationCommonFragment,
   ApplicationStatusChoice,
   type Maybe,
   type TermsOfUseTextFieldsFragment,
 } from "@gql/gql-types";
-import { getTranslation } from "@/modules/util";
 import { ApplicantInfoPreview } from "./ApplicantInfoPreview";
 import {
   ApplicationSection,
@@ -18,20 +17,26 @@ import {
 import { ApplicationEventList } from "./ApplicationEventList";
 import Sanitize from "../common/Sanitize";
 import TermsBox from "common/src/termsbox/TermsBox";
+import {
+  convertLanguageCode,
+  getTranslationSafe,
+} from "common/src/common/util";
+
+type ViewApplicationProps = {
+  application: ApplicationCommonFragment;
+  tos: Maybe<TermsOfUseTextFieldsFragment>;
+  acceptTermsOfUse?: boolean;
+  setAcceptTermsOfUse?: (value: boolean) => void;
+};
 
-type Node = NonNullable<ApplicationQuery["application"]>;
 export function ViewApplication({
   application,
   tos,
   acceptTermsOfUse,
   setAcceptTermsOfUse,
-}: {
-  application: Node;
-  tos: Maybe<TermsOfUseTextFieldsFragment>;
-  acceptTermsOfUse?: boolean;
-  setAcceptTermsOfUse?: (value: boolean) => void;
-}): JSX.Element {
-  const { t } = useTranslation();
+}: ViewApplicationProps): JSX.Element {
+  const { t, i18n } = useTranslation();
+  const lang = convertLanguageCode(i18n.language);
 
   const tos2 = application.applicationRound?.termsOfUse;
   const shouldShowNotification =
@@ -56,15 +61,15 @@ export function ViewApplication({
         >
           <TermsBox
             id="preview.acceptTermsOfUse"
-            body={<Sanitize html={getTranslation(tos, "text")} />}
+            body={<Sanitize html={getTranslationSafe(tos, "text", lang)} />}
           />
         </Accordion>
       )}
       {tos2 && (
         <Accordion heading={t("application:preview.reservationUnitTerms")} open>
           <TermsBox
             id="preview.acceptServiceSpecificTerms"
-            body={<Sanitize html={getTranslation(tos2, "text")} />}
+            body={<Sanitize html={getTranslationSafe(tos2, "text", lang)} />}
             /* TODO TermsBox has accepted and checkbox we could use but for now leaving the single
              * page specific checkbox to accept all terms */
           />