refactor(core): convert theme-fallback to TS (#6511)

* refactor(core): convert theme-fallback to TS

* add missing type

* fix snapshot

packages/docusaurus-types/src/index.d.ts

@@ -27,7 +27,7 @@ export interface DocusaurusConfig {
   baseUrl: string;
   baseUrlIssueBanner: boolean;
   favicon?: string;
-  tagline?: string;
+  tagline: string;
   title: string;
   url: string;
   // trailingSlash undefined = legacy retrocompatible behavior => /file => /file/index.html

packages/docusaurus/src/client/theme-fallback/Error/index.tsx

@@ -8,8 +8,9 @@
 import React from 'react';
 import Layout from '@theme/Layout';
 import ErrorBoundary from '@docusaurus/ErrorBoundary';
+import type {Props} from '@theme/Error';
 
-function ErrorDisplay({error, tryAgain}) {
+function ErrorDisplay({error, tryAgain}: Props): JSX.Element {
   return (
     <div
       style={{
@@ -30,7 +31,7 @@ function ErrorDisplay({error, tryAgain}) {
   );
 }
 
-function Error({error, tryAgain}) {
+function Error({error, tryAgain}: Props): JSX.Element {
   // We wrap the error in its own error boundary because the layout can actually throw too...
   // Only the ErrorDisplay component is simple enough to be considered safe to never throw
   return (

packages/docusaurus/src/client/theme-fallback/Layout/index.tsx

@@ -9,12 +9,12 @@ import React from 'react';
 import Head from '@docusaurus/Head';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 import useBaseUrl from '@docusaurus/useBaseUrl';
+import type {Props} from '@theme/Layout';
 
-function Layout(props) {
+function Layout({children, title, description}: Props): JSX.Element {
   const context = useDocusaurusContext();
-  const {siteConfig = {}} = context;
+  const {siteConfig} = context;
-  const {favicon, tagline = '', title: defaultTitle} = siteConfig;
+  const {favicon, tagline, title: defaultTitle} = siteConfig;
-  const {children, title, description} = props;
   const faviconUrl = useBaseUrl(favicon);
   return (
     <>

packages/docusaurus/src/client/theme-fallback/Loading/index.tsx

@@ -6,13 +6,18 @@
  */
 
 import React from 'react';
+import type {LoadingComponentProps} from 'react-loadable';
 
-export default function Loading({error, retry, pastDelay}) {
+export default function Loading({
+  error,
+  retry,
+  pastDelay,
+}: LoadingComponentProps): JSX.Element | null {
   if (error) {
     return (
       <div
         style={{
-          align: 'center',
+          textAlign: 'center',
           color: '#fff',
           backgroundColor: '#fa383e',
           borderColor: '#fa383e',

packages/docusaurus/src/client/theme-fallback/NotFound/index.tsx

@@ -8,7 +8,7 @@
 import React from 'react';
 import Layout from '@theme/Layout';
 
-function NotFound() {
+function NotFound(): JSX.Element {
   return (
     <Layout title="Page Not Found">
       <div

packages/docusaurus/src/client/theme-fallback/Root/index.tsx

@@ -5,6 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import type {ReactNode} from 'react';
+
 // Wrapper at the very top of the app, that is applied constantly
 // and does not depend on current route (unlike the layout)
 //
@@ -12,7 +14,7 @@
 // and these providers won't reset state when we navigate
 //
 // See https://github.com/facebook/docusaurus/issues/3919
-function Root({children}) {
+function Root({children}: {children: ReactNode}): ReactNode {
   return children;
 }
 

packages/docusaurus/src/server/configValidation.ts

@@ -37,6 +37,7 @@ export const DEFAULT_CONFIG: Pick<
   | 'themeConfig'
   | 'titleDelimiter'
   | 'noIndex'
+  | 'tagline'
   | 'baseUrlIssueBanner'
   | 'staticDirectories'
 > = {
@@ -51,6 +52,7 @@ export const DEFAULT_CONFIG: Pick<
   themeConfig: {},
   titleDelimiter: '|',
   noIndex: false,
+  tagline: '',
   baseUrlIssueBanner: true,
   staticDirectories: [STATIC_DIR_NAME],
 };
@@ -192,7 +194,7 @@ export const ConfigSchema = Joi.object({
     }).unknown(),
   ),
   clientModules: Joi.array().items(Joi.string()),
-  tagline: Joi.string().allow(''),
+  tagline: Joi.string().allow('').default(DEFAULT_CONFIG.tagline),
   titleDelimiter: Joi.string().default('|'),
   noIndex: Joi.bool().default(false),
   webpack: Joi.object({

packages/docusaurus/src/webpack/__tests__/__snapshots__/base.test.ts.snap

@@ -24,23 +24,23 @@ Object {
   "@generated": "../../../../../../..",
   "@site": "",
   "@theme-init/PluginThemeComponentEnhanced": "pluginThemeFolder/PluginThemeComponentEnhanced.js",
-  "@theme-original/Error": "../../../../client/theme-fallback/Error/index.js",
+  "@theme-original/Error": "../../../../client/theme-fallback/Error/index.tsx",
-  "@theme-original/Layout": "../../../../client/theme-fallback/Layout/index.js",
+  "@theme-original/Layout": "../../../../client/theme-fallback/Layout/index.tsx",
-  "@theme-original/Loading": "../../../../client/theme-fallback/Loading/index.js",
+  "@theme-original/Loading": "../../../../client/theme-fallback/Loading/index.tsx",
-  "@theme-original/NotFound": "../../../../client/theme-fallback/NotFound/index.js",
+  "@theme-original/NotFound": "../../../../client/theme-fallback/NotFound/index.tsx",
   "@theme-original/PluginThemeComponent1": "pluginThemeFolder/PluginThemeComponent1.js",
   "@theme-original/PluginThemeComponentEnhanced": "secondPluginThemeFolder/PluginThemeComponentEnhanced.js",
   "@theme-original/PluginThemeComponentOverriddenByUser": "pluginThemeFolder/PluginThemeComponentOverriddenByUser.js",
-  "@theme-original/Root": "../../../../client/theme-fallback/Root/index.js",
+  "@theme-original/Root": "../../../../client/theme-fallback/Root/index.tsx",
   "@theme-original/subfolder/PluginThemeComponent2": "pluginThemeFolder/subfolder/PluginThemeComponent2.js",
-  "@theme/Error": "../../../../client/theme-fallback/Error/index.js",
+  "@theme/Error": "../../../../client/theme-fallback/Error/index.tsx",
-  "@theme/Layout": "../../../../client/theme-fallback/Layout/index.js",
+  "@theme/Layout": "../../../../client/theme-fallback/Layout/index.tsx",
-  "@theme/Loading": "../../../../client/theme-fallback/Loading/index.js",
+  "@theme/Loading": "../../../../client/theme-fallback/Loading/index.tsx",
-  "@theme/NotFound": "../../../../client/theme-fallback/NotFound/index.js",
+  "@theme/NotFound": "../../../../client/theme-fallback/NotFound/index.tsx",
   "@theme/PluginThemeComponent1": "pluginThemeFolder/PluginThemeComponent1.js",
   "@theme/PluginThemeComponentEnhanced": "src/theme/PluginThemeComponentEnhanced.js",
   "@theme/PluginThemeComponentOverriddenByUser": "src/theme/PluginThemeComponentOverriddenByUser.js",
-  "@theme/Root": "../../../../client/theme-fallback/Root/index.js",
+  "@theme/Root": "../../../../client/theme-fallback/Root/index.tsx",
   "@theme/UserThemeComponent1": "src/theme/UserThemeComponent1.js",
   "@theme/subfolder/PluginThemeComponent2": "pluginThemeFolder/subfolder/PluginThemeComponent2.js",
   "@theme/subfolder/UserThemeComponent2": "src/theme/subfolder/UserThemeComponent2.js",

packages/docusaurus/tsconfig.client.json

@@ -7,7 +7,7 @@
     "tsBuildInfoFile": "./lib/client/.tsbuildinfo",
     "rootDir": "src/client",
     "outDir": "lib/client",
-    "jsx": "react"
+    "jsx": "react-native"
   },
   "include": ["src/client", "src/deps.d.ts"]
 }