@concretecms/bedrock 1.3.6 → 1.4.0

package/assets/cms/js/in-context-menu.js

@@ -19,6 +19,7 @@
             menuLauncherHoverParentClass: 'ccm-parent-menu-item-hover',
             enabled: true,
             enableClickProxy: true,
+            onShow: false,
             onHide: false
         }, options)
 
@@ -280,6 +281,10 @@
             ConcreteMenuManager.activeMenu = my
 
             ConcreteEvent.publish('ConcreteMenuShow', { menu: my, menuElement: $menu })
+
+            if (my.options.onShow) {
+                my.options.onShow(my)
+            }
         },
 
         hide: function (e) {

package/assets/cms/js/jquery-vue.js

@@ -0,0 +1,22 @@
+/* I know this is an insane library name. This is a simple plugin meant to bring our vue contexts to different
+/* places */
+/* eslint-disable no-new, no-unused-vars, camelcase, eqeqeq */
+/* global _, ccmi18n, ccmi18n_filemanager, ConcreteProgressiveOperation, ConcreteAlert, ConcreteAssetLoader, ConcreteEvent, ConcreteMenu */
+;(function(global, $) {
+    'use strict'
+    // jQuery Plugin
+    $.fn.concreteVue = function(options) {
+        this.each(function () {
+            var $element = $(this)
+            if (!$element.data('jquery-vue-attached')) {
+                Concrete.Vue.activateContext(options.context, function (Vue, config) {
+                    new Vue({
+                        el: $element.get(0),
+                        components: config.components
+                    })
+                })
+                $element.data('jquery-vue-attached', true)
+            }
+        })
+    }
+})(global, jQuery)

package/assets/cms/js/legacy-dialog.js

@@ -302,82 +302,91 @@
     }
 
     $.fn.dialog.activateDialogContents = function($dialog) {
-        // handle buttons
-        $dialog.find('button[data-dialog-action=cancel]').on('click', function() {
-            $.fn.dialog.closeTop()
-        })
-        $dialog.find('[data-dialog-form]').each(function() {
-            var $form = $(this)
-            var options = {}
-            if ($form.attr('data-dialog-form-processing') == 'progressive') {
-                options.progressiveOperation = true
-                options.progressiveOperationElement = 'div[data-dialog-form-element=progress-bar]'
-            }
-            $form.concreteAjaxForm(options)
-        })
-
-        $dialog.find('button[data-dialog-action=submit]').on('click', function() {
-            $dialog.find('[data-dialog-form]').submit()
-        })
-
-        fixDialogButtons($dialog)
+        setTimeout(function () {
+            // handle buttons
+            $dialog.find('button[data-dialog-action=cancel]').on('click', function () {
+                $.fn.dialog.closeTop()
+            })
+            $dialog.find('[data-dialog-form]').each(function () {
+                var $form = $(this)
+                var options = {}
+                if ($form.attr('data-dialog-form-processing') == 'progressive') {
+                    options.progressiveOperation = true
+                    options.progressiveOperationElement = 'div[data-dialog-form-element=progress-bar]'
+                }
+                $form.concreteAjaxForm(options)
+            })
 
-        // make dialogs
-        $dialog.find('.dialog-launch').dialog()
+            $dialog.find('button[data-dialog-action=submit]').on('click', function () {
+                $dialog.find('[data-dialog-form]').submit()
+            })
 
-        // automated close handling
-        $dialog.find('.ccm-dialog-close').on('click', function() {
-            $dialog.dialog('close')
-        })
+            fixDialogButtons($dialog)
 
-        const tooltipTriggerList = [].slice.call($dialog.find('.launch-tooltip'))
-        tooltipTriggerList.map(function (tooltipTriggerEl) {
-            return new bootstrap.Tooltip(tooltipTriggerEl, { container: '#ccm-tooltip-holder' })
-        })
+            // make dialogs
+            $dialog.find('.dialog-launch').dialog()
 
-        // help handling
-        if ($dialog.find('.dialog-help').length > 0) {
-            $dialog.find('.dialog-help').hide()
-            var helpContent = $dialog.find('.dialog-help').html()
-            var helpText
-            if (ccmi18n.helpPopup) {
-                helpText = ccmi18n.helpPopup
-            } else {
-                helpText = 'Help'
-            }
-            var button = $('<button class="btn-help"><svg><use xlink:href="#icon-dialog-help" /></svg></button>')
-            var container = $('#ccm-tooltip-holder')
-            button.insertBefore($dialog.parent().find('.ui-dialog-titlebar-close'))
+            // Handle vue components within
+            $dialog.find('[data-vue]').each(function() {
+                $(this).concreteVue({ context: $(this).attr('data-vue') })
+            })
 
-            button.popover({
-                content: function() {
-                    return helpContent
-                },
-                placement: 'bottom',
-                html: true,
-                container: container,
-                trigger: 'click'
+            // automated close handling
+            $dialog.find('.ccm-dialog-close').on('click', function () {
+                $dialog.dialog('close')
             })
-            button.on('shown.bs.popover', function() {
-                var binding = function() {
-                    button.popover('hide', button)
-                    binding = $.noop
-                }
 
-                button.on('hide.bs.popover', function(event) {
-                    button.unbind(event)
-                    binding = $.noop
+            const tooltipTriggerList = [].slice.call($dialog.find('.launch-tooltip'))
+            tooltipTriggerList.map(function (tooltipTriggerEl) {
+                return new bootstrap.Tooltip(tooltipTriggerEl, {
+                    container: '#ccm-tooltip-holder'
                 })
+            })
 
-                $('body').mousedown(function(e) {
-                    if ($(e.target).closest(container).length || $(e.target).closest(button).length) {
-                        return
+            // help handling
+            if ($dialog.find('.dialog-help').length > 0) {
+                $dialog.find('.dialog-help').hide()
+                var helpContent = $dialog.find('.dialog-help').html()
+                var helpText
+                if (ccmi18n.helpPopup) {
+                    helpText = ccmi18n.helpPopup
+                } else {
+                    helpText = 'Help'
+                }
+                var button = $('<button class="btn-help"><svg><use xlink:href="#icon-dialog-help" /></svg></button>')
+                var container = $('#ccm-tooltip-holder')
+                button.insertBefore($dialog.parent().find('.ui-dialog-titlebar-close'))
+
+                button.popover({
+                    content: function () {
+                        return helpContent
+                    },
+                    placement: 'bottom',
+                    html: true,
+                    container: container,
+                    trigger: 'click'
+                })
+                button.on('shown.bs.popover', function () {
+                    var binding = function () {
+                        button.popover('hide', button)
+                        binding = $.noop
                     }
-                    $(this).unbind(e)
-                    binding()
+
+                    button.on('hide.bs.popover', function (event) {
+                        button.unbind(event)
+                        binding = $.noop
+                    })
+
+                    $('body').mousedown(function (e) {
+                        if ($(e.target).closest(container).length || $(e.target).closest(button).length) {
+                            return
+                        }
+                        $(this).unbind(e)
+                        binding()
+                    })
                 })
-            })
-        }
+            }
+        }, 10)
     }
 
     $.fn.dialog.getTop = function() {

package/assets/cms/js/modal.js

@@ -0,0 +1,73 @@
+/* eslint-disable no-new, no-unused-vars, camelcase, eqeqeq */
+/* global bootstrap */
+// This is a bridge between our various old custom code and Bootstrap Modals. The ultimate goal is to first
+// Remove jQuery UI, on the way to removing jQuery (if the latter is ever an option.) So the first thing we need to
+// do is remove all instances of dialog-launch legacy jQuery UI dialogs in favor of a single modal BS modal approach.
+
+import bootbox from 'bootbox'
+
+class ConcreteModal {
+    openExternal(url, title, options) {
+        var my = this
+        new ConcreteAjaxRequest({
+            url: url,
+            dataType: 'html',
+            success: function (r) {
+                options.message = r
+                options.title = title
+                my.show(options)
+            }
+        })
+    }
+
+    show(options) {
+        options = $.extend(options, {
+            className: 'ccm-ui',
+            centerVertical: true,
+            show: false,
+            backdrop: 'static',
+            container: '#ccm-tooltip-holder' // This was we get the .ccm-ui namespace for things like transition, etc..
+        })
+        const $_dialog = bootbox.dialog(options)
+        const element = $_dialog.get(0)
+
+        // Turn the _dialog jQuery object into the new Bs5 modal
+        const dialog = new bootstrap.Modal(element)
+
+        // Handle buttons in the response
+        const responseButtons = $_dialog.find('.dialog-buttons')
+        if (responseButtons.length) {
+            // move it out to the root.
+            responseButtons.attr('class', 'modal-footer').insertAfter($_dialog.find('.modal-body'))
+        }
+
+        // Handle the legacy dialog buttons
+        $_dialog.find('[data-dialog-form]').concreteAjaxForm()
+        $_dialog.find('button[data-dialog-action=cancel]').on('click', function() {
+            dialog.hide()
+        })
+        $_dialog.find('button[data-dialog-action=submit]').on('click', function() {
+            $_dialog.find('[data-dialog-form]').submit()
+        })
+
+        // Change the Close button to be white.
+        $_dialog.find('.btn-close').addClass('btn-close-white')
+
+        // Show the dialog
+        // dialog._config.backdrop = 'static'
+        dialog.show()
+
+        if (options.backdrop === 'static') {
+            dialog._config.backdrop = 'static'
+        }
+
+        element.addEventListener('hide.bs.modal', function() {
+            ConcreteModal.totalOpen--
+        })
+        ConcreteModal.totalOpen++
+    }
+}
+
+ConcreteModal.totalOpen = 0
+
+global.ConcreteModal = ConcreteModal

package/assets/cms/js/panels.js

@@ -337,6 +337,10 @@ function ConcretePanel(options) {
             $('[data-panel-detail-form]').submit()
         })
 
+        $content.find('[data-vue]').each(function() {
+            $(this).concreteVue({ context: $(this).attr('data-vue') })
+        })
+
         ConcreteEvent.subscribe('AjaxFormSubmitSuccess', function (e, data) {
             if ($('[data-panel-detail-form="' + data.form + '"]').data('action-after-save') == 'reload') {
                 window.location.reload()
@@ -413,6 +417,10 @@ function ConcretePanel(options) {
         })
 
         $panel.find('.dialog-launch').dialog()
+        $panel.find('[data-vue]').each(function() {
+            $(this).concreteVue({ context: $(this).attr('data-vue') })
+        })
+
         $panel.find('[data-launch-panel-detail]').unbind('.detail').on('click.detail', function () {
             $.fn.dialog.showLoader()
             $('.ccm-panel-menu-item-active').removeClass('ccm-panel-menu-item-active')

package/assets/cms/js/search/base.js

@@ -54,7 +54,6 @@
         this.setupCheckboxes()
         this.setupSort()
         this.setupPagination()
-        this.setupSelectize()
         this.setupAdvancedSearch()
         this.setupCustomizeColumns()
         this.updateResults(options.result)
@@ -120,23 +119,6 @@
         return data
     }
 
-    ConcreteAjaxSearch.prototype.setupSelectize = function() {
-        var selects = this.$element.find('.ccm-enhanced-select')
-        console.log('base')
-        if (selects.length) {
-            selects.selectpicker({
-                liveSearch: true,
-                width: '100%'
-            })
-        }
-        // var selects = this.$element.find('.selectize-select')
-        // if (selects.length) {
-        //     selects.selectize({
-        //         plugins: ['remove_button']
-        //     })
-        // }
-    }
-
     /**
      * The legacy create menu function for simple list items without multiple selection
      * @param $selector

package/assets/cms/js/search/field-selector.js

@@ -36,13 +36,9 @@
                         var $content = $container.append(
                             renderFieldRowTemplate({ field: r })
                         )
-                        var selects = $content.find('select.ccm-enhanced-select')
-                        if (selects.length) {
-                            selects.selectpicker({
-                                liveSearch: true,
-                                width: '100%'
-                            })
-                        }
+                        $content.find('[data-vue]').each(function() {
+                            $(this).concreteVue({ context: $(this).attr('data-vue') })
+                        })
                     }
                 })
             }
@@ -73,13 +69,9 @@
             })
         }
 
-        var selects = $container.find('select.ccm-enhanced-select')
-        if (selects.length) {
-            selects.selectpicker({
-                liveSearch: true,
-                width: '100%'
-            })
-        }
+        $container.find('[data-vue]').each(function() {
+            $(this).concreteVue({ context: $(this).attr('data-vue') })
+        })
     }
 
     // jQuery Plugin

package/assets/cms/js/select-combo-box.js

@@ -0,0 +1,2 @@
+import TomSelect from 'tom-select'
+window.TomSelect = TomSelect

package/assets/cms/js/sitemap/sitemap-selector.js

@@ -35,13 +35,13 @@
                 if (options.selected) {
                     if (options.mode == 'multiple') {
                         $.each(options.selected, function(i, cID) {
-                            var node = my.$element.find('.ccm-sitemap-tree').fancytree('getTree').getNodeByKey(String(cID))
+                            var node = $.ui.fancytree.getTree(my.$element.find('.ccm-sitemap-tree')).getNodeByKey(String(cID))
                             if (node) {
                                 node.setSelected(true)
                             }
                         })
                     } else {
-                        var tree = my.$element.find('.ccm-sitemap-tree').fancytree('getTree')
+                        var tree = $.ui.fancytree.getTree(my.$element.find('.ccm-sitemap-tree'))
                         var node = tree.getNodeByKey(String(options.selected))
                         if (node) {
                             node.setSelected(true)

package/assets/cms/js/sitemap/sitemap.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-new, no-unused-vars, camelcase, eqeqeq */
-/* global _, ccmi18n_sitemap, CCM_DISPATCHER_FILENAME, CCM_SECURITY_TOKEN, CCM_REL, Concrete, ConcreteAlert, ConcretePageMenu, ccm_parseJSON, ConcreteProgressiveOperation, ConcreteEvent */
+/* global TomSelect, _, ccmi18n_sitemap, CCM_DISPATCHER_FILENAME, CCM_SECURITY_TOKEN, CCM_REL, Concrete, ConcreteAlert, ConcretePageMenu, ccm_parseJSON, ConcreteProgressiveOperation, ConcreteEvent */
 
 /* Base search class for AJAX forms in the UI */
 ;(function(global, $) {
@@ -47,7 +47,7 @@
 
         getTree: function() {
             var my = this
-            return my.$sitemap.fancytree('getTree')
+            return $.ui.fancytree.getTree(my.$sitemap)
         },
 
         setupSiteTreeSelector: function(tree) {
@@ -60,13 +60,14 @@
                     my.$element.find('div.ccm-sitemap-tree-selector-wrapper').append($(my.localesWrapperTemplate))
                     var $menu = my.$element.find('div.ccm-sitemap-tree-selector-wrapper select')
 
+                    // @todo - refactor TomSelect to bring back nice styling of flags, etc...
                     if (tree.entryGroups && tree.entryGroups.length) {
                         $.each(tree.entryGroups, function (gi, group) {
                             var $optgroup = $('<optgroup label="' + group.label + '">')
 
                             $.each(tree.entries, function (ti, entry) {
                                 if (entry.class == group.value) {
-                                    var $option = '<option value="' + entry.siteTreeID + '" data-content=\'<div class="option">' + entry.element + '</div>\''
+                                    var $option = '<option value="' + entry.siteTreeID + '"'
 
                                     if (entry.isSelected) {
                                         $option += ' selected'
@@ -81,7 +82,7 @@
                         })
                     } else {
                         $.each(tree.entries, function (ti, entry) {
-                            var $option = '<option value="' + entry.siteTreeID + '" data-content=\'<div class="option">' + entry.element + '</div>\''
+                            var $option = '<option value="' + entry.siteTreeID + '"'
 
                             if (entry.isSelected) {
                                 $option += ' selected'
@@ -92,19 +93,13 @@
                         })
                     }
 
-                    $menu.selectpicker({
-                        liveSearch: true,
-                        maxOptions: 1
-                    })
+                    var menuSelect = new TomSelect($menu.get(0))
 
-                    $menu.on('changed.bs.select', function (e, clickedIndex, isSelected, previousValue) {
-                        var treeID = $(this).selectpicker('val')
-                        if (treeID != previousValue) {
-                            var source = my.getTree().options.source
-                            my.options.siteTreeID = treeID
-                            source.data.siteTreeID = treeID
-                            my.getTree().reload(source)
-                        }
+                    menuSelect.on('change', function (treeID) {
+                        var source = my.getTree().options.source
+                        my.options.siteTreeID = treeID
+                        source.data.siteTreeID = treeID
+                        my.getTree().reload(source)
                     })
                 }
             }
@@ -340,10 +335,10 @@
             }
             ConcreteEvent.unsubscribe('SitemapDeleteRequestComplete.sitemap')
             ConcreteEvent.subscribe('SitemapDeleteRequestComplete.sitemap', function(e) {
-                var node = my.$sitemap.fancytree('getActiveNode')
+                var node = $.ui.fancytree.getTree($(my.$sitemap)).getActiveNode()
                 var parent = node.parent
                 my.reloadNode(parent)
-                $(my.$sitemap).fancytree('getTree').visit(function(node) {
+                $.ui.fancytree.getTree($(my.$sitemap)).visit(function(node) {
                     // update the trash node when a page is deleted
                     if (node.data.isTrash) {
                         var isTrashNodeExpanded = node.expanded
@@ -456,7 +451,7 @@
             if (pg.length) {
                 pg.find('a:not([disabled])').unbind('click').on('click', function() {
                     var href = $(this).attr('href')
-                    var root = my.$sitemap.fancytree('getRootNode')
+                    var root = $.ui.fancytree.getTree(my.$sitemap).getRootNode()
                     jQuery.fn.dialog.showLoader()
                     $.ajax({
                         dataType: 'json',
@@ -482,7 +477,7 @@
 
             (my.options.onDisplaySingleLevel || $.noop).call(this, node)
 
-            var root = my.$sitemap.fancytree('getRootNode')
+            var root = $.ui.fancytree.getTree(my.$sitemap).getRootNode()
             // my.$sitemap.fancytree('option', 'minExpandLevel', minExpandLevel);
             var ajaxData = $.extend({
                 dataType: 'json',

package/assets/cms/js/toolbar.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-new, no-unused-vars, camelcase, eqeqeq */
-/* global CCM_DISPATCHER_FILENAME, ConcreteEvent, ConcreteHelpGuideManager, ConcretePanelManager, bootstrap */
+/* global CCM_DISPATCHER_FILENAME, ConcreteModal, ConcreteEvent, ConcreteHelpGuideManager, ConcretePanelManager, bootstrap */
 
 /* Basic toolbar class */
 ;(function(global, $) {
@@ -14,6 +14,28 @@
         $searchResults.css('right', $(window).width() - $searchInput.offset().left - $searchResults.width() - 1)
     }
 
+    function setupAnnouncementAndHelp() {
+        if (document.querySelectorAll('div[data-wrapper=concrete-announcement-broadcast]').length) {
+            Concrete.Vue.activateContext('cms', function (Vue, config) {
+                new Vue({
+                    el: 'div[data-wrapper=concrete-announcement-broadcast]',
+                    components: config.components
+                })
+            })
+        }
+
+        $(document.body).on('click', 'a[data-launch=help-modal]', function (e) {
+            e.stopPropagation()
+            e.preventDefault()
+
+            const modal = new ConcreteModal()
+            const url = new URL($(this).attr('href'))
+            modal.openExternal(url, ccmi18n.helpPopup, {
+                size: 'lg'
+            })
+        })
+    }
+
     function setupHelpNotifications() {
         var manager = ConcreteHelpGuideManager.get()
         if (manager.getGuideToLaunchOnRefresh()) {
@@ -62,7 +84,7 @@
 
         const tooltipTriggerList = [].slice.call(document.querySelectorAll('.launch-tooltip'))
         tooltipTriggerList.map(function (tooltipTriggerEl) {
-            return new bootstrap.Tooltip(tooltipTriggerEl, {
+            return bootstrap.Tooltip.getInstance(tooltipTriggerEl) || new bootstrap.Tooltip(tooltipTriggerEl, {
                 container: '#ccm-tooltip-holder',
                 delay: {
                     show: 500,
@@ -324,6 +346,7 @@
                 setupTooltips()
                 setupPageAlerts()
                 setupHelpNotifications()
+                setupAnnouncementAndHelp()
                 setupMobileNav()
             }
         },

package/assets/cms/js/tree.js

@@ -155,7 +155,7 @@ ConcreteTree.prototype = {
                 if (options.removeNodesByKey.length) {
                     for (var i = 0; i < options.removeNodesByKey.length; i++) {
                         var nodeID = options.removeNodesByKey[i]
-                        var node = $tree.fancytree('getTree').getNodeByKey(String(nodeID))
+                        var node = $.ui.fancytree.getTree($tree).getNodeByKey(String(nodeID))
                         if (node) {
                             node.remove()
                         }
@@ -168,7 +168,7 @@ ConcreteTree.prototype = {
 
                 var selectedNodes
                 if (options.chooseNodeInForm) {
-                    selectedNodes = $tree.fancytree('getTree')
+                    selectedNodes = $.ui.fancytree.getTree($tree)
                     selectedNodes = selectedNodes.getSelectedNodes()
                     if (selectedNodes.length) {
                         var keys = $.map(selectedNodes, function (node) {
@@ -332,7 +332,7 @@ ConcreteTree.prototype = {
                     ConcreteAlert.dialog(ccmi18n.error, r.errors.join('<br>'))
                 } else {
                     jQuery.fn.dialog.closeTop()
-                    var node = $tree.fancytree('getTree').getNodeByKey(String(r.treeNodeParentID))
+                    var node = $.ui.fancytree.getTree($tree).getNodeByKey(String(r.treeNodeParentID))
                     jQuery.fn.dialog.showLoader()
                     my.reloadNode(node, function () {
                         jQuery.fn.dialog.hideLoader()
@@ -411,23 +411,23 @@ ConcreteTree.setupTreeEvents = function (my) {
         var node
         if (nodes.length) {
             for (var i = 0; i < nodes.length; i++) {
-                node = $tree.fancytree('getTree').getNodeByKey(String(nodes[i].treeNodeParentID))
+                node = $.ui.fancytree.getTree($tree).getNodeByKey(String(nodes[i].treeNodeParentID))
                 node.addChildren(nodes)
             }
         } else {
-            node = $tree.fancytree('getTree').getNodeByKey(String(nodes.treeNodeParentID))
+            node = $.ui.fancytree.getTree($tree).getNodeByKey(String(nodes.treeNodeParentID))
             node.addChildren(nodes)
         }
     })
     ConcreteEvent.subscribe('ConcreteTreeUpdateTreeNode.concreteTree', function (e, r) {
         var $tree = $('[data-tree=' + my.options.treeID + ']')
-        var node = $tree.fancytree('getTree').getNodeByKey(String(r.node.key))
+        var node = $.ui.fancytree.getTree($tree).getNodeByKey(String(r.node.key))
         node.fromDict(r.node)
         node.render()
     })
     ConcreteEvent.subscribe('ConcreteTreeDeleteTreeNode.concreteTree', function (e, r) {
         var $tree = $('[data-tree=' + my.options.treeID + ']')
-        var node = $tree.fancytree('getTree').getNodeByKey(String(r.node.treeNodeID))
+        var node = $.ui.fancytree.getTree($tree).getNodeByKey(String(r.node.treeNodeID))
         node.remove()
     })
 }

package/assets/cms/js/users/group-manager.js

@@ -0,0 +1,55 @@
+/* global ccmi18n, CCM_DISPATCHER_FILENAME, ConcreteAjaxRequest, ConcreteEvent */
+class ConcreteUserGroupManager {
+    static launchDialog(callback, opts) {
+        const options = {
+            displayDialogButtons: true
+        }
+
+        $.extend(options, opts)
+
+        $.fn.dialog.open({
+            title: ccmi18n.chooseGroup,
+            href: `${CCM_DISPATCHER_FILENAME}/ccm/system/dialogs/groups/search`,
+            width: '740px',
+            modal: true,
+            height: '600px',
+            data: options,
+            onOpen: function() {
+                ConcreteEvent.unsubscribe('SelectGroup.core')
+                ConcreteEvent.subscribe('SelectGroup.core', function (e, response) {
+                    $.fn.dialog.closeTop()
+                    callback(response)
+                })
+            }
+        })
+    }
+
+    static getGroupDetails(groupID, callbackSuccess, callbackFailure) {
+        const options = {
+            url: `${CCM_DISPATCHER_FILENAME}/ccm/system/group/get_json`,
+            data: { gID: groupID },
+            skipResponseValidation: true,
+            success(r) {
+                if (r.error) {
+                    if (callbackFailure) {
+                        callbackFailure(r)
+                    } else {
+                        ConcreteAjaxRequest.validateResponse(r)
+                    }
+                } else if (callbackSuccess) {
+                    callbackSuccess(r)
+                }
+            }
+        }
+        if (callbackFailure) {
+            options.error = function(r) {
+                callbackFailure(r)
+            }
+        }
+        /* eslint-disable no-new */
+        new ConcreteAjaxRequest(options)
+        /* eslint-enable no-new */
+    }
+}
+
+global.ConcreteUserGroupManager = ConcreteUserGroupManager

package/assets/cms/js/users/user-manager.js

@@ -2,7 +2,8 @@
 class ConcreteUserManager {
     static launchDialog(callback, opts) {
         const options = {
-            multipleSelection: ''
+            multipleSelection: false,
+            hideUsername: false
         }
 
         $.extend(options, opts)

package/assets/cms/js/users.js

@@ -1 +1,2 @@
 import './users/user-manager'
+import './users/group-manager'