diff --git a/app/javascript/dashboard/components-next/sidebar/Sidebar.vue b/app/javascript/dashboard/components-next/sidebar/Sidebar.vue index 449ba9ada..509654013 100644 --- a/app/javascript/dashboard/components-next/sidebar/Sidebar.vue +++ b/app/javascript/dashboard/components-next/sidebar/Sidebar.vue @@ -455,6 +455,7 @@ const menuItems = computed(() => { name: 'Settings Billing', label: t('SIDEBAR.BILLING'), icon: 'i-lucide-credit-card', + showOnlyOnCloud: true, to: accountScopedRoute('billing_settings_index'), }, ], diff --git a/app/javascript/dashboard/components-next/sidebar/SidebarGroup.vue b/app/javascript/dashboard/components-next/sidebar/SidebarGroup.vue index 36caf61fe..e84a18fb8 100644 --- a/app/javascript/dashboard/components-next/sidebar/SidebarGroup.vue +++ b/app/javascript/dashboard/components-next/sidebar/SidebarGroup.vue @@ -23,6 +23,7 @@ const { resolvePath, resolvePermissions, resolveFeatureFlag, + isOnChatwootCloud, isAllowed, } = useSidebarContext(); @@ -41,6 +42,7 @@ const hasChildren = computed( const accessibleItems = computed(() => { if (!hasChildren.value) return []; return props.children.filter(child => { + if (child.showOnlyOnCloud && isOnChatwootCloud.value) return false; // If a item has no link, it means it's just a subgroup header // So we don't need to check for permissions here, because there's nothing to // access here anyway diff --git a/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue b/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue index 13bdb040d..94ca7bd78 100644 --- a/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue +++ b/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue @@ -9,18 +9,28 @@ const props = defineProps({ to: { type: [String, Object], required: true }, icon: { type: [String, Object], default: null }, active: { type: Boolean, default: false }, + showOnlyOnCloud: { type: Boolean, default: false }, component: { type: Function, default: null }, }); -const { resolvePermissions, resolveFeatureFlag } = useSidebarContext(); +const { resolvePermissions, resolveFeatureFlag, isOnChatwootCloud } = + useSidebarContext(); + +const allowedToShow = computed(() => { + if (props.showOnlyOnCloud && isOnChatwootCloud) return false; + + return true; +}); const shouldRenderComponent = computed(() => { return typeof props.component === 'function' || isVNode(props.component); }); +