1.0.60

packages/shared/src/components/settings/ServerSettingsModal.tsx

@@ -34,13 +34,22 @@ const TABS: Array<{ id: ServerSettingsTab; label: string; icon: typeof Gear }> =
 	{ id: 'emojis', label: 'Custom Emoji', icon: Smiley },
 ];
 
-export function ServerSettingsModal({ isOpen, onClose, initialTab = 'overview' }: ServerSettingsModalProps) {
-	const [activeTab, setActiveTab] = useState<ServerSettingsTab>(initialTab);
+export function ServerSettingsModal({ isOpen, onClose, initialTab }: ServerSettingsModalProps) {
+	// Desktop opens straight to the Overview tab when no explicit
+	// tab is requested — the two-column layout always needs a
+	// selection to fill the content pane. Mobile uses the category
+	// list as the root and only jumps into a panel if the caller
+	// actually asked for one, so we keep the raw `initialTab` below
+	// to forward to `MobileServerSettings`.
+	const resolvedInitialTab: ServerSettingsTab = initialTab ?? 'overview';
+	const [activeTab, setActiveTab] = useState<ServerSettingsTab>(
+		resolvedInitialTab,
+	);
 	const isMobile = useIsMobile();
 
 	useEffect(() => {
-		if (isOpen) setActiveTab(initialTab);
-	}, [isOpen, initialTab]);
+		if (isOpen) setActiveTab(resolvedInitialTab);
+	}, [isOpen, resolvedInitialTab]);
 
 	useEffect(() => {
 		if (!isOpen) return;
@@ -52,7 +61,9 @@ export function ServerSettingsModal({ isOpen, onClose, initialTab = 'overview' }
 	}, [isOpen, onClose]);
 
 	// Mobile gets the full-screen overlay with a category list ↔ panel
-	// flow, desktop gets the two-column modal below.
+	// flow, desktop gets the two-column modal below. Pass the raw
+	// `initialTab` (NOT the resolved version) so mobile lands on the
+	// category list when nothing was requested.
 	if (isMobile) {
 		return (
 			<MobileServerSettings