UIIN-2557-settings-options-for-number-generators

CHANGELOG.md

@@ -18,6 +18,7 @@
 * Sort holdings by location name and call number. Refs UIIN-3207.
 * Remove hover-over text next to "Shelving order" on the Item record detail view. Refs UIIN-3210.
 * CI: Switch to centralized/shared workflow from https://github.com/folio-org/.github. Fixes UIIN-3218.
+* Add settings options for using number gernerator for item barcode, accession number and call number. Refs UIIN-2557.
 
 ## [12.0.12](https://github.com/folio-org/ui-inventory/tree/v12.0.12) (2025-01-27)
 [Full Changelog](https://github.com/folio-org/ui-inventory/compare/v12.0.11...v12.0.12)

package.json

@@ -86,6 +86,7 @@
       "modes-of-issuance": "1.0",
       "nature-of-content-terms": "1.0",
       "search": "0.7 1.0 1.3",
+      "settings": "1.1",
       "source-storage-records": "3.3",
       "statistical-code-types": "1.0",
       "statistical-codes": "1.0",
@@ -569,6 +570,19 @@
         ],
         "visible": true
       },
+      {
+        "permissionName": "ui-inventory.settings.manage-number-generator-options",
+        "displayName": "Settings (Inventory): Manage number generator options",
+        "subPermissions": [
+          "settings.inventory.enabled",
+          "mod-settings.entries.collection.get",
+          "mod-settings.entries.item.post",
+          "mod-settings.entries.item.put",
+          "mod-settings.global.read.ui-inventory.number-generator-settings",
+          "mod-settings.global.write.ui-inventory.number-generator-settings"
+        ],
+        "visible": true
+      },
       {
         "permissionName": "ui-inventory.instance.view",
         "displayName": "Inventory: View instances, holdings, and items",

src/settings/InventorySettings/InventorySettings.js

@@ -46,6 +46,7 @@ import SubjectSourcesSettings from '../SubjectSourcesSettings';
 import SubjectTypesSettings from '../SubjectTypesSettings';
 import DisplaySettings from '../DisplaySettings';
 import CallNumberBrowseSettings from '../CallNumberBrowseSettings';
+import NumberGeneratorSettings from '../NumberGeneratorSettings';
 import {
   flattenCentralTenantPermissions,
   isUserInConsortiumMode,
@@ -282,6 +283,12 @@ const InventorySettings = (props) => {
             component: CallNumberTypes,
             perm: addPerm('ui-inventory.settings.call-number-types'),
           },
+          {
+            component: NumberGeneratorSettings,
+            label: <FormattedMessage id="ui-inventory.numberGenerator.options" />,
+            route: 'numberGeneratorOptions',
+            perm: 'ui-inventory.settings.manage-number-generator-options',
+          },
         ]
       },
     ];

src/settings/NumberGeneratorSettings/NumberGeneratorSettings.css

@@ -0,0 +1,9 @@
+@import '@folio/stripes-components/lib/variables';
+
+.marginBottomGutter {
+  margin-bottom: var(--gutter);
+}
+
+.greyLabel {
+  color: var(--checkable-disabled-fill);
+}

src/settings/NumberGeneratorSettings/NumberGeneratorSettings.js

@@ -0,0 +1,33 @@
+import { useMemo } from 'react';
+import { FormattedMessage } from 'react-intl';
+
+import { useStripes } from '@folio/stripes/core';
+import { ConfigManager } from '@folio/stripes/smart-components';
+
+import {
+  NUMBER_GENERATOR_SETTINGS_KEY,
+  NUMBER_GENERATOR_SETTINGS_SCOPE,
+} from './constants';
+import NumberGeneratorSettingsForm from './NumberGeneratorSettingsForm';
+
+const NumberGeneratorSettings = () => {
+  const stripes = useStripes();
+  const ConnectedConfigManager = useMemo(() => stripes.connect(ConfigManager), [stripes]);
+
+  const beforeSave = (data) => data || '';
+  const getInitialValues = (settings) => (settings?.[0]?.value || '');
+
+  return (
+    <ConnectedConfigManager
+      configName={NUMBER_GENERATOR_SETTINGS_KEY}
+      formType="final-form"
+      getInitialValues={getInitialValues}
+      label={<FormattedMessage id="ui-inventory.numberGenerator.options" />}
+      onBeforeSave={beforeSave}
+      scope={NUMBER_GENERATOR_SETTINGS_SCOPE}
+      configFormComponent={NumberGeneratorSettingsForm}
+    />
+  );
+};
+
+export default NumberGeneratorSettings;

src/settings/NumberGeneratorSettings/NumberGeneratorSettings.test.js

