add viewSelection=false to hide view selector

Author: maxkorp

typescript-sdk/apps/dojo/src/components/sidebar/sidebar.tsx

@@ -29,7 +29,7 @@ interface SidebarProps {
 export function Sidebar({ isMobile, onMobileClose }: SidebarProps) {
   const router = useRouter();
   const pathname = usePathname();
-  const { view, pickerDisabled, featureSelectionDisabled, setView } = useURLParams();
+  const { view, pickerDisabled, featureSelectionDisabled, setView, viewSelectionDisabled} = useURLParams();
   const [isDarkTheme, setIsDarkTheme] = useState<boolean>(false);
 
   // Extract the current integration ID from the pathname
@@ -116,6 +116,7 @@ export function Sidebar({ isMobile, onMobileClose }: SidebarProps) {
       </div>
 
       {/* Controls Section */}
+      {(!viewSelectionDisabled || !pickerDisabled) && (
       <div className="p-4 border-b bg-background">
         {/* Integration picker */}
         {!pickerDisabled && (
@@ -144,6 +145,7 @@ export function Sidebar({ isMobile, onMobileClose }: SidebarProps) {
         )}
 
         {/* Preview/Code Tabs */}
+        {!viewSelectionDisabled &&
         <div className="mb-1">
           <label className="block text-sm font-medium text-muted-foreground mb-2">View</label>
           <Tabs
@@ -176,7 +178,9 @@ export function Sidebar({ isMobile, onMobileClose }: SidebarProps) {
             </TabsList>
           </Tabs>
         </div>
+        }
       </div>
+      )}
 
       {/* Demo List */}
       <div className="flex-1 overflow-auto">

typescript-sdk/apps/dojo/src/contexts/url-params-context.tsx

@@ -8,6 +8,7 @@ interface URLParamsState {
   view: View;
   sidebarHidden: boolean;
   featureSelectionDisabled: boolean;
+  viewSelectionDisabled: boolean;
   pickerDisabled: boolean;
   file?: string;
 }
@@ -16,6 +17,7 @@ interface URLParamsContextType extends URLParamsState {
   setView: (view: View) => void;
   setSidebarHidden: (disabled: boolean) => void;
   setFeatureSelectionDisabled: (disabled: boolean) => void;
+  setViewSelectionDisabled: (disabled: boolean) => void;
   setPickerDisabled: (disabled: boolean) => void;
   setCodeFile: (fileName: string) => void;
 }
@@ -35,6 +37,7 @@ export function URLParamsProvider({ children }: URLParamsProviderProps) {
   const [state, setState] = useState<URLParamsState>(() => ({
     view: (searchParams.get("view") as View) || "preview",
     sidebarHidden: searchParams.get("sidebar") === "disabled",
+    viewSelectionDisabled: searchParams.get("viewSelection") === "false",
     pickerDisabled: searchParams.get("picker") === "false",
     featureSelectionDisabled: searchParams.get("features") === "false",
   }));
@@ -61,6 +64,14 @@ export function URLParamsProvider({ children }: URLParamsProviderProps) {
       }
     }
 
+    // Update viewSelection param
+    if (newState.viewSelectionDisabled !== undefined) {
+      if (newState.viewSelectionDisabled) {
+        params.set("viewSelection", "false");
+      } else {
+        params.delete("viewSelection");
+      }
+    }
     // Update features param
     if (newState.featureSelectionDisabled !== undefined) {
       if (newState.featureSelectionDisabled) {
@@ -90,6 +101,7 @@ export function URLParamsProvider({ children }: URLParamsProviderProps) {
       sidebarHidden: searchParams.get("sidebar") === "disabled",
       pickerDisabled: searchParams.get("picker") === "false",
       featureSelectionDisabled: searchParams.get("features") === "false",
+      viewSelectionDisabled: searchParams.get("viewSelection") === "false",
     };
 
     setState(newState);
@@ -120,6 +132,12 @@ export function URLParamsProvider({ children }: URLParamsProviderProps) {
     updateURL({ featureSelectionDisabled });
   };
 
+  const setViewSelectionDisabled = (viewSelectionDisabled: boolean) => {
+    const newState = { ...state, viewSelectionDisabled };
+    setState(newState);
+    updateURL({ viewSelectionDisabled });
+  };
+
   const setCodeFile = (fileName: string) => {
     const newState = { ...state, file: fileName };
     setState(newState);
@@ -132,6 +150,7 @@ export function URLParamsProvider({ children }: URLParamsProviderProps) {
     setSidebarHidden,
     setPickerDisabled,
     setFeatureSelectionDisabled,
+    setViewSelectionDisabled,
     setCodeFile,
   };