@truedat/dd 8.2.3 → 8.3.0

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

@@ -1,8 +1,33 @@
 import { render, waitForLoad } from "@truedat/test/render";
-import { singleTemplateMock } from "@truedat/test/mocks";
+import { singleTemplateMock, domainsMock } from "@truedat/test/mocks";
 import { StructureGrantCartCheckout } from "../StructureGrantCartCheckout";
 
-const grantRequestsCart = {
+jest.mock("@truedat/core/webContext", () => ({
+  useWebContext: jest.fn(),
+}));
+
+jest.mock("@truedat/df/hooks/useTemplateRelations", () => ({
+  useTemplateRelations: jest.fn(),
+}));
+
+jest.mock("../../hooks/useCheckoutGrantRequest", () => ({
+  useCheckoutGrantRequest: jest.fn(),
+}));
+
+jest.mock("react-redux", () => {
+  const actual = jest.requireActual("react-redux");
+  return {
+    ...actual,
+    useDispatch: jest.fn(),
+  };
+});
+
+const { useWebContext } = require("@truedat/core/webContext");
+const { useTemplateRelations } = require("@truedat/df/hooks/useTemplateRelations");
+const { useCheckoutGrantRequest } = require("../../hooks/useCheckoutGrantRequest");
+const { useDispatch } = require("react-redux");
+
+const grantRequestsCartWithModification = {
   template: null,
   templateContent: {},
   modificationGrant: {
@@ -13,7 +38,6 @@ const grantRequestsCart = {
       id: "4570121",
       system_id: 7,
     },
-
     detail: {},
     id: "73399",
     inserted_at: "2025-01-03T11:47:30.447054Z",
@@ -26,27 +50,70 @@ const grantRequestsCart = {
     },
     user_id: "10",
   },
+  structures: [],
+};
+
+const grantRequestsCartSingle = {
+  template: "some_template",
+  templateContent: {},
+  modificationGrant: null,
+  validCart: true,
+  user: { id: "1", valid: true },
+  structures: [],
+};
+
+const grantRequestsCartMultiGroup = {
+  template: null,
+  templateContent: {},
+  modificationGrant: null,
+  validCart: false,
+  user: { id: "1", valid: true },
+  structures: [
+    { id: 101, system_id: 10, system: { id: 10 } },
+    { id: 102, system_id: 10, system: { id: 10 } },
+    { id: 201, system_id: 20, system: { id: 20 } },
+  ],
+  groupTemplates: {
+    "1": { template: "Template A", templateContent: {}, valid: true },
+    "2": { template: "Template B", templateContent: {}, valid: false },
+    others: { template: null, templateContent: {}, valid: false },
+  },
 };
 
 describe("StructureGrantCartCheckout", () => {
-  const mockCheckoutGrantRequest = jest.fn();
+  const mockTrigger = jest.fn();
+  const mockDispatch = jest.fn();
+  const mockInitGroupTemplates = jest.fn();
+  const mockSelectGrantRequestTemplateForGroup = jest.fn();
+  const mockUpdateGrantRequestTemplateContentForGroup = jest.fn();
 
   const defaultProps = {
-    grantRequestsCart,
-    checkoutGrantRequest: mockCheckoutGrantRequest,
+    grantRequestsCart: grantRequestsCartWithModification,
+    initGroupTemplates: mockInitGroupTemplates,
+    selectGrantRequestTemplateForGroup: mockSelectGrantRequestTemplateForGroup,
+    updateGrantRequestTemplateContentForGroup:
+      mockUpdateGrantRequestTemplateContentForGroup,
   };
 
   beforeEach(() => {
     jest.clearAllMocks();
+    useWebContext.mockReturnValue({ scopesWithRelations: [] });
+    useTemplateRelations.mockReturnValue({ resource: [] });
+    useCheckoutGrantRequest.mockReturnValue({
+      trigger: mockTrigger,
+      isMutating: false,
+    });
+    useDispatch.mockReturnValue(mockDispatch);
   });
 
   const variables = { scope: "gr" };
-
   const renderOpts = {
     mocks: [singleTemplateMock(variables)],
   };
 
-  it("matches the latest snapshot", async () => {
+  it("matches snapshot when modification grant (single flow)", async () => {
+    useWebContext.mockReturnValue({ scopesWithRelations: [] });
+    useTemplateRelations.mockReturnValue({ resource: [] });
     const rendered = render(
       <StructureGrantCartCheckout {...defaultProps} />,
       renderOpts
@@ -54,4 +121,39 @@ describe("StructureGrantCartCheckout", () => {
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
+
+  it("matches snapshot when single flow without modification and empty cart", async () => {
+    useWebContext.mockReturnValue({ scopesWithRelations: [] });
+    useTemplateRelations.mockReturnValue({ resource: [] });
+    const props = {
+      ...defaultProps,
+      grantRequestsCart: grantRequestsCartSingle,
+    };
+    const rendered = render(<StructureGrantCartCheckout {...props} />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot when multi-system (gr scope and multiple groups)", async () => {
+    useWebContext.mockReturnValue({ scopesWithRelations: ["gr"] });
+    useTemplateRelations.mockReturnValue({
+      resource: [
+        { resource_id: 10, template_id: 1 },
+        { resource_id: 20, template_id: 2 },
+      ],
+    });
+    const multiRenderOpts = {
+      state: { grantRequestsCart: grantRequestsCartMultiGroup },
+      mocks: [
+        singleTemplateMock({ scope: "gr" }),
+        domainsMock({ action: "createForeignGrantRequest" }),
+      ],
+    };
+    const rendered = render(
+      <StructureGrantCartCheckout {...defaultProps} />,
+      multiRenderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
 });

package/src/components/__tests__/__snapshots__/GrantRequestCartResult.spec.js.snap

@@ -0,0 +1,179 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`GrantRequestCartResult matches snapshot when groups have embedded requests with data structures 1`] = `
+<div>
+  <div
+    class="ui segment"
+  >
+    <h2
+      class="ui header"
+    >
+      grantRequest.cart.result.header
+    </h2>
+    <div
+      class="ui positive message"
+    >
+      <div
+        class="header"
+      >
+        grantRequest.cart.result.success
+      </div>
+    </div>
+    <div
+      class="ui divided relaxed list"
+      role="list"
+    >
+      <div
+        class="item"
+        role="listitem"
+      >
+        <div
+          class="content"
+        >
+          <a
+            class="header"
+            data-discover="true"
+            href="/grantRequestGroups/1"
+          >
+            Template A
+          </a>
+          <div
+            class="description"
+          >
+            Structures requested
+            : 
+            <ul
+              style="margin-top: 0.25em; margin-bottom: 0px;"
+            >
+              <li>
+                <a
+                  data-discover="true"
+                  href="/structures/10"
+                >
+                  Structure One
+                </a>
+              </li>
+              <li>
+                <a
+                  data-discover="true"
+                  href="/structures/20"
+                >
+                  Structure Two
+                </a>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+    <a
+      class="ui primary button"
+      data-discover="true"
+      href="/myGrantRequests"
+      role="button"
+    >
+      grantRequest.cart.result.viewMyRequests
+    </a>
+  </div>
+</div>
+`;
+
+exports[`GrantRequestCartResult matches snapshot when ids in URL and hook returns groups 1`] = `
+<div>
+  <div
+    class="ui segment"
+  >
+    <h2
+      class="ui header"
+    >
+      grantRequest.cart.result.header
+    </h2>
+    <div
+      class="ui positive message"
+    >
+      <div
+        class="header"
+      >
+        grantRequest.cart.result.success
+      </div>
+    </div>
+    <div
+      class="ui divided relaxed list"
+      role="list"
+    >
+      <div
+        class="item"
+        role="listitem"
+      >
+        <div
+          class="content"
+        >
+          <a
+            class="header"
+            data-discover="true"
+            href="/grantRequestGroups/1"
+          >
+            Template A
+          </a>
+          <div
+            class="description"
+          />
+        </div>
+      </div>
+      <div
+        class="item"
+        role="listitem"
+      >
+        <div
+          class="content"
+        >
+          <a
+            class="header"
+            data-discover="true"
+            href="/grantRequestGroups/2"
+          >
+            Template B
+          </a>
+          <div
+            class="description"
+          />
+        </div>
+      </div>
+    </div>
+    <a
+      class="ui primary button"
+      data-discover="true"
+      href="/myGrantRequests"
+      role="button"
+    >
+      grantRequest.cart.result.viewMyRequests
+    </a>
+  </div>
+</div>
+`;
+
+exports[`GrantRequestCartResult matches snapshot when no ids in URL (empty) 1`] = `
+<div>
+  <div
+    class="ui segment"
+  >
+    <div
+      class="ui info message"
+    >
+      <div
+        class="header"
+      >
+        grantRequest.cart.result.empty
+      </div>
+      <a
+        class="ui button"
+        data-discover="true"
+        href="/myGrantRequests"
+        role="button"
+      >
+        grantRequest.cart.result.viewMyRequests
+      </a>
+    </div>
+  </div>
+</div>
+`;

package/src/components/__tests__/__snapshots__/StructureGrantCartCheckout.spec.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`StructureGrantCartCheckout matches the latest snapshot 1`] = `
+exports[`StructureGrantCartCheckout matches snapshot when modification grant (single flow) 1`] = `
 <div>
   <div
     class="ui segment structures"
@@ -104,3 +104,296 @@ exports[`StructureGrantCartCheckout matches the latest snapshot 1`] = `
   </div>
 </div>
 `;
+
+exports[`StructureGrantCartCheckout matches snapshot when multi-system (gr scope and multiple groups) 1`] = `
+<div>
+  <div
+    class="ui segment structures"
+  >
+    <div
+      class="ui grid"
+    >
+      <div
+        class="row"
+      >
+        <div
+          class="eight wide column"
+        >
+          <h2
+            class="ui header"
+          >
+            <div
+              class="content"
+            >
+              grantRequest.header.update
+            </div>
+          </h2>
+        </div>
+        <div
+          class="right aligned eight wide column"
+        >
+          <a
+            class="ui secondary button"
+            data-discover="true"
+            href="/"
+            role="button"
+          >
+            actions.cancel
+          </a>
+          <button
+            class="ui primary disabled button"
+            disabled=""
+            tabindex="-1"
+          >
+            actions.save
+          </button>
+        </div>
+      </div>
+      <div
+        class="row"
+      >
+        <div
+          class="five wide column"
+        >
+          <div
+            class="ui segment"
+          >
+            <form
+              class="ui form"
+            >
+              <div
+                class="ui header"
+              >
+                <div
+                  class="content"
+                >
+                  grants.props.user_name
+                </div>
+              </div>
+              <div
+                class="ui header"
+                title="grants.props.user_name"
+              />
+              <div
+                class="field"
+              >
+                <div
+                  class="ui checkbox"
+                >
+                  <input
+                    class="hidden"
+                    readonly=""
+                    tabindex="0"
+                    type="checkbox"
+                  />
+                  <label>
+                    grantRequestCart.user.label
+                  </label>
+                </div>
+                <div
+                  aria-expanded="false"
+                  class="ui search selection dropdown"
+                  role="combobox"
+                >
+                  <input
+                    aria-autocomplete="list"
+                    autocomplete="off"
+                    class="search"
+                    tabindex="0"
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    aria-atomic="true"
+                    aria-live="polite"
+                    class="divider default text"
+                    role="alert"
+                  >
+                    grantRequestCart.user.placeholder
+                  </div>
+                  <i
+                    aria-hidden="true"
+                    class="dropdown icon"
+                  />
+                  <div
+                    class="menu transition"
+                    role="listbox"
+                  >
+                    <div
+                      class="message"
+                    >
+                      No results found.
+                    </div>
+                  </div>
+                </div>
+              </div>
+              filters
+              :
+              <div
+                class="ui labels"
+              >
+                <a
+                  class="ui label"
+                >
+                  userDomainsFilter.placeholder
+                </a>
+                <a
+                  class="ui label"
+                >
+                  roles.header
+                </a>
+              </div>
+              <div
+                class="ui divider"
+              />
+              <div
+                class="ui header"
+                title="structure.grant.cart.template"
+              >
+                structure.grant.cart.template
+              </div>
+              <div
+                class="ui segment"
+              >
+                <h4
+                  class="ui header"
+                >
+                  g1
+                </h4>
+                <div
+                  class="field"
+                  data-testid="form-field"
+                >
+                  <label>
+                    field1
+                  </label>
+                  <div
+                    class="field"
+                  >
+                    <div
+                      class="ui input"
+                    >
+                      <input
+                        name="field1"
+                        placeholder="field1"
+                        type="text"
+                        value=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </form>
+          </div>
+        </div>
+        <div
+          class="eleven wide column"
+        />
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`StructureGrantCartCheckout matches snapshot when single flow without modification and empty cart 1`] = `
+<div>
+  <div
+    class="ui segment structures"
+  >
+    <div
+      class="ui grid"
+    >
+      <div
+        class="row"
+      >
+        <div
+          class="eight wide column"
+        >
+          <h2
+            class="ui header"
+          >
+            <div
+              class="content"
+            >
+              grantRequest.header.create
+            </div>
+          </h2>
+        </div>
+        <div
+          class="right aligned eight wide column"
+        >
+          <a
+            class="ui secondary button"
+            data-discover="true"
+            href="/structuresGrantRequests"
+            role="button"
+          >
+            actions.cancel
+          </a>
+          <button
+            class="ui primary button"
+          >
+            actions.save
+          </button>
+        </div>
+      </div>
+      <div
+        class="row"
+      >
+        <div
+          class="five wide column"
+        >
+          <div
+            class="ui segment"
+          >
+            <form
+              class="ui form"
+            >
+              <div
+                class="ui header"
+                title="structure.grant.cart.template"
+              >
+                structure.grant.cart.template
+              </div>
+              <div
+                class="ui segment"
+              >
+                <h4
+                  class="ui header"
+                >
+                  g1
+                </h4>
+                <div
+                  class="field"
+                  data-testid="form-field"
+                >
+                  <label>
+                    field1
+                  </label>
+                  <div
+                    class="field"
+                  >
+                    <div
+                      class="ui input"
+                    >
+                      <input
+                        name="field1"
+                        placeholder="field1"
+                        type="text"
+                        value=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </form>
+          </div>
+        </div>
+        <div
+          class="eleven wide column"
+        />
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/hooks/useCheckoutGrantRequest.js

@@ -0,0 +1,16 @@
+import useSWRMutation from "swr/mutation";
+import { apiJsonPost, JSON_OPTS } from "@truedat/core/services/api";
+import { API_GRANT_REQUEST_GROUP, API_GRANT_REQUEST_GROUPS_BULK } from "../api";
+
+const CHECKOUT_GRANT_REQUEST_KEY = "checkout-grant-request";
+
+const checkoutFetcher = (_key, { arg }) => {
+  const url = Array.isArray(arg?.grant_request_groups)
+    ? API_GRANT_REQUEST_GROUPS_BULK
+    : API_GRANT_REQUEST_GROUP;
+  return apiJsonPost(url, arg, JSON_OPTS).then((res) => res.data);
+};
+
+export const useCheckoutGrantRequest = () => {
+  return useSWRMutation(CHECKOUT_GRANT_REQUEST_KEY, checkoutFetcher);
+};

package/src/hooks/useGrantRequestGroupsByIds.js

@@ -0,0 +1,22 @@
+import useSWR from "swr";
+import { apiJson } from "@truedat/core/services/api";
+import { API_GRANT_REQUEST_GROUP } from "../api";
+
+const buildGrantRequestGroupsUrl = (ids) => {
+  if (!Array.isArray(ids) || ids.length === 0) return null;
+  const idsParam = ids.join(",");
+  return `${API_GRANT_REQUEST_GROUP}?ids=${idsParam}`;
+};
+
+export const useGrantRequestGroupsByIds = (ids) => {
+  const url = buildGrantRequestGroupsUrl(ids);
+  const { data, error, isLoading, mutate } = useSWR(url, apiJson);
+  const responseBody = data?.data;
+  const groups = url ? (responseBody?.data ?? []) : [];
+  return {
+    groups,
+    isLoading: !!url && !error && !data,
+    error,
+    mutate,
+  };
+};

package/src/hooks/useSystems.js

@@ -0,0 +1,27 @@
+import useSWR from "swr";
+import { apiJson } from "@truedat/core/services/api";
+import { API_SYSTEMS } from "@truedat/core/api";
+
+const GRANTABLE_CLASS = "grantable";
+
+const buildSystemsUrl = (options = {}) => {
+  const { class: classFilter } = options;
+  const params = new URLSearchParams();
+  if (classFilter === GRANTABLE_CLASS) {
+    params.set("class", GRANTABLE_CLASS);
+  }
+  const query = params.toString();
+  return query ? `${API_SYSTEMS}?${query}` : API_SYSTEMS;
+};
+
+export const useSystems = (options = {}) => {
+  const url = buildSystemsUrl(options);
+  const { data, error, mutate } = useSWR(url, apiJson);
+  return {
+    data: data?.data ?? [],
+    isLoading: !error && !data,
+    error,
+  };
+};
+
+export const useGrantableSystems = () => useSystems({ class: GRANTABLE_CLASS });