From 7c11115c4452b6d452a79bcb7838b70ae7631c7e Mon Sep 17 00:00:00 2001
From: Fedor Abrashin <abrashin012@gmail.com>
Date: Mon, 9 Dec 2024 12:56:50 +0300
Subject: [PATCH] feat(docs): add last time edit date

---
 docusaurus.config.ts                          | 212 +++++++++---------
 i18n/en/code.json                             |   2 +-
 package.json                                  |   1 +
 .../CustomLastUpdate/CustomLastUpdate.tsx     |  29 +++
 src/components/CustomLastUpdate/index.tsx     |   1 +
 src/theme/DocItem/Footer/index.tsx            |  39 ++--
 src/theme/DocItem/Layout/index.tsx            |  80 +++++++
 src/theme/DocItem/Layout/styles.module.css    |  10 +
 yarn.lock                                     | 103 ++++++++-
 9 files changed, 351 insertions(+), 126 deletions(-)
 create mode 100644 src/components/CustomLastUpdate/CustomLastUpdate.tsx
 create mode 100644 src/components/CustomLastUpdate/index.tsx
 create mode 100644 src/theme/DocItem/Layout/index.tsx
 create mode 100644 src/theme/DocItem/Layout/styles.module.css

diff --git a/docusaurus.config.ts b/docusaurus.config.ts
index 443ec5e6..057323a7 100644
--- a/docusaurus.config.ts
+++ b/docusaurus.config.ts
@@ -1,10 +1,10 @@
-import dotenv from 'dotenv'
+import dotenv from 'dotenv';
 import type { Config } from '@docusaurus/types';
 import type { Options, ThemeConfig } from '@docusaurus/preset-classic';
-import { themes } from 'prism-react-renderer'
+import { themes } from 'prism-react-renderer';
 import plugins from './plugins';
 
-dotenv.config()
+dotenv.config();
 
 const googleVerificationCode = process.env.GOOGLE_VERIFICATION_CODE;
 const yandexVerificationCode = process.env.YANDEX_VERIFICATION_CODE;
@@ -45,6 +45,7 @@ const config: Config = {
         docs: {
           routeBasePath: '/',
           sidebarPath: require.resolve('./sidebars.js'),
+          showLastUpdateTime: true,
           editUrl: ({ docPath }) =>
             `https://github.com/sendsay-ru/sendsay-docs/edit/stable/docs/${docPath}`,
         },
@@ -58,116 +59,115 @@ const config: Config = {
     ],
   ],
 
