@truedat/dd 8.12.1 → 8.12.4

package/src/components/StructureGrantCartCheckout.js

@@ -1,12 +1,11 @@
 import _ from "lodash/fp";
 import PropTypes from "prop-types";
-import { useEffect, useMemo, Suspense } from "react";
+import { useEffect, useMemo, Suspense, lazy } from "react";
 import { Header, Segment, Grid, Button, GridColumn } from "semantic-ui-react";
 import { bindActionCreators } from "redux";
 import { connect, useDispatch } from "react-redux";
 import { HistoryBackButton } from "@truedat/core/components";
 import { useIntl, FormattedMessage } from "react-intl";
-import { lazy } from "react";
 import { useWebContext } from "@truedat/core/webContext";
 import { useTemplateRelations } from "@truedat/df/hooks/useTemplateRelations";
 import {
@@ -21,9 +20,8 @@ import { useTemplatesByIds } from "../hooks/useTemplatesByIds";
 import StructureGrantCart from "./StructureGrantCart";
 import StructureGrantCartInformation from "./StructureGrantCartInformation";
 import StructureGrantCartUserSelector from "./StructureGrantCartUserSelector";
-
-const SelectableDynamicForm = lazy(
-  () => import("@truedat/df/components/SelectableDynamicForm"),
+const GrantRequestTemplateForm = lazy(
+  () => import("./GrantRequestTemplateForm"),
 );
 
 const getUniqueDomainIds = (structures) =>
@@ -32,7 +30,7 @@ const getUniqueDomainIds = (structures) =>
 const getUniqueSystemName = (structures) =>
   _.flow(_.map("system.name"), _.flatten, _.compact, _.uniq)(structures ?? []);
 
-const getGroupedStructuresByDomainAndTemplate = (
+export const getGroupedStructuresByDomainAndTemplate = (
   structures,
   templateResourceRelations,
   defaultTemplateId,
@@ -115,11 +113,14 @@ export const StructureGrantCartCheckout = ({
 }) => {
   const dispatch = useDispatch();
   const { trigger, isMutating } = useCheckoutGrantRequest();
-  const { resource: templateResourceRelations, default: defaultRelation } =
-    useTemplateRelations({
-      resourceType: "system",
-      listAll: true,
-    });
+  const {
+    resource: templateResourceRelations,
+    default: defaultRelation,
+    loading: relationsLoading,
+  } = useTemplateRelations({
+    resourceType: "system",
+    listAll: true,
+  });
   const defaultTemplateId =
     defaultRelation?.template_id != null
       ? Number(defaultRelation.template_id) || defaultRelation.template_id
@@ -157,8 +158,12 @@ export const StructureGrantCartCheckout = ({
       enableGrouping,
     ],
   );
-  const groupKeys = _.keys(groupedStructures);
+  const groupKeys = useMemo(
+    () => _.keys(groupedStructures),
+    [groupedStructures],
+  );
   const isMultiGroup = enableGrouping && groupKeys.length > 1;
+  const useGroupDrafts = enableGrouping && groupKeys.length > 0;
 
   const getTemplateIdFromKey = (key) => {
     const parts = key.split("_");
@@ -180,7 +185,7 @@ export const StructureGrantCartCheckout = ({
 
   const effectiveTemplateIdByKey = useMemo(
     () => _.fromPairs(groupKeys.map((k) => [k, getTemplateIdFromKey(k)])),
-    [groupKeys.join(","), defaultTemplateId],
+    [groupKeys],
   );
 
   const uniqueTemplateIds = useMemo(
@@ -196,16 +201,25 @@ export const StructureGrantCartCheckout = ({
       ? getTemplateIdFromKey(singleGroupKey)
       : null;
 
-  const templateIdsToFetch = isMultiGroup
-    ? uniqueTemplateIds
-    : singleTemplateId != null
-      ? [singleTemplateId]
-      : [];
+  const templateIdsToFetch = useMemo(
+    () =>
+      _.uniq(
+        _.compact([
+          ...(isMultiGroup
+            ? uniqueTemplateIds
+            : singleTemplateId != null
+              ? [singleTemplateId]
+              : []),
+          defaultTemplateId,
+        ]),
+      ),
+    [isMultiGroup, uniqueTemplateIds, singleTemplateId, defaultTemplateId],
+  );
 
   const templatesById = useTemplatesByIds(templateIdsToFetch);
 
   const systemTemplates = useMemo(() => {
-    if (!isMultiGroup) return {};
+    if (!useGroupDrafts) return {};
     const next = {};
     groupKeys.forEach((k) => {
       const tid = effectiveTemplateIdByKey[k];
@@ -215,12 +229,7 @@ export const StructureGrantCartCheckout = ({
       if (t) next[k] = t;
     });
     return next;
-  }, [
-    isMultiGroup,
-    groupKeys.join(","),
-    effectiveTemplateIdByKey,
-    templatesById,
-  ]);
+  }, [useGroupDrafts, groupKeys, effectiveTemplateIdByKey, templatesById]);
 
   const singleSystemTemplate = useMemo(
     () =>
@@ -232,12 +241,30 @@ export const StructureGrantCartCheckout = ({
     [singleTemplateId, templatesById],
   );
 
+  const defaultTemplate = useMemo(
+    () =>
+      defaultTemplateId != null
+        ? (templatesById[String(defaultTemplateId)] ??
+          templatesById[defaultTemplateId] ??
+          null)
+        : null,
+    [defaultTemplateId, templatesById],
+  );
+
   useEffect(() => {
-    if (!isMultiGroup) return;
-    if (_.isEmpty(uniqueTemplateIds)) {
-      initGroupTemplates(
-        _.fromPairs(
-          groupKeys.map((k) => [
+    if (!useGroupDrafts || relationsLoading) return;
+    if (singleGroupKey && !groupTemplates[singleGroupKey] && template) {
+      initGroupTemplates({
+        ...groupTemplates,
+        [singleGroupKey]: { template, templateContent, valid: validCart },
+      });
+      return;
+    }
+    if (_.isEmpty(templateIdsToFetch)) {
+      const missingGroupTemplates = _.fromPairs(
+        groupKeys
+          .filter((k) => groupTemplates[k] == null)
+          .map((k) => [
             k,
             {
               template: undefined,
@@ -245,54 +272,76 @@ export const StructureGrantCartCheckout = ({
               valid: false,
             },
           ]),
-        ),
       );
+      if (!_.isEmpty(missingGroupTemplates)) {
+        initGroupTemplates({ ...groupTemplates, ...missingGroupTemplates });
+      }
       return;
     }
-    const allLoaded = uniqueTemplateIds.every(
+    const allLoaded = templateIdsToFetch.every(
       (id) =>
         templatesById[String(id)] !== undefined ||
         templatesById[id] !== undefined,
     );
     if (!allLoaded) return;
-    const getTemplateById = (tid) =>
-      tid != null ? (templatesById[String(tid)] ?? templatesById[tid]) : null;
     groupKeys.forEach((k) => {
-      const templateObj = getTemplateById(effectiveTemplateIdByKey[k]);
+      const tid = effectiveTemplateIdByKey[k];
+      const existingTemplateName = groupTemplates[k]?.template;
+      const templateObj =
+        tid != null
+          ? (templatesById[String(tid)] ?? templatesById[tid])
+          : existingTemplateName
+            ? null
+            : defaultTemplate;
       const t = templateObj?.name;
-      if (t) {
+      if (t && t !== existingTemplateName) {
         selectGrantRequestTemplateForGroup({ key: k, template: t });
       }
     });
   }, [
-    isMultiGroup,
-    groupKeys.join(","),
-    uniqueTemplateIds.join(","),
-    defaultTemplateId,
+    useGroupDrafts,
+    relationsLoading,
+    groupTemplates,
+    initGroupTemplates,
+    singleGroupKey,
+    template,
+    templateContent,
+    validCart,
+    groupKeys,
+    templateIdsToFetch,
+    defaultTemplate,
     templatesById,
     effectiveTemplateIdByKey,
     selectGrantRequestTemplateForGroup,
   ]);
 
   useEffect(() => {
-    if (isMultiGroup || singleTemplateId == null || !singleSystemTemplate?.name)
-      return;
-    selectGrantRequestTemplate(singleSystemTemplate.name);
+    if (useGroupDrafts || relationsLoading) return;
+    const templateName =
+      singleSystemTemplate?.name ?? (!template ? defaultTemplate?.name : null);
+    if (templateName && templateName !== template) {
+      selectGrantRequestTemplate(templateName);
+    }
   }, [
-    isMultiGroup,
-    singleTemplateId,
+    useGroupDrafts,
+    relationsLoading,
     singleSystemTemplate?.name,
+    defaultTemplate?.name,
+    template,
     selectGrantRequestTemplate,
   ]);
 
-  const validCartMulti =
-    isMultiGroup &&
+  const validCartGrouped =
+    useGroupDrafts &&
     user?.valid &&
     groupKeys.every(
       (k) => groupTemplates[k]?.template && groupTemplates[k]?.valid,
     );
 
-  const canSubmit = isMultiGroup ? validCartMulti : validCart && user?.valid;
+  const canSubmit =
+    !relationsLoading &&
+    templateIdsToFetch.every((id) => templatesById[id] != null) &&
+    (useGroupDrafts ? validCartGrouped : validCart && user?.valid);
 
   const grantRequestGroupIds = _.omitBy(_.isNil)({
     user_id: _.isNil(user_group_id) ? user?.id : null,
@@ -331,7 +380,7 @@ export const StructureGrantCartCheckout = ({
         return [key, domainNames];
       }),
     );
-  }, [groupKeys.join(","), structures, groupedStructures]);
+  }, [groupKeys, structures]);
 
   const checkout = () => {
     // eslint-disable-next-line fp/no-let
@@ -357,16 +406,19 @@ export const StructureGrantCartCheckout = ({
       // eslint-disable-next-line fp/no-mutation
       payload = { grant_request_groups };
     } else {
+      const singleDraft = useGroupDrafts
+        ? groupTemplates[singleGroupKey]
+        : { template, templateContent };
       const requests = _.map((structure) => ({
         data_structure_id: structure.id,
         filters: { rows: structure.filters },
-        metadata: templateContent,
+        metadata: singleDraft?.templateContent ?? {},
       }))(structures);
       // eslint-disable-next-line fp/no-mutation
       payload = {
         grant_request_group: _.omitBy(_.isNil)({
           requests,
-          type: template,
+          type: singleDraft?.template,
           modification_grant_id: modificationGrant?.id ?? null,
           ...grantRequestGroupIds,
         }),
@@ -412,7 +464,7 @@ export const StructureGrantCartCheckout = ({
             />
           </GridColumn>
         </Grid.Row>
-        {groupKeys.length > 1 ? (
+        {relationsLoading ? null : isMultiGroup ? (
           <>
             <Grid.Row>
               <Grid.Column width={16}>
@@ -428,7 +480,6 @@ export const StructureGrantCartCheckout = ({
               const groupDomainIds = getUniqueDomainIds(groupStructures);
               const groupData = groupTemplates[key] ?? {};
               const selectedTemplate = systemTemplates[key];
-              const autoTemplateName = selectedTemplate?.name;
               const domainName = domainNamesByKey[key];
               const systemNames = getUniqueSystemName(groupStructures);
 
@@ -491,14 +542,16 @@ export const StructureGrantCartCheckout = ({
                         </Header.Subheader>
                       </Header>
                       <Suspense fallback={null}>
-                        <SelectableDynamicForm
-                          scope="gr"
+                        <GrantRequestTemplateForm
                           content={groupData.templateContent ?? null}
                           domainIds={groupDomainIds}
                           hideLabel
                           isModification={!!modificationGrant}
-                          name={autoTemplateName}
-                          disableSelector={!!selectedTemplate}
+                          name={groupData.template}
+                          disableSelector={
+                            effectiveTemplateIdByKey[key] != null
+                          }
+                          selectedTemplate={selectedTemplate ?? defaultTemplate}
                           onChange={({ content, valid }) =>
                             updateGrantRequestTemplateContentForGroup({
                               key,
@@ -534,9 +587,19 @@ export const StructureGrantCartCheckout = ({
           <Grid.Row>
             <Grid.Column width={5}>
               <StructureGrantCartInformation
+                groupKey={useGroupDrafts ? singleGroupKey : undefined}
                 isModification={!!modificationGrant}
-                name={singleSystemTemplate?.name}
-                disableSelector={!!singleSystemTemplate}
+                name={
+                  useGroupDrafts
+                    ? groupTemplates[singleGroupKey]?.template
+                    : template
+                }
+                disableSelector={
+                  useGroupDrafts
+                    ? singleTemplateId != null
+                    : !!singleSystemTemplate
+                }
+                selectedTemplate={singleSystemTemplate ?? defaultTemplate}
               />
             </Grid.Column>
             <Grid.Column width={11}>

package/src/components/StructureGrantCartInformation.js

@@ -8,12 +8,13 @@ import { useIntl } from "react-intl";
 import { DOMAINS_QUERY } from "@truedat/core/api/queries";
 import {
   selectGrantRequestTemplate,
+  selectGrantRequestTemplateForGroup,
   updateGrantRequestTemplateContent,
+  updateGrantRequestTemplateContentForGroup,
 } from "../routines";
 import StructureGrantCartUserSelector from "./StructureGrantCartUserSelector";
-
-const SelectableDynamicForm = lazy(
-  () => import("@truedat/df/components/SelectableDynamicForm"),
+const GrantRequestTemplateForm = lazy(
+  () => import("./GrantRequestTemplateForm"),
 );
 
 const getUniqueDomainIds = (structures) =>
@@ -21,15 +22,21 @@ const getUniqueDomainIds = (structures) =>
 
 export const StructureGrantCartInformation = ({
   grantRequestsCart,
+  groupKey,
   isModification,
   selectGrantRequestTemplate,
+  selectGrantRequestTemplateForGroup,
   updateGrantRequestTemplateContent,
+  updateGrantRequestTemplateContentForGroup,
   selectedTemplate,
   disableSelector,
   name: autoTemplateName,
 }) => {
   const { formatMessage } = useIntl();
-  const templateContent = _.pathOr({}, "templateContent")(grantRequestsCart);
+  const draft = groupKey
+    ? grantRequestsCart?.groupTemplates?.[groupKey]
+    : grantRequestsCart;
+  const templateContent = draft?.templateContent ?? {};
   const structures = _.pathOr([], "structures")(grantRequestsCart);
   const domainIds = getUniqueDomainIds(structures);
 
@@ -58,20 +65,37 @@ export const StructureGrantCartInformation = ({
         >
           {formatMessage({ id: `structure.grant.cart.template` })}
         </Header>
-        <SelectableDynamicForm
-          scope="gr"
+        <GrantRequestTemplateForm
           content={templateContent}
           domainIds={domainIds}
           hideLabel
           isModification={isModification}
-          onChange={updateGrantRequestTemplateContent}
-          onNameChange={selectGrantRequestTemplate}
+          onChange={
+            groupKey
+              ? ({ content, valid }) =>
+                  updateGrantRequestTemplateContentForGroup({
+                    key: groupKey,
+                    content,
+                    valid,
+                  })
+              : updateGrantRequestTemplateContent
+          }
+          onNameChange={
+            groupKey
+              ? (template) =>
+                  selectGrantRequestTemplateForGroup({
+                    key: groupKey,
+                    template,
+                  })
+              : selectGrantRequestTemplate
+          }
           placeholder={formatMessage({
             id: `structure.grant.cart.template.placeholder`,
           })}
           required
-          name={autoTemplateName}
+          name={autoTemplateName ?? draft?.template}
           disableSelector={disableSelector}
+          selectedTemplate={selectedTemplate}
         />
       </Form>
     </Segment>
@@ -80,8 +104,11 @@ export const StructureGrantCartInformation = ({
 
 StructureGrantCartInformation.propTypes = {
   grantRequestsCart: PropTypes.object,
+  groupKey: PropTypes.string,
   selectGrantRequestTemplate: PropTypes.func,
+  selectGrantRequestTemplateForGroup: PropTypes.func,
   updateGrantRequestTemplateContent: PropTypes.func,
+  updateGrantRequestTemplateContentForGroup: PropTypes.func,
   isModification: PropTypes.bool,
   selectedTemplate: PropTypes.object,
   disableSelector: PropTypes.bool,
@@ -92,5 +119,7 @@ const mapStateToProps = ({ grantRequestsCart }) => ({ grantRequestsCart });
 
 export default connect(mapStateToProps, {
   selectGrantRequestTemplate,
+  selectGrantRequestTemplateForGroup,
   updateGrantRequestTemplateContent,
+  updateGrantRequestTemplateContentForGroup,
 })(StructureGrantCartInformation);

package/src/components/StructureGrantCartUserSelector.js

@@ -11,6 +11,23 @@ import { useRoles } from "@truedat/auth/hooks/useRoles";
 import { useGrantRequestableUsers } from "@truedat/auth/hooks/useUsers";
 import { updateGrantRequestUser } from "../routines";
 
+const groupDisplayName = (userGroup) =>
+  userGroup
+    ? _.isEmpty(userGroup.alias)
+      ? userGroup.name
+      : userGroup.alias
+    : undefined;
+
+const modificationBeneficiary = (grant, formatMessage) => {
+  const groupName = groupDisplayName(grant?.user_group);
+  if (!_.isEmpty(groupName)) return groupName;
+  if (!_.isNil(grant?.user_group_id)) {
+    return formatMessage({ id: "deleted.group" });
+  }
+  if (grant?.source_group_name) return grant.source_group_name;
+  return grant?.user?.full_name ?? "";
+};
+
 export const StructureGrantCartUserSelector = ({
   grantRequestsCart,
   updateGrantRequestUser,
@@ -59,6 +76,8 @@ export const StructureGrantCartUserSelector = ({
   useEffect(() => {
     if (!_.isNil(modificationGrant?.user_id)) {
       selectUser(modificationGrant?.user_id);
+    } else if (!_.isNil(modificationGrant?.user_group_id)) {
+      selectUser(`group:${modificationGrant.user_group_id}`);
     } else if (!_.isNil(grantRequestsCart?.user?.id) && !_.isEmpty(options)) {
       _.flow(
         _.find({ value: userId }),
@@ -66,7 +85,12 @@ export const StructureGrantCartUserSelector = ({
         selectUser,
       )(options);
     }
-  }, [grantRequestsCart?.user?.id, modificationGrant?.user_id, options]);
+  }, [
+    grantRequestsCart?.user?.id,
+    modificationGrant?.user_id,
+    modificationGrant?.user_group_id,
+    options,
+  ]);
 
   useEffect(() => {
     const valid =
@@ -178,9 +202,10 @@ export const StructureGrantCartUserSelector = ({
 
   return updateGrant ? (
     <Header as="h4">
-      <Header.Content>{`${formatMessage({ id: "grantRequestCart.user.label" })} ${
-        modificationGrant.user?.full_name
-      }`}</Header.Content>
+      <Header.Content>{`${formatMessage({ id: "grantRequestCart.user.label" })} ${modificationBeneficiary(
+        modificationGrant,
+        formatMessage,
+      )}`}</Header.Content>
     </Header>
   ) : (
     <>

package/src/components/StructureGrantDropdown.js

@@ -37,6 +37,12 @@ export const StructureGrantDropdown = ({
       grantRequest?._embedded?.group?.userGroupId ??
       grantRequest?._embedded?.group?._embedded?.user_group,
   );
+  const isGroupGrant = !_.isNil(
+    grant?.user_group_id ??
+      grant?.userGroupId ??
+      grant?.user_group ??
+      grant?.userGroup,
+  );
   const createdBy =
     grantRequest?.group?._embedded?.created_by?.user_name ??
     grantRequest?.group?.createdBy?.userName ??
@@ -167,11 +173,11 @@ export const StructureGrantDropdown = ({
       {stateProps?.header ? (
         <Header as="h6">
           <Header.Content>
+            {isGroupRequest || isGroupGrant ? <Icon name="users" /> : null}
             {formatMessage({ id: stateProps.header })}
           </Header.Content>
         </Header>
       ) : null}
-      {isGroupRequest ? <Icon name="users" /> : null}
       {grantRequest ? grantRequestDetails : grantDetails}
     </>
   );

package/src/components/StructureGrants.js

@@ -33,7 +33,10 @@ const StructureGrantsContent = ({
               key={i}
               textAlign={column.textAlign}
               content={formatMessage({
-                id: `grant.header.${column.name}`,
+                id:
+                  column.name === "user"
+                    ? "grants.props.user_or_group"
+                    : `grant.header.${column.name}`,
                 defaultMessage: column.name,
               })}
             />

package/src/components/StructuresUpdateOption.js

@@ -84,7 +84,7 @@ export const StructuresUpdateOption = ({
         onClick={navigateToBulkUpdate}
         disabled={disabled}
         content={
-          <>
+          <div>
             <span>
               {formatMessage({ id: "structures.actions.bulk_update" })}
             </span>
@@ -93,7 +93,7 @@ export const StructuresUpdateOption = ({
                 {formatMessage({ id: "structures.actions.bulk_update.popup" })}
               </p>
             )}
-          </>
+          </div>
         }
       />
     )

package/src/components/SystemStructures.js

@@ -1,4 +1,3 @@
-import _ from "lodash/fp";
 import { useEffect } from "react";
 import { useSelector, useDispatch } from "react-redux";
 import { Grid, Segment } from "semantic-ui-react";
@@ -13,8 +12,9 @@ export default function SystemStructures() {
   const { id: systemId } = useParams();
   const dispatch = useDispatch();
 
-  const { navFilter, systemStructuresLoading } = useSelector(
-    _.pick(["navFilter", "systemStructuresLoading"]),
+  const navFilter = useSelector((state) => state.navFilter);
+  const systemStructuresLoading = useSelector(
+    (state) => state.systemStructuresLoading,
   );
   const system = useSelector((state) => getSystem(state, systemId));
 

package/src/components/__tests__/CatalogViewConfigForm.spec.js

@@ -29,6 +29,8 @@ jest.mock("react-router", () => ({
 }));
 
 describe("<CatalogViewConfigFormLoader />", () => {
+  beforeEach(() => jest.useRealTimers());
+
   it("Saves the configuration", async () => {
     const dispatch = jest.fn();
     const rendered = render(<CatalogViewConfigFormLoader />, {

package/src/components/__tests__/EditDomainForm.spec.js

@@ -4,7 +4,9 @@ import { render, waitForLoad } from "@truedat/test/render";
 import { domainsMock } from "@truedat/test/mocks";
 import { EditDomainForm } from "../EditDomainForm";
 
-const mocks = [domainsMock({ action: "manageStructuresDomain" })];
+const mocks = Array.from({ length: 3 }, () =>
+  domainsMock({ action: "manageStructuresDomain" }),
+);
 
 describe("<EditDomainForm />", () => {
   const updateStructure = jest.fn();