refactor(fe): share the SaaS PAYG experience with desktop via a cloud/ layer (#6649)

Co-authored-by: James Brunton <[email protected]>
This commit is contained in:
ConnorYoh
2026-06-17 11:12:05 +01:00
committed by GitHub
co-authored by James Brunton
parent ef0deef4f2
commit cd7264a76a
122 changed files with 1836 additions and 6365 deletions
@@ -2,7 +2,6 @@ import React from "react";
import { useTranslation } from "react-i18next";
import {
useConfigNavSections as useCoreConfigNavSections,
createConfigNavSections as createCoreConfigNavSections,
ConfigNavSection,
} from "@core/components/shared/config/configNavSections";
import PeopleSection from "@app/components/shared/config/configSections/PeopleSection";
@@ -270,251 +269,6 @@ export const useConfigNavSections = (
return sections;
};
/**
* Deprecated: Use useConfigNavSections hook instead
* Proprietary extension of createConfigNavSections that adds all admin and workspace sections
*/
export const createConfigNavSections = (
isAdmin: boolean = false,
runningEE: boolean = false,
loginEnabled: boolean = false,
): ConfigNavSection[] => {
console.warn(
"createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.",
);
// Get the core sections (just Preferences)
const sections = createCoreConfigNavSections(
isAdmin,
runningEE,
loginEnabled,
);
// Add account management under Preferences
const preferencesSection = sections.find((section) =>
section.items.some((item) => item.key === "general"),
);
if (preferencesSection) {
preferencesSection.items = preferencesSection.items.map((item) =>
item.key === "general"
? { ...item, component: <GeneralSection /> }
: item,
);
if (loginEnabled) {
preferencesSection.items.push({
key: "account",
label: "Account",
icon: "person-rounded",
component: <AccountSection />,
});
}
}
// Add Admin sections if user is admin OR if login is disabled (but mark as disabled)
if (isAdmin || !loginEnabled) {
const requiresLogin = !loginEnabled;
// Workspace
sections.push({
title: "Workspace",
items: [
{
key: "people",
label: "People",
icon: "group-rounded",
component: <PeopleSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "teams",
label: "Teams",
icon: "groups-rounded",
component: <TeamsSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
],
});
// Configuration
sections.push({
title: "Configuration",
items: [
{
key: "adminGeneral",
label: "System Settings",
icon: "settings-rounded",
component: <AdminGeneralSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminFeatures",
label: "Features",
icon: "extension-rounded",
component: <AdminFeaturesSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminEndpoints",
label: "Endpoints",
icon: "api-rounded",
component: <AdminEndpointsSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminDatabase",
label: "Database",
icon: "storage-rounded",
component: <AdminDatabaseSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminAdvanced",
label: "Advanced",
icon: "tune-rounded",
component: <AdminAdvancedSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
],
});
// Security & Authentication
sections.push({
title: "Security & Authentication",
items: [
{
key: "adminSecurity",
label: "Security",
icon: "shield-rounded",
component: <AdminSecuritySection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminConnections",
label: "Connections",
icon: "link-rounded",
component: <AdminConnectionsSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
],
});
// Licensing & Analytics
sections.push({
title: "Licensing & Analytics",
items: [
{
key: "adminPlan",
label: "Plan",
icon: "star-rounded",
component: <AdminPlanSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminAudit",
label: "Audit",
icon: "fact-check-rounded",
component: <AdminAuditSection />,
// Non-Enterprise users can click in to see the demo preview.
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminUsage",
label: "Usage Analytics",
icon: "analytics-rounded",
component: <AdminUsageSection />,
// Non-Enterprise users can click in to see the demo preview.
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
],
});
// Policies & Privacy
sections.push({
title: "Policies & Privacy",
items: [
{
key: "adminLegal",
label: "Legal",
icon: "gavel-rounded",
component: <AdminLegalSection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
{
key: "adminPrivacy",
label: "Privacy",
icon: "visibility-rounded",
component: <AdminPrivacySection />,
disabled: requiresLogin,
disabledTooltip: requiresLogin
? "Enable login mode first"
: undefined,
},
],
});
}
// Add Developer section if login is enabled
if (loginEnabled) {
const developerSection: ConfigNavSection = {
title: "Developer",
items: [
{
key: "api-keys",
label: "API Keys",
icon: "key-rounded",
component: <ApiKeys />,
},
],
};
// Add Developer section after Preferences (or Workspace if it exists)
const insertIndex = isAdmin ? 2 : 1;
sections.splice(insertIndex, 0, developerSection);
}
return sections;
};
// Re-export types for convenience
export type {
ConfigNavSection,