removes individual toolbox call, puts all in initial profile get

packages/cms/src/actions/formatters.js

@@ -1,5 +1,15 @@
 import axios from "axios";
 
+/** */
+export function getFormatters() { 
+  return function(dispatch) {
+    return axios.get("/api/cms/formatter")
+      .then(({data}) => {
+        dispatch({type: "FORMATTER_GET", data});
+      });
+  };
+}
+
 /** */
 export function newFormatter(payload) { 
   return function(dispatch) {

packages/cms/src/actions/profiles.js

@@ -22,6 +22,16 @@ export function newProfile() {
   };
 }
 
+/** */
+export function deleteProfile(id) { 
+  return function(dispatch, getStore) {
+    return axios.delete(`${getStore().env.CANON_API}/api/cms/profile/delete`, {params: {id}})
+      .then(({data}) => {
+        dispatch({type: "PROFILE_DELETE", data});
+      });
+  };
+}
+
 /** */
 export function swapEntity(type, id, dir) {
   return function(dispatch, getStore) {
@@ -52,16 +62,6 @@ export function deleteSection(id) {
   };
 }
 
-/** */
-export function deleteProfile(id) { 
-  return function(dispatch, getStore) {
-    return axios.delete(`${getStore().env.CANON_API}/api/cms/profile/delete`, {params: {id}})
-      .then(({data}) => {
-        dispatch({type: "PROFILE_DELETE", data});
-      });
-  };
-}
-
 /** */
 export function modifyDimension(payload) { 
   return function(dispatch) {
@@ -82,16 +82,6 @@ export function deleteDimension(id) {
   };
 }
 
-/** */
-export function getToolbox(id) { 
-  return function(dispatch) {
-    return axios.get(`/api/cms/toolbox/${id}`).then(resp => {
-      const toolbox = resp.data;
-      dispatch({type: "TOOLBOX_GET", data: {id, toolbox}});
-    });
-  };
-}
-
 /** */
 export function newEntity(type, payload) { 
   return function(dispatch) {

packages/cms/src/api/cmsRoute.js

@@ -56,6 +56,27 @@ const catcher = e => {
   return [];
 };
 
+const profileReqFull = {
+  include: [
+    {association: "meta"},
+    {association: "content"},
+    {association: "generators"},
+    {association: "materializers"},
+    {association: "selectors"},
+    {
+      association: "sections",
+      include: [
+        {association: "content"},
+        {association: "subtitles", include: [{association: "content"}]},
+        {association: "descriptions", include: [{association: "content"}]},
+        {association: "stats", include: [{association: "content"}]},
+        {association: "visualizations"},
+        {association: "selectors"}
+      ]
+    }
+  ]
+};
+
 const profileReqTreeOnly = {
   attributes: ["id", "ordering"],
   include: [
@@ -242,7 +263,6 @@ const sortStory = (db, story) => {
 };
 
 const sortSection = (db, section) => {
-  section = section.toJSON();
   section.subtitles = flatSort(db.section_subtitle, section.subtitles);
   section.visualizations = flatSort(db.section_visualization, section.visualizations);
   section.stats = flatSort(db.section_stat, section.stats);
@@ -261,6 +281,19 @@ const sortStorySection = (db, storysection) => {
   return storysection;
 };
 
+const getSectionTypes = () => {
+  const sectionTypes = [];
+  shell.ls(`${sectionTypeDir}*.jsx`).forEach(file => {
+    // In Windows, the shell.ls command returns forward-slash separated directories,
+    // but the node "path" command returns backslash separated directories. Flip the slashes
+    // so the ensuing replace operation works (this should be a no-op for *nix/osx systems)
+    const sectionTypeDirFixed = sectionTypeDir.replace(/\\/g, "/");
+    const compName = file.replace(sectionTypeDirFixed, "").replace(".jsx", "");
+    if (compName !== "Section") sectionTypes.push(compName);
+  });
+  return sectionTypes;
+};
+
 const formatter = (members, data, dimension, level) => {
 
   const newData = members.reduce((arr, d) => {
@@ -407,18 +440,23 @@ module.exports = function(app) {
   });
 
   app.get("/api/cms/tree", async(req, res) => {
-    let profiles = await db.profile.findAll(profileReqTreeOnly).catch(catcher);
+    let profiles = await db.profile.findAll(profileReqFull).catch(catcher);
     profiles = sortProfileTree(db, profiles);
+    const sectionTypes = getSectionTypes();
+    profiles.forEach(profile => {
+      profile.sections = profile.sections.map(section => {
+        section = sortSection(db, section);
+        section.types = sectionTypes;
+        return section;
+      });
+      return profile;
+    });
     return res.json(profiles);
   });
 
-  app.get("/api/cms/toolbox/:id", async(req, res) => {
-    const {id} = req.params;
-    const reqObj = Object.assign({}, profileReqToolbox, {where: {id}});
-    let profile = await db.profile.findOne(reqObj).catch(catcher);
-    profile = profile.toJSON();
-    profile.formatters = await db.formatter.findAll();
-    res.json(profile);
+  app.get("/api/cms/formatter", async(req, res) => {
+    const formatters = await db.formatter.findAll().catch(catcher);
+    res.json(formatters);
   });
 
   app.get("/api/cms/storytree", async(req, res) => {
@@ -427,6 +465,7 @@ module.exports = function(app) {
     return res.json(stories);
   });
 
+  /*
   app.get("/api/cms/profile/get/:id", async(req, res) => {
     const {id} = req.params;
     const dims = collate(req.query);
@@ -457,6 +496,7 @@ module.exports = function(app) {
     profile.attr = attr;
     return res.json(sortProfile(db, profile));
   });
+  */
 
   app.get("/api/cms/story/get/:id", async(req, res) => {
     const {id} = req.params;
@@ -465,6 +505,8 @@ module.exports = function(app) {
     return res.json(sortStory(db, story));
   });
 
+  /*
+
   app.get("/api/cms/section/get/:id", async(req, res) => {
     const {id} = req.params;
     const reqObj = Object.assign({}, sectionReqSectionOnly, {where: {id}});
@@ -486,6 +528,8 @@ module.exports = function(app) {
     return res.json(section);
   });
 
+  */
+
   app.get("/api/cms/storysection/get/:id", async(req, res) => {
     const {id} = req.params;
     const reqObj = Object.assign({}, storysectionReqStorysectionOnly, {where: {id}});
@@ -555,8 +599,15 @@ module.exports = function(app) {
     await db.profile_content.create({id: profile.id, locale: envLoc}).catch(catcher);
     const section = await db.section.create({ordering: 0, type: "Hero", profile_id: profile.id});
     await db.section_content.create({id: section.id, locale: envLoc}).catch(catcher);
-    const reqObj = Object.assign({}, profileReqTreeOnly, {where: {id: profile.id}});
-    const newProfile = await db.profile.findOne(reqObj).catch(catcher);
+    const reqObj = Object.assign({}, profileReqFull, {where: {id: profile.id}});
+    let newProfile = await db.profile.findOne(reqObj).catch(catcher);
+    newProfile = newProfile.toJSON();
+    const sectionTypes = getSectionTypes();
+    newProfile.sections = newProfile.sections.map(section => {
+      section = sortSection(db, section);
+      section.types = sectionTypes;
+      return section;
+    });
     return res.json(newProfile);
   });
 
@@ -751,8 +802,17 @@ module.exports = function(app) {
     await db.profile.update({ordering: sequelize.literal("ordering -1")}, {where: {ordering: {[Op.gt]: row.ordering}}}).catch(catcher);
     await db.profile.destroy({where: {id: req.query.id}}).catch(catcher);
     pruneSearch(row.dimension, row.levels, db);
-    let profiles = await db.profile.findAll(profileReqTreeOnly).catch(catcher);
+    let profiles = await db.profile.findAll(profileReqFull).catch(catcher);
     profiles = sortProfileTree(db, profiles);
+    const sectionTypes = getSectionTypes();
+    profiles.forEach(profile => {
+      profile.sections = profile.sections.map(section => {
+        section = sortSection(db, section);
+        section.types = sectionTypes;
+        return section;
+      });
+      return profile;
+    });
     return res.json(profiles);
   });
 

packages/cms/src/components/interface/Toolbox.jsx

@@ -8,7 +8,7 @@ import GeneratorCard from "../cards/GeneratorCard";
 import SelectorCard from "../cards/SelectorCard";
 import ConsoleVariable from "../variables/ConsoleVariable";
 
-import {fetchVariables, getToolbox, newEntity} from "../../actions/profiles";
+import {fetchVariables, newEntity} from "../../actions/profiles";
 import {setStatus} from "../../actions/status";
 
 import "./Toolbox.css";
@@ -27,11 +27,18 @@ class Toolbox extends Component {
   componentDidUpdate(prevProps) {
     const previewsChanged = JSON.stringify(prevProps.status.previews) !== JSON.stringify(this.props.status.previews);
     const localeChanged = prevProps.status.localeSecondary !== this.props.status.localeSecondary;
-    const firstLoad = prevProps.profile && !prevProps.profile.toolboxLoaded && this.props.profile.toolboxLoaded;
-    const bothLoaded = prevProps.profile && prevProps.profile.toolboxLoaded && this.props.profile && this.props.profile.toolboxLoaded;
+    // const firstLoad = prevProps.profile && !prevProps.profile.toolboxLoaded && this.props.profile && this.props.profile.toolboxLoaded;
+    const bothLoaded = prevProps.profile && this.props.profile;
     const generatorDeleted = bothLoaded && prevProps.profile.generators.length - 1 === this.props.profile.generators.length;
     const materializerDeleted = bothLoaded && prevProps.profile.materializers.length - 1 === this.props.profile.materializers.length;
 
+    if (previewsChanged || localeChanged) {
+      console.log("previews changed, fetching");
+      this.props.fetchVariables({type: "generator", ids: this.props.profile.generators.map(g => g.id)});
+    }
+
+    /*
+
     if (previewsChanged) {
       if (!this.props.profile.toolboxLoaded) {
         this.props.getToolbox(this.props.id);  
@@ -43,6 +50,8 @@ class Toolbox extends Component {
     if (firstLoad || localeChanged) {
       this.props.fetchVariables({type: "generator", ids: this.props.profile.generators.map(g => g.id)});
     }
+
+    */
     // Providing fetchvariables (and ultimately, /api/variables) with a now deleted generator or materializer id
     // is handled gracefully - it prunes the provided id from the variables object and re-runs necessary gens/mats.
     if (generatorDeleted) {
@@ -109,7 +118,7 @@ class Toolbox extends Component {
     const formattersAll = this.props.formatters;
     const {variables, localeDefault, localeSecondary, forceOpen} = this.props.status;
 
-    const dataLoaded = profile && profile.toolboxLoaded;
+    const dataLoaded = profile;
 
     if (!dataLoaded) return null;
 
@@ -293,7 +302,6 @@ const mapStateToProps = (state, ownProps) => ({
 
 const mapDispatchToProps = dispatch => ({
   fetchVariables: config => dispatch(fetchVariables(config)),
-  getToolbox: id => dispatch(getToolbox(id)),
   newEntity: (type, payload) => dispatch(newEntity(type, payload)),
   setStatus: status => dispatch(setStatus(status))
 });

packages/cms/src/profile/ProfileBuilder.jsx

@@ -19,6 +19,7 @@ import varSwapRecursive from "../utils/varSwapRecursive";
 import {getProfiles, newProfile, swapEntity, newSection, deleteSection, deleteProfile, resetPreviews, setVariables} from "../actions/profiles";
 import {setStatus} from "../actions/status";
 import {getCubeData} from "../actions/cubeData";
+import {getFormatters} from "../actions/formatters";
 
 import "./ProfileBuilder.css";
 
@@ -45,6 +46,7 @@ class ProfileBuilder extends Component {
 
   componentDidMount() {
     this.props.getProfiles();
+    this.props.getFormatters();
     this.props.getCubeData();
   }
 
@@ -418,6 +420,7 @@ const mapDispatchToProps = dispatch => ({
   resetPreviews: () => dispatch(resetPreviews()),
   setStatus: status => dispatch(setStatus(status)),
   getCubeData: () => dispatch(getCubeData()),
+  getFormatters: () => dispatch(getFormatters()),
   setVariables: newVariables => dispatch(setVariables(newVariables))
 });
 

packages/cms/src/reducers/formatters.js

@@ -1,7 +1,8 @@
 export default (formatters = [], action) => {
   switch (action.type) {
-    case "TOOLBOX_GET": 
-      return action.data.toolbox.formatters;
+    case "FORMATTER_GET": 
+      console.log("hey", action.data);
+      return action.data;
     case "FORMATTER_NEW":
       return formatters.concat([action.data]);
     case "FORMATTER_UPDATE":

packages/cms/src/reducers/index.js

@@ -16,7 +16,7 @@ const initialState = {
   cubeData: {},
   profiles: [],
   stories: [],
-  formatters: {}
+  formatters: []
 };
 
 /** */

packages/cms/src/reducers/profiles.js

@@ -17,10 +17,6 @@ export default (profiles = [], action) => {
         }).sort((a, b) => a.ordering - b.ordering);
 
     // Toolbox
-    case "TOOLBOX_GET": 
-      const {generators, materializers, selectors} = action.data.toolbox;
-      const obj = {generators, materializers, selectors};
-      return profiles.map(p => p.id === action.data.id ? Object.assign({}, p, {...obj, toolboxLoaded: true}) : p);
     case "GENERATOR_NEW":
       return profiles.map(p => p.id === action.data.profile_id ? Object.assign({}, p, {generators: p.generators.concat([action.data])}) : p);
     case "GENERATOR_UPDATE":