options advanced

package-lock.json

@@ -1858,11 +1858,6 @@
       "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
       "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
     },
-    "asap": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
-    },
     "assign-symbols": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/assign-symbols/-/assign-symbols-1.0.0.tgz",
@@ -2843,11 +2838,6 @@
         }
       }
     },
-    "core-js": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-      "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-    },
     "core-js-compat": {
       "version": "3.12.1",
       "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.12.1.tgz",
@@ -2883,15 +2873,6 @@
         "parse-json": "^4.0.0"
       }
     },
-    "create-react-context": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.2.3.tgz",
-      "integrity": "sha512-CQBmD0+QGgTaxDL3OX1IDXYqjkp2It4RIbcb99jS6AEg27Ga+a9G3JtK6SIu0HBwPLZlmwt9F7UwWA4Bn92Rag==",
-      "requires": {
-        "fbjs": "^0.8.0",
-        "gud": "^1.0.0"
-      }
-    },
     "cross-fetch": {
       "version": "3.1.4",
       "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.1.4.tgz",
@@ -3577,14 +3558,6 @@
       "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=",
       "dev": true
     },
-    "encoding": {
-      "version": "0.1.13",
-      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
-      "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
-      "requires": {
-        "iconv-lite": "^0.6.2"
-      }
-    },
     "end-of-stream": {
       "version": "1.4.4",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
@@ -4433,20 +4406,6 @@
         "websocket-driver": ">=0.5.1"
       }
     },
-    "fbjs": {
-      "version": "0.8.17",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz",
-      "integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=",
-      "requires": {
-        "core-js": "^1.0.0",
-        "isomorphic-fetch": "^2.1.1",
-        "loose-envify": "^1.0.0",
-        "object-assign": "^4.1.0",
-        "promise": "^7.1.1",
-        "setimmediate": "^1.0.5",
-        "ua-parser-js": "^0.7.18"
-      }
-    },
     "fetch-mock": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/fetch-mock/-/fetch-mock-7.3.1.tgz",
@@ -4785,11 +4744,6 @@
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.6.tgz",
       "integrity": "sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ=="
     },
-    "gud": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
-      "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
-    },
     "gzip-size": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-6.0.0.tgz",
@@ -5123,14 +5077,6 @@
         "cross-fetch": "3.1.4"
       }
     },
-    "iconv-lite": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.2.tgz",
-      "integrity": "sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==",
-      "requires": {
-        "safer-buffer": ">= 2.1.2 < 3.0.0"
-      }
-    },
     "icss-replace-symbols": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
@@ -5569,7 +5515,8 @@
     "is-stream": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
-      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
+      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=",
+      "dev": true
     },
     "is-string": {
       "version": "1.0.6",
@@ -5612,26 +5559,6 @@
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
       "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
     },
-    "isomorphic-fetch": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
-      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
-      "requires": {
-        "node-fetch": "^1.0.1",
-        "whatwg-fetch": ">=0.10.0"
-      },
-      "dependencies": {
-        "node-fetch": {
-          "version": "1.7.3",
-          "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
-          "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
-          "requires": {
-            "encoding": "^0.1.11",
-            "is-stream": "^1.0.1"
-          }
-        }
-      }
-    },
     "jest-worker": {
       "version": "26.6.2",
       "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-26.6.2.tgz",
@@ -6170,6 +6097,15 @@
       "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
       "dev": true
     },
+    "mini-create-react-context": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz",
+      "integrity": "sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==",
+      "requires": {
+        "@babel/runtime": "^7.12.1",
+        "tiny-warning": "^1.0.3"
+      }
+    },
     "mini-css-extract-plugin": {
       "version": "0.5.0",
       "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.5.0.tgz",
@@ -7580,14 +7516,6 @@
       "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
       "dev": true
     },
