refactor: move code to the files it is supposed to stay into (#56)

NoMercy235 · Mar 29, 2020 · 3bcc9ee · 3bcc9ee
1 parent 2ef1650
commit 3bcc9ee
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 32 deletions.
diff --git a/src/admin/story-view/view/components/write-story/write-story/WriteStoryComponent.js b/src/admin/story-view/view/components/write-story/write-story/WriteStoryComponent.js
@@ -6,14 +6,20 @@ import { toJS } from 'mobx';
 import { Card, CardContent } from '@material-ui/core';
 import {
   getOptionsBetweenNodes,
+  newGraphOption,
   optionToLink,
+  reduceOptionsToUniqueArray,
   seqToNode,
   sourceDestInitialValues
 } from '../../../../../../shared/utils/graphUtils';
 import { SequenceModel } from '../../../../../../infrastructure/models/SequenceModel';
 import { OptionModel } from '../../../../../../infrastructure/models/OptionModel';
 import { StoryModel } from '../../../../../../infrastructure/models/StoryModel';
-import { GRAPH_ID, GRAPH_WAIT_FOR_GRAPH_STATE_CHANGE } from '../../../../../../shared/constants/graph';
+import {
+  GRAPH_DEFAULT_CONFIG,
+  GRAPH_ID,
+  GRAPH_WAIT_FOR_GRAPH_STATE_CHANGE
+} from '../../../../../../shared/constants/graph';
 import ActionsToolbarComponent from '../actions-toolbar/ActionsToolbarComponent';
 import SaveGraphSequence from '../save-graph-sequence/SaveGraphSequence';
 import SaveGraphOptions from '../save-graph-options/SaveGraphOptions';
@@ -102,10 +108,7 @@ class WriteStoryComponent extends Component {
   onOpenSaveOptionsModal = async (fromSeqId, toSeqId) => {
     const { story } = this.props;
     let sourceDest = sourceDestInitialValues;
-    let optionsToLoad = [new OptionModel({
-      action: 'New option',
-      story: story._id,
-    })];
+    let optionsToLoad = [newGraphOption(story)];
 
     if (fromSeqId && toSeqId) {
       const { options } = this.props;
@@ -175,17 +178,7 @@ class WriteStoryComponent extends Component {
     const data = {
       nodes: sequences.map(seqToNode(story, selectedNode)),
       links: optionsFromContainer
-        .reduce((curr, option) => {
-          // Display only one link from a sequence to another
-          // even if there are multiple options
-          const linkBetweenNodesExists = curr.find(o => {
-            return o.sequence === option.sequence && o.nextSeq === option.nextSeq;
-          });
-          if (linkBetweenNodesExists) {
-            return curr;
-          }
-          return [...curr, option];
-        }, [])
+        .reduce(reduceOptionsToUniqueArray, [])
         .map(optionToLink),
     };
 
@@ -206,23 +199,8 @@ class WriteStoryComponent extends Component {
                   ref={this.graphRef}
                   data={data}
                   config={{
-                    directed: true,
-                    nodeHighlightBehavior: true,
+                    ...GRAPH_DEFAULT_CONFIG,
                     ...graphState,
-                    node: {
-                      labelProperty: 'name',
-                      fontSize: 16,
-                      highlightFontSize: 20,
-                      highlightFontWeight: 'bold',
-                      highlightColor: 'aqua',
-                    },
-                    link: {
-                      fontSize: 16,
-                      highlightFontSize: 20,
-                      highlightFontWeight: 'bold',
-                      highlightColor: 'lightblue',
-                      strokeWidth: 3,
-                    },
                   }}
                   onClickNode={this.onOpenSaveSeqModal}
                   onDoubleClickNode={this.onDoubleClickNode}

diff --git a/src/shared/constants/graph.js b/src/shared/constants/graph.js
@@ -14,3 +14,24 @@ export const NEW_SEQUENCE_POSITION = {
   x: 30,
   y: 30,
 };
+
+const NODE_LINK_CONFIG = {
+  fontSize: 16,
+  highlightFontSize: 20,
+  highlightFontWeight: 'bold',
+};
+
+export const GRAPH_DEFAULT_CONFIG = {
+  directed: true,
+  nodeHighlightBehavior: true,
+  node: {
+    labelProperty: 'name',
+    ...NODE_LINK_CONFIG,
+    highlightColor: 'aqua',
+  },
+  link: {
+    ...NODE_LINK_CONFIG,
+    highlightColor: 'lightblue',
+    strokeWidth: 3,
+  },
+};
diff --git a/src/shared/utils/graphUtils.js b/src/shared/utils/graphUtils.js
@@ -1,5 +1,6 @@
 import { ThemeColors } from '../utilities';
 import { GRAPH_ID, GRAPH_NODE_SIZE, GraphLinkTypes } from '../constants/graph';
+import { OptionModel } from '../../infrastructure/models/OptionModel';
 
 export const NodeSymbol = {
   Circle: 'circle',
@@ -39,6 +40,18 @@ export const seqToNode = (story, selectedNode) => seq => {
   }
 };
 
+export const reduceOptionsToUniqueArray = (curr, option) => {
+  // Display only one link from a sequence to another
+  // even if there are multiple options
+  const linkBetweenNodesExists = curr.find(o => {
+    return o.sequence === option.sequence && o.nextSeq === option.nextSeq;
+  });
+  if (linkBetweenNodesExists) {
+    return curr;
+  }
+  return [...curr, option];
+};
+
 export const optionToLink = (option, index, options) => {
   const hasTwoWay = options
     .find(otherOption => {
@@ -63,3 +76,10 @@ export const getOptionsBetweenNodes = (fromSeqId, toSeqId, options) => {
     return sequence === fromSeqId && nextSeq === toSeqId;
   });
 };
+
+export const newGraphOption = (story) => {
+  return new OptionModel({
+    action: 'New option',
+    story: story._id,
+  })
+};