feat: sidebar item permissions + admin nav edit

2020-04-18 18:25:16 -04:00
parent 9a93ac28f2
commit 8aba5305d8
14 changed files with 131 additions and 68 deletions
--- a/client/client-app.js
+++ b/client/client-app.js
@@ -215,6 +215,7 @@ let bootstrap = () => {
  // Load theme-specific code
  // ====================================

+  // eslint-disable-next-line no-unused-expressions
  import(/* webpackChunkName: "theme-page"  */ './themes/' + process.env.CURRENT_THEME + '/js/app.js')
 }

--- a/client/components/admin/admin-groups-edit-rules.vue
+++ b/client/components/admin/admin-groups-edit-rules.vue
@@ -118,6 +118,8 @@
              :items='locales'
              v-model='rule.locales'
              placeholder='Any Locale'
+              item-value='code'
+              item-text='name'
              multiple
              hide-details
              height='48px'
@@ -126,7 +128,7 @@
              style='flex: 0 1 150px;'
              )
              template(slot='selection', slot-scope='{ item, index }')
-                v-chip.white--text.ml-0(v-if='rule.locales.length === 1', small, label, :color='rule.deny ? `red` : `green`').caption {{ item.value.toUpperCase() }}
+                v-chip.white--text.ml-0(v-if='rule.locales.length === 1', small, label, :color='rule.deny ? `red` : `green`').caption {{ item.code.toUpperCase() }}
                v-chip.white--text.ml-0(v-else-if='index === 0', small, label, :color='rule.deny ? `red` : `green`').caption {{ rule.locales.length }} locales
              v-list-item(slot='prepend-item', @click='rule.locales = []')
                v-list-item-action(style='min-width: 30px;')
@@ -149,8 +151,8 @@
                  )
                v-icon.mr-2(:color='rule.deny ? `red` : `green`') mdi-web
                v-list-item-content