-    "promise": {
-      "version": "7.3.1",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
-      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
-      "requires": {
-        "asap": "~2.0.3"
-      }
-    },
     "prop-types": {
       "version": "15.7.2",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
@@ -7799,15 +7727,15 @@
       }
     },
     "react-router": {
-      "version": "5.0.0",
+      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.0.0.tgz",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz",
-      "integrity": "sha512-6EQDakGdLG/it2x9EaCt9ZpEEPxnd0OCLBHQ1AcITAAx7nCnyvnzf76jKWG1s2/oJ7SSviUgfWHofdYljFexsA==",
+      "integrity": "sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==",
       "requires": {
         "@babel/runtime": "^7.1.2",
-        "create-react-context": "^0.2.2",
         "history": "^4.9.0",
         "hoist-non-react-statics": "^3.1.0",
         "loose-envify": "^1.3.1",
+        "mini-create-react-context": "^0.4.0",
         "path-to-regexp": "^1.7.0",
         "prop-types": "^15.6.2",
         "react-is": "^16.6.0",
@@ -7823,15 +7751,15 @@
       }
     },
     "react-router-dom": {
-      "version": "5.0.0",
+      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.0.0.tgz",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.2.0.tgz",
-      "integrity": "sha512-wSpja5g9kh5dIteZT3tUoggjnsa+TPFHSMrpHXMpFsaHhQkm/JNVGh2jiF9Dkh4+duj4MKCkwO6H08u6inZYgQ==",
+      "integrity": "sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==",
       "requires": {
         "@babel/runtime": "^7.1.2",
         "history": "^4.9.0",
         "loose-envify": "^1.3.1",
         "prop-types": "^15.6.2",
-        "react-router": "5.0.0",
+        "react-router": "5.2.0",
         "tiny-invariant": "^1.0.2",
         "tiny-warning": "^1.0.0"
       }
@@ -8432,7 +8360,8 @@
     "safer-buffer": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "dev": true
     },
     "sax": {
       "version": "1.2.4",
@@ -8624,11 +8553,6 @@
         }
       }
     },
-    "setimmediate": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
-      "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
-    },
     "setprototypeof": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
@@ -9502,11 +9426,6 @@
         "mime-types": "~2.1.24"
       }
     },
-    "ua-parser-js": {
-      "version": "0.7.28",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.28.tgz",
-      "integrity": "sha512-6Gurc1n//gjp9eQNXjD9O3M/sMwVtN5S8Lv9bvOYBfKfDNiIIhqiyi01vMBO45u4zkDE420w/e0se7Vs+sIg+g=="
-    },
     "unbox-primitive": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.1.tgz",
@@ -10296,11 +10215,6 @@
       "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
       "dev": true
     },
