Add getContentTypes button to explorePanel

Export contentTypes from compiler as part of return

Author: scriptype

src/cms/api/index.js

@@ -3,6 +3,7 @@ const createAPI = (providers) => {
   api.settings = require('./models/settings')(providers, api)
   api.fileSystemTree = require('./models/fileSystemTree')(providers, api)
   api.contentModel = require('./models/contentModel')(providers, api)
+  api.contentTypes = require('./models/contentTypes')(providers, api)
   api.collections = require('./models/collections')(providers, api)
   api.categories = require('./models/categories')(providers, api)
   api.category = require('./models/category')(providers, api)

src/cms/api/models/contentTypes.js

@@ -0,0 +1,7 @@
+const createContentTypesModel = ({ getContentTypes }) => {
+  return {
+    get: getContentTypes
+  }
+}
+
+module.exports = createContentTypesModel

src/cms/index.js

@@ -8,6 +8,7 @@ const createCMS = (initialState = {}) => {
       settings: {},
       fileSystemTree: [],
       contentModel: {},
+      contentTypes: [],
       watcher: {
         directory: undefined,
         isRunning: false,
@@ -19,6 +20,7 @@ const createCMS = (initialState = {}) => {
       getSettings: () => state.settings,
       getFileSystemTree: () => state.fileSystemTree,
       getContentModel: () => state.contentModel,
+      getContentTypes: () => state.contentTypes,
       getSSGOptions: () => state.ssgOptions,
       isWatching: (directory) => {
         if (directory) {

src/cms/server/public/api.js

@@ -146,6 +146,18 @@ const api = {
     }
   },
 
+  contentTypes: {
+    get: async () => {
+      const response = await fetch('/api/contentTypes', {
+        method: 'get',
+        headers: {
+          'content-type': 'application/json'
+        }
+      })
+      return response.json()
+    }
+  },
+
   fileSystemTree: {
     get: async () => {
       const response = await fetch('/api/fileSystemTree', {

src/cms/server/public/app/explorePanel.js

@@ -5,8 +5,9 @@ import ssgStopWatcher from './explorePanel/ssgStopWatcher.js'
 import getSSGOptions from './explorePanel/getSSGOptions.js'
 import getSettings from './explorePanel/getSettings.js'
 import updateSettings from './explorePanel/updateSettings.js'
-import getFileSystemTree from './explorePanel/getFileSystemTree.js'
+import getContentTypes from './explorePanel/getContentTypes.js'
 import getContentModel from './explorePanel/getContentModel.js'
+import getFileSystemTree from './explorePanel/getFileSystemTree.js'
 import getCollections from './explorePanel/getCollections.js'
 import getSubpages from './explorePanel/getSubpages.js'
 import getSubpage from './explorePanel/getSubpage.js'
@@ -27,12 +28,15 @@ const template = () => {
       <button type="button" id="get-settings-btn">get settings</button>
       <button type="button" id="update-settings-btn">update settings</button>
 
-      <p>fileSystemTree</p>
-      <button type="button" id="get-file-system-tree-btn">get fileSystemTree</button>
+      <p>contentTypes</p>
+      <button type="button" id="get-content-types-btn">get contentTypes</button>
 
       <p>contentModel</p>
       <button type="button" id="get-content-model-btn">get contentModel</button>
 
+      <p>fileSystemTree</p>
+      <button type="button" id="get-file-system-tree-btn">get fileSystemTree</button>
+
       <p>collections</p>
       <button type="button" id="get-collections-btn">get all collections</button>
 
@@ -64,8 +68,9 @@ const makeButtonsWork = (panel) => {
   panel.querySelector('#get-ssg-options-btn').addEventListener('click', getSSGOptions)
   panel.querySelector('#get-settings-btn').addEventListener('click', getSettings)
   panel.querySelector('#update-settings-btn').addEventListener('click', updateSettings)
-  panel.querySelector('#get-file-system-tree-btn').addEventListener('click', getFileSystemTree)
+  panel.querySelector('#get-content-types-btn').addEventListener('click', getContentTypes)
   panel.querySelector('#get-content-model-btn').addEventListener('click', getContentModel)
+  panel.querySelector('#get-file-system-tree-btn').addEventListener('click', getFileSystemTree)
   panel.querySelector('#get-collections-btn').addEventListener('click', getCollections)
   panel.querySelector('#get-subpages-btn').addEventListener('click', getSubpages)
   panel.querySelector('#get-subpage-btn').addEventListener('click', getSubpage)

src/cms/server/public/app/explorePanel/getContentTypes.js

@@ -0,0 +1,10 @@
+import api from '../../api.js'
+import dialog from '../components/dialog.js'
+
+export default async () => {
+  dialog.textContent('Loading').show()
+
+  const contentTypes = await api.contentTypes.get()
+
+  dialog.textContent(JSON.stringify(contentTypes, null, 2))
+}

src/cms/server/router/api/contentTypes.js

@@ -0,0 +1,13 @@
+const express = require('express')
+
+module.exports = express.Router()
+  .get('/', async (req, res, next) => {
+    try {
+      res.status(200).json(
+        await req.api.contentTypes.get()
+      )
+    } catch (e) {
+      console.log('Error getting contentTypes', e)
+      return res.status(500).send(e)
+    }
+  })

src/cms/server/router/api/index.js

@@ -4,6 +4,7 @@ module.exports = express.Router()
   .use('/settings', require('./settings'))
   .use('/fileSystemTree', require('./fileSystemTree'))
   .use('/contentModel', require('./contentModel'))
+  .use('/contentTypes', require('./contentTypes'))
   .use('/collections', require('./collections'))
   .use('/categories', require('./categories'))
   .use('/category', require('./category'))

src/ssg/compiler/index.js

@@ -46,7 +46,8 @@ module.exports = class Compiler {
 
     return {
       fileSystemTree,
-      contentModel
+      contentModel,
+      contentTypes
     }
   }
 }

src/ssg/index.js

@@ -37,7 +37,11 @@ const build = async ({ mode = 'build', rootDirectory, refreshTheme, debug, cli }
   await SiteDirectory.create()
   await CNAME.create()
 
-  const { fileSystemTree, contentModel } = await new Compiler({
+  const {
+    fileSystemTree,
+    contentModel,
+    contentTypes
+  } = await new Compiler({
     FileSystemParser,
     ContentModel,
     Renderer,
@@ -76,7 +80,8 @@ const build = async ({ mode = 'build', rootDirectory, refreshTheme, debug, cli }
   return {
     settings,
     fileSystemTree,
-    contentModel
+    contentModel,
+    contentTypes
   }
 }