-                  v-list-item-title.body-2 {{props.item.text}}
-                v-chip.mr-2.grey--text(label, small, :color='$vuetify.theme.dark ? `grey darken-4` : `grey lighten-4`').caption {{props.item.value.toUpperCase()}}
+                  v-list-item-title.body-2 {{props.item.name}}
+                v-chip.mr-2.grey--text(label, small, :color='$vuetify.theme.dark ? `grey darken-4` : `grey lighten-4`').caption {{props.item.code.toUpperCase()}}

            //- Path
            v-text-field(
@@ -197,6 +199,8 @@
 import _ from 'lodash'
 import { customAlphabet } from 'nanoid/non-secure'

+/* global siteLangs */
+
 const nanoid = customAlphabet('1234567890abcdef', 10)

 export default {
@@ -209,10 +213,10 @@ export default {
  data() {
    return {
      roles: [
-        { text: 'Read Pages', value: 'read:pages', icon: 'mdi-file-document-box-search-outline' },
-        { text: 'Create Pages', value: 'write:pages', icon: 'mdi-file-document-box-plus-outline' },
+        { text: 'Read Pages', value: 'read:pages', icon: 'mdi-file-eye-outline' },
+        { text: 'Create Pages', value: 'write:pages', icon: 'mdi-file-plus-outline' },
        { text: 'Edit + Move Pages', value: 'manage:pages', icon: 'mdi-file-document-edit-outline' },
-        { text: 'Delete Pages', value: 'delete:pages', icon: 'mdi-file-document-box-remove-outline' },
+        { text: 'Delete Pages', value: 'delete:pages', icon: 'mdi-file-remove-outline' },
        { text: 'View Pages Source', value: 'read:source', icon: 'mdi-code-tags' },
        { text: 'View Pages History', value: 'read:history', icon: 'mdi-history' },
        { text: 'Read / Use Assets', value: 'read:assets', icon: 'mdi-image-search-outline' },
@@ -228,9 +232,6 @@ export default {
        { text: 'Path Ends With...', value: 'END', icon: '.../' },
        { text: 'Path Matches Regex...', value: 'REGEX', icon: '$.*' },
        { text: 'Tag Matches...', value: 'TAG', icon: 'T' }
-      ],
-      locales: [
-        { text: 'English', value: 'en' }
      ]
    }
  },
@@ -238,7 +239,8 @@ export default {
    group: {
      get() { return this.value },
      set(val) { this.$set('input', val) }
-    }
+    },
+    locales() { return siteLangs }
  },
  methods: {
    addRule(group) {
--- a/client/components/admin/admin-navigation.vue
+++ b/client/components/admin/admin-navigation.vue
@@ -69,12 +69,12 @@
                          item-value='code'
                        )
                      v-list.py-2(dense, nav, dark, class='blue darken-2', style='border-radius: 0;')
-                        v-list-item(v-if='navTree.length < 1')
+                        v-list-item(v-if='currentTree.length < 1')
                          v-list-item-avatar(size='24'): v-icon(color='blue lighten-3') mdi-alert
                          v-list-item-content
                            em.caption.blue--text.text--lighten-4 {{$t('navigation.emptyList')}}
-                        draggable(v-model='navTree')
-                          template(v-for='navItem in navTree')
+                        draggable(v-model='currentTree')
+                          template(v-for='navItem in currentTree')
                            v-list-item(
                              v-if='navItem.kind === "link"'
                              :key='navItem.id'
@@ -223,7 +223,7 @@
                          )
                      template(v-else)
                        v-toolbar(height='56', color='teal lighten-1', flat, dark)
-                        v-card-text.grey--text(v-if='navTree.length > 0') {{$t('navigation.noSelectionText')}}
+                        v-card-text.grey--text(v-if='currentTree.length > 0') {{$t('navigation.noSelectionText')}}
                        v-card-text.grey--text(v-else) {{$t('navigation.noItemsText')}}

    page-selector(mode='select', v-model='selectPageModal', :open-handler='selectPageHandle', path='home', :locale='currentLang')
@@ -247,9 +247,9 @@ export default {
  data() {
    return {
      selectPageModal: false,
-      navTree: [],
+      trees: [],
      current: {},
-      currentLang: 'en',
+      currentLang: siteConfig.lang,
      groups: [],
      config: {
        mode: 'NONE'
@@ -267,6 +267,33 @@ export default {
    },
    locales () {
      return siteLangs
+    },
+    currentTree: {
+      get () {
+        return _.get(_.find(this.trees, ['locale', this.currentLang]), 'items', null) || []
+      },
+      set (val) {
+        const tree = _.find(this.trees, ['locale', this.currentLang])
+        if (tree) {
+          tree.items = val
+        } else {
+          this.trees = [...this.trees, {
+            locale: this.currentLang,
+            items: val
+          }]
+        }
+      }
+    }
+  },
+  watch: {
+    currentLang (newValue, oldValue) {
+      this.$nextTick(() => {
+        if (this.currentTree.length > 0) {
+          this.current = this.currentTree[0]
+        } else {
+          this.current = {}
+        }
+      })
    }
  },
  methods: {
@@ -291,11 +318,11 @@ export default {
          newItem.label = this.$t('navigation.untitled', { kind: this.$t(`navigation.header`) })
          break
      }
-      this.navTree.push(newItem)
+      this.currentTree = [...this.currentTree, newItem]
      this.current = newItem
    },
    deleteItem(item) {
-      this.navTree = _.pull(this.navTree, item)
+      this.currentTree = _.pull(this.currentTree, item)
      this.current = {}
    },
    selectItem(item) {
@@ -326,7 +353,7 @@ export default {
            }
          `,
          variables: {
-            tree: this.navTree
+            tree: this.trees
          }
        })
        if (_.get(resp, 'data.navigation.updateTree.responseResult.succeeded', false)) {
@@ -344,7 +371,7 @@ export default {
      this.$store.commit(`loadingStop`, 'admin-navigation-save')
    },
    async refresh() {
-      await this.$apollo.queries.navTree.refetch()
+      await this.$apollo.queries.trees.refetch()
      this.current = {}
      this.$store.commit('showNotification', {
        message: 'Navigation has been refreshed.',
@@ -353,9 +380,6 @@ export default {
      })
    }
  },
-  mounted () {
-    this.currentLang = siteConfig.lang
-  },
  apollo: {
    config: {
      query: gql`
@@ -373,7 +397,7 @@ export default {
        this.$store.commit(`loading${isLoading ? 'Start' : 'Stop'}`, 'admin-navigation-config')
      }
    },
-    navTree: {
+    trees: {
      query: gql`
        {
          navigation {
@@ -386,6 +410,8 @@ export default {
                icon
                targetType
                target
+                visibilityMode
+                visibilityGroups
              }
            }
          }
--- a/client/themes/default/components/nav-sidebar.vue
+++ b/client/themes/default/components/nav-sidebar.vue
@@ -1,14 +1,14 @@
 <template lang="pug">
  div
    .blue.darken-3.pa-3.d-flex(v-if='navMode === `MIXED`')
-      v-btn(depressed, color='blue darken-2', style='min-width:0;', href='/')
+      v-btn(depressed, color='blue darken-2', style='min-width:0;', @click='goHome')
        v-icon(size='20') mdi-home
      v-btn.ml-3(v-if='currentMode === `custom`', depressed, color='blue darken-2', style='flex: 1 1 100%;', @click='switchMode(`browse`)')
        v-icon(left) mdi-file-tree
-        .body-2.text-none Browse
+        .body-2.text-none {{$t('common:sidebar.browse')}}
      v-btn.ml-3(v-else-if='currentMode === `browse`', depressed, color='blue darken-2', style='flex: 1 1 100%;', @click='switchMode(`custom`)')
        v-icon(left) mdi-navigation
-        .body-2.text-none Main Menu
+        .body-2.text-none {{$t('common:sidebar.mainMenu')}}
    v-divider
    //-> Custom Navigation
    v-list.py-2(v-if='currentMode === `custom`', dense, :class='color', :dark='dark')
@@ -30,7 +30,7 @@
            v-icon(small) mdi-folder-open
          v-list-item-title {{ item.title }}
        v-divider.mt-2
-        v-subheader.pl-4 Current Directory
+        v-subheader.pl-4 {{$t('common:sidebar.currentDirectory')}}
      template(v-for='item of currentItems')
        v-list-item(v-if='item.isFolder', :key='`childfolder-` + item.id', @click='fetchBrowseItems(item)')
          v-list-item-avatar(size='24')
@@ -47,6 +47,8 @@ import _ from 'lodash'
 import gql from 'graphql-tag'
 import { get } from 'vuex-pathify'

+/* global siteLangs */
+
 export default {
  props: {
    color: {
@@ -85,6 +87,7 @@ export default {
  methods: {
    switchMode (mode) {
      this.currentMode = mode
+      window.localStorage.setItem('navPref', mode)
      if (mode === `browse` && this.loadedCache.length < 1) {
        this.loadFromCurrentPath()
      }
@@ -186,14 +189,20 @@ export default {
      this.loadedCache = [curPage.parent]
      this.currentItems = _.filter(items, ['parent', curPage.parent])
      this.$store.commit(`loadingStop`, 'browse-load')
+    },
+    goHome () {
+      window.location.assign(siteLangs.length > 0 ? `/${this.locale}/home` : '/')
    }
  },
  mounted () {
+    this.currentParent.title = `/ ${this.$t('common:sidebar.root')}`
    if (this.navMode === 'TREE') {
      this.currentMode = 'browse'
-      this.loadFromCurrentPath()
    } else {
-      this.currentMode = 'custom'
+      this.currentMode = window.localStorage.getItem('navPref') || 'custom'
+    }
+    if (this.currentMode === 'browse') {
+      this.loadFromCurrentPath()
    }
  }
 }
--- a/package.json
+++ b/package.json
@@ -37,7 +37,7 @@
  "dependencies": {
    "@aoberoi/passport-slack": "1.0.5",
    "@azure/storage-blob": "12.1.1",
-    "@bugsnag/js": "6.5.2",
+    "@bugsnag/js": "7.0.0",
    "@exlinc/keycloak-passport": "1.0.2",
    "@root/csr": "0.8.1",
    "@root/keypairs": "0.9.0",
@@ -48,7 +48,7 @@
    "apollo-server": "2.12.0",
    "apollo-server-express": "2.12.0",
    "auto-load": "3.0.4",
-    "aws-sdk": "2.656.0",
+    "aws-sdk": "2.658.0",
    "azure-search-client": "3.1.5",
    "bcryptjs-then": "1.0.1",
    "bluebird": "3.7.2",
@@ -72,7 +72,7 @@
    "emoji-regex": "9.0.0",
    "express": "4.17.1",
    "express-brute": "1.0.1",
-    "express-session": "1.17.0",
+    "express-session": "1.17.1",
    "file-type": "14.1.4",
    "filesize": "6.1.0",
    "fs-extra": "9.0.0",
@@ -84,7 +84,7 @@
    "graphql-tools": "4.0.7",
    "he": "1.2.0",
    "highlight.js": "9.18.1",
-    "i18next": "19.4.1",
+    "i18next": "19.4.2",
    "i18next-express-middleware": "1.9.1",
    "i18next-node-fs-backend": "2.1.3",
    "image-size": "0.8.3",
@@ -94,7 +94,7 @@
    "jsonwebtoken": "8.5.1",
    "katex": "0.11.1",
    "klaw": "3.0.0",
-    "knex": "0.20.13",
+    "knex": "0.20.15",
    "lodash": "4.17.15",
    "markdown-it": "10.0.0",
    "markdown-it-abbr": "1.0.4",
@@ -113,7 +113,7 @@
    "mime-types": "2.1.26",
    "moment": "2.24.0",
    "moment-timezone": "0.5.28",
-    "mongodb": "3.5.5",
+    "mongodb": "3.5.6",
    "ms": "2.1.2",
    "mssql": "6.2.0",
    "multer": "1.4.2",
@@ -157,7 +157,7 @@
    "safe-regex": "2.1.1",
    "sanitize-filename": "1.6.3",
    "scim-query-filter-parser": "2.0.4",
-    "semver": "7.2.2",
+    "semver": "7.3.2",
    "serve-favicon": "2.5.0",
    "simple-git": "1.132.0",
    "solr-node": "1.2.1",
@@ -189,7 +189,7 @@
    "@babel/plugin-syntax-import-meta": "^7.8.3",
    "@babel/polyfill": "^7.8.7",
    "@babel/preset-env": "^7.9.5",
-    "@mdi/font": "5.0.45",
+    "@mdi/font": "5.1.45",
    "@panter/vue-i18next": "0.15.2",
    "@requarks/ckeditor5": "12.4.0-wiki.16",
    "@vue/babel-preset-app": "4.3.1",
@@ -234,7 +234,7 @@
    "eslint-plugin-vue": "6.2.2",
    "fibers": "4.0.2",
    "file-loader": "6.0.0",
-    "filepond": "4.13.1",
+    "filepond": "4.13.4",
    "filepond-plugin-file-validate-type": "1.2.5",
    "filesize.js": "2.0.0",
    "graphql-persisted-document-loader": "2.0.0",
@@ -264,14 +264,14 @@
    "pug-lint": "2.6.0",
    "pug-loader": "2.4.0",
    "pug-plain-loader": "1.0.0",
-    "raw-loader": "4.0.0",
+    "raw-loader": "4.0.1",
    "resolve-url-loader": "3.1.1",
    "sass": "1.26.3",
    "sass-loader": "8.0.2",
-    "sass-resources-loader": "2.0.1",
+    "sass-resources-loader": "2.0.3",
    "script-ext-html-webpack-plugin": "2.1.4",
    "simple-progress-webpack-plugin": "1.1.2",
-    "style-loader": "1.1.3",
+    "style-loader": "1.1.4",
    "terser": "4.6.11",
    "twemoji-awesome": "1.0.6",
    "url-loader": "4.1.0",
@@ -291,13 +291,13 @@
    "vue2-animate": "2.1.3",
    "vuedraggable": "2.23.2",
    "vuescroll": "4.15.0",
-    "vuetify": "2.2.21",
+    "vuetify": "2.2.22",
    "vuetify-loader": "1.4.3",
    "vuex": "3.1.3",
    "vuex-pathify": "1.4.1",
    "vuex-persistedstate": "3.0.1",
    "webpack": "4.42.1",
-    "webpack-bundle-analyzer": "3.6.1",
+    "webpack-bundle-analyzer": "3.7.0",
    "webpack-cli": "3.3.11",
    "webpack-dev-middleware": "3.7.2",
    "webpack-hot-middleware": "2.25.0",
--- a/server/controllers/auth.js
+++ b/server/controllers/auth.js
@@ -25,7 +25,7 @@ const bruteforce = new ExpressBrute(new BruteKnex({
 router.get('/login', async (req, res, next) => {
  _.set(res.locals, 'pageMeta.title', 'Login')

-  if (req.query.legacy || req.get('user-agent').indexOf('Trident') >= 0) {
+  if (req.query.legacy || (req.get('user-agent') && req.get('user-agent').indexOf('Trident') >= 0)) {
    const { formStrategies, socialStrategies } = await WIKI.models.authentication.getStrategiesForLegacyClient()
    res.render('legacy/login', {
      err: false,
--- a/server/controllers/common.js
+++ b/server/controllers/common.js
@@ -395,7 +395,7 @@ router.get('/*', async (req, res, next) => {
      if (page) {
        _.set(res.locals, 'pageMeta.title', page.title)
        _.set(res.locals, 'pageMeta.description', page.description)
-        const sidebar = await WIKI.models.navigation.getTree({ cache: true, locale: pageArgs.locale })
+        const sidebar = await WIKI.models.navigation.getTree({ cache: true, locale: pageArgs.locale, groups: req.user.groups })
        const injectCode = {
          css: WIKI.config.theming.injectCSS,
          head: WIKI.config.theming.injectHead,
--- a/server/core/db.js
+++ b/server/core/db.js
@@ -105,6 +105,7 @@ module.exports = {
      connection: dbConfig,
      pool: {
        ...WIKI.config.pool,
+        propagateCreateError: false,
        async afterCreate(conn, done) {
          // -> Set Connection App Name
          switch (WIKI.config.db.type) {
--- a/server/core/telemetry.js
+++ b/server/core/telemetry.js
@@ -1,6 +1,6 @@
 const _ = require('lodash')
 const { createApolloFetch } = require('apollo-fetch')
-const bugsnag = require('@bugsnag/node')
+const Bugsnag = require('@bugsnag/js')
 const { v4: uuid } = require('uuid')
 const os = require('os')
 const fs = require('fs-extra')
@@ -8,21 +8,20 @@ const fs = require('fs-extra')
 /* global WIKI */

 module.exports = {
-  client: null,
  enabled: false,
  init() {
-    this.client = bugsnag({
+    Bugsnag.start({
      apiKey: WIKI.data.telemetry.BUGSNAG_ID,
      appType: 'server',
      appVersion: WIKI.version,
-      autoNotify: false,
-      collectUserIp: false,
+      autoDetectErrors: false,
+      autoTrackSessions: false,
      hostname: _.get(WIKI.config, 'telemetry.clientId', uuid()),
-      notifyReleaseStages: ['production'],
+      enabledReleaseStages: ['production'],
      releaseStage: WIKI.IS_DEBUG ? 'development' : 'production',
      projectRoot: WIKI.ROOTPATH,
      logger: null,
-      beforeSend: (report) => {
+      onError: (report) => {
        if (!WIKI.telemetry.enabled) { return false }
      }
    })
@@ -34,7 +33,7 @@ module.exports = {
    }
  },
  sendError(err) {
-    this.client.notify(err)
+    Bugsnag.notify(err)
  },
  sendEvent(eventCategory, eventAction, eventLabel) {
    // TODO
--- a/server/graph/resolvers/navigation.js
+++ b/server/graph/resolvers/navigation.js
@@ -11,7 +11,7 @@ module.exports = {
  },
  NavigationQuery: {
    async tree (obj, args, context, info) {
-      return WIKI.models.navigation.getTree({ cache: false, locale: 'all' })
+      return WIKI.models.navigation.getTree({ cache: false, locale: 'all', bypassAuth: true })
    },
    config (obj, args, context, info) {
      return WIKI.config.nav
@@ -23,7 +23,9 @@ module.exports = {
        await WIKI.models.navigation.query().patch({
          config: args.tree
        }).where('key', 'site')
-        await WIKI.cache.set('nav:sidebar', args.tree, 300)
+        for (const tree of args.tree) {
+          await WIKI.cache.set(`nav:sidebar:${tree.locale}`, tree.items, 300)
+        }

        return {
          responseResult: graphHelper.generateSuccess('Navigation updated successfully')
--- a/server/graph/schemas/navigation.graphql
+++ b/server/graph/schemas/navigation.graphql
@@ -53,6 +53,8 @@ type NavigationItem {
  icon: String
  targetType: String
  target: String
+  visibilityMode: String
+  visibilityGroups: [Int]
 }

 input NavigationItemInput {
@@ -62,6 +64,8 @@ input NavigationItemInput {
  icon: String
  targetType: String
  target: String
+  visibilityMode: String
+  visibilityGroups: [Int]
 }

 type NavigationConfig {
--- a/server/models/navigation.js
+++ b/server/models/navigation.js
@@ -22,20 +22,24 @@ module.exports = class Navigation extends Model {
    }
  }

-  static async getTree({ cache = false, locale = 'en' } = {}) {
+  static async getTree({ cache = false, locale = 'en', groups = [], bypassAuth = false } = {}) {
    if (cache) {
      const navTreeCached = await WIKI.cache.get(`nav:sidebar:${locale}`)
      if (navTreeCached) {
-        return navTreeCached
+        return bypassAuth ? navTreeCached : WIKI.models.navigation.getAuthorizedItems(navTreeCached, groups)
      }
    }
-    const navTree = await WIKI.models.navigation.query().findOne('key', 'site')
+    const navTree = await WIKI.models.navigation.query().findOne('key', `site`)
    if (navTree) {
-      // Check for pre-2.1 format
+      // Check for pre-2.3 format
      if (_.has(navTree.config[0], 'kind')) {
        navTree.config = [{
          locale: 'en',
-          items: navTree.config
+          items: navTree.config.map(item => ({
+            ...item,
+            visibilityMode: 'all',
+            visibilityGroups: []
+          }))
        }]
      }

@@ -44,10 +48,20 @@ module.exports = class Navigation extends Model {
          await WIKI.cache.set(`nav:sidebar:${tree.locale}`, tree.items, 300)
        }
      }
-      return locale === 'all' ? navTree.config : WIKI.cache.get(`nav:sidebar:${locale}`)
+      if (bypassAuth) {
+        return locale === 'all' ? navTree.config : WIKI.cache.get(`nav:sidebar:${locale}`)
+      } else {
+        return locale === 'all' ? WIKI.models.navigation.getAuthorizedItems(navTree.config, groups) : WIKI.models.navigation.getAuthorizedItems(WIKI.cache.get(`nav:sidebar:${locale}`), groups)
+      }
    } else {
      WIKI.logger.warn('Site Navigation is missing or corrupted.')
      return []
    }
  }
+
+  static getAuthorizedItems(tree = [], groups = []) {
+    return _.filter(tree, leaf => {
+      return leaf.visibilityMode === 'all' || _.intersection(leaf.visibilityGroups, groups).length > 0
+    })
+  }
 }
--- a/server/setup.js
+++ b/server/setup.js
@@ -315,12 +315,17 @@ module.exports = () => {
        key: 'site',
        config: [
          {
-            id: uuid(),
-            icon: 'mdi-home',
-            kind: 'link',
-            label: 'Home',
-            target: '/',
-            targetType: 'home'
+            locale: 'en',
+            items: [
+              {
+                id: uuid(),
+                icon: 'mdi-home',
+                kind: 'link',
+                label: 'Home',
+                target: '/',
+                targetType: 'home'
+              }
+            ]
          }
        ]
      })
--- a/yarn.lock
+++ b/yarn.lock