UITEN-278 - create reading room from tenant settings

CHANGELOG.md

@@ -4,6 +4,9 @@
 
 * [UITEN-274](https://folio-org.atlassian.net/browse/UITEN-274) Use Save & close button label stripes-component translation key.
 * [UITEN-280](https://folio-org.atlassian.net/browse/UITEN-280) Conditionally include SSO Settings based on login-saml interface.
+* [UITEN-277](https://issues.folio.org/browse/UITEN-277) Ensure Reading Room Access settings page is wrapped by `Title Manager`.
+* [UITEN-276](https://issues.folio.org/browse/UITEN-276) Reading Room Access (settings): Basic Layout.
+* [UITEN-278] (https://issues.folio.org/browse/UITEN-278) Reading Room Access (settings): Create new reading room.
 
 ## [8.1.0](https://github.com/folio-org/ui-tenant-settings/tree/v8.1.0)(2024-03-19)
 [Full Changelog](https://github.com/folio-org/ui-tenant-settings/compare/v8.0.0...v8.1.0)

package.json

@@ -17,7 +17,13 @@
     "route": "/tenant-settings",
     "okapiInterfaces": {
       "configuration": "2.0",
+<<<<<<< Updated upstream
       "users": "15.0 16.0"
+=======
+      "login-saml": "2.0",
+      "users": "15.0 16.0",
+      "reading-room": "1.0"
+>>>>>>> Stashed changes
     },
     "optionalOkapiInterfaces": {
       "location-units": "2.0",

src/settings/ReadingRoomAccess/ReadingRoomAccess.js

@@ -0,0 +1,146 @@
+import React from 'react';
+import { useIntl } from 'react-intl';
+import { Field } from 'redux-form';
+import _ from 'lodash';
+
+import { TitleManager, useStripes } from '@folio/stripes/core';
+import {
+  Checkbox,
+  Label,
+  MultiSelection,
+} from '@folio/stripes/components';
+import { ControlledVocab } from '@folio/stripes/smart-components';
+
+const hiddenFields = ['numberOfObjects', 'lastUpdated'];
+const visibleFields = ['name', 'isPublic', 'servicePoints'];
+const formatter = {
+  'isPublic': (record) => <Checkbox checked={record.isPublic} disabled />,
+  'servicePoints': (record) => {
+    const asp = record.servicePoints || [];
+    const items = asp.map(a => <li key={a.label}>{a.label}</li>);
+    return <ul className="marginBottom0">{items}</ul>;
+  }
+};
+const translations = {
+  cannotDeleteTermHeader: 'ui-tenant-settings.settings.addresses.cannotDeleteTermHeader',
+  cannotDeleteTermMessage: 'ui-tenant-settings.settings.addresses.cannotDeleteTermMessage',
+  deleteEntry: 'ui-tenant-settings.settings.reading-room-access.deleteEntry',
+  termDeleted: 'ui-tenant-settings.settings.reading-room-access.termDeleted',
+  termWillBeDeleted: 'ui-tenant-settings.settings.reading-room-access.termWillBeDeleted',
+};
+
+const ReadingRoomAccess = (props) => {
+  const intl = useIntl();
+  const stripes = useStripes();
+  const { resources } = props;
+  // service points defined in the tenant
+  const servicePoints = _.get(resources, ['RRAServicePoints', 'records', 0, 'servicepoints'], []);
+  /**
+   * A reading room can have more than one service points assigned to it.
+   * but a servicepoint cannot be mapped to more than one reading room
+  */
+  const sps = [];
+  const rrs = _.get(resources, ['values', 'records']);
+  rrs.forEach(rr => {
+    const asp = rr.servicePoints || [];
+    asp.forEach(s => {
+      if (!sps.includes(s.value)) {
+        sps.push(s.value);
+      }
+    });
+  });
+
+  const options = [];
+  servicePoints.forEach(s => {
+    if (!sps.includes(s.id) || s.name === 'None') {
+      options.push({ value: s.id, label: s.name });
+    }
+  });
+
+  const columnMapping = {
+    name: (
+      <Label tagName="span" required>
+        {
+        intl.formatMessage({ id:'ui-tenant-settings.settings.reading-room-access.name' })
+      }
+      </Label>),
+    isPublic: intl.formatMessage({ id:'ui-tenant-settings.settings.reading-room-access.public' }),
+    servicePoints: (
+      <Label tagName="span" required>
+        {
+          intl.formatMessage({ id:'ui-tenant-settings.settings.reading-room-access.asp' })
+        }
+      </Label>),
+  };
+
+  const fieldComponents = {
+    isPublic: ({ fieldProps }) => (
+      <Field
+        {...fieldProps}
+        component={Checkbox}
+        type="checkbox"
+      />
+    ),
+    servicePoints: ({ fieldProps }) => {
+      return (
+        <Field
+          {...fieldProps}
+          id="rra-service-point"
+          component={MultiSelection}
+          aria-labelledby="associated-service-point-label"
+          dataOptions={options}
+          renderToOverlay
+          marginBottom0
+          validationEnabled
+          onBlur={e => e.preventDefault()}
+        />
+      );
+    }
+  };
+
+  const editable = true; // stripes.hasPerm('ui-users.settings.reading-room-access.all');
+
+  return (
+    <TitleManager page={intl.formatMessage({ id: 'ui-tenant-settings.settings.reading-room.title' })}>
+      <ControlledVocab
+        {...props}
+        id="reading-room-access-settings"
+        baseUrl="reading-room"
+        stripes={stripes}
+        label={intl.formatMessage({ id: 'ui-tenant-settings.settings.reading-room-access.label' })}
+        objectLabel={intl.formatMessage({ id: 'ui-tenant-settings.settings.reading-room-access.label' })}
+        records="readingRooms"
+        visibleFields={visibleFields}
+        columnMapping={columnMapping}
+        hiddenFields={hiddenFields}
+        formatter={formatter}
+        translations={translations}
+        editable={editable}
+        fieldComponents={fieldComponents}
+        actionSuppressor={{
+          edit: () => true,
+          delete: () => true,
+        }}
+      />
+    </TitleManager>
+  );
+};
+
+ReadingRoomAccess.manifest = Object.freeze({
+  values: {
+    type: 'okapi',
+    records: 'readingRooms',
+    path: 'reading-room',
+    GET: {
+      path: 'reading-room?query=cql.allRecords=1 sortby name&limit=100'
+    }
+  },
+  updaterIds: [],
+  RRAServicePoints: {
+    type: 'okapi',
+    resource: 'service-points',
+    path: 'service-points?limit=200',
+  },
+});
+
+export default ReadingRoomAccess;

src/settings/ReadingRoomAccess/ReadingRoomAccess.test.js

@@ -0,0 +1,122 @@
+import { screen } from '@testing-library/react';
+
+import '../../../test/jest/__mocks__';
+import buildStripes from '../../../test/jest/__new_mocks__/stripesCore.mock';
+
+import {
+  renderWithRouter,
+  renderWithReduxForm,
+} from '../../../test/jest/helpers';
+
+import ReadingRoomAccess from './ReadingRoomAccess';
+
+const STRIPES = buildStripes();
+
+const mutatorMock = {
+  values: {
+    // PUT: jest.fn(() => Promise.resolve()),
+    // DELETE: jest.fn(() => Promise.resolve()),
+    GET: jest.fn(() => Promise.resolve()),
+    POST: jest.fn(() => Promise.resolve()),
+  },
+};
+
+const resourcesMock = {
+  values: {
+    dataKey: 'reading-room',
+    failed: false,
+    hasLoaded: true,
+    httpStatus: 200,
+    isPending: false,
+    module: '@folio/tenant-settings',
+    records: [
+      {
+        'id': '04efd73f-f7e3-4c19-8614-861941dd1d8e',
+        'name': 'readingroom-422',
+        'isPublic': true,
+        'servicePoints': [
+          {
+            'value': '7c5abc9f-f3d7-4856-b8d7-6712462ca007',
+            'label': 'Online'
+          }
+        ],
+        'metadata': {
+          'createdDate': '2024-04-22T11:41:52.904334',
+          'createdByUserId': '2db30b15-7a36-4f02-9c77-999dbb470874'
+        }
+      },
+      {
+        'id': '75e44262-f68c-418c-ab4c-88c9198669c1',
+        'name': 'reading-room-4221',
+        'isPublic': true,
+        'servicePoints': [
+          {
+            'value': '3a40852d-49fd-4df2-a1f9-6e2641a6e91f',
+            'label': 'Circ Desk 1'
+          }
+        ],
+        'metadata': {
+          'createdDate': '2024-04-22T11:48:50.255863',
+          'createdByUserId': '2db30b15-7a36-4f02-9c77-999dbb470874'
+        }
+      },
+      {
+        'id': '7c5abc9f-f3d7-4856-b8d7-6712462ca009',
+        'name': 'reading-room-555',
+        'isPublic': false,
+        'servicePoints': [
+          {
+            'value': 'c4c90014-c8c9-4ade-8f24-b5e313319f4b',
+            'label': 'Circ Desk 4'
+          }
+        ],
+        'metadata': {
+          'createdDate': '2024-04-19T11:56:15.192057',
+          'createdByUserId': '2db30b15-7a36-4f02-9c77-999dbb470874',
+          'updatedDate': '2024-04-22T04:38:00.75285',
+          'updatedByUserId': '2db30b15-7a36-4f02-9c77-999dbb470874'
+        }
+      }
+    ],
+  },
+};
+
+const renderReadingRoomAccess = (props) => {
+  const component = () => (
+    <ReadingRoomAccess {...props} />
+  );
+
+  return renderWithRouter(renderWithReduxForm(component));
+};
+
+describe('Reading Room Access', () => {
+  describe('when records exist', () => {
+    const props = {
+      mutator: mutatorMock,
+      resources: resourcesMock,
+      stripes:{ STRIPES }
+    };
+
+    beforeEach(() => {
+      renderReadingRoomAccess(props);
+    });
+
+    it('should render a Pane with title "Reading room access"', () => {
+      expect(screen.getByLabelText('ui-tenant-settings.settings.reading-room-access.label')).toBeInTheDocument();
+    });
+
+    it('should render new button', () => {
+      expect(screen.getByRole('button', { name: 'stripes-core.button.new' })).toBeVisible();
+    });
+
+    it('should render correct result column', () => {
+      const columnHeaders = [
+        /settings.reading-room-access.name/,
+        /settings.reading-room-access.public/,
+        /settings.reading-room-access.asp/
+      ];
+
+      columnHeaders.forEach((el) => expect(screen.getByRole('columnheader', { name: el })).toBeVisible());
+    });
+  });
+});