@@ -0,0 +1,33 @@
+import { render, screen } from '@folio/jest-config-stripes/testing-library/react';
+import { StripesContext } from '@folio/stripes/core';
+import { ConfigManager } from '@folio/stripes/smart-components';
+
+import NumberGeneratorSettings from './NumberGeneratorSettings';
+import { NUMBER_GENERATOR_SETTINGS_KEY, NUMBER_GENERATOR_SETTINGS_SCOPE } from './constants';
+
+jest.mock('@folio/stripes/smart-components', () => ({
+  ConfigManager: jest.fn(() => <div data-testid="config-manager" />),
+}));
+
+describe('NumberGeneratorSettings', () => {
+  it('renders ConfigManager with correct props', () => {
+    const mockStripes = {
+      connect: jest.fn((component) => component),
+    };
+
+    render(
+      <StripesContext.Provider value={mockStripes}>
+        <NumberGeneratorSettings />
+      </StripesContext.Provider>
+    );
+
+    expect(screen.getByTestId('config-manager')).toBeInTheDocument();
+    expect(ConfigManager).toHaveBeenCalledWith(
+      expect.objectContaining({
+        configName: NUMBER_GENERATOR_SETTINGS_KEY,
+        scope: NUMBER_GENERATOR_SETTINGS_SCOPE,
+      }),
+      expect.any(Object)
+    );
+  });
+});

src/settings/NumberGeneratorSettings/NumberGeneratorSettingsForm.js

