From 5622de0635cff2d7145667234f7a5305669c3480 Mon Sep 17 00:00:00 2001 From: aednikanov Date: Thu, 19 Sep 2024 13:17:33 +0300 Subject: [PATCH] feat(docs): changed sidebar labels to the right ones --- docusaurus.config.js | 4 +- package.json | 2 +- src/lib/constants.ts | 67 ++++++++++++++++++++++++++++++++++ src/pages/CustomPage/index.tsx | 28 +++++++++----- yarn.lock | 16 ++++---- 5 files changed, 96 insertions(+), 21 deletions(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index 585f70a17c..75c73478a7 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -3,7 +3,7 @@ require("dotenv").config(); const { fetchAndGenerateSidebarItems } = require("./src/helpers/index.ts"); -const capitalize = require("lodash.capitalize"); +const upperFirst = require("lodash.upperfirst"); const { themes } = require("prism-react-renderer"); const codeTheme = themes.dracula; const remarkCodesandbox = require("remark-codesandbox"); @@ -134,7 +134,7 @@ const config = { const dynamicSidebarItems = await fetchAndGenerateSidebarItems(networkName); config.customFields.dynamicData = dynamicSidebarItems; const updatedItems = sidebarItems.map(item => { - if (item?.label === capitalize(networkName) && item?.items) { + if (item?.label === upperFirst(networkName) && item?.items) { item.items = [...item.items, ...dynamicSidebarItems] } return item; diff --git a/package.json b/package.json index ba12b2378f..411f38d53d 100644 --- a/package.json +++ b/package.json @@ -48,9 +48,9 @@ "dotenv": "^16.4.5", "js-cookie": "^3.0.5", "launchdarkly-js-client-sdk": "^3.3.0", - "lodash.capitalize": "^4.2.1", "lodash.debounce": "^4.0.8", "lodash.isobject": "^3.0.2", + "lodash.upperfirst": "^4.3.1", "node-polyfill-webpack-plugin": "^2.0.1", "prettier": "^3.0.0", "prism-react-renderer": "^2.1.0", diff --git a/src/lib/constants.ts b/src/lib/constants.ts index 0456a8a33a..71a84d21cc 100644 --- a/src/lib/constants.ts +++ b/src/lib/constants.ts @@ -456,3 +456,70 @@ export enum NETWORK_NAMES { linea = "linea", metamask = "metamask", } + +export const lineaSidebarNames = [ + { + old: "get-started", + new: "Get Started" + }, + { + old: "how-to", + new: "How to" + }, + { + old: "use-ipfs", + new: "Use IPFS" + }, + { + old: "access-ipfs-content", + new: "Access IPFS content" + }, + { + old: "send-a-transaction", + new: "Send transactions" + }, + { + old: "use-infura-as-a-reverse-proxy", + new: "Use Infura as a reverse proxy" + }, + { + old: "layer-2-networks", + new: "Layer 2 networks" + }, + { + old: "json-rpc-methods", + new: "JSON-RPC APIs" + }, + { + old: "avalanche-c-chain", + new: "Avalanche (C-Chain)" + }, + { + old: "bnb-smart-chain", + new: "BNB Smart Chain" + }, + { + old: "gas-api", + new: "Gas API" + }, + { + old: "ipfs", + new: "IPFS" + }, + { + old: "opbnb", + new: "opBNB" + }, + { + old: "polygon-pos", + new: "Polygon PoS" + }, + { + old: "zksync", + new: "ZKsync Era" + }, + { + old: "http-api-methods", + new: "HTTP API methods" + }, +] diff --git a/src/pages/CustomPage/index.tsx b/src/pages/CustomPage/index.tsx index 9614769ce2..d0d70179db 100644 --- a/src/pages/CustomPage/index.tsx +++ b/src/pages/CustomPage/index.tsx @@ -5,7 +5,16 @@ import React, { useEffect, useState } from "react"; import DocSidebar from '@theme/DocSidebar'; import styles from "@site/src/theme/Layout/styles.module.css" import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import * as capitalize from "lodash.capitalize" +import * as upperFirst from "lodash.upperfirst" +import { lineaSidebarNames } from "@site/src/lib/constants"; + +const formatMenuLabel = (label) => { + const menuItem = lineaSidebarNames.find(name => name.old === label); + if (menuItem) { + return menuItem.new; + } + return label; +} function generateSidebarItems(docs) { const categories = {}; @@ -15,7 +24,7 @@ function generateSidebarItems(docs) { categories['Introduction'] = { type: 'link', href: '/services', - label: capitalize(doc.frontMatter?.sidebar_label || doc.title), + label: upperFirst(doc.frontMatter?.sidebar_label || doc.title), }; return; } @@ -23,14 +32,13 @@ function generateSidebarItems(docs) { const pathParts = doc.sourceDirName.split('/'); let currentCategory = categories; let isIndexPage = doc.id.endsWith('/index'); - - pathParts.forEach((part, index) => { + pathParts.map(pathPart => formatMenuLabel(pathPart)).forEach((part, index) => { if (!currentCategory[part]) { if (isIndexPage && index === pathParts.length - 2) { currentCategory[part] = { type: 'category', - label: capitalize(doc.frontMatter?.sidebar_label || doc.frontMatter?.title || part), - collapsed: true, + label: upperFirst(doc.frontMatter?.sidebar_label || doc.frontMatter?.title || part), + collapsed: false, collapsible: true, link: { type: 'generated-index', @@ -41,8 +49,8 @@ function generateSidebarItems(docs) { } else { currentCategory[part] = { type: 'category', - label: capitalize(part), - collapsed: true, + label: upperFirst(part), + collapsed: part !== "get-started", collapsible: true, items: [] }; @@ -52,7 +60,7 @@ function generateSidebarItems(docs) { if (index === pathParts.length - 1 && !isIndexPage) { currentCategory[part].items.push({ type: 'link', - label: capitalize(doc.frontMatter?.title || doc.title), + label: doc.frontMatter?.title || doc.title, href: `/services/${doc.id.replace(/\/index$/, '')}`, sidebar_position: doc.frontMatter?.sidebar_position || Number.MAX_SAFE_INTEGER }); @@ -88,7 +96,7 @@ const CustomPage = (props) => { return { ...item, items: item.items.map(referenceItem => { - if (referenceItem?.label === capitalize(NETWORK_NAMES.linea) && referenceItem?.items) { + if (referenceItem?.label === upperFirst(NETWORK_NAMES.linea) && referenceItem?.items) { return { ...referenceItem, items: [...referenceItem.items, ...siteConfig.customFields.dynamicData] }; } return referenceItem; diff --git a/yarn.lock b/yarn.lock index 01b98151b6..4291f63b11 100644 --- a/yarn.lock +++ b/yarn.lock @@ -12569,13 +12569,6 @@ __metadata: languageName: node linkType: hard -"lodash.capitalize@npm:^4.2.1": - version: 4.2.1 - resolution: "lodash.capitalize@npm:4.2.1" - checksum: d9195f31d48c105206f1099946d8bbc8ab71435bc1c8708296992a31a992bb901baf120fdcadd773098ac96e62a79e6b023ee7d26a2deb0d6c6aada930e6ad0a - languageName: node - linkType: hard - "lodash.debounce@npm:^4.0.8": version: 4.0.8 resolution: "lodash.debounce@npm:4.0.8" @@ -12618,6 +12611,13 @@ __metadata: languageName: node linkType: hard +"lodash.upperfirst@npm:^4.3.1": + version: 4.3.1 + resolution: "lodash.upperfirst@npm:4.3.1" + checksum: cadec6955900afe1928cc60cdc4923a79c2ef991e42665419cc81630ed9b4f952a1093b222e0141ab31cbc4dba549f97ec28ff67929d71e01861c97188a5fa83 + languageName: node + linkType: hard + "lodash@npm:^4.17.12, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4, lodash@npm:^4.17.5": version: 4.17.21 resolution: "lodash@npm:4.17.21" @@ -13463,9 +13463,9 @@ __metadata: eslint-plugin-react: ^7.34.2 js-cookie: ^3.0.5 launchdarkly-js-client-sdk: ^3.3.0 - lodash.capitalize: ^4.2.1 lodash.debounce: ^4.0.8 lodash.isobject: ^3.0.2 + lodash.upperfirst: ^4.3.1 node-polyfill-webpack-plugin: ^2.0.1 prettier: ^3.0.0 prism-react-renderer: ^2.1.0