@truedat/cx 4.38.1 → 4.38.2

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [4.38.2]
+
+### Changed
+
+- [TD-2511] Source update now modify each config field individually
+
 ## [4.37.4] 2022-02-04
 
 ### Changed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/cx",
-  "version": "4.38.1",
+  "version": "4.38.2",
   "description": "Truedat Web Connectors",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -31,7 +31,7 @@
     "@babel/plugin-transform-modules-commonjs": "^7.15.0",
     "@babel/preset-env": "^7.15.0",
     "@babel/preset-react": "^7.14.5",
-    "@truedat/test": "4.38.1",
+    "@truedat/test": "4.38.2",
     "babel-jest": "^27.0.6",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -85,7 +85,7 @@
     ]
   },
   "dependencies": {
-    "@truedat/core": "4.38.1",
+    "@truedat/core": "4.38.2",
     "lodash": "^4.17.21",
     "match-sorter": "^6.3.1",
     "path-to-regexp": "^1.7.0",
@@ -103,5 +103,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "57c37e235514a51bad3496fbdde37bd3438a220b"
+  "gitHead": "41504c0c5ccc40ea20e67985e3957fd7c1897e2e"
 }

package/src/messages/en.js

@@ -2,6 +2,7 @@
 export default {
   "alert.fetchSource.failed.header": "Error retrieving source",
   "alert.signConfiguration.failed.header": "Error signing configuration",
+  "alert.updateSource.failed.header": "Error editing source",
   "configuration.content.label": "Content",
   "configuration.props.external_id": "Id Externo",
   "configuration.search.no_results": "No configurations found",

package/src/messages/es.js

@@ -2,6 +2,7 @@
 export default {
   "alert.fetchSource.failed.header": "Error al recuperar origen",
   "alert.signConfiguration.failed.header": "Error firmando configuración",
+  "alert.updateSource.failed.header": "Error al editar origen",
   "configuration.content.label": "Contenido",
   "configuration.props.external_id": "External Id",
   "configuration.search.no_results": "Ninguna configuración encontrada",

package/src/sources/components/Source.js

@@ -1,8 +1,9 @@
 import _ from "lodash/fp";
-import React from "react";
+import React, { useState, useEffect } from "react";
 import PropTypes from "prop-types";
 import { Header, Icon, Grid, Segment } from "semantic-ui-react";
 import { connect } from "react-redux";
+import { updateSourceConfig } from "../routines";
 import SourceActions from "./SourceActions";
 import SourceBreadcrumbs from "./SourceBreadcrumbs";
 
@@ -10,7 +11,34 @@ const DynamicFormViewer = React.lazy(() =>
   import("@truedat/df/components/DynamicFormViewer")
 );
 
-export const Source = ({ source, template }) => {
+export const Source = ({
+  source,
+  template,
+  updateSourceConfig,
+  sourceUpdateStatus,
+}) => {
+  const [editingField, setEditingField] = useState();
+  const [sourceConfig, setSourceConfig] = useState();
+  useEffect(() => {
+    if (source) {
+      setSourceConfig(source?.config);
+    }
+  }, [source]);
+  const editFunctions = {
+    onChange: (e, { name, value }) => {
+      e && e.preventDefault();
+      setSourceConfig({ ...sourceConfig, [name]: value });
+    },
+    onCancel: () => setSourceConfig(source?.config),
+    onSubmit: (field) =>
+      updateSourceConfig({
+        source: { ...source, config: _.pick(field)(sourceConfig) },
+      }),
+    editingField,
+    setEditingField,
+    updateStatus: sourceUpdateStatus,
+  };
+
   return _.isEmpty(source) ? null : (
     <>
       <SourceBreadcrumbs text={source.external_id} />
@@ -29,7 +57,11 @@ export const Source = ({ source, template }) => {
             <SourceActions />
           </Grid.Column>
           <Grid.Column width={8}>
-            <DynamicFormViewer template={template} content={source.config} />
+            <DynamicFormViewer
+              template={template}
+              content={sourceConfig}
+              editFunctions={editFunctions}
+            />
           </Grid.Column>
         </Grid>
       </Segment>
@@ -39,12 +71,15 @@ export const Source = ({ source, template }) => {
 
 Source.propTypes = {
   source: PropTypes.object.isRequired,
+  sourceUpdateStatus: PropTypes.string,
   template: PropTypes.object,
+  updateSourceConfig: PropTypes.func.isRequired,
 };
 
-const mapStateToProps = ({ source, templates }) => ({
+const mapStateToProps = ({ source, templates, sourceUpdateStatus }) => ({
   source,
   template: _.find(_.propEq("name", source.type))(templates),
+  sourceUpdateStatus,
 });
 
-export default connect(mapStateToProps)(Source);
+export default connect(mapStateToProps, { updateSourceConfig })(Source);

package/src/sources/components/__tests__/EditSource.spec.js

@@ -12,7 +12,7 @@ describe("<EditSource />", () => {
   const source = {
     external_id: "Micro1",
     config: { a: 1 },
-    type: "micro"
+    type: "micro",
   };
   const formatMessage = jest.fn();
   const sourceLoading = false;

package/src/sources/components/__tests__/__snapshots__/Source.spec.js.snap

@@ -36,9 +36,14 @@ exports[`<Source /> matches the latest snapshot 1`] = `
         width={8}
       >
         <lazy
-          content={
+          editFunctions={
             Object {
-              "a": 1,
+              "editingField": undefined,
+              "onCancel": [Function],
+              "onChange": [Function],
+              "onSubmit": [Function],
+              "setEditingField": [Function],
+              "updateStatus": undefined,
             }
           }
           template={

package/src/sources/reducers/__tests__/sourceUpdateStatus.spec.js

@@ -0,0 +1,40 @@
+import { updateSourceConfig } from "../../routines";
+import { sourceUpdateStatus } from "..";
+
+const fooState = { foo: "bar" };
+
+describe("reducers: sourceUpdateStatus", () => {
+  const initialState = "none";
+
+  it("should provide the initial state", () => {
+    expect(sourceUpdateStatus(undefined, {})).toEqual(initialState);
+  });
+
+  it("should handle the updateSourceConfig.TRIGGER action", () => {
+    expect(
+      sourceUpdateStatus(fooState, { type: updateSourceConfig.TRIGGER })
+    ).toEqual("updating");
+  });
+
+  it("should handle the updateSourceConfig.SUCCESS action", () => {
+    expect(
+      sourceUpdateStatus(fooState, { type: updateSourceConfig.SUCCESS })
+    ).toEqual("success");
+  });
+
+  it("should handle the updateSourceConfig.FAILURE action", () => {
+    expect(
+      sourceUpdateStatus(fooState, { type: updateSourceConfig.FAILURE })
+    ).toEqual("fail");
+  });
+
+  it("should handle the updateSourceConfig.FULFILL action", () => {
+    expect(
+      sourceUpdateStatus(fooState, { type: updateSourceConfig.FULFILL })
+    ).toEqual("none");
+  });
+
+  it("should ignore unknown actions", () => {
+    expect(sourceUpdateStatus(fooState, { type: "FOO" })).toBe(fooState);
+  });
+});

package/src/sources/reducers/index.js

@@ -3,5 +3,13 @@ import { sources } from "./sources";
 import { source } from "./source";
 import { sourceLoading } from "./sourceLoading";
 import { sourceRedirect } from "./sourceRedirect";
+import { sourceUpdateStatus } from "./sourceUpdateStatus";
 
-export { source, sources, sourceLoading, sourcesLoading, sourceRedirect };
+export {
+  source,
+  sources,
+  sourceLoading,
+  sourcesLoading,
+  sourceRedirect,
+  sourceUpdateStatus,
+};

package/src/sources/reducers/source.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import { fetchSource, clearSource } from "../routines";
+import { fetchSource, clearSource, updateSourceConfig } from "../routines";
 
 const pickFields = _.pick([
   "active",
@@ -22,6 +22,9 @@ const source = (state = initialState, { type, payload }) => {
       const data = _.propOr({}, "data")(payload);
       return pickFields(data);
     }
+    case updateSourceConfig.SUCCESS:
+      const data = _.propOr({}, "data")(payload);
+      return pickFields(data);
     case fetchSource.FAILURE:
       return initialState;
     default:

package/src/sources/reducers/sourceUpdateStatus.js

@@ -0,0 +1,18 @@
+import { updateSourceConfig } from "../routines";
+
+const sourceUpdateStatus = (state = "none", { type }) => {
+  switch (type) {
+    case updateSourceConfig.TRIGGER:
+      return "updating";
+    case updateSourceConfig.SUCCESS:
+      return "success";
+    case updateSourceConfig.FAILURE:
+      return "fail";
+    case updateSourceConfig.FULFILL:
+      return "none";
+    default:
+      return state;
+  }
+};
+
+export { sourceUpdateStatus };

package/src/sources/routines.js

@@ -10,3 +10,4 @@ export const enableSource = createRoutine("ENABLE_SOURCE");
 export const fetchSource = createRoutine("FETCH_SOURCE");
 export const fetchSources = createRoutine("FETCH_SOURCES");
 export const updateSource = createRoutine("UPDATE_SOURCE");
+export const updateSourceConfig = createRoutine("UPDATE_SOURCE_CONFIG");

package/src/sources/sagas/__tests__/updateSourceConfig.spec.js

@@ -0,0 +1,73 @@
+import { compile } from "path-to-regexp";
+import { testSaga } from "redux-saga-test-plan";
+import { apiJsonPut, JSON_OPTS } from "@truedat/core/services/api";
+import {
+  updateSourceConfigRequestSaga,
+  updateSourceConfigSaga,
+} from "../updateSourceConfig";
+import { updateSourceConfig } from "../../routines";
+import { API_SOURCE } from "../../api";
+
+describe("sagas: updateSourceConfigRequestSaga", () => {
+  it("should invoke updateSourceConfigSaga on trigger", () => {
+    expect(() => {
+      testSaga(updateSourceConfigRequestSaga)
+        .next()
+        .takeLatest(updateSourceConfig.TRIGGER, updateSourceConfigSaga)
+        .finish()
+        .isDone();
+    }).not.toThrow();
+  });
+
+  it("should throw exception if an unhandled action is received", () => {
+    expect(() => {
+      testSaga(updateSourceConfigRequestSaga)
+        .next()
+        .takeLatest("FOO", updateSourceConfigSaga);
+    }).toThrow();
+  });
+});
+
+describe("sagas: updateSourceConfigSaga", () => {
+  const external_id = "Micro1";
+  const url = compile(API_SOURCE)({ external_id });
+  const config = { a: 1 };
+  const source = { external_id, config };
+  const payload = { source };
+  const requestData = { source_config: config };
+
+  it("should put a success action when a response is returned", () => {
+    expect(() => {
+      testSaga(updateSourceConfigSaga, { payload })
+        .next()
+        .put(updateSourceConfig.request())
+        .next()
+        .call(apiJsonPut, url, requestData, JSON_OPTS)
+        .next({ data: payload })
+        .put(updateSourceConfig.success({ source }))
+        .next()
+        .put(updateSourceConfig.fulfill())
+        .next()
+        .isDone();
+    }).not.toThrow();
+  });
+
+  it("should put a failure action when the call returns an error", () => {
+    const message = "Request failed";
+    const error = { message };
+
+    expect(() => {
+      testSaga(updateSourceConfigSaga, { payload })
+        .next()
+        .put(updateSourceConfig.request())
+        .next()
+        .call(apiJsonPut, url, requestData, JSON_OPTS)
+        .throw(error)
+        .put(updateSourceConfig.failure(message))
+        .next()
+        .put(updateSourceConfig.fulfill())
+        .next()
+        .isDone();
+    }).not.toThrow();
+  });
+});

package/src/sources/sagas/index.js

@@ -5,6 +5,7 @@ import { enableSourceRequestSaga } from "./enableSource";
 import { fetchSourceRequestSaga } from "./fetchSource";
 import { fetchSourcesRequestSaga } from "./fetchSources";
 import { updateSourceRequestSaga } from "./updateSource";
+import { updateSourceConfigRequestSaga } from "./updateSourceConfig";
 
 export {
   createSourceRequestSaga,
@@ -14,6 +15,7 @@ export {
   fetchSourceRequestSaga,
   fetchSourcesRequestSaga,
   updateSourceRequestSaga,
+  updateSourceConfigRequestSaga,
 };
 
 export default [
@@ -24,4 +26,5 @@ export default [
   fetchSourceRequestSaga(),
   fetchSourcesRequestSaga(),
   updateSourceRequestSaga(),
+  updateSourceConfigRequestSaga(),
 ];

package/src/sources/sagas/updateSourceConfig.js

@@ -0,0 +1,29 @@
+import { compile } from "path-to-regexp";
+import { call, put, takeLatest } from "redux-saga/effects";
+import { apiJsonPut, JSON_OPTS } from "@truedat/core/services/api";
+import { updateSourceConfig } from "../routines";
+import { API_SOURCE } from "../api";
+
+export function* updateSourceConfigSaga({ payload }) {
+  try {
+    const { source } = payload;
+    const url = compile(API_SOURCE)(source);
+    const requestData = { source_config: source?.config };
+    yield put(updateSourceConfig.request());
+    const { data } = yield call(apiJsonPut, url, requestData, JSON_OPTS);
+    yield put(updateSourceConfig.success(data));
+  } catch (error) {
+    if (error.response) {
+      const { status, data } = error.response;
+      yield put(updateSourceConfig.failure({ status, data }));
+    } else {
+      yield put(updateSourceConfig.failure(error.message));
+    }
+  } finally {
+    yield put(updateSourceConfig.fulfill());
+  }
+}
+
+export function* updateSourceConfigRequestSaga() {
+  yield takeLatest(updateSourceConfig.TRIGGER, updateSourceConfigSaga);
+}