@@ -0,0 +1,255 @@
+import PropTypes from 'prop-types';
+import { Field } from 'react-final-form';
+import { FormattedMessage } from 'react-intl';
+import { upperFirst } from 'lodash';
+
+import {
+  Accordion,
+  AccordionSet,
+  AccordionStatus,
+  Button,
+  Checkbox,
+  Col,
+  ExpandAllButton,
+  Label,
+  MessageBanner,
+  Pane,
+  PaneFooter,
+  PaneHeader,
+  RadioButton,
+  Row,
+} from '@folio/stripes/components';
+import stripesFinalForm from '@folio/stripes/final-form';
+
+import css from './NumberGeneratorSettings.css';
+import {
+  ACCESSION_NUMBER_SETTING,
+  BARCODE_SETTING,
+  CALL_NUMBER_SETTING,
+  NUMBER_GENERATOR_OPTIONS,
+  USE_SHARED_NUMBER,
+} from './constants';
+
+const NumberGeneratorSettingsForm = ({
+  pristine,
+  submitting,
+  handleSubmit,
+  values,
+}) => {
+  const disableSharedNumber =
+    values?.accessionNumber === NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD ||
+    values?.callNumber === NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD;
+  const disableGeneratorOffOption = values?.useSharedNumber;
+
+  const paneHeader = (renderProps) => (
+    <PaneHeader
+      {...renderProps}
+      paneTitle={<FormattedMessage id="ui-inventory.numberGenerator.options" />}
+    />
+  );
+
+  const paneFooter = (
+    <PaneFooter
+      renderEnd={
+        <Button
+          buttonStyle="primary mega"
+          disabled={pristine || submitting}
+          id="clickable-save-number-generator-settings"
+          onClick={handleSubmit}
+          type="submit"
+        >
+          <FormattedMessage id="stripes-core.button.save" />
+        </Button>
+      }
+    />
+  );
+
+  return (
+    <form onSubmit={handleSubmit} id="numberGeneratorSettingsForm">
+      <Pane
+        defaultWidth="fill"
+        footer={paneFooter}
+        id="number-generator-settings-form"
+        renderHeader={paneHeader}
+      >
+        <Row className={css.marginBottomGutter}>
+          <Col xs={12}>
+            <MessageBanner>
+              <p><FormattedMessage id="ui-inventory.numberGenerator.info" /></p>
+            </MessageBanner>
+          </Col>
+        </Row>
+        <AccordionStatus>
+          <Row end="xs">
+            <Col xs>
+              <ExpandAllButton />
+            </Col>
+          </Row>
+          <AccordionSet initialStatus={{}}>
+            <Accordion
+              id="acc01"
+              label={<FormattedMessage id="ui-inventory.holdings" />}
+            >
+              <Row className={css.marginBottomGutter}>
+                <Col xs={12}>
+                  <Label><FormattedMessage id="ui-inventory.numberGenerator.callNumber" /></Label>
+                  <Field
+                    component={RadioButton}
+                    id={`${CALL_NUMBER_SETTING}Holdings${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setManually" values={{ number: 'call number' }} />}
+                    name={`${CALL_NUMBER_SETTING}Holdings`}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${CALL_NUMBER_SETTING}Holdings${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_BOTH)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGeneratorOrManually" values={{ number: 'call number' }} />}
+                    name={`${CALL_NUMBER_SETTING}Holdings`}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_BOTH}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${CALL_NUMBER_SETTING}Holdings${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_GENERATOR)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGenerator" values={{ number: 'call number' }} />}
+                    name={`${CALL_NUMBER_SETTING}Holdings`}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_GENERATOR}
+                  />
+                </Col>
+              </Row>
+            </Accordion>
+            <Accordion
+              id="acc02"
+              label={<FormattedMessage id="ui-inventory.items" />}
+            >
+              <Row className={css.marginBottomGutter}>
+                <Col xs={12}>
+                  <Label><FormattedMessage id="ui-inventory.numberGenerator.barcode" /></Label>
+                  <Field
+                    component={RadioButton}
+                    id={`${BARCODE_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setManually" values={{ number: 'barcode' }} />}
+                    name={BARCODE_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${BARCODE_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_BOTH)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGeneratorOrManually" values={{ number: 'barcode' }} />}
+                    name={BARCODE_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_BOTH}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${BARCODE_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_GENERATOR)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGenerator" values={{ number: 'barcode' }} />}
+                    name={BARCODE_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_GENERATOR}
+                  />
+                </Col>
+              </Row>
+              <Row className={css.marginBottomGutter}>
+                <Col xs={12}>
+                  <Label><FormattedMessage id="ui-inventory.numberGenerator.accessionNumber" /></Label>
+                  <Field
+                    className={disableGeneratorOffOption ? css.greyLabel : null}
+                    component={RadioButton}
+                    disabled={disableGeneratorOffOption}
+                    id={`${ACCESSION_NUMBER_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setManually" values={{ number: 'accession number' }} />}
+                    name={ACCESSION_NUMBER_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${ACCESSION_NUMBER_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_BOTH)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGeneratorOrManually" values={{ number: 'accession number' }} />}
+                    name={ACCESSION_NUMBER_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_BOTH}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${ACCESSION_NUMBER_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_GENERATOR)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGenerator" values={{ number: 'accession number' }} />}
+                    name={ACCESSION_NUMBER_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_GENERATOR}
+                  />
+                </Col>
+              </Row>
+              <Row className={css.marginBottomGutter}>
+                <Col xs={12}>
+                  <Label><FormattedMessage id="ui-inventory.numberGenerator.callNumber" /></Label>
+                  <Field
+                    className={disableGeneratorOffOption ? css.greyLabel : null}
+                    component={RadioButton}
+                    disabled={disableGeneratorOffOption}
+                    id={`${CALL_NUMBER_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setManually" values={{ number: 'call number' }} />}
+                    name={CALL_NUMBER_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_TEXT_FIELD}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${CALL_NUMBER_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_BOTH)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGeneratorOrManually" values={{ number: 'call number' }} />}
+                    name={CALL_NUMBER_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_BOTH}
+                  />
+                  <Field
+                    component={RadioButton}
+                    id={`${CALL_NUMBER_SETTING}${upperFirst(NUMBER_GENERATOR_OPTIONS.USE_GENERATOR)}`}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.setGenerator" values={{ number: 'call number' }} />}
+                    name={CALL_NUMBER_SETTING}
+                    type="radio"
+                    value={NUMBER_GENERATOR_OPTIONS.USE_GENERATOR}
+                  />
+                </Col>
+              </Row>
+              <Row>
+                <Col xs={12}>
+                  <Field
+                    component={Checkbox}
+                    disabled={disableSharedNumber}
+                    id={USE_SHARED_NUMBER}
+                    label={<FormattedMessage id="ui-inventory.numberGenerator.accessionNumberEqualCallNumber" />}
+                    name={USE_SHARED_NUMBER}
+                    type="checkbox"
+                  />
+                  {disableSharedNumber &&
+                    <MessageBanner type="warning">
+                      <FormattedMessage id="ui-inventory.numberGenerator.accessionNumberEqualCallNumber.warning" />
+                    </MessageBanner>
+                  }
+                </Col>
+              </Row>
+            </Accordion>
+          </AccordionSet>
+        </AccordionStatus>
+      </Pane>
+    </form>
+  );
+};
+
+NumberGeneratorSettingsForm.propTypes = {
+  pristine: PropTypes.bool,
+  submitting: PropTypes.bool,
+  handleSubmit: PropTypes.func.isRequired,
+  values: PropTypes.object,
+};
+
+export default stripesFinalForm({
+  enableReinitialize: true,
+  keepDirtyOnReinitialize: true,
+  navigationCheck: true,
+  subscription: { values: true },
+})(NumberGeneratorSettingsForm);