feat(frontend): show proxy menu in simple mode but remove proxy controls

packages/frontend/src/app/main-sidebar.tsx

@@ -126,16 +126,12 @@ export function MainSidebar() {
       isCurrent: selectedMenu === 'formatter',
       id: 'formatter',
     },
-    ...(mode === 'pro'
-      ? [
-          {
-            name: 'Proxy',
-            iconType: BiServer,
-            isCurrent: selectedMenu === 'proxy',
-            id: 'proxy',
-          },
-        ]
-      : []),
+    {
+      name: 'Proxy',
+      iconType: BiServer,
+      isCurrent: selectedMenu === 'proxy',
+      id: 'proxy',
+    },
     {
       name: 'Miscellaneous',
       iconType: BiCog,

packages/frontend/src/components/menu/proxy.tsx

@@ -14,6 +14,7 @@ import { Button } from '../ui/button';
 import MarkdownLite from '../shared/markdown-lite';
 import { PageControls } from '../shared/page-controls';
 import { PasswordInput } from '../ui/password-input';
+import { useMode } from '@/context/mode';
 type ProxyServiceId = keyof typeof constants.PROXY_SERVICE_DETAILS;
 
 type ProxyConfig = {
@@ -39,6 +40,7 @@ export function ProxyMenu() {
 function Content() {
   const { status } = useStatus();
   const { userData, setUserData } = useUserData();
+  const { mode } = useMode();
   const details = constants.PROXY_SERVICE_DETAILS;
 
   // Effect to initialize values from userData/defaults/forced
@@ -214,76 +216,80 @@ function Content() {
             )}
           </div>
 
-          <div className="space-y-2">
-            <TextInput
-              label="Public IP"
-              value={userData.proxy?.publicIp ?? ''}
-              onValueChange={(v) => {
-                setUserData((prev) => ({
-                  ...prev,
-                  proxy: { ...prev.proxy, publicIp: v || undefined },
-                }));
-              }}
-              placeholder="Enter public IP"
-              disabled={isPublicIpForced || !userData.proxy?.enabled}
-            />
-            <p className="text-[--muted] text-sm">
-              Configure this only when running {selectedProxyDetails?.name}{' '}
-              locally with a proxy service. Leave empty if{' '}
-              {selectedProxyDetails?.name} is configured locally without a proxy
-              server or if it's hosted on a remote server.
-            </p>
-          </div>
+          {mode === 'pro' && (
+            <div className="space-y-2">
+              <TextInput
+                label="Public IP"
+                value={userData.proxy?.publicIp ?? ''}
+                onValueChange={(v) => {
+                  setUserData((prev) => ({
+                    ...prev,
+                    proxy: { ...prev.proxy, publicIp: v || undefined },
+                  }));
+                }}
+                placeholder="Enter public IP"
+                disabled={isPublicIpForced || !userData.proxy?.enabled}
+              />
+              <p className="text-[--muted] text-sm">
+                Configure this only when running {selectedProxyDetails?.name}{' '}
+                locally with a proxy service. Leave empty if{' '}
+                {selectedProxyDetails?.name} is configured locally without a
+                proxy server or if it's hosted on a remote server.
+              </p>
+            </div>
+          )}
         </SettingsCard>
 
-        <SettingsCard
-          title="Proxy Controls"
-          description="Optionally, specify services and addons that should be proxied. These options are applied conjunctively."
-        >
-          <div className="space-y-2">
-            <Combobox
-              label="Proxied Services"
-              value={userData.proxy?.proxiedServices ?? []}
-              onValueChange={(v) => {
-                setUserData((prev) => ({
-                  ...prev,
-                  proxy: { ...prev.proxy, proxiedServices: v },
-                }));
-              }}
-              options={serviceOptions}
-              placeholder="Select services to proxy"
-              multiple={true}
-              disabled={isServicesForced || !userData.proxy?.enabled}
-              emptyMessage="No services available"
-            />
-            <p className="text-[--muted] text-sm">
-              Only streams (that are detected to be) from these services will be
-              proxied. Select None to enable proxying of streams that are not
-              detected to be from a service.
-            </p>
-          </div>
+        {mode === 'pro' && (
+          <SettingsCard
+            title="Proxy Controls"
+            description="Optionally, specify services and addons that should be proxied. These options are applied conjunctively."
+          >
+            <div className="space-y-2">
+              <Combobox
+                label="Proxied Services"
+                value={userData.proxy?.proxiedServices ?? []}
+                onValueChange={(v) => {
+                  setUserData((prev) => ({
+                    ...prev,
+                    proxy: { ...prev.proxy, proxiedServices: v },
+                  }));
+                }}
+                options={serviceOptions}
+                placeholder="Select services to proxy"
+                multiple={true}
+                disabled={isServicesForced || !userData.proxy?.enabled}
+                emptyMessage="No services available"
+              />
+              <p className="text-[--muted] text-sm">
+                Only streams (that are detected to be) from these services will
+                be proxied. Select None to enable proxying of streams that are
+                not detected to be from a service.
+              </p>
+            </div>
 
-          <div className="space-y-2">
-            <Combobox
-              label="Proxied Addons"
-              value={userData.proxy?.proxiedAddons ?? []}
-              onValueChange={(v) => {
-                setUserData((prev) => ({
-                  ...prev,
-                  proxy: { ...prev.proxy, proxiedAddons: v },
-                }));
-              }}
-              options={addonOptions}
-              placeholder="Select addons to proxy"
-              multiple={true}
-              disabled={isProxiedAddonsDisabled || !userData.proxy?.enabled}
-              emptyMessage="No addons available"
-            />
-            <p className="text-[--muted] text-sm">
-              Only streams from these addons will be proxied
-            </p>
-          </div>
-        </SettingsCard>
+            <div className="space-y-2">
+              <Combobox
+                label="Proxied Addons"
+                value={userData.proxy?.proxiedAddons ?? []}
+                onValueChange={(v) => {
+                  setUserData((prev) => ({
+                    ...prev,
+                    proxy: { ...prev.proxy, proxiedAddons: v },
+                  }));
+                }}
+                options={addonOptions}
+                placeholder="Select addons to proxy"
+                multiple={true}
+                disabled={isProxiedAddonsDisabled || !userData.proxy?.enabled}
+                emptyMessage="No addons available"
+              />
+              <p className="text-[--muted] text-sm">
+                Only streams from these addons will be proxied
+              </p>
+            </div>
+          </SettingsCard>
+        )}
       </div>
     </>
   );

packages/frontend/src/context/menu.tsx

@@ -15,7 +15,7 @@ const VALID_MENUS = [
   'save-install',
 ];
 
-const PRO_ONLY_MENUS = ['proxy', 'sorting'];
+const PRO_ONLY_MENUS = ['sorting'];
 
 export type MenuId = (typeof VALID_MENUS)[number];