UIORGS-442 Add claiming to organization integration details

CHANGELOG.md

@@ -5,6 +5,7 @@
 * *BREAKING* Display all versions in change log in fourth pane. Refs UIORGS-355.
 * Show in version history record view, which fields have been edited. Refs UIORGS-356.
 * Adapt organization metadata fields to version history mechanism. Refs UIORGS-359.
+* Add claiming to organization integration details. Refs UIORGS-442.
 
 ## [5.2.0](https://github.com/folio-org/ui-organizations/tree/v5.2.0) (2024-10-31)
 [Full Changelog](https://github.com/folio-org/ui-organizations/compare/v5.1.1...v5.2.0)

src/OrganizationIntegration/OrganizationIntegrationCreate/OrganizationIntegrationCreate.js

@@ -17,9 +17,12 @@ import {
 
 import {
   EDI_CODE_TYPES,
+  FILE_FORMAT,
   FTP_TYPES,
+  TRANSMISSION_METHOD,
   TRANSMISSION_MODES,
   CONNECTION_MODES,
+  INTEGRATION_TYPE,
 } from '../constants';
 import {
   buildAvailableAccounts,
@@ -38,6 +41,9 @@ const buildInitialValues = (organization, withMigration) => {
     exportTypeSpecificParameters: {
       vendorEdiOrdersExportConfig: {
         vendorId: organization.id,
+        integrationType: INTEGRATION_TYPE.claiming,
+        transmissionMethod: TRANSMISSION_METHOD.fileDownLoad,
+        fileFormat: FILE_FORMAT.csv,
         ediConfig: {
           vendorEdiCode: edi.vendorEdiCode,
           vendorEdiType: edi.vendorEdiType || EDI_CODE_TYPES[0].value,

src/OrganizationIntegration/OrganizationIntegrationForm/EdiForm/EdiForm.js

@@ -1,7 +1,10 @@
-import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
+import { useMemo } from 'react';
+import {
+  Field,
+  useForm,
+} from 'react-final-form';
 import { FormattedMessage } from 'react-intl';
-import { Field, useForm } from 'react-final-form';
 
 import {
   Accordion,
@@ -13,61 +16,30 @@ import {
   TextArea,
   TextField,
 } from '@folio/stripes/components';
-import {
-  validateRequired,
-} from '@folio/stripes-acq-components';
+import { validateRequired } from '@folio/stripes-acq-components';
 
 import {
   EDI_CODE_TYPES,
   EDI_NAMING_TOKENS,
 } from '../../constants';
 import {
-  getAccountOptions,
   getAcqMethodOptions,
+  isFileFormatEDI,
 } from '../../utils';
 
-export const EdiForm = ({
-  acqMethods = [],
-  accounts = [],
-}) => {
+export const EdiForm = ({ acqMethods }) => {
   const { getState } = useForm();
 
   const acqMethodOptions = useMemo(() => getAcqMethodOptions(acqMethods), [acqMethods]);
-  const accountOptions = useMemo(() => getAccountOptions(accounts), [accounts]);
 
-  const isDefaultConfig = getState()
-    ?.values
-    ?.exportTypeSpecificParameters
-    ?.vendorEdiOrdersExportConfig
-    ?.isDefaultConfig;
+  const isFormatEDI = isFileFormatEDI(getState()?.values);
 
   return (
     <Accordion
       id="edi"
       label={<FormattedMessage id="ui-organizations.integration.edi" />}
     >
       <Row>
-        {
-          !isDefaultConfig && (
-            <Col
-              data-test-edi-account-numbers
-              xs={6}
-              md={3}
-            >
-              <Field
-                label={<FormattedMessage id="ui-organizations.integration.edi.accountNumbers" />}
-                name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.ediConfig.accountNoList"
-                component={Select}
-                dataOptions={accountOptions}
-                fullWidth
-                multiple
-                required
-                validate={validateRequired}
-              />
-            </Col>
-          )
-        }
-
         <Col
           data-test-edi-acq-methods
           xs={6}
@@ -94,8 +66,8 @@ export const EdiForm = ({
             id="vendorEdiCode"
             label={<FormattedMessage id="ui-organizations.integration.edi.vendorEDICode" />}
             name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.ediConfig.vendorEdiCode"
-            required
-            validate={validateRequired}
+            required={isFormatEDI}
+            validate={isFormatEDI ? validateRequired : undefined}
           />
         </Col>
 
@@ -124,8 +96,8 @@ export const EdiForm = ({
             id="libEdiCode"
             label={<FormattedMessage id="ui-organizations.integration.edi.libraryEDICode" />}
             name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.ediConfig.libEdiCode"
-            required
-            validate={validateRequired}
+            required={isFormatEDI}
+            validate={isFormatEDI ? validateRequired : undefined}
           />
         </Col>
 
@@ -226,5 +198,4 @@ export const EdiForm = ({
 
 EdiForm.propTypes = {
   acqMethods: PropTypes.arrayOf(PropTypes.object),
-  accounts: PropTypes.arrayOf(PropTypes.string),
 };

src/OrganizationIntegration/OrganizationIntegrationForm/FtpForm/FtpForm.js

@@ -1,6 +1,8 @@
-import React from 'react';
 import { FormattedMessage } from 'react-intl';
-import { Field } from 'react-final-form';
+import {
+  Field,
+  useForm,
+} from 'react-final-form';
 
 import {
   Accordion,
@@ -24,8 +26,13 @@ import {
   TRANSMISSION_MODES,
   CONNECTION_MODES,
 } from '../../constants';
+import { isTransmissionMethodFTP } from '../../utils';
 
 export const FtpForm = () => {
+  const { getState } = useForm();
+
+  const isMethodFTP = isTransmissionMethodFTP(getState()?.values);
+
   return (
     <Accordion
       id="ftp"
@@ -69,10 +76,10 @@ export const FtpForm = () => {
             label={<FormattedMessage id="ui-organizations.integration.ftp.serverAddress" />}
             name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.ediFtp.serverAddress"
             type="text"
-            validate={validateURLRequired}
+            validate={isMethodFTP ? validateURLRequired : undefined}
             component={TextField}
             fullWidth
-            required
+            required={isMethodFTP}
             validateFields={[]}
           />
         </Col>
@@ -139,9 +146,9 @@ export const FtpForm = () => {
             type="number"
             component={TextField}
             fullWidth
-            required
+            required={isMethodFTP}
             validateFields={[]}
-            validate={validateRequired}
+            validate={isMethodFTP ? validateRequired : undefined}
           />
         </Col>
         <Col

src/OrganizationIntegration/OrganizationIntegrationForm/IntegrationInfoForm/IntegrationInfoForm.js

@@ -1,21 +1,85 @@
-import React from 'react';
 import PropTypes from 'prop-types';
-import { FormattedMessage } from 'react-intl';
-import { Field } from 'react-final-form';
+import { useMemo } from 'react';
+import {
+  Field,
+  useForm,
+} from 'react-final-form';
+import {
+  FormattedMessage,
+  useIntl,
+} from 'react-intl';
 
 import {
   Accordion,
   Checkbox,
   Col,
   Row,
+  Select,
   TextArea,
   TextField,
 } from '@folio/stripes/components';
+import { validateRequired } from '@folio/stripes-acq-components';
+
+import {
+  FILE_FORMAT,
+  INTEGRATION_TYPE,
+  TRANSMISSION_METHOD,
+} from '../../constants';
 import {
-  validateRequired,
-} from '@folio/stripes-acq-components';
+  getAccountOptions,
+  getFileFormatOptions,
+  getIntegrationTypeOptions,
+  getTransmissionMethodOptions,
+  isFileFormatEDI,
+  isOrderingIntegration,
+} from '../../utils';
+
+export const IntegrationInfoForm = ({
+  accounts,
+  defaultIntegration,
+}) => {
+  const intl = useIntl();
+  const {
+    batch,
+    change,
+    getState,
+  } = useForm();
+
+  const formValues = getState()?.values;
+
+  const isFormatEDI = isFileFormatEDI(formValues);
+  const isOrderingType = isOrderingIntegration(formValues);
+
+  const isDefaultConfig = formValues
+    ?.exportTypeSpecificParameters
+    ?.vendorEdiOrdersExportConfig
+    ?.isDefaultConfig;
+
+  const accountOptions = useMemo(() => getAccountOptions(accounts), [accounts]);
+
+  const integrationTypeOptions = useMemo(() => getIntegrationTypeOptions(intl), [intl]);
+  const transmissionMethodOptions = useMemo(() => getTransmissionMethodOptions(intl), [intl]);
+  const fileFormatOptions = useMemo(() => getFileFormatOptions(), []);
+
+  const handleIntegrationTypeChange = ({ target: { value } }) => {
+    batch(() => {
+      change('exportTypeSpecificParameters.vendorEdiOrdersExportConfig.integrationType', value);
+
+      switch (value) {
+        case INTEGRATION_TYPE.ordering: {
+          change('exportTypeSpecificParameters.vendorEdiOrdersExportConfig.transmissionMethod', TRANSMISSION_METHOD.ftp);
+          change('exportTypeSpecificParameters.vendorEdiOrdersExportConfig.fileFormat', FILE_FORMAT.edi);
+          break;
+        }
+        case INTEGRATION_TYPE.claiming: {
+          change('exportTypeSpecificParameters.vendorEdiOrdersExportConfig.ediSchedule', null);
+          break;
+        }
+        default: break;
+      }
+    });
+  };
 
-export const IntegrationInfoForm = ({ defaultIntegration }) => {
   return (
     <Accordion
       id="integrationInfo"
@@ -53,10 +117,66 @@ export const IntegrationInfoForm = ({ defaultIntegration }) => {
           />
         </Col>
       </Row>
+      <Row>
+        <Col xs={3}>
+          <Field
+            component={Select}
+            dataOptions={integrationTypeOptions}
+            fullWidth
+            label={<FormattedMessage id="ui-organizations.integration.info.integrationType" />}
+            name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.integrationType"
+            onChange={handleIntegrationTypeChange}
+            required
+          />
+        </Col>
+        <Col xs={3}>
+          <Field
+            component={Select}
+            dataOptions={transmissionMethodOptions}
+            disabled={isOrderingType}
+            fullWidth
+            label={<FormattedMessage id="ui-organizations.integration.info.transmissionMethod" />}
+            name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.transmissionMethod"
+            required
+          />
+        </Col>
+        <Col xs={3}>
+          <Field
+            component={Select}
+            dataOptions={fileFormatOptions}
+            disabled={isOrderingType}
+            fullWidth
+            label={<FormattedMessage id="ui-organizations.integration.info.fileFormat" />}
+            name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.fileFormat"
+            required
+          />
+        </Col>
+        {
+          !isDefaultConfig && (
+            <Col
+              data-test-edi-account-numbers
+              xs={6}
+              md={3}
+            >
+              <Field
+                label={<FormattedMessage id="ui-organizations.integration.edi.accountNumbers" />}
+                name="exportTypeSpecificParameters.vendorEdiOrdersExportConfig.ediConfig.accountNoList"
+                component={Select}
+                dataOptions={accountOptions}
+                fullWidth
+                multiple
+                required={isFormatEDI}
+                validate={isFormatEDI ? validateRequired : undefined}
+              />
+            </Col>
+          )
+        }
+      </Row>
     </Accordion>
   );
 };
 
 IntegrationInfoForm.propTypes = {
+  accounts: PropTypes.arrayOf(PropTypes.string),
   defaultIntegration: PropTypes.object,
 };