Nomchy/discord.js
1
0
Fork 0
mirror of https://github.com/discordjs/discord.js.git synced 2026-03-15 19:13:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: use fallback with loading

Browse Source
This commit is contained in:
iCrawl
2022-08-23 01:43:10 +02:00
parent 360936140b
commit 2ecb862e76
7 changed files with 91 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
packages/website/src/components/model/Enum.tsx
View File

@@ -1,5 +1,6 @@
import { Stack } from '@mantine/core';
import { Skeleton, Stack } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks';
import { useRouter } from 'next/router';
import { VscSymbolEnumMember } from 'react-icons/vsc';
import { CodeListing, CodeListingSeparatorType } from '../CodeListing';
import { DocContainer } from '../DocContainer';
@@ -7,23 +8,26 @@ import { Section } from '../Section';
import type { ApiEnumJSON } from '~/DocModel/ApiNodeJSONEncoder';
export function Enum({ data }: { data: ApiEnumJSON }) {
const router = useRouter();
const matches = useMediaQuery('(max-width: 768px)', true, { getInitialValueInEffect: false });
return (
<DocContainer name={data.name} kind={data.kind} excerpt={data.excerpt} summary={data.summary}>
<Section title="Members" icon={<VscSymbolEnumMember size={20} />} padded dense={matches}>
<Stack>
{data.members.map((member) => (
<CodeListing
key={member.name}
name={member.name}
separator={CodeListingSeparatorType.Value}
typeTokens={member.initializerTokens}
summary={member.summary}
/>
))}
</Stack>
</Section>
<Skeleton visible={router.isFallback}>
<Section title="Members" icon={<VscSymbolEnumMember size={20} />} padded dense={matches}>
<Stack>
{data.members.map((member) => (
<CodeListing
key={member.name}
name={member.name}
separator={CodeListingSeparatorType.Value}
typeTokens={member.initializerTokens}
summary={member.summary}
/>
))}
</Stack>
</Section>
</Skeleton>
</DocContainer>
);
}