@truedat/dd 8.4.3 → 8.4.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dd",
-  "version": "8.4.3",
+  "version": "8.4.5",
   "description": "Truedat Web Data Dictionary",
   "sideEffects": false,
   "module": "src/index.js",
@@ -51,7 +51,7 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
-    "@truedat/test": "8.4.3",
+    "@truedat/test": "8.4.5",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",
     "redux-saga-test-plan": "^4.0.6"
@@ -86,5 +86,5 @@
     "svg-pan-zoom": "^3.6.2",
     "swr": "^2.3.3"
   },
-  "gitHead": "4c27fe8b467a2b0b26f69d4931d85d8bdf674e6d"
+  "gitHead": "b02bd52fc13d8e811993059bc50085f841415c91"
 }

package/src/components/StructureGrantCartCheckout.js

@@ -23,36 +23,86 @@ import { useCheckoutGrantRequest } from "../hooks/useCheckoutGrantRequest";
 import { useTemplatesByIds } from "../hooks/useTemplatesByIds";
 
 const SelectableDynamicForm = lazy(
-  () => import("@truedat/df/components/SelectableDynamicForm")
+  () => import("@truedat/df/components/SelectableDynamicForm"),
 );
 
-const getGroupedStructuresByTemplate = (
+const getUniqueDomainIds = (structures) =>
+  _.flow(_.map("domain_ids"), _.flatten, _.compact, _.uniq)(structures ?? []);
+
+const getUniqueSystemName = (structures) =>
+  _.flow(_.map("system.name"), _.flatten, _.compact, _.uniq)(structures ?? []);
+
+const getGroupedStructuresByDomainAndTemplate = (
   structures,
   templateResourceRelations,
-  defaultTemplateId
+  defaultTemplateId,
+  defaultGroupByDomain = false,
+  enableGrouping = true,
 ) => {
+  if (!enableGrouping) {
+    return { grouped: { all: structures ?? [] }, groupByDomainByKey: {} };
+  }
+
+  const explicitSystemIds = new Set(
+    (templateResourceRelations ?? [])
+      .filter((r) => r.resource_id != null)
+      .map((r) => String(r.resource_id)),
+  );
+
   const systemToTemplateId = _.fromPairs(
-    (templateResourceRelations ?? []).map((r) => [
-      r.resource_id != null ? Number(r.resource_id) || r.resource_id : null,
-      r.template_id != null ? Number(r.template_id) || r.template_id : null,
-    ]).filter(([sid]) => sid != null)
+    (templateResourceRelations ?? [])
+      .map((r) => [
+        r.resource_id != null ? String(r.resource_id) : null,
+        r.template_id != null ? Number(r.template_id) || r.template_id : null,
+      ])
+      .filter(([sid]) => sid != null),
+  );
+
+  const systemGroupByDomain = _.fromPairs(
+    (templateResourceRelations ?? [])
+      .filter((r) => r.resource_id != null)
+      .map((r) => [String(r.resource_id), r.group_by_domain === true]),
   );
+
   return _.reduce(
     (acc, structure) => {
       const systemId = structure.system_id ?? structure.system?.id ?? null;
-      const normalizedSystemId =
-        systemId != null ? Number(systemId) || systemId : null;
-      const templateId =
-        normalizedSystemId != null
-          ? systemToTemplateId[normalizedSystemId] ?? defaultTemplateId
-          : defaultTemplateId;
-      const key =
-        templateId != null ? String(templateId) : "others";
-      const list = acc[key] ?? [];
-      return { ...acc, [key]: [...list, structure] };
+      const normalizedSystemIdStr = systemId != null ? String(systemId) : null;
+
+      const isExplicitSystem =
+        normalizedSystemIdStr != null &&
+        explicitSystemIds.has(normalizedSystemIdStr);
+
+      const templateId = isExplicitSystem
+        ? (systemToTemplateId[normalizedSystemIdStr] ?? defaultTemplateId)
+        : defaultTemplateId;
+
+      const shouldGroupByDomain = isExplicitSystem
+        ? systemGroupByDomain[normalizedSystemIdStr] === true
+        : defaultGroupByDomain === true && defaultTemplateId != null;
+
+      const systemKey = isExplicitSystem ? normalizedSystemIdStr : "others";
+
+      const domainIds = structure.domain_ids || [];
+      const sortedDomainIds = [...domainIds].sort((a, b) => a - b);
+      const domainKey =
+        shouldGroupByDomain && sortedDomainIds.length > 0
+          ? sortedDomainIds.join(",")
+          : "nodomain";
+      const templateKey = templateId != null ? String(templateId) : "notype";
+      const key = `${domainKey}_${systemKey}_${templateKey}`;
+
+      const list = acc.grouped[key] ?? [];
+      return {
+        grouped: { ...acc.grouped, [key]: [...list, structure] },
+        groupByDomainByKey: {
+          ...acc.groupByDomainByKey,
+          [key]: shouldGroupByDomain && domainKey !== "nodomain",
+        },
+      };
     },
-    {},
-    structures ?? []
+    { grouped: {}, groupByDomainByKey: {} },
+    structures ?? [],
   );
 };
 
@@ -86,45 +136,63 @@ export const StructureGrantCartCheckout = ({
     groupTemplates = {},
   } = grantRequestsCart;
 
-  const groupedStructures = getGroupedStructuresByTemplate(
-    structures,
-    templateResourceRelations,
-    defaultTemplateId
+  const enableGrouping =
+    !modificationGrant && scopesWithRelations.includes("gr");
+
+  const { grouped: groupedStructures, groupByDomainByKey } = useMemo(
+    () =>
+      getGroupedStructuresByDomainAndTemplate(
+        structures,
+        templateResourceRelations,
+        defaultTemplateId,
+        defaultRelation?.group_by_domain === true,
+        enableGrouping,
+      ),
+    [
+      structures,
+      templateResourceRelations,
+      defaultTemplateId,
+      defaultRelation,
+      enableGrouping,
+    ],
   );
   const groupKeys = _.keys(groupedStructures);
-  const isMultiGroup =
-    !modificationGrant &&
-    scopesWithRelations.includes("gr") &&
-    groupKeys.length > 1;
+  const isMultiGroup = enableGrouping && groupKeys.length > 1;
 
-  const singleGroupKey =
-    !modificationGrant &&
-    scopesWithRelations.includes("gr") &&
-    groupKeys.length === 1
-      ? groupKeys[0]
-      : null;
+  const getTemplateIdFromKey = (key) => {
+    const parts = key.split("_");
+    const templatePart = parts[2];
+    if (templatePart === "notype" || !templatePart) {
+      return defaultTemplateId;
+    }
+    return Number(templatePart) || templatePart;
+  };
+
+  const getDomainIdsFromKey = (key) => {
+    const parts = key.split("_");
+    const domainPart = parts[0];
+    if (domainPart === "nodomain" || !domainPart) {
+      return null;
+    }
+    return domainPart.split(",").map((id) => parseInt(id, 10));
+  };
 
   const effectiveTemplateIdByKey = useMemo(
-    () =>
-      _.fromPairs(
-        groupKeys.map((k) => [
-          k,
-          k === "others" ? defaultTemplateId : Number(k) || k,
-        ])
-      ),
-    [groupKeys.join(","), defaultTemplateId]
+    () => _.fromPairs(groupKeys.map((k) => [k, getTemplateIdFromKey(k)])),
+    [groupKeys.join(","), defaultTemplateId],
   );
 
   const uniqueTemplateIds = useMemo(
     () => _.uniq(_.compact(_.values(effectiveTemplateIdByKey))),
-    [effectiveTemplateIdByKey]
+    [effectiveTemplateIdByKey],
   );
 
+  const singleGroupKey =
+    enableGrouping && groupKeys.length === 1 ? groupKeys[0] : null;
+
   const singleTemplateId =
     !isMultiGroup && singleGroupKey != null
-      ? singleGroupKey === "others"
-        ? defaultTemplateId
-        : Number(singleGroupKey) || singleGroupKey
+      ? getTemplateIdFromKey(singleGroupKey)
       : null;
 
   const templateIdsToFetch = isMultiGroup
@@ -141,22 +209,25 @@ export const StructureGrantCartCheckout = ({
     groupKeys.forEach((k) => {
       const tid = effectiveTemplateIdByKey[k];
       const t =
-        tid != null
-          ? templatesById[String(tid)] ?? templatesById[tid]
-          : null;
+        tid != null ? (templatesById[String(tid)] ?? templatesById[tid]) : null;
       if (t) next[k] = t;
     });
     return next;
-  }, [isMultiGroup, groupKeys.join(","), effectiveTemplateIdByKey, templatesById]);
+  }, [
+    isMultiGroup,
+    groupKeys.join(","),
+    effectiveTemplateIdByKey,
+    templatesById,
+  ]);
 
   const singleSystemTemplate = useMemo(
     () =>
       singleTemplateId != null
-        ? templatesById[String(singleTemplateId)] ??
+        ? (templatesById[String(singleTemplateId)] ??
           templatesById[singleTemplateId] ??
-          null
+          null)
         : null,
-    [singleTemplateId, templatesById]
+    [singleTemplateId, templatesById],
   );
 
   useEffect(() => {
@@ -167,35 +238,35 @@ export const StructureGrantCartCheckout = ({
           groupKeys.map((k) => [
             k,
             {
-              template: k === "others" ? null : undefined,
+              template: undefined,
               templateContent: {},
               valid: false,
             },
-          ])
-        )
+          ]),
+        ),
       );
       return;
     }
     const allLoaded = uniqueTemplateIds.every(
       (id) =>
         templatesById[String(id)] !== undefined ||
-        templatesById[id] !== undefined
+        templatesById[id] !== undefined,
     );
     if (!allLoaded) return;
     const getTemplateById = (tid) =>
