feat: enhance navigation components with available plans

- Updated LeftNav and CloudVersionSelect components to accept and utilize an `availablePlans` prop for improved version selection based on user plans.
- Modified DocTemplate to dynamically generate the `availablePlans` array based on navigation types, enhancing the documentation structure.
- Improved filtering logic in the version selection to display only relevant options based on the user's available plans.

Author: shhdgit

src/components/Layout/Navigation/LeftNav.tsx

@@ -26,10 +26,19 @@ interface LeftNavProps {
   availIn: string[];
   buildType?: BuildType;
   bannerEnabled?: boolean;
+  availablePlans: string[];
 }
 
 export function LeftNavDesktop(props: LeftNavProps) {
-  const { data, current, name, pathConfig, availIn, buildType } = props;
+  const {
+    data,
+    current,
+    name,
+    pathConfig,
+    availIn,
+    buildType,
+    availablePlans,
+  } = props;
 
   return (
     <Box
@@ -68,6 +77,7 @@ export function LeftNavDesktop(props: LeftNavProps) {
             pathConfig={pathConfig}
             availIn={availIn}
             buildType={buildType}
+            availablePlans={availablePlans}
           />
         )}
         <LeftNavTree data={data} current={current} />

src/components/Layout/VersionSelect/CloudVersionSelect.tsx

@@ -51,6 +51,7 @@ const VersionItems = (props: {
   pathConfig: PathConfig;
   name: string;
   onClick: () => void;
+  availablePlans: string[];
 }) => {
   const { pathConfig } = props;
   const { cloudMode } = useCloudMode(pathConfig.repo);
@@ -72,7 +73,9 @@ const VersionItems = (props: {
 
   return (
     <>
-      {CLOUD_VERSIONS.map((version) => (
+      {CLOUD_VERSIONS.filter((version) =>
+        props.availablePlans.includes(version.value)
+      ).map((version) => (
         <MenuItem
           key={`menu-${version.value}`}
           value={`menu-${version.value}`}
@@ -113,10 +116,11 @@ interface VersionSelectProps {
   pathConfig: PathConfig;
   availIn: string[];
   buildType?: BuildType;
+  availablePlans: string[];
 }
 
 export default function CloudVersionSelect(props: VersionSelectProps) {
-  const { name, pathConfig, availIn } = props;
+  const { name, pathConfig, availIn, availablePlans } = props;
   const { cloudMode } = useCloudMode(pathConfig.repo);
   const currentCloudVersion =
     CLOUD_VERSIONS.find((version) => version.value === cloudMode) ||
@@ -158,6 +162,7 @@ export default function CloudVersionSelect(props: VersionSelectProps) {
           pathConfig={pathConfig}
           name={name}
           onClick={handleClose}
+          availablePlans={availablePlans}
         />
       </VersionSelectMenu>
     </>

src/templates/DocTemplate.tsx

@@ -101,6 +101,16 @@ export default function DocTemplate({
     ? essentialNavigation
     : classicNavigation;
 
+  const haveStarter = starterNavigation.length > 0;
+  const haveEssential = essentialNavigation.length > 0;
+  const availablePlans = ["dedicated"];
+  if (haveStarter) {
+    availablePlans.push("starter");
+  }
+  if (haveEssential) {
+    availablePlans.push("essential");
+  }
+
   const tocData: TableOfContent[] | undefined = React.useMemo(() => {
     if (tableOfContents.items?.length === 1) {
       return tableOfContents.items![0].items;
@@ -129,6 +139,7 @@ export default function DocTemplate({
             name={name}
             pathConfig={pathConfig}
             availIn={availIn.version}
+            availablePlans={availablePlans}
           />
         )
       }
@@ -188,6 +199,7 @@ export default function DocTemplate({
               availIn={availIn.version}
               buildType={buildType}
               bannerEnabled={bannerVisible}
+              availablePlans={availablePlans}
             />
           )}
           <Box