docs: i18nable component (#13084)

2023-08-21 02:58:53 +08:00 · 2023-08-21 02:58:53 +08:00 · 7daa88abb4
parent 04529804ab
commit 7daa88abb4
14 changed files with 246 additions and 130 deletions
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@ -118,7 +118,7 @@ jobs:

  docs:
    runs-on: ubuntu-latest
-    timeout-minutes: 5
+    timeout-minutes: 10
    strategy:
      fail-fast: false
      matrix:
--- a/website/docusaurus.config.js
+++ b/website/docusaurus.config.js
@ -53,7 +53,7 @@ const config = {
                    { from: '/joinus/pub-date', to: '/joinus/advanced/pub-date' },
                    { from: '/joinus/use-cache', to: '/joinus/advanced/use-cache' },
                    ...Object.values(require('./sidebars').guideSidebar)
-                        .find((s) => s.label === '路由')
+                        .find((s) => s.label === 'Routes')
                        .items.map((category) => ({
                            from: `/${category.split('/')[1]}`,
                            to: `/routes/${category.split('/')[1]}`,
@ -131,30 +131,30 @@ const config = {
                    {
                        to: '/',
                        position: 'left',
-                        label: '指南',
+                        label: 'Guide',
                        activeBaseRegex: '^/(usage|faq|parameter|api)?$',
                    },
                    {
                        to: '/routes',
                        position: 'left',
-                        label: '路由',
+                        label: 'Routes',
                        activeBaseRegex: '^/routes/',
                    },
                    {
                        to: '/joinus/quick-start',
-                        label: '参与我们',
+                        label: 'Join Us',
                        position: 'left',
                        activeBaseRegex: '^/joinus/',
                    },
                    {
                        to: '/install',
                        position: 'left',
-                        label: '部署',
+                        label: 'Deploy',
                    },
                    {
                        to: '/support',
                        position: 'left',
-                        label: '支持 RSSHub',
+                        label: 'Support RSSHub',
                    },
                    {
                        type: 'search',
@ -178,20 +178,20 @@ const config = {
                        title: 'Docs',
                        items: [
                            {
-                                label: '指南',
+                                label: 'Guide',
                                to: '/',
                            },
                            {
                                to: '/joinus/quick-start',
-                                label: '参与我们',
+                                label: 'Join Us',
                            },
                            {
                                to: '/install',
-                                label: '部署',
+                                label: 'Deploy',
                            },
                            {
                                to: '/support',
-                                label: '支持 RSSHub',
+                                label: 'Support RSSHub',
                            },
                        ],
                    },
@ -216,15 +216,15 @@ const config = {
                        title: 'More',
                        items: [
                            {
-                                label: '关于作者 DIYgod',
+                                label: 'About DIYgod',
                                to: 'https://diygod.cc',
                            },
                            {
-                                label: 'RSSHub Radar - 快速发现和订阅 RSS',
+                                label: 'RSSHub Radar - Discover and subscribe to RSS quickly',
                                href: 'https://github.com/DIYgod/RSSHub-Radar',
                            },
                            {
-                                label: 'xLog - 书写在区块链上的开源创作社区',
+                                label: 'xLog - Open source creation community written on the blockchain',
                                href: 'https://xlog.app',
                            },
                        ],
--- a/website/i18n/en/code.json
+++ b/website/i18n/en/code.json
@ -1 +1,59 @@
-{}
+{
+  "badge.supportBT": {
+    "message": "Support BT"
+  },
+  "badge.supportPodcast": {
+    "message": "Support Podcast"
+  },
+  "badge.supportSciHub": {
+    "message": "Support Sci-Hub"
+  },
+  "badge.puppeteer": {
+    "message": "Rely on Puppeteer"
+  },
+  "badge.anticrawler": {
+    "message": "Strict anti-crawler policy"
+  },
+  "badge.selfhost": {
+    "message": "Self-host only"
+  },
+  "badge.radar": {
+    "message": "Support browser extension"
+  },
+  "badge.rssbud": {
+    "message": "Support RSSBud"
+  },
+  "route.author": {
+    "message": "Author: "
+  },
+  "route.example": {
+    "message": "Example: "
+  },
+  "route.path": {
+    "message": "Route: "
+  },
+  "route.parameter": {
+    "message": "Parameters: "
+  },
+  "route.parameter.optional": {
+    "message": "optional"
+  },
+  "route.parameter.zeroOrMore": {
+    "message": "zero or more"
+  },
+  "route.parameter.oneOrMore": {
+    "message": "one or more"
+  },
+  "route.parameter.required": {
+    "message": "required"
+  },
+  "route.parameter.na": {
+    "message": "Parameters: N/A"
+  },
+  "route.comma": {
+    "message": ", "
+  },
+  "route.dash": {
+    "message": " - "
+  }
+}
--- a/website/i18n/en/docusaurus-plugin-content-docs/current.json
+++ b/website/i18n/en/docusaurus-plugin-content-docs/current.json
@ -4,39 +4,39 @@
    "description": "The label for version current"
  },
  "sidebar.tutorialSidebar.category.joinus": {
-    "message": "joinus",
+    "message": "Join Us",
    "description": "The label for category joinus in sidebar tutorialSidebar"
  },
-  "sidebar.tutorialSidebar.category.提交新的 RSSHub 规则": {
-    "message": "Submit new RSSHub rule",
-    "description": "The label for category 提交新的 RSSHub 规则 in sidebar tutorialSidebar"
+  "sidebar.tutorialSidebar.category.New RSSHub Rules": {
+    "message": "New RSSHub Rules",
+    "description": "The label for category New RSSHub Rules in sidebar tutorialSidebar"
  },
-  "sidebar.tutorialSidebar.category.高级用法": {
-    "message": "Advanced usage",
-    "description": "The label for category 高级用法 in sidebar tutorialSidebar"
+  "sidebar.tutorialSidebar.category.Advanced": {
+    "message": "Advanced",
+    "description": "The label for category Advanced in sidebar tutorialSidebar"
  },
  "sidebar.tutorialSidebar.category.routes": {
-    "message": "routes",
+    "message": "Routes",
    "description": "The label for category routes in sidebar tutorialSidebar"
  },
-  "sidebar.guideSidebar.category.指南": {
+  "sidebar.guideSidebar.category.Guide": {
    "message": "Guide",
-    "description": "The label for category 指南 in sidebar guideSidebar"
+    "description": "The label for category Guide in sidebar guideSidebar"
  },
-  "sidebar.guideSidebar.category.路由": {
+  "sidebar.guideSidebar.category.Routes": {
    "message": "Routes",
-    "description": "The label for category 路由 in sidebar guideSidebar"
+    "description": "The label for category Routes in sidebar guideSidebar"
  },
-  "sidebar.guideSidebar.category.路由.link.generated-index.description": {
+  "sidebar.guideSidebar.category.Routes.link.generated-index.description": {
    "message": "Routes are the access paths of RSSHub. Each route contains a RSSHub rule, which tells RSSHub how to extract content from the website and generate RSS subscription.",
-    "description": "The generated-index page description for category 路由 in sidebar guideSidebar"
+    "description": "The generated-index page description for category Routes in sidebar guideSidebar"
  },
-  "sidebar.joinusSidebar.category.提交新的 RSSHub 规则": {
-    "message": "Submit new RSSHub rule",
-    "description": "The label for category 提交新的 RSSHub 规则 in sidebar joinusSidebar"
+  "sidebar.joinusSidebar.category.New RSSHub Rules": {
+    "message": "New RSSHub Rules",
+    "description": "The label for category New RSSHub Rules in sidebar joinusSidebar"
  },
-  "sidebar.joinusSidebar.category.高级用法": {
-    "message": "Advanced usage",
-    "description": "The label for category 高级用法 in sidebar joinusSidebar"
+  "sidebar.joinusSidebar.category.Advanced": {
+    "message": "Advanced",
+    "description": "The label for category Advanced in sidebar joinusSidebar"
  }
 }
--- a/website/i18n/en/docusaurus-theme-classic/footer.json
+++ b/website/i18n/en/docusaurus-theme-classic/footer.json
@ -11,21 +11,21 @@
    "message": "More",
    "description": "The title of the footer links column with title=More in the footer"
  },
-  "link.item.label.指南": {
+  "link.item.label.Guide": {
    "message": "Guide",
-    "description": "The label of footer link with label=指南 linking to /"
+    "description": "The label of footer link with label=Guide linking to /"
  },
-  "link.item.label.参与我们": {
+  "link.item.label.Join Us": {
    "message": "Join Us",
-    "description": "The label of footer link with label=参与我们 linking to /joinus/quick-start"
+    "description": "The label of footer link with label=Join Us linking to /joinus/quick-start"
  },
-  "link.item.label.部署": {
+  "link.item.label.Deploy": {
    "message": "Deploy",
-    "description": "The label of footer link with label=部署 linking to /install"
+    "description": "The label of footer link with label=Deploy linking to /install"
  },
-  "link.item.label.支持 RSSHub": {
+  "link.item.label.Support RSSHub": {
    "message": "Support RSSHub",
-    "description": "The label of footer link with label=支持 RSSHub linking to /support"
+    "description": "The label of footer link with label=Support RSSHub linking to /support"
  },
  "link.item.label.GitHub": {
    "message": "GitHub",
@ -39,17 +39,17 @@
    "message": "Telegram Channel",
    "description": "The label of footer link with label=Telegram Channel linking to https://t.me/awesomeRSSHub"
  },
-  "link.item.label.关于作者 DIYgod": {
+  "link.item.label.About DIYgod": {
    "message": "About DIYgod",
-    "description": "The label of footer link with label=关于作者 DIYgod linking to https://diygod.cc"
+    "description": "The label of footer link with label=About DIYgod linking to https://diygod.cc"
  },
-  "link.item.label.RSSHub Radar - 快速发现和订阅 RSS": {
+  "link.item.label.RSSHub Radar - Discover and subscribe to RSS quickly": {
    "message": "RSSHub Radar - Discover and subscribe to RSS quickly",
-    "description": "The label of footer link with label=RSSHub Radar - 快速发现和订阅 RSS linking to https://github.com/DIYgod/RSSHub-Radar"
+    "description": "The label of footer link with label=RSSHub Radar - Discover and subscribe to RSS quickly linking to https://github.com/DIYgod/RSSHub-Radar"
  },
-  "link.item.label.xLog - 书写在区块链上的开源创作社区": {
+  "link.item.label.xLog - Open source creation community written on the blockchain": {
    "message": "xLog - Open source creation community written on the blockchain",
-    "description": "The label of footer link with label=xLog - 书写在区块链上的开源创作社区 linking to https://xlog.app"
+    "description": "The label of footer link with label=xLog - Open source creation community written on the blockchain linking to https://xlog.app"
  },
  "copyright": {
    "message": "Copyright © 2023 RSSHub.",
--- a/website/i18n/en/docusaurus-theme-classic/navbar.json
+++ b/website/i18n/en/docusaurus-theme-classic/navbar.json
@ -7,25 +7,25 @@
    "message": "RSSHub",
    "description": "The alt text of navbar logo"
  },
-  "item.label.指南": {
+  "item.label.Guide": {
    "message": "Guide",
-    "description": "Navbar item with label 指南"
+    "description": "Navbar item with label Guide"
  },
-  "item.label.路由": {
+  "item.label.Routes": {
    "message": "Routes",
-    "description": "Navbar item with label 路由"
+    "description": "Navbar item with label Routes"
  },
-  "item.label.参与我们": {
-    "message": "Join us",
-    "description": "Navbar item with label 参与我们"
+  "item.label.Join Us": {
+    "message": "Join Us",
+    "description": "Navbar item with label Join Us"
  },
-  "item.label.部署": {
+  "item.label.Deploy": {
    "message": "Deploy",
-    "description": "Navbar item with label 部署"
+    "description": "Navbar item with label Deploy"
  },
-  "item.label.支持 RSSHub": {
+  "item.label.Support RSSHub": {
    "message": "Support RSSHub",
-    "description": "Navbar item with label 支持 RSSHub"
+    "description": "Navbar item with label Support RSSHub"
  },
  "item.label.GitHub": {
    "message": "GitHub",
--- a/website/i18n/zh/code.json
+++ b/website/i18n/zh/code.json
@ -1 +1,59 @@
-{}
+{
+  "badge.supportBT": {
+    "message": "支持 BT"
+  },
+  "badge.supportPodcast": {
+    "message": "支持播客"
+  },
+  "badge.supportSciHub": {
+    "message": "支持 Sci-Hub"
+  },
+  "badge.puppeteer": {
+    "message": "依赖 Puppeteer"
+  },
+  "badge.anticrawler": {
+    "message": "反爬严格"
+  },
+  "badge.selfhost": {
+    "message": "仅支持自建"
+  },
+  "badge.radar": {
+    "message": "支持浏览器扩展"
+  },
+  "badge.rssbud": {
+    "message": "支持 RSSBud"
+  },
+  "route.author": {
+    "message": "作者："
+  },
+  "route.example": {
+    "message": "举例："
+  },
+  "route.path": {
+    "message": "路由："
+  },
+  "route.parameter": {
+    "message": "参数："
+  },
+  "route.parameter.optional": {
+    "message": "可选"
+  },
+  "route.parameter.zeroOrMore": {
+    "message": "零个或多个"
+  },
+  "route.parameter.oneOrMore": {
+    "message": "一个或多个"
+  },
+  "route.parameter.required": {
+    "message": "必选"
+  },
+  "route.parameter.na": {
+    "message": "参数：无"
+  },
+  "route.comma": {
+    "message": "，"
+  },
+  "route.dash": {
+    "message": " — "
+  }
+}
--- a/website/i18n/zh/docusaurus-plugin-content-docs/current.json
+++ b/website/i18n/zh/docusaurus-plugin-content-docs/current.json
@ -4,39 +4,39 @@
    "description": "The label for version current"
  },
  "sidebar.tutorialSidebar.category.joinus": {
-    "message": "joinus",
+    "message": "参与我们",
    "description": "The label for category joinus in sidebar tutorialSidebar"
  },
-  "sidebar.tutorialSidebar.category.提交新的 RSSHub 规则": {
+  "sidebar.tutorialSidebar.category.New RSSHub Rules": {
    "message": "提交新的 RSSHub 规则",
-    "description": "The label for category 提交新的 RSSHub 规则 in sidebar tutorialSidebar"
+    "description": "The label for category New RSSHub Rules in sidebar tutorialSidebar"
  },
-  "sidebar.tutorialSidebar.category.高级用法": {
+  "sidebar.tutorialSidebar.category.Advanced": {
    "message": "高级用法",
-    "description": "The label for category 高级用法 in sidebar tutorialSidebar"
+    "description": "The label for category Advanced in sidebar tutorialSidebar"
  },
  "sidebar.tutorialSidebar.category.routes": {
-    "message": "routes",
+    "message": "路由",
    "description": "The label for category routes in sidebar tutorialSidebar"
  },
-  "sidebar.guideSidebar.category.指南": {
+  "sidebar.guideSidebar.category.Guide": {
    "message": "指南",
-    "description": "The label for category 指南 in sidebar guideSidebar"
+    "description": "The label for category Guide in sidebar guideSidebar"
  },
-  "sidebar.guideSidebar.category.路由": {
+  "sidebar.guideSidebar.category.Routes": {
    "message": "路由",
-    "description": "The label for category 路由 in sidebar guideSidebar"
+    "description": "The label for category Routes in sidebar guideSidebar"
  },
-  "sidebar.guideSidebar.category.路由.link.generated-index.description": {
+  "sidebar.guideSidebar.category.Routes.link.generated-index.description": {
    "message": "路由是 RSSHub 访问路径，每个路由后面包含一段 RSSHub 规则，它告诉 RSSHub 如何从网站中提取内容并生成 RSS 订阅。",
-    "description": "The generated-index page description for category 路由 in sidebar guideSidebar"
+    "description": "The generated-index page description for category Routes in sidebar guideSidebar"
  },
-  "sidebar.joinusSidebar.category.提交新的 RSSHub 规则": {
+  "sidebar.joinusSidebar.category.New RSSHub Rules": {
    "message": "提交新的 RSSHub 规则",
-    "description": "The label for category 提交新的 RSSHub 规则 in sidebar joinusSidebar"
+    "description": "The label for category New RSSHub Rules in sidebar joinusSidebar"
  },
-  "sidebar.joinusSidebar.category.高级用法": {
+  "sidebar.joinusSidebar.category.Advanced": {
    "message": "高级用法",
-    "description": "The label for category 高级用法 in sidebar joinusSidebar"
+    "description": "The label for category Advanced in sidebar joinusSidebar"
  }
 }
--- a/website/i18n/zh/docusaurus-theme-classic/footer.json
+++ b/website/i18n/zh/docusaurus-theme-classic/footer.json
@ -11,21 +11,21 @@
    "message": "More",
    "description": "The title of the footer links column with title=More in the footer"
  },
-  "link.item.label.指南": {
+  "link.item.label.Guide": {
    "message": "指南",
-    "description": "The label of footer link with label=指南 linking to /"
+    "description": "The label of footer link with label=Guide linking to /"
  },
-  "link.item.label.参与我们": {
+  "link.item.label.Join Us": {
    "message": "参与我们",
-    "description": "The label of footer link with label=参与我们 linking to /joinus/quick-start"
+    "description": "The label of footer link with label=Join Us linking to /joinus/quick-start"
  },
-  "link.item.label.部署": {
+  "link.item.label.Deploy": {
    "message": "部署",
-    "description": "The label of footer link with label=部署 linking to /install"
+    "description": "The label of footer link with label=Deploy linking to /install"
  },
-  "link.item.label.支持 RSSHub": {
+  "link.item.label.Support RSSHub": {
    "message": "支持 RSSHub",
-    "description": "The label of footer link with label=支持 RSSHub linking to /support"
+    "description": "The label of footer link with label=Support RSSHub linking to /support"
  },
  "link.item.label.GitHub": {
    "message": "GitHub",
@ -39,17 +39,17 @@
    "message": "Telegram Channel",
    "description": "The label of footer link with label=Telegram Channel linking to https://t.me/awesomeRSSHub"
  },
-  "link.item.label.关于作者 DIYgod": {
+  "link.item.label.About DIYgod": {
    "message": "关于作者 DIYgod",
-    "description": "The label of footer link with label=关于作者 DIYgod linking to https://diygod.cc"
+    "description": "The label of footer link with label=About DIYgod linking to https://diygod.cc"
  },
-  "link.item.label.RSSHub Radar - 快速发现和订阅 RSS": {
+  "link.item.label.RSSHub Radar - Discover and subscribe to RSS quickly": {
    "message": "RSSHub Radar - 快速发现和订阅 RSS",
-    "description": "The label of footer link with label=RSSHub Radar - 快速发现和订阅 RSS linking to https://github.com/DIYgod/RSSHub-Radar"
+    "description": "The label of footer link with label=RSSHub Radar - Discover and subscribe to RSS quickly linking to https://github.com/DIYgod/RSSHub-Radar"
  },
-  "link.item.label.xLog - 书写在区块链上的开源创作社区": {
+  "link.item.label.xLog - Open source creation community written on the blockchain": {
    "message": "xLog - 书写在区块链上的开源创作社区",
-    "description": "The label of footer link with label=xLog - 书写在区块链上的开源创作社区 linking to https://xlog.app"
+    "description": "The label of footer link with label=xLog - Open source creation community written on the blockchain linking to https://xlog.app"
  },
  "copyright": {
    "message": "Copyright © 2023 RSSHub.",
--- a/website/i18n/zh/docusaurus-theme-classic/navbar.json
+++ b/website/i18n/zh/docusaurus-theme-classic/navbar.json
@ -7,25 +7,25 @@
    "message": "RSSHub",
    "description": "The alt text of navbar logo"
  },
-  "item.label.指南": {
+  "item.label.Guide": {
    "message": "指南",
-    "description": "Navbar item with label 指南"
+    "description": "Navbar item with label Guide"
  },
-  "item.label.路由": {
+  "item.label.Routes": {
    "message": "路由",
-    "description": "Navbar item with label 路由"
+    "description": "Navbar item with label Routes"
  },
-  "item.label.参与我们": {
+  "item.label.Join Us": {
    "message": "参与我们",
-    "description": "Navbar item with label 参与我们"
+    "description": "Navbar item with label Join Us"
  },
-  "item.label.部署": {
+  "item.label.Deploy": {
    "message": "部署",
-    "description": "Navbar item with label 部署"
+    "description": "Navbar item with label Deploy"
  },
-  "item.label.支持 RSSHub": {
+  "item.label.Support RSSHub": {
    "message": "支持 RSSHub",
-    "description": "Navbar item with label 支持 RSSHub"
+    "description": "Navbar item with label Support RSSHub"
  },
  "item.label.GitHub": {
    "message": "GitHub",
--- a/website/package.json
+++ b/website/package.json
@ -5,7 +5,7 @@
  "scripts": {
    "docusaurus": "docusaurus",
    "start": "docusaurus start",
-    "start:en": "docusaurus start --locale en",
+    "start:zh": "docusaurus start --locale zh",
    "build": "docusaurus build",
    "swizzle": "docusaurus swizzle",
    "deploy": "docusaurus deploy",
--- a/website/sidebars.js
+++ b/website/sidebars.js
@ -31,18 +31,18 @@ const sidebars = {
        },
        {
            type: 'category',
-            label: '指南',
+            label: 'Guide',
            items: ['README', 'usage', 'faq', 'parameter', 'api'],
            collapsible: true,
            collapsed: true,
        },
        {
            type: 'category',
-            label: '路由',
+            label: 'Routes',
            link: {
                type: 'generated-index',
                slug: '/routes',
-                description: '路由是 RSSHub 访问路径，每个路由后面包含一段 RSSHub 规则，它告诉 RSSHub 如何从网站中提取内容并生成 RSS 订阅。',
+                description: 'Routes are the access paths of RSSHub. Each route contains a RSSHub rule, which tells RSSHub how to extract content from the website and generate RSS subscription.',
            },
            items: [
                'routes/social-media',
--- a/website/src/components/Badge.tsx
+++ b/website/src/components/Badge.tsx
@ -1,13 +1,13 @@
 import React from 'react';

 export default function Badge({
-  text = '',
  type = 'tip',
+  children = '',
 }: {
-  text: string;
  type: string;
+  children: React.ReactNode;
 }): JSX.Element {
  return (
-    <span className={`badge ${type}`}>{text}</span>
-  )
+    <span className={`badge ${type}`}>{children}</span>
+  );
 }
--- a/website/src/components/Route.tsx
+++ b/website/src/components/Route.tsx
@ -1,6 +1,7 @@
 import React from 'react';
 import MarkdownIt from 'markdown-it';
 import Badge from './Badge';
+import Translate from '@docusaurus/Translate';

 export default function Route({
  author = 'DIYgod',
@ -44,68 +45,67 @@ export default function Route({
    return (
        <div className="routeBlock" id={path}>
            <p className="badges">
-                {supportBT && <Badge text="Support BT" type="tip" />}
-                {supportPodcast && <Badge text="Support Podcast" type="tip" />}
-                {supportScihub && <Badge text="Support Sci-Hub" type="tip" />}
-                {puppeteer && <Badge text="Rely on Puppeteer" type="warn" />}
+                {supportBT && <Badge type="tip"><Translate id="badge.supportBT" /></Badge>}
+                {supportPodcast && <Badge type="tip"><Translate id="badge.supportPodcast" /></Badge>}
+                {supportScihub && <Badge type="tip"><Translate id="badge.supportSciHub" /></Badge>}
+                {puppeteer && <Badge type="warn"><Translate id="badge.puppeteer" /></Badge>}
                {anticrawler && (
                    <a target="_blank" href="/faq.html">
-                        <Badge text="Strict anti-crawler policy" type="warn" />
+                        <Badge type="warn"><Translate id="badge.anticrawler" /></Badge>
                    </a>
                )}
                {selfhost && (
                    <a target="_blank" href="/install/">
-                        <Badge text="Self-host only" type="warn" />
+                        <Badge type="warn"><Translate id="badge.selfhost" /></Badge>
                    </a>
                )}
                {radar && (
                    <a target="_blank" href="https://github.com/DIYgod/RSSHub-Radar">
-                        <Badge text="Support browser extension" type="tip" />
+                        <Badge type="tip"><Translate id="badge.radar" /></Badge>
                    </a>
                )}
                {rssbud && (
                    <a target="_blank" href="https://github.com/Cay-Zhang/RSSBud">
-                        <Badge text="Support RSSBud" type="tip" />
+                        <Badge type="tip"><Translate id="badge.rssbud" /></Badge>
                    </a>
                )}
            </p>
            <p className="author">
-                Author:{' '}
+                <Translate id="route.author" />
                {author.split(' ').map((uid) => (
                    <a href={`https://github.com/${uid}`} target="_blank" key={uid}>
-                        {' '}
-                        @ {uid}{' '}
+                        @{uid}{' '}
                    </a>
                ))}
            </p>
            <p className="example">
-                <span>Example:</span>{' '}
+                <span><Translate id="route.example" /></span>
                <a href={demoUrl} target="_blank">
                    {demoUrl}
                </a>
            </p>
            <p className="path">
-                Route: <code>{path}</code>
+                <Translate id="route.path" /><code>{path}</code>
            </p>
            {paramMatch ? (
                <div>
-                    <p>Parameters:</p>
+                    <p><Translate id="route.parameter" /></p>
                    <ul>
                        {paramMatch.map((item, index) => (
                            <li className="params" key={index}>
-                                <code>{item.replace(/:|\?|\+|\*/g, '')}</code>,
+                                <code>{item.replace(/:|\?|\+|\*/g, '')}</code><Translate id="route.comma" />
                                {{
-                                    '?': 'optional',
-                                    '*': 'zero or more',
-                                    '+': 'one or more',
-                                }[item[item.length - 1]] || 'required'}
-                                -<span dangerouslySetInnerHTML={{ __html: renderMarkdown(paramsDesc[index]) }}></span>
+                                    '?': <Translate id="route.parameter.optional" />,
+                                    '*': <Translate id="route.parameter.zeroOrMore" />,
+                                    '+': <Translate id="route.parameter.oneOrMore" />,
+                                }[item[item.length - 1]] || <Translate id="route.parameter.required" /> }
+                                <Translate id="route.dash" /><span dangerouslySetInnerHTML={{ __html: renderMarkdown(paramsDesc[index]) }}></span>
                            </li>
                        ))}
                    </ul>
                </div>
            ) : (
-                <p>Parameters: N/A</p>
+                <p><Translate id="route.parameter.na" /></p>
            )}
            {children}
        </div>