@docusaurus/theme-classic 2.0.0-beta.12faed89d → 2.0.0-beta.14

package/src/theme/hooks/useContextualSearchFilters.ts

@@ -1,52 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import {useAllDocsData, useActivePluginAndVersion} from '@theme/hooks/useDocs';
-import {
-  useDocsPreferredVersionByPluginId,
-  DEFAULT_SEARCH_TAG,
-  docVersionSearchTag,
-} from '@docusaurus/theme-common';
-import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-
-type ContextualSearchFilters = {
-  locale: string;
-  tags: string[];
-};
-
-// We may want to support multiple search engines, don't couple that to Algolia/DocSearch
-// Maybe users will want to use its own search engine solution
-export default function useContextualSearchFilters(): ContextualSearchFilters {
-  const {i18n} = useDocusaurusContext();
-  const allDocsData = useAllDocsData();
-  const activePluginAndVersion = useActivePluginAndVersion();
-  const docsPreferredVersionByPluginId = useDocsPreferredVersionByPluginId();
-
-  function getDocPluginTags(pluginId: string) {
-    const activeVersion =
-      activePluginAndVersion?.activePlugin?.pluginId === pluginId
-        ? activePluginAndVersion.activeVersion
-        : undefined;
-
-    const preferredVersion = docsPreferredVersionByPluginId[pluginId];
-
-    const latestVersion = allDocsData[pluginId].versions.find((v) => v.isLast);
-
-    const version = activeVersion ?? preferredVersion ?? latestVersion;
-
-    return docVersionSearchTag(pluginId, version.name);
-  }
-
-  const tags = [
-    DEFAULT_SEARCH_TAG,
-    ...Object.keys(allDocsData).map(getDocPluginTags),
-  ];
-
-  return {
-    locale: i18n.currentLocale,
-    tags,
-  };
-}

package/src/theme/hooks/useLocationHash.ts

@@ -1,25 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import {useState, useEffect} from 'react';
-import type {useLocationHashReturns} from '@theme/hooks/useLocationHash';
-
-function useLocationHash(initialHash: string): useLocationHashReturns {
-  const [hash, setHash] = useState(initialHash);
-
-  useEffect(() => {
-    const handleHashChange = () => setHash(window.location.hash);
-
-    window.addEventListener('hashchange', handleHashChange);
-
-    return () => window.removeEventListener('hashchange', handleHashChange);
-  }, []);
-
-  return [hash, setHash];
-}
-
-export default useLocationHash;

package/src/theme/hooks/useScrollPosition.ts

@@ -1,45 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import {useEffect, useRef} from 'react';
-import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';
-import type {ScrollPosition} from '@theme/hooks/useScrollPosition';
-
-const getScrollPosition = (): ScrollPosition => ({
-  scrollX: ExecutionEnvironment.canUseDOM ? window.pageXOffset : 0,
-  scrollY: ExecutionEnvironment.canUseDOM ? window.pageYOffset : 0,
-});
-
-const useScrollPosition = (
-  effect?: (position: ScrollPosition, lastPosition: ScrollPosition) => void,
-  deps = [],
-): void => {
-  const scrollPosition = useRef(getScrollPosition());
-
-  const handleScroll = () => {
-    const currentScrollPosition = getScrollPosition();
-
-    if (effect) {
-      effect(currentScrollPosition, scrollPosition.current);
-    }
-
-    scrollPosition.current = currentScrollPosition;
-  };
-
-  useEffect(() => {
-    const opts: AddEventListenerOptions & EventListenerOptions = {
-      passive: true,
-    };
-
-    handleScroll();
-    window.addEventListener('scroll', handleScroll, opts);
-
-    return () => window.removeEventListener('scroll', handleScroll, opts);
-  }, deps);
-};
-
-export default useScrollPosition;

package/src/theme/hooks/useTOCHighlight.ts

