From 3b33469328e1fec56779964afb13f37d51e0d07e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Moritz=20St=C3=BCckler?= <moritz@bitbetter.de>
Date: Sat, 11 Feb 2023 14:57:22 +0000
Subject: [PATCH 1/6] refactor(docusaurus-theme-common): allow string prop for
 details summary

---
 .../src/components/Details/index.tsx            | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/packages/docusaurus-theme-common/src/components/Details/index.tsx b/packages/docusaurus-theme-common/src/components/Details/index.tsx
index 19952166bc59..f6cb8aee8d8a 100644
--- a/packages/docusaurus-theme-common/src/components/Details/index.tsx
+++ b/packages/docusaurus-theme-common/src/components/Details/index.tsx
@@ -31,8 +31,8 @@ function hasParent(node: HTMLElement | null, parent: HTMLElement): boolean {
 }
 
 export type DetailsProps = {
-  /** Summary is provided as props, including the wrapping `<summary>` tag */
-  summary?: ReactElement;
+  /** Summary is provided as props, optionally including the wrapping `<summary>` tag */
+  summary?: ReactElement | string | boolean;
 } & ComponentProps<'details'>;
 
 /**
@@ -54,6 +54,16 @@ export function Details({
   // only after animation completes, otherwise close animations won't work
   const [open, setOpen] = useState(props.open);
 
+  let SummaryElement = null;
+
+  if (React.isValidElement(summary)) {
+    SummaryElement = summary;
+  } else if (typeof summary === 'boolean' && summary === true) {
+    SummaryElement = <summary>Details</summary>;
+  } else if (typeof summary === 'string') {
+    SummaryElement = <summary>{summary}</summary>;
+  }
+
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
     <details
@@ -91,8 +101,7 @@ export function Details({
           // setOpen(false);
         }
       }}>
-      {/* eslint-disable-next-line @docusaurus/no-untranslated-text */}
-      {summary ?? <summary>Details</summary>}
+      {SummaryElement}
 
       <Collapsible
         lazy={false} // Content might matter for SEO in this case

From d288c08ca75d200fa3de5d4f8534a1b99db037d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Moritz=20St=C3=BCckler?= <moritz@bitbetter.de>
Date: Sat, 11 Feb 2023 15:19:18 +0000
Subject: [PATCH 2/6] fix: remove boolean

---
 .../src/components/Details/index.tsx                 |  6 +++---
 website/_dogfooding/_docs tests/details.mdx          | 12 ++++++++++++
 2 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 website/_dogfooding/_docs tests/details.mdx

