feat: Start work on settings
This commit is contained in:
parent
0843162d69
commit
a970ed27a5
8 changed files with 126 additions and 13 deletions
|
|
@ -8,11 +8,8 @@ import App from './ui/App';
|
|||
import HomePage from './ui/pages/Home';
|
||||
import BrowserPage from './ui/pages/Browser';
|
||||
import UpdatesPage from './ui/pages/Updates';
|
||||
import ClusterOverview from './ui/pages/cluster/ClusterOverview';
|
||||
import ClusterMods from './ui/pages/cluster/ClusterMods';
|
||||
import ClusterRoot from '~ui/pages/cluster/ClusterRoot';
|
||||
import ClusterLogs from '~ui/pages/cluster/ClusterLogs';
|
||||
import ClusterScreenshots from '~ui/pages/cluster/ClusterScreenshots';
|
||||
import SettingsRoot from '~ui/pages/settings/SettingsRoot';
|
||||
|
||||
render(() => (
|
||||
<Router root={App}>
|
||||
|
|
@ -20,10 +17,10 @@ render(() => (
|
|||
<Route path="/browser" component={BrowserPage} />
|
||||
<Route path="/updates" component={UpdatesPage} />
|
||||
<Route path="/clusters" component={ClusterRoot}>
|
||||
<Route path="/" component={ClusterOverview} />
|
||||
<Route path="/logs" component={ClusterLogs} />
|
||||
<Route path="/mods" component={ClusterMods} />
|
||||
<Route path="/screenshots" component={ClusterScreenshots} />
|
||||
<ClusterRoot.Routes />
|
||||
</Route>
|
||||
<Route path="/settings" component={SettingsRoot}>
|
||||
<SettingsRoot.Routes />
|
||||
</Route>
|
||||
</Router>
|
||||
), document.getElementById('root') as HTMLElement);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import { A } from '@solidjs/router';
|
||||
import { A, useNavigate } from '@solidjs/router';
|
||||
import { createSignal } from 'solid-js';
|
||||
import { Bell01Icon, Cloud01Icon, Settings01Icon, TerminalBrowserIcon } from '@untitled-theme/icons-solid';
|
||||
import { open } from '@tauri-apps/plugin-shell';
|
||||
import { WEBSITE } from '@onelauncher/client';
|
||||
import useAccount from '../hooks/useAccount';
|
||||
import PolyfrostFull from './logos/PolyfrostFull';
|
||||
import AccountPopup from './overlay/AccountPopup';
|
||||
|
|
@ -9,7 +10,6 @@ import PlayerHead from './game/PlayerHead';
|
|||
import Button from './base/Button';
|
||||
import NotificationPopup from './overlay/notifications/NotificationPopup';
|
||||
import Popup from './overlay/Popup';
|
||||
import { WEBSITE } from '~constants';
|
||||
|
||||
interface NavbarLinkProps {
|
||||
path: string;
|
||||
|
|
@ -33,6 +33,7 @@ function NavbarLink(props: NavbarLinkProps) {
|
|||
function Navbar() {
|
||||
const [profileMenuOpen, setProfileMenuOpen] = createSignal(false);
|
||||
const [notificationMenuOpen, setNotificationMenuOpen] = createSignal(false);
|
||||
const navigate = useNavigate();
|
||||
|
||||
const account = useAccount();
|
||||
|
||||
|
|
@ -71,7 +72,7 @@ function Navbar() {
|
|||
</Button>
|
||||
|
||||
{/* Launcher Settings Button */}
|
||||
<Button buttonStyle="icon">
|
||||
<Button buttonStyle="icon" onClick={() => navigate('/settings')}>
|
||||
<Settings01Icon />
|
||||
</Button>
|
||||
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ function Sidebar(props: SidebarProps) {
|
|||
}
|
||||
|
||||
function isActive(link: string) {
|
||||
return location.pathname === `${props.base}${link}`;
|
||||
return location.pathname === `${props.base}${link}` || `${location.pathname}/` === `${props.base}${link}`;
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -1,9 +1,24 @@
|
|||
import { useSearchParams } from '@solidjs/router';
|
||||
import { Route, useSearchParams } from '@solidjs/router';
|
||||
import type { ParentProps } from 'solid-js';
|
||||
import { EyeIcon, File06Icon, Globe04Icon, Image03Icon, PackagePlusIcon, Settings04Icon, Tool02Icon } from '@untitled-theme/icons-solid';
|
||||
import Sidebar from '../../components/Sidebar';
|
||||
import AnimatedRoutes from '../../components/AnimatedRoutes';
|
||||
import ErrorBoundary from '../../components/ErrorBoundary';
|
||||
import ClusterOverview from './ClusterOverview';
|
||||
import ClusterLogs from './ClusterLogs';
|
||||
import ClusterMods from './ClusterMods';
|
||||
import ClusterScreenshots from './ClusterScreenshots';
|
||||
|
||||
function ClusterRoutes() {
|
||||
return (
|
||||
<>
|
||||
<Route path="/" component={ClusterOverview} />
|
||||
<Route path="/logs" component={ClusterLogs} />
|
||||
<Route path="/mods" component={ClusterMods} />
|
||||
<Route path="/screenshots" component={ClusterScreenshots} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function ClusterRoot(props: ParentProps) {
|
||||
const [searchParams] = useSearchParams();
|
||||
|
|
@ -42,4 +57,6 @@ function ClusterRoot(props: ParentProps) {
|
|||
);
|
||||
}
|
||||
|
||||
ClusterRoot.Routes = ClusterRoutes;
|
||||
|
||||
export default ClusterRoot;
|
||||
|
|
|
|||
59
desktop/src/ui/pages/settings/SettingsRoot.tsx
Normal file
59
desktop/src/ui/pages/settings/SettingsRoot.tsx
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
import type { ParentProps } from 'solid-js';
|
||||
import { Brush01Icon, CodeSnippet02Icon, Globe01Icon, Key01Icon, MessageTextSquare01Icon, RefreshCcw02Icon, Rocket02Icon, Sliders04Icon, Users01Icon } from '@untitled-theme/icons-solid';
|
||||
import { Route } from '@solidjs/router';
|
||||
import Sidebar from '../../components/Sidebar';
|
||||
import SettingsGeneral from './launcher/SettingsGeneral';
|
||||
import SettingsAppearance from './launcher/SettingsAppearance';
|
||||
import AnimatedRoutes from '~ui/components/AnimatedRoutes';
|
||||
import ErrorBoundary from '~ui/components/ErrorBoundary';
|
||||
|
||||
function SettingsRoutes() {
|
||||
return (
|
||||
<>
|
||||
<Route path="/" component={SettingsGeneral} />
|
||||
<Route path="/appearance" component={SettingsAppearance} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function SettingsRoot(props: ParentProps) {
|
||||
return (
|
||||
<div class="flex flex-row flex-1 h-full gap-x-7">
|
||||
<div class="mt-8">
|
||||
<Sidebar
|
||||
base="/settings"
|
||||
state={{}}
|
||||
links={{
|
||||
'Launcher Settings': [
|
||||
[<Rocket02Icon />, 'General', '/'],
|
||||
[<Brush01Icon />, 'Appearance', '/appearance'],
|
||||
[<Key01Icon />, 'APIs', '/apis'],
|
||||
[<Globe01Icon />, 'Language', '/language'],
|
||||
],
|
||||
'Game Settings': [
|
||||
[<Sliders04Icon />, 'Minecraft settings', '/minecraft'],
|
||||
[<Users01Icon />, 'Accounts', '/accounts'],
|
||||
],
|
||||
'About': [
|
||||
[<CodeSnippet02Icon />, 'Developer Options', '/developer'],
|
||||
[<RefreshCcw02Icon />, 'Changelog', '/changelog'],
|
||||
[<MessageTextSquare01Icon />, 'Feedback', '/feedback'],
|
||||
],
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col w-full h-full">
|
||||
<AnimatedRoutes>
|
||||
<ErrorBoundary>
|
||||
{props.children}
|
||||
</ErrorBoundary>
|
||||
</AnimatedRoutes>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
SettingsRoot.Routes = SettingsRoutes;
|
||||
|
||||
export default SettingsRoot;
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
function SettingsAppearance() {
|
||||
return (
|
||||
<div>
|
||||
<h1>Appearance</h1>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default SettingsAppearance;
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
function SettingsGeneral() {
|
||||
return (
|
||||
<div>
|
||||
<h1>General</h1>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default SettingsGeneral;
|
||||
21
pnpm-lock.yaml
generated
21
pnpm-lock.yaml
generated
|
|
@ -47,6 +47,9 @@ importers:
|
|||
'@rspc/client':
|
||||
specifier: ^0.2.0
|
||||
version: 0.2.0
|
||||
'@rspc/solid':
|
||||
specifier: ^0.2.0
|
||||
version: 0.2.0(@tanstack/solid-query@5.36.0(solid-js@1.8.17))(solid-js@1.8.17)
|
||||
'@rspc/tauri':
|
||||
specifier: ^0.2.0
|
||||
version: 0.2.0(@tauri-apps/api@2.0.0-beta.8)
|
||||
|
|
@ -83,6 +86,9 @@ importers:
|
|||
'@rspc/client':
|
||||
specifier: ^0.2.0
|
||||
version: 0.2.0
|
||||
'@rspc/solid':
|
||||
specifier: ^0.2.0
|
||||
version: 0.2.0(@tanstack/solid-query@5.36.0(solid-js@1.8.17))(solid-js@1.8.17)
|
||||
'@rspc/tauri':
|
||||
specifier: ^0.2.0
|
||||
version: 0.2.0(@tauri-apps/api@2.0.0-beta.8)
|
||||
|
|
@ -92,6 +98,9 @@ importers:
|
|||
'@solidjs/router':
|
||||
specifier: ^0.13.3
|
||||
version: 0.13.3(solid-js@1.8.17)
|
||||
'@tanstack/solid-query':
|
||||
specifier: ^5.36.0
|
||||
version: 5.36.0(solid-js@1.8.17)
|
||||
'@tauri-apps/api':
|
||||
specifier: ^2.0.0-beta
|
||||
version: 2.0.0-beta.8
|
||||
|
|
@ -786,6 +795,12 @@ packages:
|
|||
'@rspc/client@0.2.0':
|
||||
resolution: {integrity: sha512-IIOfAk4g+bzbfr3cmvm42EocsjtzMO9CRCc95ZMx9mFh5ixHzP4Na1lun+KipGzsFV1QsmV6uYSBg/4Kpnu9iA==}
|
||||
|
||||
'@rspc/solid@0.2.0':
|
||||
resolution: {integrity: sha512-6w7kSn3ZeSikUNI5niE+HszTA6mDMIOglhg92BdKOKw7YeuC0b11k9gAXNq1tyOVsn8KGKlkFgPr5iOP4G0k2A==}
|
||||
peerDependencies:
|
||||
'@tanstack/solid-query': ^5.0.0
|
||||
solid-js: ^1.0.0
|
||||
|
||||
'@rspc/tauri@0.2.0':
|
||||
resolution: {integrity: sha512-YULpKSCV/YZLtDRs/poiq3PVW54vMJjIbFZ8PgG+sdyZcujRudpza7xaLrfAHfbo61XdQYz/HP5j/9s5uqXQrA==}
|
||||
peerDependencies:
|
||||
|
|
@ -3989,6 +4004,12 @@ snapshots:
|
|||
|
||||
'@rspc/client@0.2.0': {}
|
||||
|
||||
'@rspc/solid@0.2.0(@tanstack/solid-query@5.36.0(solid-js@1.8.17))(solid-js@1.8.17)':
|
||||
dependencies:
|
||||
'@rspc/client': 0.2.0
|
||||
'@tanstack/solid-query': 5.36.0(solid-js@1.8.17)
|
||||
solid-js: 1.8.17
|
||||
|
||||
'@rspc/tauri@0.2.0(@tauri-apps/api@2.0.0-beta.8)':
|
||||
dependencies:
|
||||
'@rspc/client': 0.2.0
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue