UIBULKED-349 Update Electronic access - URL relationship

CHANGELOG.md

@@ -11,6 +11,7 @@
 * [UIBULKED-332](https://issues.folio.org/browse/UIBULKED-332) Bulk edit actions for holdings notes - find and replace or remove.
 * [UIBULKED-333](https://issues.folio.org/browse/UIBULKED-333) Bulk edit actions for holdings notes - change note type.
 * [UIBULKED-377](https://issues.folio.org/browse/UIBULKED-377) Not all note types are displayed using "Change note type".
+* [UIBULKED-349](https://issues.folio.org/browse/UIBULKED-349) Update Electronic access - URL relationship
 
 ## [4.0.0](https://github.com/folio-org/ui-bulk-edit/tree/v4.0.0) (2023-10-12)
 

src/components/BulkEditList/BulkEditListResult/BulkEditInApp/ContentUpdatesForm/ActionsRow.js

@@ -36,7 +36,13 @@ export const ActionsRow = ({ option, actions, onChange }) => {
 
         {/* Render value fields only in case if actions selected AND action is not from FINAL_ACTIONS */}
         {action.name && !FINAL_ACTIONS.includes(action.name) && (
-          <ValuesColumn option={option} action={action} actionIndex={actionIndex} onChange={onChange} />
+          <ValuesColumn
+            option={option}
+            action={action}
+            allActions={actions}
+            actionIndex={actionIndex}
+            onChange={onChange}
+          />
         )}
 
         {/* Render additional actions  */}

src/components/BulkEditList/BulkEditListResult/BulkEditInApp/ContentUpdatesForm/ValuesColumn.js

@@ -16,16 +16,17 @@ import {
   CAPABILITIES,
   CONTROL_TYPES,
   getDuplicateNoteOptions, getHoldingsNotes,
-  getItemStatusOptions,
+  getItemStatusOptions, getItemsWithPlaceholder,
   getNotesOptions,
 } from '../../../../../constants';
 import { FIELD_VALUE_KEY, TEMPORARY_LOCATIONS } from './helpers';
 import { useLoanTypes, usePatronGroup } from '../../../../../hooks/api';
 import { useItemNotes } from '../../../../../hooks/api/useItemNotes';
 import { usePreselectedValue } from '../../../../../hooks/usePreselectedValue';
 import { useHoldingsNotes } from '../../../../../hooks/api/useHoldingsNotes';
+import { useElectronicAccessRelationships } from '../../../../../hooks/api/useElectronicAccess';
 
-export const ValuesColumn = ({ action, actionIndex, onChange, option }) => {
+export const ValuesColumn = ({ action, allActions, actionIndex, onChange, option }) => {
   const { formatMessage } = useIntl();
   const location = useLocation();
   const search = new URLSearchParams(location.search);
@@ -38,6 +39,12 @@ export const ValuesColumn = ({ action, actionIndex, onChange, option }) => {
   const { userGroups } = usePatronGroup({ enabled: isUserCapability });
   const { loanTypes, isLoanTypesLoading } = useLoanTypes({ enabled: isItemCapability });
   const { itemNotes, usItemNotesLoading } = useItemNotes({ enabled: isItemCapability });
+
+  const { electronicAccessRelationships, isElectronicAccessLoading } = useElectronicAccessRelationships({ enabled: isHoldingsCapability });
+  const filteredElectronicAccessRelationships = getItemsWithPlaceholder(
+    electronicAccessRelationships.filter(item => actionIndex === 0 || item.value !== allActions[0]?.value),
+  );
+
   const { holdingsNotes, isHoldingsNotesLoading } = useHoldingsNotes({ enabled: isHoldingsCapability });
   const duplicateNoteOptions = getDuplicateNoteOptions(formatMessage).filter(el => el.value !== option);
 
@@ -130,16 +137,16 @@ export const ValuesColumn = ({ action, actionIndex, onChange, option }) => {
     <>
       <LocationSelection
         value={actionValue}
-        onSelect={location => onChange({ actionIndex, value: location.id, fieldName: FIELD_VALUE_KEY })}
+        onSelect={loc => onChange({ actionIndex, value: loc.id, fieldName: FIELD_VALUE_KEY })}
         placeholder={formatMessage({ id: 'ui-bulk-edit.layer.selectLocation' })}
         data-test-id={`textField-${actionIndex}`}
         aria-label={formatMessage({ id: 'ui-bulk-edit.ariaLabel.location' })}
       />
       <LocationLookup
         marginBottom0
         isTemporaryLocation={TEMPORARY_LOCATIONS.includes(option)}
-        onLocationSelected={(location) => onChange({
-          actionIndex, value: location.id, fieldName: FIELD_VALUE_KEY,
+        onLocationSelected={(loc) => onChange({
+          actionIndex, value: loc.id, fieldName: FIELD_VALUE_KEY,
         })}
         data-testid={`locationLookup-${actionIndex}`}
       />
@@ -204,6 +211,17 @@ export const ValuesColumn = ({ action, actionIndex, onChange, option }) => {
   />
   );
 
+  const renderElectronicAccessRelationshipSelect = () => controlType === CONTROL_TYPES.ELECTRONIC_ACCESS_RELATIONSHIP_SELECT && (
+    <Select
+      id="urlRelationship"
+      value={action.value}
+      loading={isElectronicAccessLoading}
+      onChange={e => onChange({ actionIndex, value: e.target.value, fieldName: FIELD_VALUE_KEY })}
+      dataOptions={filteredElectronicAccessRelationships}
+      aria-label={formatMessage({ id: 'ui-bulk-edit.ariaLabel.loanTypeSelect' })}
+    />
+  );
+
   return (
     <Col xs={2} sm={2}>
       {renderTextField()}
@@ -215,6 +233,7 @@ export const ValuesColumn = ({ action, actionIndex, onChange, option }) => {
       {renderLoanTypeSelect()}
       {renderNoteTypeSelect()}
       {renderNoteDuplicateTypeSelect()}
+      {renderElectronicAccessRelationshipSelect()}
     </Col>
   );
 };
@@ -227,5 +246,10 @@ ValuesColumn.propTypes = {
     value: PropTypes.string,
   }),
   actionIndex: PropTypes.number,
+  allActions: PropTypes.arrayOf(PropTypes.shape({
+    controlType: PropTypes.func,
+    name: PropTypes.string,
+    value: PropTypes.string,
+  })),
   onChange: PropTypes.func,
 };

src/components/BulkEditList/BulkEditListResult/BulkEditInApp/ContentUpdatesForm/helpers.js

@@ -19,7 +19,7 @@ import {
   statusActions,
   noteActions,
   noteActionsWithMark,
-  noteActionsWithDuplicate,
+  noteActionsWithDuplicate, urlReletionshipActions, urlReletionshipAdditionalActions,
 } from '../../../../../constants';
 
 export const ACTION_VALUE_KEY = 'name';
@@ -291,6 +291,20 @@ export const getDefaultActions = (option, options, formatMessage) => {
         ],
       };
 
+    case OPTIONS.URL_RELATIONSHIP:
+      return {
+        type: '',
+        actions: [
+          null,
+          {
+            actionsList: urlReletionshipActions(formatMessage),
+            controlType: () => CONTROL_TYPES.ELECTRONIC_ACCESS_RELATIONSHIP_SELECT,
+            [ACTION_VALUE_KEY]: noteDefaultActions[0].value,
+            [FIELD_VALUE_KEY]: '',
+          },
+        ],
+      };
+
     default:
       return {
         type: null,
@@ -368,6 +382,14 @@ export const getExtraActions = (option, action, formattedMessage) => {
         [FIELD_VALUE_KEY]: '',
       }];
 
+    case `${OPTIONS.URL_RELATIONSHIP}-${ACTIONS.FIND}`:
+      return [{
+        actionsList: urlReletionshipAdditionalActions(formattedMessage),
+        controlType: () => CONTROL_TYPES.ELECTRONIC_ACCESS_RELATIONSHIP_SELECT,
+        [ACTION_VALUE_KEY]: urlReletionshipAdditionalActions(formattedMessage)[0].value,
+        [FIELD_VALUE_KEY]: '',
+      }];
+
     default:
       return [];
   }

src/constants/core.js

@@ -75,6 +75,7 @@ export const CONTROL_TYPES = {
   TEXTAREA: 'TEXTAREA',
   NOTE_SELECT: 'NOTE_SELECT',
   NOTE_DUPLICATE_SELECT: 'NOTE_DUPLICATE_SELECT',
+  ELECTRONIC_ACCESS_RELATIONSHIP_SELECT: 'ELECTRONIC_ACCESS_RELATIONSHIP_SELECT',
 };
 
 export const TRANSLATION_SUFFIX = {

src/constants/inAppActions.js

@@ -165,3 +165,16 @@ export const noteAdditionalActions = (formatMessage) => [
   getReplaceAction(formatMessage),
   getRemoveNoteAction(formatMessage),
 ];
+
+export const urlReletionshipActions = (formatMessage) => [
+  getPlaceholder(formatMessage),
+  getClearAction(formatMessage),
+  getFindAction(formatMessage),
+  getReplaceAction(formatMessage),
+];
+
+export const urlReletionshipAdditionalActions = (formatMessage) => [
+  getPlaceholder(formatMessage),
+  getReplaceAction(formatMessage),
+  getRemoveNoteAction(formatMessage),
+];

src/constants/selectOptions.js

@@ -23,6 +23,7 @@ export const OPTIONS = {
   ADMINISTRATIVE_NOTE: 'ADMINISTRATIVE_NOTE',
   CHECK_IN_NOTE: 'CHECK_IN_NOTE',
   CHECK_OUT_NOTE: 'CHECK_OUT_NOTE',
+  URL_RELATIONSHIP: 'URL_RELATIONSHIP',
 };
 
 export const PARAMETERS_KEYS = {
@@ -34,6 +35,15 @@ export const OPTIONS_WITH_ADDITIONAL_PARAMETERS = [
   OPTIONS.ITEM_NOTE,
 ];
 
+export const getItemsWithPlaceholder = (items) => [
+  {
+    value: '',
+    label: <FormattedMessage id="ui-bulk-edit.list.filters.recordIdentifier.placeholder" />,
+    disabled: true,
+  },
+  ...items,
+];
+
 export const identifierOptions = {
   [CAPABILITIES.USER]: [
     {
@@ -194,6 +204,12 @@ export const getHoldingsOptions = (formatMessage, holdingsNotes = []) => [
     categoryName: formatMessage({ id: 'ui-bulk-edit.category.holdingsLocation' }),
   },
   ...holdingsNotes,
+  {
+    value: OPTIONS.URL_RELATIONSHIP,
+    label: formatMessage({ id: 'ui-bulk-edit.layer.options.holdings.urlRelationship' }),
+    disabled: false,
+    categoryName: formatMessage({ id: 'ui-bulk-edit.category.electronicAccess' }),
+  },
   {
     value: OPTIONS.SUPPRESS_FROM_DISCOVERY,
     label: formatMessage({ id: 'ui-bulk-edit.layer.options.holdings.suppress' }),

src/hooks/api/useElectronicAccess.js

@@ -0,0 +1,26 @@
+import { useOkapiKy } from '@folio/stripes/core';
+import { useQuery } from 'react-query';
+
+export const useElectronicAccessRelationships = (options = {}) => {
+  const ky = useOkapiKy();
+
+  const { data, isLoading: isElectronicAccessLoading } = useQuery(
+    {
+      queryKey: 'electronicAccess',
+      cacheTime: Infinity,
+      staleTime: Infinity,
+      queryFn: () => ky.get('electronic-access-relationships').json(),
+      ...options,
+    },
+  );
+
+  const electronicAccessRelationships = data?.electronicAccessRelationships?.map((item) => ({
+    label: item.name,
+    value: item.id,
+  })) || [];
+
+  return {
+    electronicAccessRelationships,
+    isElectronicAccessLoading,
+  };
+};

translations/ui-bulk-edit/en.json

@@ -118,6 +118,7 @@
   "category.itemNotes": "Item notes",
   "category.holdingsNotes": "Holdings notes",
   "category.holdingsLocation": "Holdings location",
+  "category.electronicAccess": "Electronic access",
 
   "columns.USER.User name": "Username",
   "columns.USER.User id": "User id",
@@ -266,6 +267,7 @@
   "layer.options.holdings.temporaryLocation": "Temporary holdings location",
   "layer.options.holdings.permanentLocation": "Permanent holdings location",
   "layer.options.holdings.suppress": "Suppress from discovery",
+  "layer.options.holdings.urlRelationship": "URL Relationship",
   "layer.options.expirationDate": "Expiration date",
   "layer.options.email": "Email",
   "layer.options.patronGroup": "Patron group",
@@ -286,6 +288,7 @@
   "layer.selectPatronGroup": "Select patron group",
   "layer.selectLoanType": "Select loan type",
   "layer.selectNoteType": "Select note type",
+  "layer.selectType": "Select note type",
   "layer.options.items.true": "Set true",
   "layer.options.items.false": "Set false",
   "layer.options.items.changeNote": "Change note type",