Merge pull request #917 from City-of-Helsinki/fix-admin-add-resources

fix: can't add new resources

Author: vergama

apps/admin-ui/src/component/Resources/resource-editor/NewResourceModal.tsx

@@ -174,10 +174,10 @@ const NewResourceModal = ({
               <ParentSelector
                 label={t("ResourceModal.selectSpace")}
                 onChange={(parent) => setValue("spacePk", parent)}
-                unitPk={unit.pk as number}
-                parentPk={null}
+                unitPk={unit.pk ?? 0}
+                value={state.resource.spacePk ?? null}
                 placeholder={t("ResourceModal.selectSpace")}
-                disableNull
+                noParentless
                 errorText={getValidationError("spacePk")}
               />
 

apps/admin-ui/src/component/Resources/resource-editor/ResourceEditor.tsx

@@ -218,8 +218,8 @@ const ResourceEditor = ({ resourcePk, unitPk }: Props) => {
               label={t("ResourceModal.selectSpace")}
               onChange={(parent) => setValue("spacePk", parent)}
               unitPk={unitPk}
-              parentPk={state.resourceEdit.spacePk as number}
-              disableNull
+              value={state.resourceEdit.spacePk ?? null}
+              noParentless
             />
             {languages.map((lang) => {
               const fieldName = `name${upperFirst(lang)}`;

apps/admin-ui/src/component/Spaces/space-editor/ParentSelector.tsx

@@ -1,98 +1,58 @@
-import React, { useState } from "react";
+import React from "react";
 import { useQuery } from "@apollo/client";
 import { Select } from "hds-react";
 import i18next from "i18next";
-import {
-  Maybe,
-  Query,
-  QueryUnitByPkArgs,
-  SpaceType,
-} from "common/types/gql-types";
+import type { Query, QueryUnitByPkArgs } from "common/types/gql-types";
+import { filterNonNullable } from "common/src/helpers";
 import { SPACE_HIERARCHY_QUERY } from "./queries";
 import { spacesAsHierarchy } from "./util";
 
 type Props = {
   unitPk: number;
-  spacePk?: number | null;
-  parentPk: number | null;
+  value: number | null;
   label: string;
   placeholder?: string;
   helperText?: string;
-  disableNull?: boolean;
+  noParentless?: boolean;
   errorText?: string;
+  // TODO why is the label sent upstream?
   onChange: (val: number | null, name?: string) => void;
 };
 
 type ParentType = { label: string; value: number | null };
 
-const getChildrenFor = (spacePk: number, hierarchy: SpaceType[]) => {
-  return hierarchy.filter((s) => s.parent?.pk === spacePk);
-};
-
-const getChildrenRecursive = (spacePk: number, hierarchy: SpaceType[]) => {
-  const newChildren = getChildrenFor(spacePk, hierarchy);
-  return newChildren.concat(
-    newChildren.flatMap((s) => getChildrenFor(s.pk as number, hierarchy))
-  );
-};
-
-const independentSpaceOption = {
+const parentLessOption = {
+  // TODO don't use floating i18n.t (use the hook)
   label: i18next.t("SpaceEditor.noParent"),
   value: null,
 };
 
-const getParent = (v: Maybe<number> | undefined, options: ParentType[]) =>
-  options.find((po) => po.value === v) || options[0];
-
 const ParentSelector = ({
   unitPk,
-  spacePk,
   onChange,
-  parentPk,
+  value,
   label,
   placeholder,
-  disableNull = false,
+  noParentless = false,
   helperText,
   errorText,
 }: Props): JSX.Element | null => {
-  const [parentOptions, setParentOptions] = useState([] as ParentType[]);
-
-  useQuery<Query, QueryUnitByPkArgs>(SPACE_HIERARCHY_QUERY, {
+  const { data } = useQuery<Query, QueryUnitByPkArgs>(SPACE_HIERARCHY_QUERY, {
     variables: { pk: unitPk },
-    onCompleted: ({ unitByPk }) => {
-      const parentSpaces = unitByPk?.spaces?.map((s) => s as SpaceType);
-      if (parentSpaces) {
-        const unitSpaces = spacesAsHierarchy(parentSpaces, "\u2007");
-
-        const children = spacePk
-          ? getChildrenRecursive(spacePk, unitSpaces).map((s) => s.pk)
-          : [];
-
-        const additionalOptions = unitSpaces
-          .filter((space) => space.pk !== spacePk)
-          .filter((space) => children.includes(space.pk))
-          .map((space) => ({
-            label: space.nameFi ?? "-",
-            value: space.pk ?? null,
-          }));
+    skip: !unitPk,
+  });
 
-        const options = [] as {
-          label: string;
-          value: number | null;
-        }[];
+  const parentSpaces = filterNonNullable(data?.unitByPk?.spaces);
+  const unitSpaces = spacesAsHierarchy(parentSpaces, "\u2007");
 
-        if (!disableNull) {
-          options.push(independentSpaceOption);
-        }
+  // NOTE there used to be children filtering, but it filtered out all possible options
 
-        setParentOptions(options.concat(additionalOptions));
-      }
-    },
-  });
+  const opts = unitSpaces.map((space) => ({
+    label: space.nameFi ?? "-",
+    value: space.pk ?? null,
+  }));
 
-  if (parentOptions.length === 0) {
-    return null;
-  }
+  const options = noParentless ? opts : [...opts, parentLessOption];
 
   return (
     <Select
@@ -101,12 +61,9 @@ const ParentSelector = ({
       placeholder={placeholder}
       required
       helper={helperText}
-      options={parentOptions}
-      value={
-        parentPk || !disableNull
-          ? getParent(parentPk, parentOptions)
-          : undefined
-      }
+      options={options}
+      disabled={options.length === 0}
+      value={options.find((po) => po.value === value) ?? null}
       onChange={(selected: ParentType) =>
         onChange(selected.value, selected.label)
       }

apps/admin-ui/src/component/Spaces/space-editor/SpaceEditor.tsx

@@ -349,8 +349,7 @@ const SpaceEditor = ({ space, unit }: Props): JSX.Element | null => {
                 helperText={t("SpaceModal.page1.parentHelperText")}
                 label={t("SpaceModal.page1.parentLabel")}
                 onChange={(parentPk) => setValue({ parentPk })}
-                parentPk={state.spaceEdit?.parentPk as number}
-                spacePk={space}
+                value={state.spaceEdit?.parentPk ?? null}
                 placeholder={t("SpaceModal.page1.parentPlaceholder")}
                 unitPk={unit}
               />

apps/admin-ui/src/component/Spaces/space-editor/new-space-modal/Page1.tsx

@@ -96,9 +96,8 @@ const Page1 = ({
             <br />
             <ParentSelector
               label={t("SpaceModal.page1.parentLabel")}
-              unitPk={unit.pk as number}
-              spacePk={null}
-              parentPk={editorState.parentPk || null}
+              unitPk={unit.pk ?? 0}
+              value={editorState.parentPk}
               onChange={(parentPk, parentName) =>
                 dispatch({
                   type: "setParent",