UIORGS-424 Accurately handle user permissions for banking information operations

CHANGELOG.md

@@ -14,6 +14,7 @@
 * Factor away from unsupported `color()` function. Refs UIORGS-416.
 * Suppress banking information management for unauthorized user. Refs UIORGS-418.
 * Add validation for `Day` field in `Monthly` scheduler for export method. Refs UIORGS-417.
+* Accurately handle user permissions for banking information operations. Refs UIORGS-424.
 
 ## [5.0.0](https://github.com/folio-org/ui-organizations/tree/v5.0.0) (2023-10-12)
 [Full Changelog](https://github.com/folio-org/ui-organizations/compare/v4.0.0...v5.0.0)

src/OrganizationIntegration/OrganizationIntegrationForm/__snapshots__/OrganizationIntegrationForm.test.js.snap

@@ -147,7 +147,7 @@ exports[`OrganizationIntegrationForm should render correct form structure 1`] =
                 </div>
                 <div
                   class="content-wrap expanded"
-                  style="z-index: 4;"
+                  style="z-index: 0;"
                 >
                   <div
                     aria-labelledby="accordion-toggle-button-integrationInfo"
@@ -330,7 +330,7 @@ exports[`OrganizationIntegrationForm should render correct form structure 1`] =
                 </div>
                 <div
                   class="content-wrap expanded"
-                  style="z-index: 3;"
+                  style="z-index: 1;"
                 >
                   <div
                     aria-labelledby="accordion-toggle-button-edi"
@@ -1379,7 +1379,7 @@ exports[`OrganizationIntegrationForm should render correct form structure 1`] =
                 </div>
                 <div
                   class="content-wrap expanded"
-                  style="z-index: 1;"
+                  style="z-index: 3;"
                 >
                   <div
                     aria-labelledby="accordion-toggle-button-scheduling"

src/OrganizationIntegration/OrganizationIntegrationView/__snapshots__/OrganizationIntegrationView.test.js.snap

@@ -217,7 +217,7 @@ exports[`OrganizationIntegrationView should render correct view structure 1`] =
                 </div>
                 <div
                   class="content-wrap expanded"
-                  style="z-index: 4;"
+                  style="z-index: 0;"
                 >
                   <div
                     aria-labelledby="accordion-toggle-button-integrationInfo"
@@ -369,7 +369,7 @@ exports[`OrganizationIntegrationView should render correct view structure 1`] =
                 </div>
                 <div
                   class="content-wrap expanded"
-                  style="z-index: 3;"
+                  style="z-index: 1;"
                 >
                   <div
                     aria-labelledby="accordion-toggle-button-edi"
@@ -1061,7 +1061,7 @@ exports[`OrganizationIntegrationView should render correct view structure 1`] =
                 </div>
                 <div
                   class="content-wrap expanded"
-                  style="z-index: 1;"
+                  style="z-index: 3;"
                 >
                   <div
                     aria-labelledby="accordion-toggle-button-scheduling"

src/Organizations/OrganizationForm/OrganizationVendorInfoForm/__snapshots__/OrganizationVendorInfoForm.test.js.snap

@@ -636,7 +636,7 @@ exports[`OrganizationVendorInfoForm should render correct structure 1`] = `
             </div>
             <div
               class="content-wrap expanded"
-              style="z-index: 1;"
+              style="z-index: 0;"
             >
               <div
                 aria-labelledby="accordion-toggle-button-taxSection"

src/Organizations/OrganizationForm/__snapshots__/OrganizationForm.test.js.snap

@@ -154,7 +154,7 @@ exports[`OrganizationForm should render correct form with metadata 1`] = `
                     </div>
                     <div
                       class="content-wrap expanded"
-                      style="z-index: 4;"
+                      style="z-index: 0;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-summarySection"
@@ -215,7 +215,7 @@ exports[`OrganizationForm should render correct form with metadata 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 3;"
+                      style="z-index: 1;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-contactInformationSection"
@@ -331,7 +331,7 @@ exports[`OrganizationForm should render correct form with metadata 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 1;"
+                      style="z-index: 3;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-interfacesSection"
@@ -566,7 +566,7 @@ exports[`OrganizationForm should render correct non-vendor form structure 1`] =
                     </div>
                     <div
                       class="content-wrap expanded"
-                      style="z-index: 4;"
+                      style="z-index: 0;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-summarySection"
@@ -624,7 +624,7 @@ exports[`OrganizationForm should render correct non-vendor form structure 1`] =
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 3;"
+                      style="z-index: 1;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-contactInformationSection"
@@ -740,7 +740,7 @@ exports[`OrganizationForm should render correct non-vendor form structure 1`] =
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 1;"
+                      style="z-index: 3;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-interfacesSection"
@@ -975,7 +975,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap expanded"
-                      style="z-index: 7;"
+                      style="z-index: 0;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-summarySection"
@@ -1033,7 +1033,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 6;"
+                      style="z-index: 1;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-contactInformationSection"
@@ -1091,7 +1091,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 5;"
+                      style="z-index: 2;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-contactPeopleSection"
@@ -1149,7 +1149,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 4;"
+                      style="z-index: 3;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-interfacesSection"
@@ -1207,7 +1207,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 3;"
+                      style="z-index: 4;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-vendorInformationSection"
@@ -1265,7 +1265,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 2;"
+                      style="z-index: 5;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-agreementsSection"
@@ -1323,7 +1323,7 @@ exports[`OrganizationForm should render correct vendor form structure 1`] = `
                     </div>
                     <div
                       class="content-wrap"
-                      style="z-index: 1;"
+                      style="z-index: 6;"
                     >
                       <div
                         aria-labelledby="accordion-toggle-button-accountsSection"

src/Organizations/useBankingInformationManager.js

@@ -10,13 +10,21 @@ import {
 } from '../common/hooks';
 import { getArrayItemsChanges } from '../common/utils';
 
-const executeSequentially = (fn, arr) => arr.reduce((acc, curr) => {
-  return acc.then(() => fn({ bankingInformation: curr }));
-}, Promise.resolve());
+const executeSequentially = (fn, arr, hasPerm) => {
+  if (!hasPerm) return Promise.resolve();
 
-const executeParallel = (fn, arr) => chunk(arr, 5).reduce((acc, chunked) => {
-  return acc.then(() => Promise.all(chunked.map((bankingInformation) => fn({ bankingInformation }))));
-}, Promise.resolve());
+  return arr.reduce((acc, curr) => {
+    return acc.then(() => fn({ bankingInformation: curr }));
+  }, Promise.resolve());
+};
+
+const executeParallel = (fn, arr, hasPerm) => {
+  if (!hasPerm) return Promise.resolve();
+
+  return chunk(arr, 5).reduce((acc, chunked) => {
+    return acc.then(() => Promise.all(chunked.map((bankingInformation) => fn({ bankingInformation }))));
+  }, Promise.resolve());
+};
 
 export const useBankingInformationManager = () => {
   const stripes = useStripes();
@@ -36,13 +44,7 @@ export const useBankingInformationManager = () => {
     bankingInformation,
     organization,
   }) => {
-    const isOperationRestricted = !(
-      organization.isVendor
-      && isBankingInformationEnabled
-      && stripes.hasPerm('organizations.banking-information.item.post')
-      && stripes.hasPerm('organizations.banking-information.item.put')
-      && stripes.hasPerm('organizations.banking-information.item.delete')
-    );
+    const isOperationRestricted = !(organization.isVendor && isBankingInformationEnabled);
 
     if (isOperationRestricted) return Promise.resolve();
 
@@ -53,12 +55,13 @@ export const useBankingInformationManager = () => {
     } = getArrayItemsChanges(initBankingInformation, bankingInformation);
 
     return Promise.all([
-      executeSequentially(createBankingInformation, created.map((item) => ({
-        organizationId: organization.id,
-        ...item,
-      }))),
-      executeParallel(updateBankingInformation, updated),
-      executeParallel(deleteBankingInformation, deleted),
+      executeSequentially(
+        createBankingInformation,
+        created.map((item) => ({ organizationId: organization.id, ...item })),
+        stripes.hasPerm('organizations.banking-information.item.post'),
+      ),
+      executeParallel(updateBankingInformation, updated, stripes.hasPerm('organizations.banking-information.item.put')),
+      executeParallel(deleteBankingInformation, deleted, stripes.hasPerm('organizations.banking-information.item.delete')),
     ]).catch(() => {
       showCallout({
         type: 'error',

src/Organizations/useBankingInformationManager.test.js

@@ -1,4 +1,5 @@
 import { renderHook } from '@folio/jest-config-stripes/testing-library/react';
+import { useStripes } from '@folio/stripes/core';
 
 import { organization } from 'fixtures';
 import {
@@ -13,6 +14,11 @@ const mutationsMock = {
   deleteBankingInformation: jest.fn(),
 };
 
+jest.mock('@folio/stripes/core', () => ({
+  ...jest.requireActual('@folio/stripes/core'),
+  useStripes: jest.fn(),
+}));
+
 jest.mock('../common/hooks', () => ({
   ...jest.requireActual('../common/hooks'),
   useBankingInformationMutation: jest.fn(),
@@ -29,7 +35,15 @@ const bankingInformation = [
   { id: 3, bankName: 'Bank name 3' },
 ];
 
-describe('useBankingAccountTypes', () => {
+const hasPermFactory = (permsMap) => (perm) => {
+  return permsMap ? permsMap[perm] : true;
+};
+
+const stripesStub = {
+  hasPerm: hasPermFactory(),
+};
+
+describe('useBankingInformationManager', () => {
   beforeEach(() => {
     Object
       .values(mutationsMock)
@@ -40,6 +54,9 @@ describe('useBankingAccountTypes', () => {
     useBankingInformationSettings
       .mockClear()
       .mockReturnValue({ enabled: true });
+    useStripes
+      .mockClear()
+      .mockReturnValue(stripesStub);
   });
 
   it('should handle banking information fields change', async () => {
@@ -100,4 +117,79 @@ describe('useBankingAccountTypes', () => {
     expect(mutationsMock.deleteBankingInformation).not.toHaveBeenCalled();
     expect(mutationsMock.updateBankingInformation).not.toHaveBeenCalled();
   });
+
+  describe('Permissions handling', () => {
+    it('edit banking information item', async () => {
+      useStripes.mockReturnValue({ hasPerm: hasPermFactory({ 'organizations.banking-information.item.put': true }) });
+
+      const { result } = renderHook(() => useBankingInformationManager());
+      const { manageBankingInformation } = result.current;
+
+      await manageBankingInformation({
+        initBankingInformation,
+        bankingInformation,
+        organization,
+      });
+
+      expect(mutationsMock.createBankingInformation).not.toHaveBeenCalled();
+      expect(mutationsMock.deleteBankingInformation).not.toHaveBeenCalled();
+      expect(mutationsMock.updateBankingInformation).toHaveBeenCalled();
+    });
+
+    it('create banking information item', async () => {
+      useStripes.mockReturnValue({ hasPerm: hasPermFactory({ 'organizations.banking-information.item.post': true }) });
+
+      const { result } = renderHook(() => useBankingInformationManager());
+      const { manageBankingInformation } = result.current;
+
+      await manageBankingInformation({
+        initBankingInformation,
+        bankingInformation,
+        organization,
+      });
+
+      expect(mutationsMock.createBankingInformation).toHaveBeenCalled();
+      expect(mutationsMock.deleteBankingInformation).not.toHaveBeenCalled();
+      expect(mutationsMock.updateBankingInformation).not.toHaveBeenCalled();
+    });
+
+    it('delete banking information item', async () => {
+      useStripes.mockReturnValue({ hasPerm: hasPermFactory({ 'organizations.banking-information.item.delete': true }) });
+
+      const { result } = renderHook(() => useBankingInformationManager());
+      const { manageBankingInformation } = result.current;
+
+      await manageBankingInformation({
+        initBankingInformation,
+        bankingInformation,
+        organization,
+      });
+
+      expect(mutationsMock.createBankingInformation).not.toHaveBeenCalled();
+      expect(mutationsMock.deleteBankingInformation).toHaveBeenCalled();
+      expect(mutationsMock.updateBankingInformation).not.toHaveBeenCalled();
+    });
+
+    it('create and edit banking information item', async () => {
+      const permsMap = {
+        'organizations.banking-information.item.post': true,
+        'organizations.banking-information.item.put': true,
+      };
+
+      useStripes.mockReturnValue({ hasPerm: hasPermFactory(permsMap) });
+
+      const { result } = renderHook(() => useBankingInformationManager());
+      const { manageBankingInformation } = result.current;
+
+      await manageBankingInformation({
+        initBankingInformation,
+        bankingInformation,
+        organization,
+      });
+
+      expect(mutationsMock.createBankingInformation).toHaveBeenCalled();
+      expect(mutationsMock.deleteBankingInformation).not.toHaveBeenCalled();
+      expect(mutationsMock.updateBankingInformation).toHaveBeenCalled();
+    });
+  });
 });