avoid render loop that POSTed field values to the server (#12955)

frontend/src/metabase/admin/datamodel/components/FieldRemapping.jsx

@@ -328,9 +328,18 @@ export class ValueRemappings extends React.Component {
     this._updateEditingRemappings(this.props.remappings);
   }
 
-  componentWillReceiveProps(nextProps) {
-    if (nextProps.remappings !== this.props.remappings) {
-      this._updateEditingRemappings(nextProps.remappings);
+  componentDidUpdate(prevProps) {
+    const { remappings } = this.props;
+    if (
+      !// check if the Maps are different
+      (
+        prevProps.remappings &&
+        remappings &&
+        prevProps.remappings.size === remappings.size &&
+        [...remappings].every(([k, v]) => prevProps.remappings.get(k) === v)
+      )
+    ) {
+      this._updateEditingRemappings(remappings);
     }
   }
 

frontend/test/metabase/scenarios/admin/datamodel/field.cy.spec.js

@@ -142,11 +142,10 @@ describe("scenarios > admin > datamodel > field", () => {
       cy.contains("Title");
     });
 
-    it.skip("lets you change to 'Custom mapping' and set custom values (Issue #12771)", () => {
+    it("lets you change to 'Custom mapping' and set custom values (Issue #12771)", () => {
       visitAlias("@ORDERS_QUANTITY_URL");
 
       cy.contains("Use original value").click();
-      // *** Clicking this button starts a loop
       cy.contains("Custom mapping").click();
 
       cy.get('input[value="0"]')