fix: replace "Content" section in the main menu with "Page Builder" a…

…nd "Form Builder"
webiny · Jun 30, 2020 · 066b6b3 · 066b6b3
1 parent ad29ab1
commit 066b6b3
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 27 deletions.
diff --git a/packages/app-form-builder/src/admin/plugins/menus.tsx b/packages/app-form-builder/src/admin/plugins/menus.tsx
@@ -1,24 +1,39 @@
 import React from "react";
+import { ReactComponent as PagesIcon } from "@webiny/app-page-builder/admin/assets/round-ballot-24px.svg";
 import { i18n } from "@webiny/app/i18n";
 import { SecureView } from "@webiny/app-security/components";
-import { AdminMenuContentSectionPlugin } from "@webiny/app-admin/types";
+import { AdminMenuPlugin } from "@webiny/app-admin/types";
 
 const t = i18n.ns("app-form-builder/admin/menus");
+const ROLE_FORMS_EDITOR = ["forms:form:crud"];
 
-const ROLE_FORMS_EDITOR = ["forms:settings"];
+const plugin: AdminMenuPlugin = {
+    type: "admin-menu",
+    name: "admin-menu-form-builder",
+    render({ Menu, Section, Item }) {
+        return (
+            <SecureView
+                scopes={{
+                    forms: ROLE_FORMS_EDITOR
+                }}
+            >
+                {({ scopes }) => {
+                    const { forms } = scopes;
+                    if (!forms) {
+                        return null;
+                    }
 
-export default [
-    {
-        type: "admin-menu-content-section",
-        name: "menu-content-section-forms",
-        render({ Section, Item }) {
-            return (
-                <SecureView scopes={ROLE_FORMS_EDITOR}>
-                    <Section label={t`Form Builder`}>
-                        <Item label={t`Forms`} path="/forms" />
-                    </Section>
-                </SecureView>
-            );
-        }
+                    return (
+                        <Menu name="app-form-builder" label={t`Form Builder`} icon={<PagesIcon />}>
+                            <Section label={t`Forms`}>
+                                {forms && <Item label={t`Forms`} path="/forms" />}
+                            </Section>
+                        </Menu>
+                    );
+                }}
+            </SecureView>
+        );
     }
-] as AdminMenuContentSectionPlugin[];
+};
+
+export default plugin;
diff --git a/packages/app-page-builder/src/admin/plugins/menus.tsx b/packages/app-page-builder/src/admin/plugins/menus.tsx
@@ -1,9 +1,8 @@
 import React from "react";
 import { ReactComponent as PagesIcon } from "@webiny/app-page-builder/admin/assets/round-ballot-24px.svg";
 import { i18n } from "@webiny/app/i18n";
-import { getPlugins } from "@webiny/plugins";
 import { SecureView } from "@webiny/app-security/components";
-import { AdminMenuPlugin, AdminMenuContentSectionPlugin } from "@webiny/app-admin/types";
+import { AdminMenuPlugin } from "@webiny/app-admin/types";
 
 const t = i18n.ns("app-form-builder/admin/menus");
 
@@ -13,7 +12,7 @@ const ROLE_PB_EDITOR = ["pb:page:crud"];
 
 const plugin: AdminMenuPlugin = {
     type: "admin-menu",
-    name: "menu-content",
+    name: "admin-menu-page-builder",
     render({ Menu, Section, Item }) {
         return (
             <SecureView
@@ -30,21 +29,14 @@ const plugin: AdminMenuPlugin = {
                     }
 
                     return (
-                        <Menu name="content-2" label={t`Content`} icon={<PagesIcon />}>
+                        <Menu name="app-page-builder" label={t`Page Builder`} icon={<PagesIcon />}>
                             <Section label={t`Pages`}>
                                 {categories && (
                                     <Item label={t`Categories`} path="/page-builder/categories" />
                                 )}
                                 {editor && <Item label={t`Pages`} path="/page-builder/pages" />}
                                 {menus && <Item label={t`Menus`} path="/page-builder/menus" />}
                             </Section>
-                            {getPlugins("admin-menu-content-section").map(
-                                (plugin: AdminMenuContentSectionPlugin) => (
-                                    <React.Fragment key={plugin.name}>
-                                        {plugin.render({ Section, Item })}
-                                    </React.Fragment>
-                                )
-                            )}
                         </Menu>
                     );
                 }}