fix: typing

Author: vincit-matu

apps/admin-ui/gql/gql-types.ts

@@ -1,7 +1,7 @@
 import styled from "styled-components";
-import {Checkbox} from "hds-react";
-import {useSearchParams} from "react-router-dom";
-import {useTranslation} from "react-i18next";
+import { Checkbox } from "hds-react";
+import { useSearchParams } from "react-router-dom";
+import { useTranslation } from "react-i18next";
 import React from "react";
 
 // "&& > *" needed to position the checkbox and label correctly in the grid block

apps/admin-ui/src/component/QueryParamFilters/CheckboxFilter.tsx

@@ -2,33 +2,33 @@ import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import get from "lodash/get";
 import type {
-  RecurringReservationCreateMutationInput,
-  ReservationStaffCreateMutationInput,
   Maybe,
+  RecurringReservationCreateMutationInput,
   ReservationMetadataFieldNode,
   ReservationsInIntervalFragment,
+  ReservationStaffCreateMutationInput,
 } from "@gql/gql-types";
 import {
-  ReservationTypeChoice,
   ReservationStartInterval,
-  useCreateStaffReservationMutation,
+  ReservationTypeChoice,
   useCreateRecurringReservationMutation,
+  useCreateStaffReservationMutation,
   useRecurringReservationUnitQuery,
   useReservationTimesInReservationUnitQuery,
 } from "@gql/gql-types";
 import type { UseFormReturn } from "react-hook-form";
 import type { RecurringReservationForm } from "app/schemas";
 import {
+  fromUIDateUnsafe,
   toApiDate,
   toApiDateUnsafe,
-  fromUIDateUnsafe,
 } from "common/src/common/util";
 import { addDays } from "date-fns";
 import {
   CollisionInterval,
+  dateTime,
   doesIntervalCollide,
   reservationToInterval,
-  dateTime,
 } from "@/helpers";
 import { generateReservations } from "./generateReservations";
 import { useNotification } from "@/context/NotificationContext";

apps/admin-ui/src/component/my-units/MyUnitRecurringReservation/hooks.ts

