fix(website): cross package deprecated links (#9981)

* refactor: minify api.json by shortening keys

* fix: links to other packages

* refactor: get doclink from canonicalReference, not model

* fix: types

* fix: again

* fix: @link tags with alt texts

* fix(website): cross-package links in @deprecated

Author: Qjuh

apps/website/src/components/documentation/tsdoc/TSDoc.tsx

@@ -8,7 +8,7 @@ import { DocumentationLink } from '~/components/DocumentationLink';
 import { BuiltinDocumentationLinks } from '~/util/builtinDocumentationLinks';
 import { ItemLink } from '../../ItemLink';
 import { SyntaxHighlighter } from '../../SyntaxHighlighter';
-import { resolveItemURI } from '../util';
+import { resolveCanonicalReference, resolveItemURI } from '../util';
 import { DefaultValueBlock, DeprecatedBlock, ExampleBlock, RemarksBlock, ReturnsBlock, SeeBlock } from './BlockComment';
 
 export function TSDoc({ item, tsdoc }: { readonly item: ApiItem; readonly tsdoc: DocNode }): JSX.Element {
@@ -52,17 +52,18 @@ export function TSDoc({ item, tsdoc }: { readonly item: ApiItem; readonly tsdoc:
 
 						const declarationReference = item.getAssociatedModel()?.resolveDeclarationReference(codeDestination, item);
 						const foundItem = declarationReference?.resolvedApiItem;
+						const resolved = resolveCanonicalReference(codeDestination);
 
-						if (!foundItem) return null;
+						if (!foundItem && !resolved) return null;
 
 						return (
 							<ItemLink
 								className="rounded font-mono text-blurple outline-none focus:ring focus:ring-width-2 focus:ring-blurple"
-								itemURI={resolveItemURI(foundItem)}
+								itemURI={resolveItemURI(foundItem ?? resolved!.item)}
 								key={idx}
-								packageName={item.getAssociatedPackage()?.displayName.replace('@discordjs/', '')}
+								packageName={resolved?.package ?? item.getAssociatedPackage()?.displayName.replace('@discordjs/', '')}
 							>
-								{linkText ?? foundItem.displayName}
+								{linkText ?? foundItem?.displayName ?? resolved!.item.displayName}
 							</ItemLink>
 						);
 					}

apps/website/src/components/documentation/util.ts

@@ -10,6 +10,8 @@ import type {
 	ApiParameterListMixin,
 	ApiEvent,
 } from '@discordjs/api-extractor-model';
+import type { DocDeclarationReference } from '@microsoft/tsdoc';
+import { SelectorKind } from '@microsoft/tsdoc';
 import type { DeclarationReference } from '@microsoft/tsdoc/lib-commonjs/beta/DeclarationReference';
 import { METHOD_SEPARATOR, OVERLOAD_SEPARATOR } from '~/util/constants';
 import { resolveMembers } from '~/util/members';
@@ -26,7 +28,7 @@ export type ApiItemLike = {
 
 interface ResolvedCanonicalReference {
 	item: ApiItemLike;
-	package: string;
+	package: string | undefined;
 }
 
 export function hasProperties(item: ApiItemContainerMixin) {
@@ -51,8 +53,11 @@ export function resolveItemURI(item: ApiItemLike): string {
 		: `${item.parent.displayName}${OVERLOAD_SEPARATOR}${item.parent.kind}${METHOD_SEPARATOR}${item.displayName}`;
 }
 
-export function resolveCanonicalReference(canonicalReference: DeclarationReference): ResolvedCanonicalReference | null {
+export function resolveCanonicalReference(
+	canonicalReference: DeclarationReference | DocDeclarationReference,
+): ResolvedCanonicalReference | null {
 	if (
+		'source' in canonicalReference &&
 		canonicalReference.source &&
 		'packageName' in canonicalReference.source &&
 		canonicalReference.symbol?.componentPath &&
@@ -68,6 +73,23 @@ export function resolveCanonicalReference(canonicalReference: DeclarationReferen
 				}|${canonicalReference.symbol.componentPath.component.toString()}`,
 			},
 		};
+	else if (
+		'memberReferences' in canonicalReference &&
+		canonicalReference.memberReferences.length &&
+		canonicalReference.memberReferences[0]?.memberIdentifier &&
+		canonicalReference.memberReferences[0]?.selector?.selectorKind === SelectorKind.System
+	) {
+		const member = canonicalReference.memberReferences[0]!;
+		return {
+			package: canonicalReference.packageName?.replace('@discordjs/', ''),
+			item: {
+				kind: member.selector!.selector as ApiItemKind,
+				displayName: member.memberIdentifier!.identifier,
+				containerKey: `|${member.selector!.selector}|${member.memberIdentifier!.identifier}`,
+			},
+		};
+	}
+
 	return null;
 }
 

packages/discord.js/typings/index.d.ts

@@ -5061,10 +5061,10 @@ export interface ClientUserEditOptions {
 }
 
 export interface CloseEvent {
-  /** @deprecated Not used anymore since using {@link @discordjs/ws#WebSocketManager} internally */
+  /** @deprecated Not used anymore since using {@link @discordjs/ws#(WebSocketManager:class)} internally */
   wasClean: boolean;
   code: number;
-  /** @deprecated Not used anymore since using {@link @discordjs/ws#WebSocketManager} internally */
+  /** @deprecated Not used anymore since using {@link @discordjs/ws#(WebSocketManager:class)} internally */
   reason: string;
 }