-      tid != null ? templatesById[String(tid)] ?? templatesById[tid] : null;
+      tid != null ? (templatesById[String(tid)] ?? templatesById[tid]) : null;
     const initial = _.fromPairs(
       groupKeys.map((k) => {
         const t = getTemplateById(effectiveTemplateIdByKey[k])?.name;
         return [
           k,
           {
-            template: t ?? (k === "others" ? null : undefined),
+            template: t ?? undefined,
             templateContent: {},
             valid: false,
           },
         ];
-      })
+      }),
     );
     initGroupTemplates(initial);
   }, [
@@ -223,11 +294,43 @@ export const StructureGrantCartCheckout = ({
     isMultiGroup &&
     user?.valid &&
     groupKeys.every(
-      (k) => groupTemplates[k]?.template && groupTemplates[k]?.valid
+      (k) => groupTemplates[k]?.template && groupTemplates[k]?.valid,
     );
 
   const canSubmit = isMultiGroup ? validCartMulti : validCart && user?.valid;
 
+  const domainNamesByKey = useMemo(() => {
+    const domainIdToName = {};
+    (structures ?? []).forEach((structure) => {
+      const structureDomains =
+        structure.domains || structure.data_structure?.domains || [];
+      structureDomains.forEach((domain) => {
+        if (domain?.id != null) {
+          const key = String(domain.id);
+          if (!domainIdToName[key]) {
+            domainIdToName[key] = domain.name;
+          }
+        }
+      });
+    });
+
+    return _.fromPairs(
+      groupKeys.map((key) => {
+        const domainIds = getDomainIdsFromKey(key);
+
+        if (!domainIds) {
+          return [key, null];
+        }
+
+        const domainNames = domainIds
+          .map((id) => domainIdToName[id] || String(id))
+          .join(", ");
+
+        return [key, domainNames];
+      }),
+    );
+  }, [groupKeys.join(","), structures, groupedStructures]);
+
   const checkout = () => {
     let payload;
     if (isMultiGroup) {
@@ -274,9 +377,9 @@ export const StructureGrantCartCheckout = ({
           checkoutGrantRequest.failure(
             err?.response
               ? { status: err.response.status, data: err.response.data }
-              : err?.message
-          )
-        )
+              : err?.message,
+          ),
+        ),
       )
       .finally(() => dispatch(checkoutGrantRequest.fulfill()));
   };
@@ -306,7 +409,7 @@ export const StructureGrantCartCheckout = ({
             />
           </GridColumn>
         </Grid.Row>
-        {isMultiGroup ? (
+        {groupKeys.length > 1 ? (
           <>
             <Grid.Row>
               <Grid.Column width={16}>
@@ -319,24 +422,75 @@ export const StructureGrantCartCheckout = ({
             {groupKeys.map((key) => {
               const groupStructures = groupedStructures[key] ?? [];
               if (_.isEmpty(groupStructures)) return null;
-              const isOthers = key === "others";
+              const groupDomainIds = getUniqueDomainIds(groupStructures);
               const groupData = groupTemplates[key] ?? {};
               const selectedTemplate = systemTemplates[key];
+              const domainName = domainNamesByKey[key];
+              const systemNames = getUniqueSystemName(groupStructures);
+
+              const shouldGroupByDomain =
+                enableGrouping && groupByDomainByKey[key] === true;
+
+              const shouldShowSystemTitle = enableGrouping;
+
+              const domainCount = groupDomainIds.length;
+              const domainMessageId =
+                domainCount === 1
+                  ? "grants.props.domain_name"
+                  : "grants.props.domain_names";
+
+              const systemMessageId = "grants.props.system_name";
+
               return (
                 <Grid.Row key={key}>
                   <Grid.Column width={5}>
                     <Segment className="grant-cart-group-form">
-                      <Header as="h4">
-                        {isOthers ? (
-                          <FormattedMessage id="grantRequest.cart.group.others" />
-                        ) : (
-                          selectedTemplate?.name ?? key
-                        )}
+                      <Header as="h5">
+                        {shouldShowSystemTitle &&
+                          systemNames != null &&
+                          systemNames.length > 0 && (
+                            <div
+                              style={{
+                                wordBreak: "break-word",
+                                marginBottom: "5px",
+                              }}
+                            >
+                              {formatMessage({ id: systemMessageId })}:{" "}
+                              <span style={{ fontWeight: "normal" }}>
+                                {key.split("_")[1] === "others"
+                                  ? formatMessage({
+                                      id: "grantRequest.cart.group.others",
+                                    })
+                                  : systemNames.join(", ")}
+                              </span>
+                            </div>
+                          )}
+
+                        {shouldGroupByDomain &&
+                          domainName != null &&
+                          domainName !== "" && (
+                            <div
+                              style={{
+                                wordBreak: "break-word",
+                                marginBottom: "5px",
+                              }}
+                            >
+                              {formatMessage({ id: domainMessageId })}:{" "}
+                              <span style={{ fontWeight: "normal" }}>
+                                {domainName}
+                              </span>
+                            </div>
+                          )}
+                        <Header.Subheader>
+                          {formatMessage({ id: "grants.props.structures" })}:{" "}
+                          {groupStructures.length}
+                        </Header.Subheader>
                       </Header>
                       <Suspense fallback={null}>
                         <SelectableDynamicForm
                           scope="gr"
                           content={groupData.templateContent ?? {}}
+                          domainIds={groupDomainIds}
                           hideLabel
                           isModification={!!modificationGrant}
                           selectedTemplate={selectedTemplate}
@@ -411,10 +565,10 @@ const mapDispatchToProps = (dispatch) =>
       selectGrantRequestTemplateForGroup,
       updateGrantRequestTemplateContentForGroup,
     },
-    dispatch
+    dispatch,
   );
 
 export default connect(
   mapStateToProps,
-  mapDispatchToProps
+  mapDispatchToProps,
 )(StructureGrantCartCheckout);

package/src/components/StructureGrantCartInformation.js

@@ -16,6 +16,14 @@ const SelectableDynamicForm = lazy(
   () => import("@truedat/df/components/SelectableDynamicForm")
 );
 
+const getUniqueDomainIds = (structures) =>
+  _.flow(
+    _.map("domain_ids"),
+    _.flatten,
+    _.compact,
+    _.uniq
+  )(structures ?? []);
+
 export const StructureGrantCartInformation = ({
   grantRequestsCart,
   isModification,
@@ -26,6 +34,8 @@ export const StructureGrantCartInformation = ({
 }) => {
   const { formatMessage } = useIntl();
   const templateContent = _.pathOr({}, "templateContent")(grantRequestsCart);
+  const structures = _.pathOr([], "structures")(grantRequestsCart);
+  const domainIds = getUniqueDomainIds(structures);
 
   const { loading, data } = useQuery(DOMAINS_QUERY, {
     fetchPolicy: "cache-and-network",
@@ -54,6 +64,7 @@ export const StructureGrantCartInformation = ({
         <SelectableDynamicForm
           scope="gr"
           content={templateContent}
+          domainIds={domainIds}
           hideLabel
           isModification={isModification}
           onChange={updateGrantRequestTemplateContent}

package/src/components/StructureGrantCartUserSelector.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import { lazy, useEffect, useState } from "react";
+import { lazy, useEffect, useMemo, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import { Form, Checkbox, Header, Label, Popup } from "semantic-ui-react";
 import { connect } from "react-redux";
@@ -15,6 +15,7 @@ export const StructureGrantCartUserSelector = ({
   grantRequestsCart,
   updateGrantRequestUser,
   spacedLabel,
+  domainIds: externalDomainIds,
 }) => {
   const { formatMessage } = useIntl();
   const [usersGroupsQuery, setUsersGroupsQuery] = useState("");
@@ -25,6 +26,15 @@ export const StructureGrantCartUserSelector = ({
   const [userId, setUserId] = useState(null);
   const { users, trigger } = useGrantRequestableUsers();
 
+  const structuresDomainIds = useMemo(
+    () =>
+      externalDomainIds ||
+      _.flatMap(({ domain_ids }) => domain_ids)(
+        grantRequestsCart.structures || [],
+      ),
+    [externalDomainIds, grantRequestsCart.structures],
+  );
+
   const { modificationGrant } = grantRequestsCart;
   const updateGrant = !_.isEmpty(modificationGrant);
   const domainActions = ["publishGrantRequest"];
@@ -37,6 +47,8 @@ export const StructureGrantCartUserSelector = ({
 
   const { data: roles } = useRoles();
 
+  const prevPayloadRef = useRef(null);
+
   useEffect(() => {
     if (!_.isNil(modificationGrant?.user_id)) {
       selectUser(modificationGrant?.user_id);
@@ -44,7 +56,7 @@ export const StructureGrantCartUserSelector = ({
       _.flow(
         _.find({ value: userId }),
         _.pathOr(null, "value"),
-        selectUser
+        selectUser,
       )(options);
     }
   }, [grantRequestsCart?.user?.id, modificationGrant?.user_id, options]);
@@ -61,24 +73,26 @@ export const StructureGrantCartUserSelector = ({
     _.flow(
       _.filter(({ name }) => _.includes(name)(selectedRoles)),
       _.map(({ id }) => id),
-      setSelectedRoleIds
+      setSelectedRoleIds,
     )(roles);
   }, [selectedRoles, roles]);
 
   useEffect(() => {
-    const structuresDomains = _.flatMap(({ domain_ids }) => domain_ids)(
-      grantRequestsCart.structures
-    );
     const filters = {
-      structures_domains: structuresDomains,
+      structures_domains: structuresDomainIds,
       query: usersGroupsQuery,
       filter_domains: domainIds,
       roles: selectedRoleIds,
     };
     const payload = _.omitBy(_.isEmpty)(filters);
-    trigger(payload);
+
+    const payloadKey = JSON.stringify(payload);
+    if (prevPayloadRef.current !== payloadKey) {
+      prevPayloadRef.current = payloadKey;
+      trigger(payload);
+    }
   }, [
-    grantRequestsCart.structures,
+    structuresDomainIds,
     usersGroupsQuery,
     domainIds,
     selectedRoleIds,
@@ -201,6 +215,7 @@ StructureGrantCartUserSelector.propTypes = {
   grantRequestsCart: PropTypes.object,
   updateGrantRequestUser: PropTypes.func,
   spacedLabel: PropTypes.bool,
+  domainIds: PropTypes.array,
 };
 
 const mapStateToProps = ({ grantRequestsCart }) => ({
@@ -208,5 +223,5 @@ const mapStateToProps = ({ grantRequestsCart }) => ({
 });
 
 export default connect(mapStateToProps, { updateGrantRequestUser })(
-  StructureGrantCartUserSelector
+  StructureGrantCartUserSelector,
 );