Optionally show examples menu by using SHOW_EXAMPLES environment.

Author: Renoir Boulanger

.vscode/launch.json

@@ -14,7 +14,8 @@
         "sourceMaps": true,
         "env": {
             "NODE_ENV": "development",
-            "DEBUG": "nuxt:*,koa:*"
+            "DEBUG": "nuxt:*,koa:*",
+            "SHOW_EXAMPLES": "true"
         }
       },
       {

server/api/index.js

@@ -1,10 +1,9 @@
 const Koa = require('koa') // Koa framework
 const xmlify = require('xmlify') // JS object to XML
 const yaml = require('js-yaml') // JS object to YAML
-const consts = require('../utils/consts')
 const auth = require('./routes-auth')
 const examples = require('./routes-examples')
-const menu = require('./routes-menu')
+const ui = require('./routes-ui')
 
 const app = new Koa() // API app
 
@@ -82,9 +81,9 @@ app.use(async function handleErrors (ctx, next) {
 // public (unsecured) modules first
 
 app.use(auth)
-app.use(menu)
+app.use(ui)
 
-if (consts.SHOW_EXAMPLES === true) {
+if (process.env.SHOW_EXAMPLES === 'true') {
   app.use(examples)
 }
 

server/api/routes-auth.js

@@ -63,7 +63,7 @@ const translator = translatorFactory('en')
  * HttpOnly Cookie is made for this.
  */
 router.post('/auth/login', async (ctx) => {
-  console.log('POST /auth/login', {...ctx.request.body})
+  // console.log('POST /auth/login', {...ctx.request.body})
   const user = ctx.request.body
   if (!user || !user.userName || !user.password) {
     ctx.throw(401, translator.translate('auth.login.required.missing'))
@@ -202,6 +202,8 @@ router.get('/auth/validate', async (ctx) => {
 
   try {
     userData = await getUserData(jwt)
+    // This is assuming your UserData object has a status property, and when the credentials we've given
+    // are still valid (i.e. not expired) as per that backend, it returns exactly the String "valid"
     authenticated = userData.status === 'valid' || false
   } catch (e) {
     // Nothing to do, body.authenticated defaults to false. Which would be what we want.

server/api/routes-menu.js

@@ -0,0 +1,38 @@
+/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
+/*  Route to handle /ui                                                                           */
+/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
+const koaRouter = require('koa-router')
+const consts = require('../utils/consts')
+const menu = require('../models/menu')
+
+const router = koaRouter({
+  prefix: consts.BASE_API
+})
+
+const includingExamples = (assertion = true) => item => {
+  const assertIncludeExample = assertion === true
+  // Defaults to true. Anything could be an example.
+  // So we have to be careful at what we might end up with in production build.
+  let isExample = true
+  const idFieldExists = Reflect.has(item, 'id')
+  // Make it in example range if id is missing
+  const idFieldFirstDigits = idFieldExists ? item.id.split('-')[0] : 1000
+  const idFieldInteger = Number.parseInt(idFieldFirstDigits)
+  if (idFieldExists && typeof idFieldInteger === 'number') {
+    // Assuming id 9999-99 IS NOT an example
+    // Assuming id 1000-00 IS an example
+    isExample = idFieldInteger > 999
+  }
+  return isExample === false || isExample === assertIncludeExample
+}
+
+router.get('/ui/menu', async (ctx, next) => {
+  ctx.assert(ctx.session.jwt, 401, 'Require authentication')
+
+  const body = menu.filter(i => includingExamples(process.env.SHOW_EXAMPLES === 'true')(i))
+
+  ctx.status = 200
+  ctx.body = body
+})
+
+module.exports = router.routes()

server/api/routes-ui.js

@@ -0,0 +1,48 @@
+const items = [
+  {
+    id: '1',
+    name: 'nav.home',
+    url: '/',
+    icon: 'el-icon-menu'
+  },
+  {
+    id: '3',
+    name: 'nav.about',
+    url: '/about',
+    icon: 'el-icon-menu'
+  },
+  // Assuming id > 999 are examples.
+  {
+    id: '1000',
+    name: 'nav.kitchenSink',
+    icon: 'el-icon-goods',
+    children: [
+      {
+        id: '1000-1',
+        name: 'nav.demo',
+        url: '/examples',
+        icon: 'el-icon-share'
+      },
+      {
+        id: '1000-2',
+        name: 'nav.list',
+        url: '/examples/activity',
+        icon: 'el-icon-view'
+      },
+      {
+        id: '1000-3',
+        name: 'nav.create',
+        url: '/examples/activity/create',
+        icon: 'el-icon-message'
+      },
+      {
+        id: '1000-4',
+        name: 'nav.charts',
+        url: '/examples/charts',
+        icon: 'el-icon-picture'
+      }
+    ]
+  }
+]
+
+module.exports = [...items]

server/models/menu.js

@@ -47,7 +47,7 @@ const handleTokenExp = exp => {
  * to point to your own API.
  */
 const createRequest = async (method, url, requestConfig) => {
-  // #TODO Make this only return a request configuration object, and factor axios out from this.
+  // #TODO #refactorCreateRequestBackIntoKoa Make this only return a request configuration object, and factor axios out from this.
   const baseURL = process.env.LB_ADDR || consts.LB_ADDR
   const verb = method.toUpperCase()
   console.log(`createRequest ${verb} ${baseURL}${url}, requestConfig`, requestConfig)
@@ -87,8 +87,11 @@ const getUserData = async (token) => {
    * Would create a request like this;
    *
    *     GET /platform/uaano/oauth/validate?Token=111.222.333&userinfo=PreferredLanguage,TimeZone
+   *
+   * rel: #refactorCreateRequestBackIntoKoa
    */
   const response = await createRequest('GET', consts.ENDPOINT_BACKEND_VALIDATE, { params })
+  // console.log(`getUserData response`, {...response})
 
   const body = {
     status: response.Status