mirror of
https://github.com/discordjs/discord.js.git
synced 2026-03-12 09:33:32 +01:00
123 lines
3.5 KiB
TypeScript
123 lines
3.5 KiB
TypeScript
import { type ColorScheme, ColorSchemeProvider, MantineProvider } from '@mantine/core';
|
|
import { useLocalStorage } from '@mantine/hooks';
|
|
import { type SpotlightAction, SpotlightProvider } from '@mantine/spotlight';
|
|
import type { AppProps } from 'next/app';
|
|
import Head from 'next/head';
|
|
import { type NextRouter, useRouter } from 'next/router';
|
|
import { VscPackage } from 'react-icons/vsc';
|
|
import { RouterTransition } from '~/components/RouterTransition';
|
|
import '../styles/unocss.css';
|
|
import '../styles/main.css';
|
|
|
|
const actions: (router: NextRouter) => SpotlightAction[] = (router: NextRouter) => [
|
|
{
|
|
title: 'Home',
|
|
description: 'Go to landing page',
|
|
onTrigger: () => void router.push('/'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
title: 'Packages',
|
|
description: 'Go to the package selection',
|
|
onTrigger: () => void router.push('/docs/packages'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
id: 'packages-builders',
|
|
title: 'Builders',
|
|
description: 'Go to the @discordjs/builders documentation',
|
|
onTrigger: () => void router.push('/docs/packages/builders'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
id: 'packages-collection',
|
|
title: 'Collection',
|
|
description: 'Go to the @discordjs/collection documentation',
|
|
onTrigger: () => void router.push('/docs/packages/collection'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
id: 'packages-proxy',
|
|
title: 'Proxy',
|
|
description: 'Go to the @discordjs/proxy documentation',
|
|
onTrigger: () => void router.push('/docs/packages/proxy'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
id: 'packages-rest',
|
|
title: 'REST',
|
|
description: 'Go to the @discordjs/rest documentation',
|
|
onTrigger: () => void router.push('/docs/packages/voice'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
id: 'packages-voice',
|
|
title: 'Voice',
|
|
description: 'Go to the @discordjs/voice documentation',
|
|
onTrigger: () => void router.push('/docs/packages/ws'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
{
|
|
id: 'packages-ws',
|
|
title: 'WS',
|
|
description: 'Go to the @discordjs/ws documentation',
|
|
onTrigger: () => void router.push('/docs'),
|
|
icon: <VscPackage size={20} />,
|
|
},
|
|
];
|
|
|
|
export default function MyApp({ Component, pageProps }: AppProps) {
|
|
const router = useRouter();
|
|
const [colorScheme, setColorScheme] = useLocalStorage<ColorScheme>({
|
|
key: 'theme',
|
|
defaultValue: 'dark',
|
|
getInitialValueInEffect: true,
|
|
});
|
|
const toggleColorScheme = (value?: ColorScheme) =>
|
|
setColorScheme(value ?? (colorScheme === 'dark' ? 'light' : 'dark'));
|
|
|
|
return (
|
|
<>
|
|
<Head>
|
|
<title key="title">discord.js</title>
|
|
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />
|
|
</Head>
|
|
<ColorSchemeProvider colorScheme={colorScheme} toggleColorScheme={toggleColorScheme}>
|
|
<MantineProvider
|
|
theme={{
|
|
fontFamily: 'Inter var',
|
|
fontFamilyMonospace: 'JetBrains Mono',
|
|
headings: {
|
|
fontFamily: 'Inter var',
|
|
},
|
|
colorScheme,
|
|
colors: {
|
|
blurple: [
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
'#5865f2',
|
|
],
|
|
},
|
|
primaryColor: 'blurple',
|
|
}}
|
|
withCSSVariables
|
|
withNormalizeCSS
|
|
withGlobalStyles
|
|
>
|
|
<SpotlightProvider shortcut={['mod + P', 'mod + K', '/']} actions={actions(router)}>
|
|
<RouterTransition />
|
|
<Component {...pageProps} />
|
|
</SpotlightProvider>
|
|
</MantineProvider>
|
|
</ColorSchemeProvider>
|
|
</>
|
|
);
|
|
}
|