Merge pull request #3197 from flarum/as/permission-grid-fixes

Permission grid fixes

framework/core/js/src/admin/components/PermissionDropdown.js

@@ -38,7 +38,6 @@ export default class PermissionDropdown extends Dropdown {
 
     attrs.className = 'PermissionDropdown';
     attrs.buttonClassName = 'Button Button--text';
-    attrs.lazyDraw = true;
   }
 
   view(vnode) {

framework/core/js/src/admin/components/PermissionGrid.tsx

@@ -38,11 +38,13 @@ export default class PermissionGrid<CustomAttrs extends IPermissionGridAttrs = I
 
     const permissionCells = (permission: PermissionGridEntry | { children: PermissionGridEntry[] }) => {
       return scopes.map((scope) => {
+        // This indicates the "permission" is a permission category,
+        // in which case we return an empty table cell.
         if ('children' in permission) {
           return <td></td>;
         }
 
-        return scope.render(permission);
+        return <td>{scope.render(permission)}</td>;
       });
     };
 
@@ -416,7 +418,7 @@ export default class PermissionGrid<CustomAttrs extends IPermissionGridAttrs = I
             });
           }
 
-          return '';
+          return null;
         },
       },
       100

framework/core/js/src/admin/components/SettingDropdown.js

@@ -1,4 +1,4 @@
-import app from '../../admin/app';
+import app from '../app';
 import SelectDropdown from '../../common/components/SelectDropdown';
 import Button from '../../common/components/Button';
 import saveSettings from '../utils/saveSettings';
@@ -11,18 +11,23 @@ export default class SettingDropdown extends SelectDropdown {
     attrs.buttonClassName = 'Button Button--text';
     attrs.caretIcon = 'fas fa-caret-down';
     attrs.defaultLabel = 'Custom';
+
+    if ('key' in attrs) {
+      attrs.setting = attrs.key;
+      delete attrs.key;
+    }
   }
 
   view(vnode) {
     return super.view({
       ...vnode,
       children: this.attrs.options.map(({ value, label }) => {
-        const active = app.data.settings[this.attrs.key] === value;
+        const active = app.data.settings[this.attrs.setting] === value;
 
         return Button.component(
           {
             icon: active ? 'fas fa-check' : true,
-            onclick: saveSettings.bind(this, { [this.attrs.key]: value }),
+            onclick: saveSettings.bind(this, { [this.attrs.setting]: value }),
             active,
           },
           label