UIIN-1980: Update locations in <ViewHoldingsRecord> after edit. (#1658)

This commit includes a lot of cleanup of location-related code that was using local resources to manage location state. Because the resources weren't being updated properly, the locations displayed in the location accordion would never be updated after an edit unless the entire page were refreshed in the browser. The pane header, on the other hand, displayed the correct location because it was using passed-in referenceTables to determine location name from the holdings record. Switching to that method for the location accordion as well allows us to eliminate a lot of unnecessary code. Refs UIIN-1980
folio-org · Apr 15, 2022 · f6f6b6d · f6f6b6d
1 parent c8a098f
commit f6f6b6d
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 51 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Change history for ui-inventory
 
+## 9.0.11 IN PROGRESS
+
+* Update locations in `<ViewHoldingsRecord>` after edit. Fixes UIIN-1980.
+
 ## [9.0.10](https://github.com/folio-org/ui-inventory/tree/v9.0.10) (2022-04-11)
 [Full Changelog](https://github.com/folio-org/ui-inventory/compare/v9.0.9...v9.0.10)
 
@@ -69,7 +73,6 @@
 * Browse form has hardcoded limit of the returned records. Refs UIIN-1957.
 * search.holdings.ids.collection.get permission missing from package.json. Refs UIIN-1972.
 
-
 ## [9.0.0](https://github.com/folio-org/ui-inventory/tree/v9.0.0) (2022-03-03)
 [Full Changelog](https://github.com/folio-org/ui-inventory/compare/v8.0.0...v9.0.0)
 

diff --git a/src/ViewHoldingsRecord.js b/src/ViewHoldingsRecord.js
@@ -73,8 +73,6 @@ class ViewHoldingsRecord extends React.Component {
 
   static manifest = Object.freeze({
     query: {},
-    permanentLocationQuery: {},
-    temporaryLocationQuery: {},
     holdingsRecords: {
       type: 'okapi',
       path: 'holdings-storage/holdings/:{holdingsrecordid}',
@@ -95,14 +93,6 @@ class ViewHoldingsRecord extends React.Component {
       type: 'okapi',
       path: 'inventory/instances/:{id}',
     },
-    permanentLocation: {
-      type: 'okapi',
-      path: 'locations/%{permanentLocationQuery.id}',
-    },
-    temporaryLocation: {
-      type: 'okapi',
-      path: 'locations/%{temporaryLocationQuery.id}',
-    },
     tagSettings: {
       type: 'okapi',
       records: 'configs',
@@ -131,25 +121,6 @@ class ViewHoldingsRecord extends React.Component {
     this.accordionStatusRef = createRef();
   }
 
-  static getDerivedStateFromProps(nextProps) {
-    const { resources } = nextProps;
-    const holdingsRecords = (resources.holdingsRecords || {}).records || [];
-    const permanentLocationQuery = resources.permanentLocationQuery;
-    const temporaryLocationQuery = resources.temporaryLocationQuery;
-    const holding = holdingsRecords[0];
-
-    if (holding && holding.permanentLocationId && permanentLocationQuery
-      && (!permanentLocationQuery.id || permanentLocationQuery.id !== holding.permanentLocationId)) {
-      nextProps.mutator.permanentLocationQuery.update({ id: holding.permanentLocationId });
-    }
-    if (holding && holding.temporaryLocationId && temporaryLocationQuery
-      && (!temporaryLocationQuery.id || temporaryLocationQuery.id !== holding.temporaryLocationId)) {
-      nextProps.mutator.temporaryLocationQuery.update({ id: holding.temporaryLocationId });
-    }
-
-    return null;
-  }
-
   componentDidMount() {
     this.props.mutator.holdingsRecords.GET();
 
@@ -440,8 +411,6 @@ class ViewHoldingsRecord extends React.Component {
     const {
       holdingsRecords,
       instances1,
-      permanentLocation,
-      temporaryLocation,
     } = this.props.resources;
 
     if (this.state.isLoadingUpdatedHoldingsRecord) {
@@ -452,11 +421,7 @@ class ViewHoldingsRecord extends React.Component {
       return true;
     }
 
-    const holdingsRecord = this.getMostRecentHolding();
-
-    if (!instances1 || !instances1.hasLoaded
-      || (holdingsRecord.permanentLocationId && (!permanentLocation || !permanentLocation.hasLoaded))
-      || (holdingsRecord.temporaryLocationId && (!temporaryLocation || !temporaryLocation.hasLoaded))) {
+    if (!instances1 || !instances1.hasLoaded) {
       return true;
     }
 
@@ -470,8 +435,6 @@ class ViewHoldingsRecord extends React.Component {
     const {
       resources: {
         instances1,
-        permanentLocation,
-        temporaryLocation,
         items,
         tagSettings,
       },
@@ -486,8 +449,8 @@ class ViewHoldingsRecord extends React.Component {
     const instanceSource = referenceTables?.holdingsSources?.find(source => source.name === instance.source);
     const holdingsRecord = this.getMostRecentHolding();
     const holdingsSource = referenceTables?.holdingsSources?.find(source => source.id === holdingsRecord.sourceId);
-    const holdingsPermanentLocation = holdingsRecord.permanentLocationId ? permanentLocation.records[0] : null;
-    const holdingsTemporaryLocation = holdingsRecord.temporaryLocationId ? temporaryLocation.records[0] : null;
+    const holdingsPermanentLocation = get(referenceTables?.locationsById[holdingsRecord?.permanentLocationId], ['name'], '-');
+    const holdingsTemporaryLocation = get(referenceTables?.locationsById[holdingsRecord?.temporaryLocationId], ['name'], '-');
     const itemCount = get(items, 'records.length', 0);
     const holdingsSourceName = holdingsSource?.name || instanceSource.name;
     const tagsEnabled = !tagSettings?.records?.length || tagSettings?.records?.[0]?.value === 'true';
@@ -497,7 +460,7 @@ class ViewHoldingsRecord extends React.Component {
         id="ui-inventory.confirmHoldingsRecordDeleteModal.message"
         values={{
           hrid: holdingsRecord.hrid,
-          location: (holdingsPermanentLocation ? holdingsPermanentLocation.name : null)
+          location: holdingsPermanentLocation
         }}
       />
     );
@@ -511,7 +474,7 @@ class ViewHoldingsRecord extends React.Component {
         id={noHoldingsRecordDeleteModalMessageId}
         values={{
           hrid: holdingsRecord.hrid,
-          location: (holdingsPermanentLocation ? holdingsPermanentLocation.name : null),
+          location: holdingsPermanentLocation,
           itemCount,
         }}
       />
@@ -539,8 +502,8 @@ class ViewHoldingsRecord extends React.Component {
       : emptyList;
 
     const locationAccordion = {
-      permanent: get(holdingsPermanentLocation, ['name'], '-'),
-      temporary: get(holdingsTemporaryLocation, ['name'], '-'),
+      permanent: holdingsPermanentLocation,
+      temporary: holdingsTemporaryLocation,
       shelvingOrder: get(holdingsRecord, ['shelvingOrder'], '-'),
       shelvingTitle: get(holdingsRecord, ['shelvingTitle'], '-'),
       copyNumber: get(holdingsRecord, ['copyNumber'], '-'),
@@ -1044,10 +1007,6 @@ ViewHoldingsRecord.propTypes = {
     tagSettings: PropTypes.shape({
       records: PropTypes.arrayOf(PropTypes.object),
     }),
-    permanentLocation: PropTypes.object,
-    temporaryLocation: PropTypes.object,
-    permanentLocationQuery: PropTypes.object,
-    temporaryLocationQuery: PropTypes.object,
   }).isRequired,
   location: PropTypes.object,
   history: PropTypes.object.isRequired,
@@ -1071,8 +1030,6 @@ ViewHoldingsRecord.propTypes = {
       DELETE: PropTypes.func.isRequired,
     }),
     query: PropTypes.object.isRequired,
-    permanentLocationQuery: PropTypes.object.isRequired,
-    temporaryLocationQuery: PropTypes.object.isRequired,
   }),
   goTo: PropTypes.func.isRequired,
 };