-    "whatwg-fetch": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.2.tgz",
-      "integrity": "sha512-bJlen0FcuU/0EMLrdbJ7zOnW6ITZLrZMIarMUVmdKtsGvZna8vxKYaexICWPfZ8qwf9fzNq+UEIZrnSaApt6RA=="
-    },
     "whatwg-url": {
       "version": "6.5.0",
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-6.5.0.tgz",

package.json

@@ -27,7 +27,7 @@
     "react-flags": "^0.1.18",
     "react-i18next": "^11.4.0",
     "react-redux": "6.0.1",
-    "react-router-dom": "5.0.0",
+    "react-router-dom": "5.2.0",
     "react-simple-chatbot": "^0.6.1",
     "recharts": "^1.8.5",
     "redux": "4.0.1",

public/locales/en/translations.json

@@ -21,7 +21,8 @@
   },
   "General": {
     "Close": "Close",
-    "Send": "Send"
+    "Send": "Send",
+    "Advanced": "Advanced"
   },
   "Session": {
     "Title": "Sessions",

public/locales/ro/translations.json

@@ -12,7 +12,8 @@
   },
   "General": {
     "Close": "Închide",
-    "Send": "Trimite"
+    "Send": "Trimite",
+    "Advanced": "Avansat"
   },
   "Session": {
     "Title": "Sesiuni",

src/components/App.js

@@ -36,7 +36,8 @@ function App({ actions }) {
           <Route path="/sessions" component={SessionContainer} />
           <Route path="/release-notes" component={ReleaseNotesContainer} />
           <Route
-            path="/forwards/:forwardId([0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12})"
+            exact
+            path="/forwards/:sessionId([0-9A-Fa-f]{8}[-][0-9A-Fa-f]{4}[-][0-9A-Fa-f]{4}[-][0-9A-Fa-f]{4}[-][0-9A-Fa-f]{12})/:forwardId([0-9A-Fa-f]{8}[-][0-9A-Fa-f]{4}[-][0-9A-Fa-f]{4}[-][0-9A-Fa-f]{4}[-][0-9A-Fa-f]{12})"
             component={ForwardContainer}
           />
           <Route component={PageNotFound} />

src/features/forwards/core/components/ForwardComponent.js

@@ -1,8 +1,12 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-const ForwardComponent = () => {
+const ForwardComponent = ({ forward }) => {
-  return <div>in dev</div>;
+  return <div>{forward.forwardId}</div>;
+};
+
+ForwardComponent.propTypes = {
+  forward: PropTypes.object.isRequired
 };
 
 export default ForwardComponent;

src/features/forwards/core/components/ForwardContainer.js

@@ -1,16 +1,43 @@
 import React from "react";
-//import PropTypes from "prop-types";
+import PropTypes from "prop-types";
 import ForwardComponent from "./ForwardComponent";
 import { useParams } from "react-router";
+import { connect } from "react-redux";
+import { bindActionCreators } from "redux";
+import { loadSessionForwards } from "../../../session/actionCreators";
+import Spinner from "../../../../components/common/Spinner";
 
-const ForwardContainer = () => {
+const ForwardContainer = ({ actions, forward }) => {
   const params = useParams();
-  const forwardId = params.forwardId;
+  const { sessionId } = params;
-  alert(forwardId);
 
-  return <ForwardComponent />;
+  if (!forward) {
+    actions.loadSessionForwards(sessionId);
+    return <Spinner />;
+  }
+
+  return <ForwardComponent forward={forward} />;
 };
 
-ForwardContainer.propTypes = {};
+ForwardContainer.propTypes = {
+  actions: PropTypes.object.isRequired,
+  forward: PropTypes.object
+};
 
-export default ForwardContainer;
+function mapStateToProps(state, route) {
+  const { sessionId, forwardId } = route.match.params;
+  const session = state.forwards[sessionId];
+  const forward = session?.find(z => (z.forwardId = forwardId));
+
+  return {
+    forward
+  };
+}
+
+function mapDispatchToProps(dispatch) {
+  return {
+    actions: bindActionCreators({ loadSessionForwards }, dispatch)
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(ForwardContainer);

src/features/forwards/options/components/simple/ForwardOptionsDialog.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useCallback } from "react";
 import PropTypes from "prop-types";
 import {
   Button,
@@ -9,9 +9,16 @@ import {
 } from "@material-ui/core";
 import { useTranslation } from "react-i18next";
 import ForwardOptionsContainer from "./ForwardOptionsContainer";
+import { useHistory } from "react-router-dom";
 
-const ForwardOptionsDialog = ({ open, handleClose, forward }) => {
+const ForwardOptionsDialog = ({ open, forward, handleClose }) => {
   const { t } = useTranslation();
+  const history = useHistory();
+
+  const handleAdvancedClick = useCallback(
+    () => history.push(`/forwards/${forward.sessionId}/${forward.forwardId}`),
+    [forward]
+  );
 
   return (
     <div>
@@ -28,6 +35,9 @@ const ForwardOptionsDialog = ({ open, handleClose, forward }) => {
           {forward ? <ForwardOptionsContainer forward={forward} /> : "N/A"}
         </DialogContent>
         <DialogActions>
+          <Button onClick={handleAdvancedClick} color="primary">
+            {t("General.Advanced")}
+          </Button>
           <Button onClick={handleClose} color="primary">
             {t("General.Close")}
           </Button>
@@ -39,8 +49,8 @@ const ForwardOptionsDialog = ({ open, handleClose, forward }) => {
 
 ForwardOptionsDialog.propTypes = {
   open: PropTypes.bool.isRequired,
-  handleClose: PropTypes.func.isRequired,
+  forward: PropTypes.object,
-  forward: PropTypes.object
+  handleClose: PropTypes.func.isRequired
 };
 
 export default ForwardOptionsDialog;

src/features/server/components/ActiveSessionContainer.js

@@ -53,8 +53,8 @@ const ActiveSessionContainer = ({ actions, session, forwards, domain }) => {
       />
       <ForwardOptionsDialog
         open={optionsDialogOpen}
-        handleClose={handleOptionsDialogClose}
         forward={focusedForward}
+        handleClose={handleOptionsDialogClose}
       />
     </>
   );

src/features/session/components/SessionContainer.js

@@ -38,8 +38,8 @@ const SessionContainer = ({ actions, sessions, forwards }) => {
       />
       <ForwardOptionsDialog
         open={optionsDialogOpen}
-        handleClose={handleOptionsDialogClose}
         forward={focusedForward}
+        handleClose={handleOptionsDialogClose}
       />
     </>
   );