Skip to content

Commit

Permalink
fix(SlashCommandBuilder): missing methods in subcommand builder (disc…
Browse files Browse the repository at this point in the history 
…ordjs#8583)
  • Loading branch information
@almeidx @suneettipirneni
almeidx authored and suneettipirneni committed Sep 17, 2022
1 parent 053da5b commit fac2e55
Show file tree
Hide file tree
Showing 9 changed files with 120 additions and 25 deletions.
7 changes: 6 additions & 1 deletion packages/api-extractor-utils/src/ApiNodeJSONEncoder.ts
View file
Expand Up @@ -82,6 +82,7 @@ export interface ApiMethodSignatureJSON
ApiTypeParameterListJSON,
ApiParameterListJSON,
ApiInheritableJSON {
mergedSiblings: ApiFunctionJSON[];
optional: boolean;
overloadIndex: number;
returnTypeTokens: TokenDocumentation[];
Expand Down Expand Up @@ -133,6 +134,7 @@ export interface ApiVariableJSON extends ApiItemJSON {
}

export interface ApiFunctionJSON extends ApiItemJSON, ApiTypeParameterListJSON, ApiParameterListJSON {
mergedSiblings: ApiFunctionJSON[];
overloadIndex: number;
returnTypeTokens: TokenDocumentation[];
}
Expand Down Expand Up @@ -255,12 +257,15 @@ export class ApiNodeJSONEncoder {
};
}

public static encodeFunction(model: ApiModel, item: FunctionLike, version: string): ApiFunctionJSON {
public static encodeFunction(model: ApiModel, item: FunctionLike, version: string, nested = false): ApiFunctionJSON {
return {
...this.encodeItem(model, item, version),
...this.encodeParameterList(model, item, version),
...this.encodeTypeParameterList(model, item, version),
returnTypeTokens: item.returnTypeExcerpt.spannedTokens.map((token) => genToken(model, token, version)),
mergedSiblings: nested
? []
: item.getMergedSiblings().map((item) => this.encodeFunction(model, item as ApiFunction, version, true)),
overloadIndex: item.overloadIndex,
};
}
Expand Down
12 changes: 12 additions & 0 deletions packages/builders/__tests__/interactions/SlashCommands/SlashCommands.test.ts
View file
Expand Up @@ -371,6 +371,18 @@ describe('Slash Commands', () => {
).not.toThrowError();
});

test('GIVEN builder with subcommand THEN has regular slash command fields', () => {
expect(() =>
getBuilder()
.setName('name')
.setDescription('description')
.addSubcommand((option) => option.setName('ye').setDescription('ye'))
.addSubcommand((option) => option.setName('no').setDescription('no'))
.setDMPermission(false)
.setDefaultMemberPermissions(1n),
).not.toThrowError();
});

test('GIVEN builder with already built subcommand group THEN does not throw error', () => {
expect(() => getNamedBuilder().addSubcommandGroup(getSubcommandGroup())).not.toThrowError();
});
Expand Down
3 changes: 1 addition & 2 deletions packages/builders/src/interactions/slashCommands/SlashCommandBuilder.ts
View file
Expand Up @@ -190,8 +190,7 @@ export class SlashCommandBuilder {
export interface SlashCommandBuilder extends SharedNameAndDescription, SharedSlashCommandOptions {}

export interface SlashCommandSubcommandsOnlyBuilder
extends SharedNameAndDescription,
Pick<SlashCommandBuilder, 'addSubcommand' | 'addSubcommandGroup' | 'toJSON'> {}
extends Omit<SlashCommandBuilder, Exclude<keyof SharedSlashCommandOptions, 'options'>> {}

export interface SlashCommandOptionsOnlyBuilder
extends SharedNameAndDescription,
Expand Down
5 changes: 5 additions & 0 deletions packages/website/src/components/DocContainer.tsx
View file
Expand Up @@ -5,6 +5,7 @@ import type {
ApiClassJSON,
ApiInterfaceJSON,
} from '@discordjs/api-extractor-utils';
import type { ReactNode } from 'react';
import { Fragment, type PropsWithChildren } from 'react';
import { Scrollbars } from 'react-custom-scrollbars-2';
import {
Expand Down Expand Up @@ -32,6 +33,7 @@ type DocContainerProps = PropsWithChildren<{
methods?: ApiClassJSON['methods'] | ApiInterfaceJSON['methods'] | null;
name: string;
properties?: ApiClassJSON['properties'] | ApiInterfaceJSON['properties'] | null;
subHeading?: ReactNode;
summary?: ApiItemJSON['summary'];
typeParams?: TypeParameterData[];
}>;
Expand Down Expand Up @@ -60,6 +62,7 @@ export function DocContainer({
implementsTokens,
methods,
properties,
subHeading,
}: DocContainerProps) {
const matches = useMedia('(max-width: 768px)', true);

Expand All @@ -71,6 +74,8 @@ export function DocContainer({
{name}
</h2>

{subHeading}

<Section title="Summary" icon={<VscListSelection size={20} />} padded dense={matches}>
{summary ? <TSDoc node={summary} /> : <span>No summary provided.</span>}
<div className="border-light-900 -mx-8 mt-6 border-t-2" />
Expand Down
41 changes: 35 additions & 6 deletions packages/website/src/components/MethodItem.tsx
View file
@@ -1,13 +1,20 @@
import type { ApiMethodJSON, ApiMethodSignatureJSON } from '@discordjs/api-extractor-utils';
import { useCallback, useMemo } from 'react';
import { Menu, MenuButton, MenuItem, useMenuState } from 'ariakit';
import { useCallback, useMemo, useState } from 'react';
import { FiLink } from 'react-icons/fi';
import { VscChevronDown } from 'react-icons/vsc';
import { HyperlinkedText } from './HyperlinkedText';
import { InheritanceText } from './InheritanceText';
import { ParameterTable } from './ParameterTable';
import { TSDoc } from './tsdoc/TSDoc';

export function MethodItem({ data }: { data: ApiMethodJSON | ApiMethodSignatureJSON }) {
const method = data as ApiMethodJSON;

const [overloadIndex, setOverloadIndex] = useState(1);
const overloadedData = method.mergedSiblings[overloadIndex - 1]!;
const menuState = useMenuState({ gutter: 8 });

const key = useMemo(
() => `${data.name}${data.overloadIndex && data.overloadIndex > 1 ? `:${data.overloadIndex}` : ''}`,
[data.name, data.overloadIndex],
Expand Down Expand Up @@ -62,13 +69,35 @@ export function MethodItem({ data }: { data: ApiMethodJSON | ApiMethodSignatureJ
</div>
</div>
</div>
{data.mergedSiblings.length > 1 ? (
<div className="flex flex-shrink">
<MenuButton
state={menuState}
className="dark:bg-dark-600 border-light-800 dark:border-dark-100 z-20 flex flex-col rounded border bg-white p-1"
>
<div className="space-x-sm flex items-center">
{`Overload ${overloadIndex} of ${data.mergedSiblings.length}`}
<VscChevronDown />
</div>
</MenuButton>
<Menu state={menuState} className="dark:border-dark-100 rounded border">
{data.mergedSiblings.map((_, idx) => (
<MenuItem
className="hover:bg-light-700 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 rounded bg-white p-3 text-sm"
key={idx}
onClick={() => setOverloadIndex(idx + 1)}
>{`Overload ${idx + 1}`}</MenuItem>
))}
</Menu>
</div>
) : null}
{data.summary || data.parameters.length ? (
<div className="mb-4 flex flex-col gap-4">
{data.deprecated ? <TSDoc node={data.deprecated} /> : null}
{data.summary ? <TSDoc node={data.summary} /> : null}
{data.remarks ? <TSDoc node={data.remarks} /> : null}
{data.comment ? <TSDoc node={data.comment} /> : null}
{data.parameters.length ? <ParameterTable data={data.parameters} /> : null}
{overloadedData.deprecated ? <TSDoc node={overloadedData.deprecated} /> : null}
{overloadedData.summary ?? data.summary ? <TSDoc node={overloadedData.summary ?? data.summary!} /> : null}
{overloadedData.remarks ? <TSDoc node={overloadedData.remarks} /> : null}
{overloadedData.comment ? <TSDoc node={overloadedData.comment} /> : null}
{overloadedData.parameters.length ? <ParameterTable data={overloadedData.parameters} /> : null}
{data.inheritanceData ? <InheritanceText data={data.inheritanceData} /> : null}
</div>
) : null}
Expand Down
22 changes: 14 additions & 8 deletions packages/website/src/components/MethodList.tsx
View file
Expand Up @@ -5,14 +5,20 @@ import { MethodItem } from './MethodItem';
export function MethodList({ data }: { data: (ApiMethodJSON | ApiMethodSignatureJSON)[] }) {
const methodItems = useMemo(
() =>
data.map((method) => (
<Fragment
key={`${method.name}${method.overloadIndex && method.overloadIndex > 1 ? `:${method.overloadIndex}` : ''}`}
>
<MethodItem data={method} />
<div className="border-light-900 -mx-8 border-t-2" />
</Fragment>
)),
data.map((method) => {
if (method.overloadIndex > 1) {
return null;
}

return (
<Fragment
key={`${method.name}${method.overloadIndex && method.overloadIndex > 1 ? `:${method.overloadIndex}` : ''}`}
>
<MethodItem data={method} />
<div className="border-light-900 -mx-8 border-t-2" />
</Fragment>
);
}),
[data],
);

Expand Down
4 changes: 4 additions & 0 deletions packages/website/src/components/TableOfContentItems.tsx
View file
Expand Up @@ -27,6 +27,10 @@ export function TableOfContentItems({
const methodItems = useMemo(
() =>
methods.map((member) => {
if (member.overloadIndex && member.overloadIndex > 1) {
return null;
}

const key = `${member.name}${
member.overloadIndex && member.overloadIndex > 1 ? `:${member.overloadIndex}` : ''
}`;
Expand Down
45 changes: 39 additions & 6 deletions packages/website/src/components/model/Function.tsx
View file
@@ -1,17 +1,50 @@
import type { ApiFunctionJSON } from '@discordjs/api-extractor-utils';
import { Menu, MenuButton, MenuItem, useMenuState } from 'ariakit';
import { useState } from 'react';
import { VscChevronDown } from 'react-icons/vsc';
import { DocContainer } from '../DocContainer';
import { ParametersSection } from '../Sections';

export function Function({ data }: { data: ApiFunctionJSON }) {
const [overloadIndex, setOverloadIndex] = useState(1);
const overloadedData = data.mergedSiblings[overloadIndex - 1]!;
const menuState = useMenuState({ gutter: 8 });

return (
<DocContainer
name={`${data.name}${data.overloadIndex && data.overloadIndex > 1 ? ` (${data.overloadIndex})` : ''}`}
kind={data.kind}
excerpt={data.excerpt}
summary={data.summary}
typeParams={data.typeParameters}
name={`${overloadedData.name}${
overloadedData.overloadIndex && overloadedData.overloadIndex > 1 ? ` (${overloadedData.overloadIndex})` : ''
}`}
kind={overloadedData.kind}
excerpt={overloadedData.excerpt}
summary={overloadedData.summary}
typeParams={overloadedData.typeParameters}
subHeading={
data.mergedSiblings.length > 1 ? (
<div className="flex flex-shrink">
<MenuButton
state={menuState}
className="dark:bg-dark-600 border-light-800 dark:border-dark-100 z-20 flex flex-col rounded border bg-white p-1"
>
<div className="space-x-sm flex items-center">
<p>{`Overload ${overloadIndex} of ${data.mergedSiblings.length}`}</p>
<VscChevronDown />
</div>
</MenuButton>
<Menu state={menuState} className="dark:border-dark-100 rounded border">
{data.mergedSiblings.map((_, idx) => (
<MenuItem
className="hover:bg-light-700 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 rounded bg-white p-3 text-sm"
key={idx}
onClick={() => setOverloadIndex(idx + 1)}
>{`Overload ${idx + 1}`}</MenuItem>
))}
</Menu>
</div>
) : null
}
>
<ParametersSection data={data.parameters} />
<ParametersSection data={overloadedData.parameters} />
</DocContainer>
);
}
6 changes: 4 additions & 2 deletions packages/website/src/pages/docs/[...slug].tsx
View file
Expand Up @@ -193,7 +193,9 @@ export const getStaticProps: GetStaticProps = async ({ params }) => {
packageName,
branchName,
data: {
members: pkg ? getMembers(pkg, branchName) : [],
members: pkg
? getMembers(pkg, branchName).filter((item) => item.overloadIndex === null || item.overloadIndex <= 1)
: [],
member:
memberName && containerKey ? findMemberByKey(model, packageName, containerKey, branchName) ?? null : null,
source: mdxSource,
Expand All @@ -219,7 +221,7 @@ const member = (props?: ApiItemJSON | undefined) => {
case 'Class':
return <Class data={props as ApiClassJSON} />;
case 'Function':
return <Function data={props as ApiFunctionJSON} />;
return <Function key={props.containerKey} data={props as ApiFunctionJSON} />;
case 'Interface':
return <Interface data={props as ApiInterfaceJSON} />;
case 'TypeAlias':
Expand Down

0 comments on commit fac2e55

Please sign in to comment.