diff --git a/packages/docusaurus-theme-common/src/components/Details/index.tsx b/packages/docusaurus-theme-common/src/components/Details/index.tsx
index f6cb8aee8d8a..01f65e7ab1d5 100644
--- a/packages/docusaurus-theme-common/src/components/Details/index.tsx
+++ b/packages/docusaurus-theme-common/src/components/Details/index.tsx
@@ -32,7 +32,7 @@ function hasParent(node: HTMLElement | null, parent: HTMLElement): boolean {
 
 export type DetailsProps = {
   /** Summary is provided as props, optionally including the wrapping `<summary>` tag */
-  summary?: ReactElement | string | boolean;
+  summary?: ReactElement | string;
 } & ComponentProps<'details'>;
 
 /**
@@ -58,10 +58,10 @@ export function Details({
 
   if (React.isValidElement(summary)) {
     SummaryElement = summary;
-  } else if (typeof summary === 'boolean' && summary === true) {
-    SummaryElement = <summary>Details</summary>;
   } else if (typeof summary === 'string') {
     SummaryElement = <summary>{summary}</summary>;
+  } else {
+    SummaryElement = <summary>Details</summary>;
   }
 
   return (
diff --git a/website/_dogfooding/_docs tests/details.mdx b/website/_dogfooding/_docs tests/details.mdx
new file mode 100644
index 000000000000..0c0ba2d5edbe
--- /dev/null
+++ b/website/_dogfooding/_docs tests/details.mdx	
@@ -0,0 +1,12 @@
+---
+slug: details.html
+---
+
+import Details from '@theme/Details';
+
+# Testing Details component
+
+<Details summary={'My Headline'}>Some Text</Details>
+<Details summary>Some Text</Details>
+<Details summary={true}>Some Text</Details>
+<Details>Some Text</Details>

From ef6c08c438d80a834caf3ff6831d3dc663c4b6f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Moritz=20St=C3=BCckler?= <moritz@bitbetter.de>
Date: Sat, 11 Feb 2023 16:12:34 +0000
Subject: [PATCH 3/6] fix: examples

---
 website/_dogfooding/_docs tests/details.mdx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/website/_dogfooding/_docs tests/details.mdx b/website/_dogfooding/_docs tests/details.mdx
index 0c0ba2d5edbe..090a853a7515 100644
--- a/website/_dogfooding/_docs tests/details.mdx	
+++ b/website/_dogfooding/_docs tests/details.mdx	
@@ -7,6 +7,4 @@ import Details from '@theme/Details';
 # Testing Details component
 
 <Details summary={'My Headline'}>Some Text</Details>
-<Details summary>Some Text</Details>
-<Details summary={true}>Some Text</Details>
 <Details>Some Text</Details>

From 4082cc91d4628f7d98fdf217bb4efb1c3821f9ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Moritz=20St=C3=BCckler?= <moritz@bitbetter.de>
Date: Sat, 11 Feb 2023 16:15:41 +0000
Subject: [PATCH 4/6] fix: review comments

---
 .../src/components/Details/index.tsx            | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/packages/docusaurus-theme-common/src/components/Details/index.tsx b/packages/docusaurus-theme-common/src/components/Details/index.tsx
index 01f65e7ab1d5..e949309c7576 100644
--- a/packages/docusaurus-theme-common/src/components/Details/index.tsx
+++ b/packages/docusaurus-theme-common/src/components/Details/index.tsx
@@ -54,15 +54,12 @@ export function Details({
   // only after animation completes, otherwise close animations won't work
   const [open, setOpen] = useState(props.open);
 
-  let SummaryElement = null;
-
-  if (React.isValidElement(summary)) {
-    SummaryElement = summary;
-  } else if (typeof summary === 'string') {
-    SummaryElement = <summary>{summary}</summary>;
-  } else {
-    SummaryElement = <summary>Details</summary>;
-  }
+   
+  const summaryElement = React.isValidElement(summary) ? (
+    summary
+  ) : (
+    <summary>{summary ?? 'Details'}</summary>
+  );
 
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
@@ -101,7 +98,7 @@ export function Details({
           // setOpen(false);
         }
       }}>
-      {SummaryElement}
+      {summaryElement}
 
       <Collapsible
         lazy={false} // Content might matter for SEO in this case

From ea4b1a5491ec5df8bfd2ab49cd0d93b257c67dc9 Mon Sep 17 00:00:00 2001
From: Joshua Chen <sidachen2003@gmail.com>
Date: Wed, 15 Feb 2023 11:36:18 -0500
Subject: [PATCH 5/6] Format

---
 .../src/components/Details/index.tsx                        | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/docusaurus-theme-common/src/components/Details/index.tsx b/packages/docusaurus-theme-common/src/components/Details/index.tsx
index e949309c7576..0876cf9b94d3 100644
--- a/packages/docusaurus-theme-common/src/components/Details/index.tsx
+++ b/packages/docusaurus-theme-common/src/components/Details/index.tsx
@@ -31,7 +31,10 @@ function hasParent(node: HTMLElement | null, parent: HTMLElement): boolean {
 }
 
 export type DetailsProps = {
-  /** Summary is provided as props, optionally including the wrapping `<summary>` tag */
+  /**
+   * Summary is provided as props, optionally including the wrapping
+   * `<summary>` tag
+   */
   summary?: ReactElement | string;
 } & ComponentProps<'details'>;
 
@@ -54,7 +57,6 @@ export function Details({
   // only after animation completes, otherwise close animations won't work
   const [open, setOpen] = useState(props.open);
 
-   
   const summaryElement = React.isValidElement(summary) ? (
     summary
   ) : (

From 1cd5fc7dd8574acf726c0cb8c1764d51dea4ac42 Mon Sep 17 00:00:00 2001
From: Joshua Chen <sidachen2003@gmail.com>
Date: Wed, 15 Feb 2023 11:38:44 -0500
Subject: [PATCH 6/6] Merge pages

---
 website/_dogfooding/_docs tests/details.mdx            | 10 ----------
 website/_dogfooding/_pages tests/markdownPageTests.mdx |  5 +++++
 2 files changed, 5 insertions(+), 10 deletions(-)
 delete mode 100644 website/_dogfooding/_docs tests/details.mdx

diff --git a/website/_dogfooding/_docs tests/details.mdx b/website/_dogfooding/_docs tests/details.mdx
deleted file mode 100644
index 090a853a7515..000000000000
--- a/website/_dogfooding/_docs tests/details.mdx	
+++ /dev/null
@@ -1,10 +0,0 @@
----
-slug: details.html
----
-
-import Details from '@theme/Details';
-
-# Testing Details component
-
-<Details summary={'My Headline'}>Some Text</Details>
-<Details>Some Text</Details>
diff --git a/website/_dogfooding/_pages tests/markdownPageTests.mdx b/website/_dogfooding/_pages tests/markdownPageTests.mdx
index 35f7c2a4ff59..a7ce3561d2d0 100644
--- a/website/_dogfooding/_pages tests/markdownPageTests.mdx	
+++ b/website/_dogfooding/_pages tests/markdownPageTests.mdx	
@@ -204,6 +204,11 @@ Details without a summary
 
 </details>
 
+import Details from '@theme/Details';
+
+<Details summary={'My Headline'}>Some Text</Details>
+<Details>Some Text</Details>
+
 This is a fragment:
 
 <>Hello</>