diff --git a/packages/web/src/components/layout/MobileInstancePanel.tsx b/packages/web/src/components/layout/MobileInstancePanel.tsx
new file mode 100644
index 00000000..3ffd9678
--- /dev/null
+++ b/packages/web/src/components/layout/MobileInstancePanel.tsx
@@ -0,0 +1,68 @@
+import React from 'react';
+import { useUIStore } from '../../stores/uiStore';
+import { MobileScreenHeader } from './MobileScreenHeader';
+
+const sections = [
+ {
+ id: 'general',
+ label: 'General',
+ icon: (
+
+ ),
+ },
+ {
+ id: 'streaming',
+ label: 'Streaming',
+ icon: (
+
+ ),
+ },
+ {
+ id: 'storage',
+ label: 'Storage',
+ icon: (
+
+ ),
+ },
+ {
+ id: 'users',
+ label: 'Users',
+ icon: (
+
+ ),
+ },
+];
+
+export function MobileInstancePanel() {
+ const pushMobileScreen = useUIStore((s) => s.pushMobileScreen);
+
+ return (
+
+
+
+ {sections.map((section) => (
+
+ ))}
+
+
+ );
+}
diff --git a/packages/web/src/components/layout/MobileSettingsScreen.tsx b/packages/web/src/components/layout/MobileSettingsScreen.tsx
index e42e245e..6d22eba4 100644
--- a/packages/web/src/components/layout/MobileSettingsScreen.tsx
+++ b/packages/web/src/components/layout/MobileSettingsScreen.tsx
@@ -5,7 +5,6 @@ import { AccountPanel } from '../modals/settingsPanels/AccountPanel';
import { VoicePanel } from '../modals/settingsPanels/VoicePanel';
import { ConnectionsPanel } from '../modals/settingsPanels/ConnectionsPanel';
import { PrivacyPanel } from '../modals/settingsPanels/PrivacyPanel';
-import { InstancePanel } from '../modals/settingsPanels/InstancePanel';
interface MobileSettingsScreenProps {
initialPanel?: string;
@@ -16,7 +15,6 @@ const panelConfig: Record
voice: { title: 'Voice & Audio', component: },
privacy: { title: 'Privacy', component: },
connections: { title: 'Connections', component: },
- instance: { title: 'Instance', component: },
};
const sectionIcons: Record = {
diff --git a/packages/web/src/components/layout/MobileShell.tsx b/packages/web/src/components/layout/MobileShell.tsx
index dff8b841..e777e454 100644
--- a/packages/web/src/components/layout/MobileShell.tsx
+++ b/packages/web/src/components/layout/MobileShell.tsx
@@ -11,12 +11,18 @@ import { MobileDmsScreen } from './MobileDmsScreen';
import { MobileYouScreen } from './MobileYouScreen';
import { MobileChatScreen } from './MobileChatScreen';
import { MobileSettingsScreen } from './MobileSettingsScreen';
+import { MobileInstancePanel } from './MobileInstancePanel';
+import { MobileScreenHeader } from './MobileScreenHeader';
import { MobileVoiceMiniBar } from './MobileVoiceMiniBar';
import { MobileVoiceFullScreen } from './MobileVoiceFullScreen';
import { MemberSidebar } from './MemberSidebar';
import { FriendsPage } from '../chat/FriendsPage';
import { ExplorePage } from '../chat/ExplorePage';
import { UserProfileModal } from '../modals/UserProfileModal';
+import { GeneralPanel } from '../modals/instanceSettingsPanels/GeneralPanel';
+import { StreamingPanel } from '../modals/instanceSettingsPanels/StreamingPanel';
+import { StoragePanel } from '../modals/instanceSettingsPanels/StoragePanel';
+import { UsersPanel } from '../modals/instanceSettingsPanels/UsersPanel';
const screenMap: Record) => React.ReactNode> = {
'channel-chat': (params) => ,
@@ -26,7 +32,31 @@ const screenMap: Record) => React.React
'settings-voice': () => ,
'settings-privacy': () => ,
'settings-connections': () => ,
- 'settings-instance': () => ,
+ 'settings-instance': () => ,
+ 'settings-instance-general': () => (
+
+ ),
+ 'settings-instance-streaming': () => (
+
+ ),
+ 'settings-instance-storage': () => (
+
+ ),
+ 'settings-instance-users': () => (
+
+ ),
'members': () => ,
'voice-full': () => ,
'explore': () => ,