@@ -1,98 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import {useEffect, useState} from 'react';
-
-function useTOCHighlight(
-  linkClassName: string,
-  linkActiveClassName: string,
-  topOffset: number,
-): void {
-  const [lastActiveLink, setLastActiveLink] = useState<
-    HTMLAnchorElement | undefined
-  >(undefined);
-
-  useEffect(() => {
-    function setActiveLink() {
-      function getActiveHeaderAnchor(): Element | null {
-        const headersAnchors: Element[] = Array.from(
-          document.getElementsByClassName('anchor'),
-        );
-
-        const firstAnchorUnderViewportTop = headersAnchors.find((anchor) => {
-          const {top} = anchor.getBoundingClientRect();
-          return top >= topOffset;
-        });
-
-        if (firstAnchorUnderViewportTop) {
-          // If first anchor in viewport is under a certain threshold, we consider it's not the active anchor.
-          // In such case, the active anchor is the previous one (if it exists), that may be above the viewport
-          if (
-            firstAnchorUnderViewportTop.getBoundingClientRect().top >= topOffset
-          ) {
-            const previousAnchor =
-              headersAnchors[
-                headersAnchors.indexOf(firstAnchorUnderViewportTop) - 1
-              ];
-            return previousAnchor ?? firstAnchorUnderViewportTop;
-          }
-          // If the anchor is at the top of the viewport, we consider it's the first anchor
-          else {
-            return firstAnchorUnderViewportTop;
-          }
-        }
-        // no anchor under viewport top? (ie we are at the bottom of the page)
-        else {
-          // highlight the last anchor found
-          return headersAnchors[headersAnchors.length - 1];
-        }
-      }
-
-      const activeHeaderAnchor = getActiveHeaderAnchor();
-
-      if (activeHeaderAnchor) {
-        let index = 0;
-        let itemHighlighted = false;
-
-        // @ts-expect-error: Must be <a> tags.
-        const links: HTMLCollectionOf<HTMLAnchorElement> = document.getElementsByClassName(
-          linkClassName,
-        );
-        while (index < links.length && !itemHighlighted) {
-          const link = links[index];
-          const {href} = link;
-          const anchorValue = decodeURIComponent(
-            href.substring(href.indexOf('#') + 1),
-          );
-
-          if (activeHeaderAnchor.id === anchorValue) {
-            if (lastActiveLink) {
-              lastActiveLink.classList.remove(linkActiveClassName);
-            }
-            link.classList.add(linkActiveClassName);
-            setLastActiveLink(link);
-            itemHighlighted = true;
-          }
-
-          index += 1;
-        }
-      }
-    }
-
-    document.addEventListener('scroll', setActiveLink);
-    document.addEventListener('resize', setActiveLink);
-
-    setActiveLink();
-
-    return () => {
-      document.removeEventListener('scroll', setActiveLink);
-      document.removeEventListener('resize', setActiveLink);
-    };
-  });
-}
-
-export default useTOCHighlight;

package/tsconfig.json

@@ -1,12 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "lib": ["DOM"],
-    "module": "esnext",
-    "noEmit": true,
-    "noImplicitAny": false,
-    "jsx": "react",
-    "baseUrl": "src"
-  },
-  "include": ["src/"]
-}

package/update-code-translations.js

