fix(content-docs): properly display collocated social card image (#6744)

* fix(content-docs): properly display collocated social card image

* oops

packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts

@@ -8,6 +8,10 @@
 declare module '@docusaurus/plugin-content-docs' {
   import type {RemarkAndRehypePluginOptions} from '@docusaurus/mdx-loader';
 
+  export interface Assets {
+    image?: string;
+  }
+
   export type NumberPrefixParser = (filename: string) => {
     filename: string;
     numberPrefix?: number;
@@ -159,6 +163,7 @@ declare module '@theme/DocItem' {
   import type {
     PropNavigationLink,
     PropVersionMetadata,
+    Assets,
   } from '@docusaurus/plugin-content-docs';
 
   export type DocumentRoute = {
@@ -204,6 +209,7 @@ declare module '@theme/DocItem' {
       readonly metadata: Metadata;
       readonly toc: readonly TOCItem[];
       readonly contentTitle: string | undefined;
+      readonly assets: Assets;
       (): JSX.Element;
     };
   }

packages/docusaurus-theme-classic/src/theme/DocItem/index.tsx

@@ -22,9 +22,8 @@ import DocBreadcrumbs from '@theme/DocBreadcrumbs';
 
 export default function DocItem(props: Props): JSX.Element {
   const {content: DocContent} = props;
-  const {metadata, frontMatter} = DocContent;
+  const {metadata, frontMatter, assets} = DocContent;
   const {
-    image,
     keywords,
     hide_title: hideTitle,
     hide_table_of_contents: hideTableOfContents,
@@ -32,6 +31,7 @@ export default function DocItem(props: Props): JSX.Element {
     toc_max_heading_level: tocMaxHeadingLevel,
   } = frontMatter;
   const {description, title} = metadata;
+  const image = assets.image ?? frontMatter.image;
 
   // We only add a title if:
   // - user asks to hide it with front matter

website/_dogfooding/_docs tests/tests/img-tests.mdx

@@ -1,3 +1,7 @@
+---
+image: ./img/oss_logo.png
+---
+
 # Image tests
 
 import Image from '@theme/IdealImage';