-  themeConfig:
-    {
-      navbar: {
-        logo: {
-          alt: 'Sendsay docs',
-          src: 'img/logo.svg',
-          className: 'no-border',
-        },
-        items: [
-          {
-            type: 'dropdown',
-            label: 'Главная',
-            labelMode: 'dynamic',
-            position: 'left',
-            items: [
-              {
-                type: 'docSidebar',
-                sidebarId: 'docs',
-                label: 'Главная',
-              },
-              {
-                type: 'docSidebar',
-                sidebarId: 'integrations',
-                label: 'Интеграции',
-              },
-              {
-                type: 'docSidebar',
-                sidebarId: 'videolessons',
-                label: 'Видеоуроки',
-              },
-              {
-                type: 'docSidebar',
-                sidebarId: 'updates',
-                label: 'Обновления',
-              },
-            ],
-          },
-          {
-            type: 'docSidebar',
-            position: 'left',
-            sidebarId: 'docs',
-            label: 'Главная',
-            displayedLocale: 'ru',
-          },
-          {
-            type: 'docSidebar',
-            position: 'left',
-            sidebarId: 'integrations',
-            label: 'Интеграции',
-            displayedLocale: 'ru',
-          },
-          {
-            type: 'docSidebar',
-            position: 'left',
-            sidebarId: 'videolessons',
-            label: 'Видеоуроки',
-            displayedLocale: 'ru',
-          },
-          {
-            type: 'docSidebar',
-            position: 'left',
-            sidebarId: 'updates',
-            label: 'Обновления',
-            displayedLocale: 'ru',
-          },
-          {
-            href: 'https://app.sendsay.ru',
-            label: 'Sendsay',
-            position: 'right',
-          },
-          {
-            href: 'https://sendsay.ru/api/api.html',
-            label: 'API',
-            position: 'right',
-          },
-          {
-            type: 'localeDropdown',
-            position: 'right',
-          },
-        ],
-      },
-      footer: {
-        style: 'light',
-        copyright: `Copyright © ${new Date().getFullYear()} Sendsay.`,
-      },
-      prism: {
-        theme: themes.github,
-        darkTheme: themes.dracula,
+  themeConfig: {
+    navbar: {
+      logo: {
+        alt: 'Sendsay docs',
+        src: 'img/logo.svg',
+        className: 'no-border',
       },
-      colorMode: {
-        disableSwitch: true,
-      },
-      zoom: {
-        selector: '.markdown img',
-        background: {
-          light: 'rgb(255, 255, 255)',
-          dark: 'rgb(50, 50, 50)',
+      items: [
+        {
+          type: 'dropdown',
+          label: 'Главная',
+          labelMode: 'dynamic',
+          position: 'left',
+          items: [
+            {
+              type: 'docSidebar',
+              sidebarId: 'docs',
+              label: 'Главная',
+            },
+            {
+              type: 'docSidebar',
+              sidebarId: 'integrations',
+              label: 'Интеграции',
+            },
+            {
+              type: 'docSidebar',
+              sidebarId: 'videolessons',
+              label: 'Видеоуроки',
+            },
+            {
+              type: 'docSidebar',
+              sidebarId: 'updates',
+              label: 'Обновления',
+            },
+          ],
+        },
+        {
+          type: 'docSidebar',
+          position: 'left',
+          sidebarId: 'docs',
+          label: 'Главная',
+          displayedLocale: 'ru',
+        },
+        {
+          type: 'docSidebar',
+          position: 'left',
+          sidebarId: 'integrations',
+          label: 'Интеграции',
+          displayedLocale: 'ru',
+        },
+        {
+          type: 'docSidebar',
+          position: 'left',
+          sidebarId: 'videolessons',
+          label: 'Видеоуроки',
+          displayedLocale: 'ru',
+        },
+        {
+          type: 'docSidebar',
+          position: 'left',
+          sidebarId: 'updates',
+          label: 'Обновления',
+          displayedLocale: 'ru',
         },
-      },
-      metadata: [
         {
-          name: 'google-site-verification',
-          content: googleVerificationCode,
+          href: 'https://app.sendsay.ru',
+          label: 'Sendsay',
+          position: 'right',
         },
         {
-          name: 'yandex-verification',
-          content: yandexVerificationCode,
+          href: 'https://sendsay.ru/api/api.html',
+          label: 'API',
+          position: 'right',
+        },
+        {
+          type: 'localeDropdown',
+          position: 'right',
         },
       ],
-    } satisfies ThemeConfig,
+    },
+    footer: {
+      style: 'light',
+      copyright: `Copyright © ${new Date().getFullYear()} Sendsay.`,
+    },
+    prism: {
+      theme: themes.github,
+      darkTheme: themes.dracula,
+    },
+    colorMode: {
+      disableSwitch: true,
+    },
+    zoom: {
+      selector: '.markdown img',
+      background: {
+        light: 'rgb(255, 255, 255)',
+        dark: 'rgb(50, 50, 50)',
+      },
+    },
+    metadata: [
+      {
+        name: 'google-site-verification',
+        content: googleVerificationCode,
+      },
+      {
+        name: 'yandex-verification',
+        content: yandexVerificationCode,
+      },
+    ],
+  } satisfies ThemeConfig,
 };
 
 module.exports = config;
diff --git a/i18n/en/code.json b/i18n/en/code.json
index 95aee8e8..4d6dc551 100644
--- a/i18n/en/code.json
+++ b/i18n/en/code.json
@@ -163,7 +163,7 @@
     "description": "Title for link to heading"
   },
   "theme.lastUpdated.atDate": {
-    "message": " on {date}",
+    "message": "Updated: {date}",
     "description": "The words used to describe on which date a page has been last updated"
   },
   "theme.lastUpdated.byUser": {
diff --git a/package.json b/package.json
index 000a4f7e..8fba5d53 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "prism-react-renderer": "^2.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-intl": "^7.0.4",
     "tailwindcss": "^3.4.1"
   },
   "devDependencies": {
diff --git a/src/components/CustomLastUpdate/CustomLastUpdate.tsx b/src/components/CustomLastUpdate/CustomLastUpdate.tsx
new file mode 100644
index 00000000..1df85e60
--- /dev/null
+++ b/src/components/CustomLastUpdate/CustomLastUpdate.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import Translate from '@docusaurus/Translate';
+
+const NARROW_SPACE = '\u202F';
+
+export const CustomLastUpdate = ({ lastUpdatedAt }: { lastUpdatedAt: number }): JSX.Element => (
+  <div className="rounded-sm bg-blue-50 px-1.5 py-0.5 text-blue-500 text-xs font-normal w-fit mb-3">
+    <Translate
+      id="theme.lastUpdated.atDate"
+      values={{
+        date: (
+          <time dateTime={new Date(lastUpdatedAt * 1000).toISOString()}>
+            {new Intl.DateTimeFormat('ru', {
+              day: 'numeric',
+              month: 'long',
+              timeZone: 'UTC',
+            }).format(lastUpdatedAt)}
+            {NARROW_SPACE}
+            {new Intl.DateTimeFormat('ru', {
+              year: 'numeric',
+            }).format(lastUpdatedAt)}
+          </time>
+        ),
+      }}
+    >
+      {'Обновлено: {date}'}
+    </Translate>
+  </div>
+);
diff --git a/src/components/CustomLastUpdate/index.tsx b/src/components/CustomLastUpdate/index.tsx
new file mode 100644
index 00000000..cb0a5f50
--- /dev/null
+++ b/src/components/CustomLastUpdate/index.tsx
@@ -0,0 +1 @@
+export { CustomLastUpdate } from './CustomLastUpdate';
diff --git a/src/theme/DocItem/Footer/index.tsx b/src/theme/DocItem/Footer/index.tsx
index 5398d180..33709923 100644
--- a/src/theme/DocItem/Footer/index.tsx
+++ b/src/theme/DocItem/Footer/index.tsx
@@ -8,9 +8,8 @@ import LastUpdated from '@theme/LastUpdated';
 import EditThisPage from '@theme/EditThisPage';
 import TagsListInline, { type Props as TagsListInlineProps } from '@theme/TagsListInline';
 import { Feedback } from '../../../components/Feedback';
-
-import styles from './styles.module.css';
 import { useSearchParams } from '../../../hooks';
+import styles from './styles.module.css';
 
 const TagsRow = (props: TagsListInlineProps) => (
   <div className={clsx(ThemeClassNames.docs.docFooterTagsRow, 'row margin-bottom--sm')}>
@@ -29,33 +28,36 @@ const EditMetaRow = ({
   lastUpdatedAt,
   lastUpdatedBy,
   formattedLastUpdatedAt,
-}: EditMetaRowProps) => (
-  <div className={clsx(ThemeClassNames.docs.docFooterEditMetaRow, 'row')}>
-    <div className="col">{editUrl && <EditThisPage editUrl={editUrl} />}</div>
+}: EditMetaRowProps) => {
+  const queryParams = useSearchParams();
 
-    <div className={clsx('col', styles.lastUpdated)}>
-      {(lastUpdatedAt || lastUpdatedBy) && (
-        <LastUpdated
-          lastUpdatedAt={lastUpdatedAt}
-          formattedLastUpdatedAt={formattedLastUpdatedAt}
-          lastUpdatedBy={lastUpdatedBy}
-        />
+  const isEditorMode = queryParams && queryParams.get('edit') === 'true';
+
+  return (
+    <div className={clsx(ThemeClassNames.docs.docFooterEditMetaRow, 'row')}>
+      {isEditorMode && <div className="col">{editUrl && <EditThisPage editUrl={editUrl} />}</div>}
+
+      {false && (
+        <div className={clsx('col', styles.lastUpdated)}>
+          <LastUpdated
+            lastUpdatedAt={lastUpdatedAt}
+            formattedLastUpdatedAt={formattedLastUpdatedAt}
+            lastUpdatedBy={lastUpdatedBy}
+          />
+        </div>
       )}
     </div>
-  </div>
-);
+  );
+};
 
 const DocItemFooter = (): JSX.Element | null => {
   const { metadata } = useDoc();
-  const queryParams = useSearchParams();
-
-  const isEditorMode = queryParams && queryParams.get('edit') === 'true';
 
   const { editUrl, lastUpdatedAt, formattedLastUpdatedAt, lastUpdatedBy, tags } = metadata;
 
   const canDisplayTagsRow = tags.length > 0;
 
-  const canDisplayEditMetaRow = !!(editUrl || lastUpdatedAt || lastUpdatedBy) && isEditorMode;
+  const canDisplayEditMetaRow = Boolean(editUrl || lastUpdatedAt || lastUpdatedBy);
 
   const canDisplayFooter = canDisplayTagsRow || canDisplayEditMetaRow;
 
@@ -66,6 +68,7 @@ const DocItemFooter = (): JSX.Element | null => {
   return (
     <footer className={clsx(ThemeClassNames.docs.docFooter, 'docusaurus-mt-lg')}>
       {canDisplayTagsRow && <TagsRow tags={tags} />}
+
       {canDisplayEditMetaRow && (
         <EditMetaRow
           editUrl={editUrl}
diff --git a/src/theme/DocItem/Layout/index.tsx b/src/theme/DocItem/Layout/index.tsx
new file mode 100644
index 00000000..1c32208f
--- /dev/null
+++ b/src/theme/DocItem/Layout/index.tsx
@@ -0,0 +1,80 @@
+import React from 'react';
+import clsx from 'clsx';
+import { useWindowSize } from '@docusaurus/theme-common';
+import { useDoc } from '@docusaurus/theme-common/internal';
+import DocItemPaginator from '@theme/DocItem/Paginator';
+import DocVersionBanner from '@theme/DocVersionBanner';
+import DocVersionBadge from '@theme/DocVersionBadge';
+import DocItemFooter from '@theme/DocItem/Footer';
+import DocItemTOCMobile from '@theme/DocItem/TOC/Mobile';
+import DocItemTOCDesktop from '@theme/DocItem/TOC/Desktop';
+import DocItemContent from '@theme/DocItem/Content';
+import DocBreadcrumbs from '@theme/DocBreadcrumbs';
+import Unlisted from '@theme/Unlisted';
+import type { Props } from '@theme/DocItem/Layout';
+import { CustomLastUpdate } from '../../../components/CustomLastUpdate';
+
+import styles from './styles.module.css';
+
+/**
+ * Decide if the toc should be rendered, on mobile or desktop viewports
+ */
+function useDocTOC() {
+  const { frontMatter, toc } = useDoc();
+  const windowSize = useWindowSize();
+
+  const hidden = frontMatter.hide_table_of_contents;
+  const canRender = !hidden && toc.length > 0;
+
+  const mobile = canRender ? <DocItemTOCMobile /> : undefined;
+
+  const desktop =
+    canRender && (windowSize === 'desktop' || windowSize === 'ssr') ? (
+      <DocItemTOCDesktop />
+    ) : undefined;
+
+  return {
+    hidden,
+    mobile,
+    desktop,
+  };
+}
+
+const DocItemLayout = ({ children }: Props): JSX.Element => {
+  const docTOC = useDocTOC();
+  const {
+    metadata: { unlisted, lastUpdatedAt },
+  } = useDoc();
+
+  return (
+    <div className="row">
+      <div className={clsx('col', !docTOC.hidden && styles.docItemCol)}>
+        {unlisted && <Unlisted />}
+
+        <DocVersionBanner />
+
+        <div className={styles.docItemContainer}>
+          <article>
+            <DocBreadcrumbs />
+
+            <DocVersionBadge />
+
+            <CustomLastUpdate lastUpdatedAt={lastUpdatedAt} />
+
+            {docTOC.mobile}
+
+            <DocItemContent>{children}</DocItemContent>
+
+            <DocItemFooter />
+          </article>
+
+          <DocItemPaginator />
+        </div>
+      </div>
+
+      {docTOC.desktop && <div className="col col--3">{docTOC.desktop}</div>}
+    </div>
+  );
+};
+
+export default DocItemLayout;
diff --git a/src/theme/DocItem/Layout/styles.module.css b/src/theme/DocItem/Layout/styles.module.css
new file mode 100644
index 00000000..d5aaec13
--- /dev/null
+++ b/src/theme/DocItem/Layout/styles.module.css
@@ -0,0 +1,10 @@
+.docItemContainer header + *,
+.docItemContainer article > *:first-child {
+  margin-top: 0;
+}
+
+@media (min-width: 997px) {
+  .docItemCol {
+    max-width: 75% !important;
+  }
+}
diff --git a/yarn.lock b/yarn.lock
index 10e93401..6f107032 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1717,6 +1717,58 @@
   resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.56.0.tgz#ef20350fec605a7f7035a01764731b2de0f3782b"
   integrity sha512-gMsVel9D7f2HLkBma9VbtzZRehRogVRfbr++f06nL2vnCGCNlzOD+/MUov/F4p8myyAHspEhVobgjpX64q5m6A==
 
+"@formatjs/ecma402-abstract@2.3.1":
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-2.3.1.tgz#cdeb3ffe1aeea9c4284b85b7e37e8e8615314c39"
+  integrity sha512-Ip9uV+/MpLXWRk03U/GzeJMuPeOXpJBSB5V1tjA6kJhvqssye5J5LoYLc7Z5IAHb7nR62sRoguzrFiVCP/hnzw==
+  dependencies:
+    "@formatjs/fast-memoize" "2.2.5"
+    "@formatjs/intl-localematcher" "0.5.9"
+    decimal.js "10"
+    tslib "2"
+
+"@formatjs/fast-memoize@2.2.5":
+  version "2.2.5"
+  resolved "https://registry.yarnpkg.com/@formatjs/fast-memoize/-/fast-memoize-2.2.5.tgz#54a4a1793d773b72c372d3dcab3595149aee7880"
+  integrity sha512-6PoewUMrrcqxSoBXAOJDiW1m+AmkrAj0RiXnOMD59GRaswjXhm3MDhgepXPBgonc09oSirAJTsAggzAGQf6A6g==
+  dependencies:
+    tslib "2"
+
+"@formatjs/icu-messageformat-parser@2.9.7":
+  version "2.9.7"
+  resolved "https://registry.yarnpkg.com/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.9.7.tgz#84abd5c86ef2ad7cb82da63b3380c33808efb6da"
+  integrity sha512-cuEHyRM5VqLQobANOjtjlgU7+qmk9Q3fDQuBiRRJ3+Wp3ZoZhpUPtUfuimZXsir6SaI2TaAJ+SLo9vLnV5QcbA==
+  dependencies:
+    "@formatjs/ecma402-abstract" "2.3.1"
+    "@formatjs/icu-skeleton-parser" "1.8.11"
+    tslib "2"
+
+"@formatjs/icu-skeleton-parser@1.8.11":
+  version "1.8.11"
+  resolved "https://registry.yarnpkg.com/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.8.11.tgz#e7c9918274dfa0c1c2bca1ab6e15ef49b10cf0bb"
+  integrity sha512-8LlHHE/yL/zVJZHAX3pbKaCjZKmBIO6aJY1mkVh4RMSEu/2WRZ4Ysvv3kKXJ9M8RJLBHdnk1/dUQFdod1Dt7Dw==
+  dependencies:
+    "@formatjs/ecma402-abstract" "2.3.1"
+    tslib "2"
+
+"@formatjs/intl-localematcher@0.5.9":
+  version "0.5.9"
+  resolved "https://registry.yarnpkg.com/@formatjs/intl-localematcher/-/intl-localematcher-0.5.9.tgz#43c6ee22be85b83340bcb09bdfed53657a2720db"
+  integrity sha512-8zkGu/sv5euxbjfZ/xmklqLyDGQSxsLqg8XOq88JW3cmJtzhCP8EtSJXlaKZnVO4beEaoiT9wj4eIoCQ9smwxA==
+  dependencies:
+    tslib "2"
+
+"@formatjs/intl@3.0.4":
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/@formatjs/intl/-/intl-3.0.4.tgz#b257d8c472b8f439d5e901fd74ea47b97d3cebb5"
+  integrity sha512-pnetak6R7Xp/ET96O5kx9zRYoQQqr6sbRXWkJHKw0Hr/jr3ls4CddZKq+suwCDuW6p/ior2BhpOSh/WLLcJM6w==
+  dependencies:
+    "@formatjs/ecma402-abstract" "2.3.1"
+    "@formatjs/fast-memoize" "2.2.5"
+    "@formatjs/icu-messageformat-parser" "2.9.7"
+    intl-messageformat "10.7.10"
+    tslib "2"
+
 "@hapi/hoek@^9.0.0", "@hapi/hoek@^9.3.0":
   version "9.3.0"
   resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-9.3.0.tgz#8368869dcb735be2e7f5cb7647de78e167a251fb"
@@ -2203,6 +2255,14 @@
   resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.11.tgz#56588b17ae8f50c53983a524fc3cc47437969d64"
   integrity sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==
 
+"@types/hoist-non-react-statics@3":
+  version "3.3.6"
+  resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.6.tgz#6bba74383cdab98e8db4e20ce5b4a6b98caed010"
+  integrity sha512-lPByRJUer/iN/xa4qpyL0qmL11DqNW81iU/IG1S3uvRUq4oKagz8VCxZjiWkumgt66YT3vOdDgZ0o32sGKtCEw==
+  dependencies:
+    "@types/react" "*"
+    hoist-non-react-statics "^3.3.0"
+
 "@types/html-minifier-terser@^6.0.0":
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#4fc33a00c1d0c16987b1a20cf92d20614c55ac35"
@@ -2365,6 +2425,13 @@
     "@types/scheduler" "*"
     csstype "^3.0.2"
 
+"@types/react@16 || 17 || 18 || 19":
+  version "19.0.1"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-19.0.1.tgz#a000d5b78f473732a08cecbead0f3751e550b3df"
+  integrity sha512-YW6614BDhqbpR5KtUYzTA+zlA7nayzJRA9ljz9CQoxthR0sDisYZLuvSMsil36t4EH/uAt8T52Xb4sVw17G+SQ==
+  dependencies:
+    csstype "^3.0.2"
+
 "@types/react@18.2.0":
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.0.tgz#15cda145354accfc09a18d2f2305f9fc099ada21"
@@ -3869,6 +3936,11 @@ debug@^3.2.7:
   dependencies:
     ms "^2.1.1"
 
+decimal.js@10:
+  version "10.4.3"
+  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.3.tgz#1044092884d245d1b7f65725fa4ad4c6f781cc23"
+  integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==
+
 decode-named-character-reference@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/decode-named-character-reference/-/decode-named-character-reference-1.0.2.tgz#daabac9690874c394c81e4162a0304b35d824f0e"
@@ -5518,7 +5590,7 @@ hogan.js@^3.0.2:
     mkdirp "0.3.0"
     nopt "1.0.10"
 
-hoist-non-react-statics@^3.1.0:
+hoist-non-react-statics@3, hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.0:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
   integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -5795,6 +5867,16 @@ interpret@^1.0.0:
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e"
   integrity sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==
 
+intl-messageformat@10.7.10:
+  version "10.7.10"
+  resolved "https://registry.yarnpkg.com/intl-messageformat/-/intl-messageformat-10.7.10.tgz#fc8fc8c13b0a4104ba08dc2f5f9225f14945bcb7"
+  integrity sha512-hp7iejCBiJdW3zmOe18FdlJu8U/JsADSDiBPQhfdSeI8B9POtvPRvPh3nMlvhYayGMKLv6maldhR7y3Pf1vkpw==
+  dependencies:
+    "@formatjs/ecma402-abstract" "2.3.1"
+    "@formatjs/fast-memoize" "2.2.5"
+    "@formatjs/icu-messageformat-parser" "2.9.7"
+    tslib "2"
+
 invariant@^2.2.4:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
@@ -8404,6 +8486,20 @@ react-helmet-async@^1.3.0:
     react-fast-compare "^3.2.0"
     shallowequal "^1.1.0"
 
+react-intl@^7.0.4:
+  version "7.0.4"
+  resolved "https://registry.yarnpkg.com/react-intl/-/react-intl-7.0.4.tgz#9bb491fc686ed2e8bba9fd859375e9464a4fab5a"
+  integrity sha512-WGNfCPNcRQhNAZBN+amz2hfR8Kd7jngScJ4WaRZcsaOWsvva1ciStnUIGj9MvOAxPqTf1D78J5OdRdc3l0wgKQ==
+  dependencies:
+    "@formatjs/ecma402-abstract" "2.3.1"
+    "@formatjs/icu-messageformat-parser" "2.9.7"
+    "@formatjs/intl" "3.0.4"
+    "@types/hoist-non-react-statics" "3"
+    "@types/react" "16 || 17 || 18 || 19"
+    hoist-non-react-statics "3"
+    intl-messageformat "10.7.10"
+    tslib "2"
+
 react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -9588,6 +9684,11 @@ tsconfig-paths@^3.15.0:
     minimist "^1.2.6"
     strip-bom "^3.0.0"
 
+tslib@2:
+  version "2.8.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f"
+  integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==
+
 tslib@^2.0.3, tslib@^2.6.0:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"