@@ -1,242 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-const chalk = require('chalk');
-const path = require('path');
-const fs = require('fs-extra');
-const globby = require('globby');
-const {mapValues, pickBy, difference, orderBy} = require('lodash');
-
-const CodeDirPaths = [
-  path.join(__dirname, 'lib-next'),
-  // TODO other themes should rather define their own translations in the future?
-  path.join(__dirname, '..', 'docusaurus-theme-search-algolia', 'src', 'theme'),
-  path.join(__dirname, '..', 'docusaurus-theme-live-codeblock', 'src', 'theme'),
-  path.join(__dirname, '..', 'docusaurus-plugin-pwa', 'src', 'theme'),
-];
-
-console.log('Will scan folders for code translations:', CodeDirPaths);
-
-function removeDescriptionSuffix(key) {
-  if (key.replace('___DESCRIPTION')) {
-    return key.replace('___DESCRIPTION', '');
-  }
-  return key;
-}
-
-function sortObjectKeys(obj) {
-  let keys = Object.keys(obj);
-  keys = orderBy(keys, [(k) => removeDescriptionSuffix(k)]);
-  return keys.reduce((acc, key) => {
-    acc[key] = obj[key];
-    return acc;
-  }, {});
-}
-
-function logSection(title) {
-  console.log(``);
-  console.log(``);
-  console.log(`##############################`);
-  console.log(`## ${chalk.blue(title)}`);
-}
-
-function logKeys(keys) {
-  return `Keys:\n- ${keys.join('\n- ')}\``;
-}
-
-async function extractThemeCodeMessages() {
-  // Unsafe import, should we create a package for the translationsExtractor ?
-  const {
-    globSourceCodeFilePaths,
-    extractAllSourceCodeFileTranslations,
-    // eslint-disable-next-line global-require
-  } = require('@docusaurus/core/lib/server/translations/translationsExtractor');
-
-  const filePaths = (
-    await globSourceCodeFilePaths(CodeDirPaths)
-  ).filter((filePath) => ['.js', '.jsx'].includes(path.extname(filePath)));
-
-  const filesExtractedTranslations = await extractAllSourceCodeFileTranslations(
-    filePaths,
-    {
-      presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
-    },
-  );
-
-  filesExtractedTranslations.forEach((fileExtractedTranslations) => {
-    fileExtractedTranslations.warnings.forEach((warning) => {
-      throw new Error(`
-Please make sure all theme translations are static!
-Some warnings were found!
-
-${warning}
-      `);
-    });
-  });
-
-  const translations = filesExtractedTranslations.reduce(
-    (acc, extractedTranslations) => {
-      return {...acc, ...extractedTranslations.translations};
-    },
-    {},
-  );
-
-  return translations;
-}
-
-async function readMessagesFile(filePath) {
-  return JSON.parse(await fs.readFile(filePath));
-}
-
-async function writeMessagesFile(filePath, messages) {
-  const sortedMessages = sortObjectKeys(messages);
-
-  const content = `${JSON.stringify(sortedMessages, null, 2)}\n`; // \n makes prettier happy
-  await fs.writeFile(filePath, content);
-  console.log(
-    `${path.basename(filePath)} updated (${
-      Object.keys(sortedMessages).length
-    } messages)`,
-  );
-}
-
-async function getCodeTranslationFiles() {
-  const codeTranslationsDir = path.join(__dirname, 'codeTranslations');
-  const baseFile = path.join(codeTranslationsDir, 'base.json');
-  const localesFiles = (await globby(codeTranslationsDir)).filter(
-    (filepath) =>
-      path.extname(filepath) === '.json' && !filepath.endsWith('base.json'),
-  );
-  return {baseFile, localesFiles};
-}
-
-const DescriptionSuffix = '___DESCRIPTION';
-
-async function updateBaseFile(baseFile) {
-  const baseMessagesWithDescriptions = await readMessagesFile(baseFile);
-  const baseMessages = pickBy(
-    baseMessagesWithDescriptions,
-    (_, key) => !key.endsWith(DescriptionSuffix),
-  );
-
-  const codeExtractedTranslations = await extractThemeCodeMessages();
-  const codeMessages = mapValues(
-    codeExtractedTranslations,
-    (translation) => translation.message,
-  );
-
-  const unknownMessages = difference(
-    Object.keys(baseMessages),
-    Object.keys(codeMessages),
-  );
-
-  if (unknownMessages.length) {
-    console.log(
-      chalk.red(`Some messages exist in base.json but were not found by the code extractor!
-They won't be removed automatically, so do the cleanup manually if necessary!
-${logKeys(unknownMessages)}`),
-    );
-  }
-
-  const newBaseMessages = {
-    ...baseMessages, // Ensure we don't automatically remove unknown messages
-    ...codeMessages,
-  };
-
-  const newBaseMessagesDescriptions = Object.entries(newBaseMessages).reduce(
-    (acc, [key]) => {
-      const codeTranslation = codeExtractedTranslations[key];
-      return {
-        ...acc,
-        [`${key}${DescriptionSuffix}`]: codeTranslation
-          ? codeTranslation.description
-          : undefined,
-      };
-    },
-    {},
-  );
-
-  const newBaseMessagesWitDescription = {
-    ...newBaseMessages,
-    ...newBaseMessagesDescriptions,
-  };
-
-  await writeMessagesFile(baseFile, newBaseMessagesWitDescription);
-
-  return newBaseMessages;
-}
-
-async function updateLocaleCodeTranslations(localeFile, baseFileMessages) {
-  const localeFileMessages = await readMessagesFile(localeFile);
-
-  const unknownMessages = difference(
-    Object.keys(localeFileMessages),
-    Object.keys(baseFileMessages),
-  );
-
-  if (unknownMessages.length) {
-    console.log(
-      chalk.red(`Some localized messages do not exist in base.json!
-You may want to delete these!
-${logKeys(unknownMessages)}`),
-    );
-  }
-
-  const newLocaleFileMessages = {
-    ...baseFileMessages,
-    ...localeFileMessages,
-  };
-
-  const untranslatedKeys = Object.entries(newLocaleFileMessages)
-    .filter(([key, value]) => {
-      return value === baseFileMessages[key];
-    })
-    .map(([key]) => key);
-
-  if (untranslatedKeys.length) {
-    console.warn(
-      chalk.yellow(`Some messages do not seem to be translated!
-${logKeys(untranslatedKeys)}`),
-    );
-  }
-
-  await writeMessagesFile(localeFile, newLocaleFileMessages);
-}
-
-async function updateCodeTranslations() {
-  logSection('Will update base file');
-  const {baseFile, localesFiles} = await getCodeTranslationFiles();
-  const baseFileMessages = await updateBaseFile(baseFile);
-
-  // eslint-disable-next-line no-restricted-syntax
-  for (const localeFile of localesFiles) {
-    logSection(`Will update ${path.basename(localeFile)}`);
-    // eslint-disable-next-line no-await-in-loop
-    await updateLocaleCodeTranslations(localeFile, baseFileMessages);
-  }
-}
-
-function run() {
-  updateCodeTranslations().then(
-    () => {
-      console.log('');
-      console.log(chalk.green('updateCodeTranslations end'));
-      console.log('');
-    },
-    (e) => {
-      console.log('');
-      console.error(chalk.red(`updateCodeTranslations failure: ${e.message}`));
-      console.log('');
-      console.error(e.stack);
-      console.log('');
-      process.exit(1);
-    },
-  );
-}
-
-exports.run = run;
-exports.extractThemeCodeMessages = extractThemeCodeMessages;

package/update-code-translations.test.js

@@ -1,33 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-const {extractThemeCodeMessages} = require('./update-code-translations');
-const path = require('path');
-const fs = require('fs-extra');
-const {mapValues, pickBy} = require('lodash');
-
-// Seems the 5s default timeout fails sometimes
-jest.setTimeout(15000);
-
-describe('update-code-translations', () => {
-  test(`to have base.json contain all the translations extracted from the theme. Please run "yarn workspace @docusaurus/theme-classic update-code-translations" to keep base.json up-to-date.`, async () => {
-    const baseMessages = pickBy(
-      JSON.parse(
-        await fs.readFile(
-          path.join(__dirname, 'codeTranslations', 'base.json'),
-        ),
-      ),
-      (_, key) => !key.endsWith('___DESCRIPTION'),
-    );
-
-    const codeMessages = mapValues(
-      await extractThemeCodeMessages(),
-      (translation) => translation.message,
-    );
-    expect(codeMessages).toEqual(baseMessages);
-  });
-});