@@ -284,17 +284,20 @@ const DialogContent = ({
 
       const flatMetaValues = flattenMetadata(values, fields);
 
+      if (values.type == null) {
+        throw new Error("Invalid reservation type");
+      }
       const bufferBefore =
-        values.type !== "BLOCKED" && values.bufferTimeBefore
+        values.type !== ReservationTypeChoice.Blocked && values.bufferTimeBefore
           ? reservationUnit.bufferTimeBefore ?? 0
           : 0;
       const bufferAfter =
-        values.type !== "BLOCKED" && values.bufferTimeAfter
+        values.type !== ReservationTypeChoice.Blocked && values.bufferTimeAfter
           ? reservationUnit.bufferTimeAfter ?? 0
           : 0;
       const input: ReservationStaffCreateMutationInput = {
         reservationUnitPks: [reservationUnit.pk],
-        type: values.type ?? "",
+        type: values.type,
         begin: dateTime(values.date, values.startTime),
         end: dateTime(values.date, values.endTime),
         bufferTimeBefore: bufferBefore.toString(),

apps/admin-ui/src/component/my-units/create-reservation/CreateReservationModal.tsx

@@ -1,6 +1,6 @@
 import { type CalendarEvent } from "common/src/calendar/Calendar";
 import {
-  State,
+  ReservationStateChoice,
   ReservationTypeChoice,
   type ReservationUnitReservationsFragment,
 } from "@gql/gql-types";
@@ -77,8 +77,9 @@ const eventStyleGetter =
       (ru) => ru?.pk === currentReservationUnitPk
     );
 
-    const isConfirmed = event?.state === State.Confirmed;
-    const isWaitingForPayment = event?.state === State.WaitingForPayment;
+    const isConfirmed = event?.state === ReservationStateChoice.Confirmed;
+    const isWaitingForPayment =
+      event?.state === ReservationStateChoice.WaitingForPayment;
 
     const isClosed = event?.type === ReservationTypeChoice.Blocked;
     const isStaff = event?.type === ReservationTypeChoice.Staff;

apps/admin-ui/src/component/my-units/eventStyleGetter.ts

@@ -2,6 +2,7 @@ import React, { useState } from "react";
 import { type ApolloError } from "@apollo/client";
 import {
   ReservationUnitOrderingChoices,
+  ReservationUnitState,
   useSearchReservationUnitsQuery,
 } from "@gql/gql-types";
 import { filterNonNullable, toNumber } from "common/src/helpers";
@@ -94,6 +95,29 @@ export function ReservationUnitsDataReader(): JSX.Element {
     searchParams.get("surfaceAreaGte")
   )?.toString();
 
+  function convertToReservationUnitState(
+    state: string
+  ): ReservationUnitState | null {
+    switch (state) {
+      case ReservationUnitState.Archived:
+        return ReservationUnitState.Archived;
+      case ReservationUnitState.Draft:
+        return ReservationUnitState.Draft;
+      case ReservationUnitState.Hidden:
+        return ReservationUnitState.Hidden;
+      case ReservationUnitState.Published:
+        return ReservationUnitState.Published;
+      case ReservationUnitState.ScheduledHiding:
+        return ReservationUnitState.ScheduledHiding;
+      case ReservationUnitState.ScheduledPeriod:
+        return ReservationUnitState.ScheduledPeriod;
+      case ReservationUnitState.ScheduledPublishing:
+        return ReservationUnitState.ScheduledPublishing;
+      default:
+        return null;
+    }
+  }
+
   const query = useSearchReservationUnitsQuery({
     variables: {
       orderBy,
@@ -104,7 +128,9 @@ export function ReservationUnitsDataReader(): JSX.Element {
       surfaceAreaGte,
       nameFi: searchFilter,
       unit,
-      state: reservationUnitStates,
+      state: reservationUnitStates.map((state) =>
+        convertToReservationUnitState(state)
+      ),
       reservationUnitType: reservationUnitTypes,
     },
     onError: (err: ApolloError) => {

apps/admin-ui/src/component/reservation-units/ReservationUnitsDataLoader.tsx

@@ -12,7 +12,7 @@ export const SEARCH_RESERVATION_UNITS_QUERY = gql`
     $unit: [Int]
     $reservationUnitType: [Int]
     $orderBy: [ReservationUnitOrderingChoices]
-    $state: [String]
+    $state: [ReservationUnitState]
   ) {
     reservationUnits(
       first: $first

apps/admin-ui/src/component/reservation-units/queries.tsx

@@ -160,7 +160,7 @@ function EditReservation({
       reservationUnitPks: [reservationUnit.pk],
       seriesName: values.seriesName !== "" ? values.seriesName : undefined,
       workingMemo: values.comments,
-      type: values.type ?? "",
+      type: values.type,
       ...flattenedMetadataSetValues,
     };
 

apps/admin-ui/src/component/reservations/EditPage.tsx

@@ -20,7 +20,7 @@ import { SearchTags } from "../SearchTags";
 import {
   OrderStatusWithFree,
   ReservationTypeChoice,
-  State,
+  ReservationStateChoice,
 } from "@gql/gql-types";
 import { fromUIDate, isValidDate } from "common/src/common/util";
 
@@ -47,8 +47,8 @@ export function Filters({
 
   const { options: reservationUnitTypeOptions } = useReservationUnitTypes();
 
-  const stateOptions = Object.values(State)
-    .filter((s) => s !== State.Created)
+  const stateOptions = Object.values(ReservationStateChoice)
+    .filter((s) => s !== ReservationStateChoice.Created)
     .map((s) => ({
       value: s,
       label: t(`RequestedReservation.state.${s}`),

apps/admin-ui/src/component/reservations/Filters.tsx

@@ -7,10 +7,14 @@ import BreadcrumbWrapper from "../BreadcrumbWrapper";
 import { HR } from "@/component/Table";
 import { Container } from "@/styles/layout";
 import { useSearchParams } from "react-router-dom";
-import { State } from "@gql/gql-types";
+import { ReservationStateChoice } from "@gql/gql-types";
 import { toUIDate } from "common/src/common/util";
 
-const defaultStates = [State.Denied, State.Confirmed, State.RequiresHandling];
+const defaultStates = [
+  ReservationStateChoice.Denied,
+  ReservationStateChoice.Confirmed,
+  ReservationStateChoice.RequiresHandling,
+];
 
 function Reservations(): JSX.Element {
   const { t } = useTranslation();