import React from "react"; import { useRouter } from "next/router"; import Link from "next/link"; import { RootStore } from "store/root"; import { useMobxStore } from "lib/mobx/store-provider"; export enum EUserWorkspaceRoles { GUEST = 5, MEMBER = 15, ADMIN = 20, } export const WorkspaceSettingsSidebar = () => { const router = useRouter(); const { workspaceSlug } = router.query; const { user: userStore }: RootStore = useMobxStore(); const workspaceMemberInfo = userStore.currentWorkspaceRole || EUserWorkspaceRoles.GUEST; const workspaceLinks: Array<{ label: string; href: string; access: EUserWorkspaceRoles; }> = [ { label: "General", href: `/${workspaceSlug}/settings`, access: EUserWorkspaceRoles.GUEST, }, { label: "Members", href: `/${workspaceSlug}/settings/members`, access: EUserWorkspaceRoles.GUEST, }, { label: "Billing and plans", href: `/${workspaceSlug}/settings/billing`, access: EUserWorkspaceRoles.ADMIN, }, { label: "Integrations", href: `/${workspaceSlug}/settings/integrations`, access: EUserWorkspaceRoles.ADMIN, }, { label: "Imports", href: `/${workspaceSlug}/settings/imports`, access: EUserWorkspaceRoles.ADMIN, }, { label: "Exports", href: `/${workspaceSlug}/settings/exports`, access: EUserWorkspaceRoles.ADMIN, }, { label: "Webhooks", href: `/${workspaceSlug}/settings/webhooks`, access: EUserWorkspaceRoles.ADMIN, }, { label: "API tokens", href: `/${workspaceSlug}/settings/api-tokens`, access: EUserWorkspaceRoles.ADMIN, }, ]; return (
SETTINGS
{workspaceLinks.map( (link) => workspaceMemberInfo >= link.access && (
{link.label}
) )}
); };