diff --git a/packages/ui/app/package.json b/packages/ui/app/package.json index 425de8a9a1..a8a3b39e9a 100644 --- a/packages/ui/app/package.json +++ b/packages/ui/app/package.json @@ -128,6 +128,7 @@ "unist-util-visit": "^5.0.0", "url-join": "5.0.0", "use-memo-one": "^1.1.3", + "uuid": "^9.0.0", "vfile": "^6.0.1", "zod": "^3.23.8" }, @@ -161,6 +162,7 @@ "@types/react-dom": "^18.2.18", "@types/react-test-renderer": "^18.0.7", "@types/tinycolor2": "^1.4.6", + "@types/uuid": "^9.0.1", "@vitejs/plugin-react": "^4.2.1", "autoprefixer": "^10.4.16", "chromatic": "^11.3.0", diff --git a/packages/ui/app/src/mdx/components/accordion/AccordionGroup.tsx b/packages/ui/app/src/mdx/components/accordion/AccordionGroup.tsx index 1aa47d958d..d698dcf61d 100644 --- a/packages/ui/app/src/mdx/components/accordion/AccordionGroup.tsx +++ b/packages/ui/app/src/mdx/components/accordion/AccordionGroup.tsx @@ -4,6 +4,7 @@ import { NavArrowRight } from "iconoir-react"; import { useAtom } from "jotai"; import { NextRouter } from "next/router"; import { FC, ReactNode, useCallback, useEffect, useState } from "react"; +import { v4 } from "uuid"; import { ANCHOR_ATOM } from "../../../atoms"; export interface AccordionItemProps { @@ -16,19 +17,21 @@ export interface AccordionGroupProps { items: AccordionItemProps[]; router: NextRouter; toc?: boolean; + key: string; } export const AccordionGroup: FC = ({ items = [], toc: parentToc = true }) => { + const [key, _setKey] = useState(v4()); const [activeTabs, setActiveTabs] = useState([]); const [anchor, setAnchor] = useAtom(ANCHOR_ATOM); useEffect(() => { if (anchor != null) { - const anchorTab = items.findIndex((tab) => slug(tab.title) === anchor); + const anchorTab = items.findIndex((tab) => slug(`${tab.title}-${key}`) === anchor); if (anchorTab >= 0) { setActiveTabs((prev) => (prev.includes(anchorTab.toString()) ? prev : [...prev, anchorTab.toString()])); } } - }, [anchor, items]); + }, [anchor, items, key]); const handleValueChange = useCallback( (nextActiveTabs: string[]) => { @@ -37,13 +40,13 @@ export const AccordionGroup: FC = ({ items = [], toc: paren if (added[0] != null) { const addedItem = items[parseInt(added[0])]; if (addedItem != null) { - setAnchor(slug(addedItem.title)); + setAnchor(slug(`${addedItem.title}-${key}`)); } } return nextActiveTabs; }); }, - [items, setAnchor], + [items, setAnchor, key], ); return ( diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 513d81a516..d3bb16bbd0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1286,6 +1286,9 @@ importers: use-memo-one: specifier: ^1.1.3 version: 1.1.3(react@18.3.1) + uuid: + specifier: ^9.0.0 + version: 9.0.1 vfile: specifier: ^6.0.1 version: 6.0.1 @@ -1380,6 +1383,9 @@ importers: '@types/tinycolor2': specifier: ^1.4.6 version: 1.4.6 + '@types/uuid': + specifier: ^9.0.1 + version: 9.0.8 '@vitejs/plugin-react': specifier: ^4.2.1 version: 4.2.1(vite@5.2.11(@types/node@18.19.33)(less@4.2.0)(sass@1.77.0)(stylus@0.62.0)(terser@5.31.0)) @@ -16407,10 +16413,10 @@ snapshots: '@aws-crypto/sha1-browser': 3.0.0 '@aws-crypto/sha256-browser': 3.0.0 '@aws-crypto/sha256-js': 3.0.0 - '@aws-sdk/client-sso-oidc': 3.572.0 - '@aws-sdk/client-sts': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0) + '@aws-sdk/client-sso-oidc': 3.572.0(@aws-sdk/client-sts@3.572.0) + '@aws-sdk/client-sts': 3.572.0 '@aws-sdk/core': 3.572.0 - '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)) + '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0(@aws-sdk/client-sts@3.572.0))(@aws-sdk/client-sts@3.572.0) '@aws-sdk/middleware-bucket-endpoint': 3.568.0 '@aws-sdk/middleware-expect-continue': 3.572.0 '@aws-sdk/middleware-flexible-checksums': 3.572.0 @@ -16471,7 +16477,7 @@ snapshots: '@aws-crypto/sha256-js': 3.0.0 '@aws-sdk/client-sts': 3.572.0 '@aws-sdk/core': 3.572.0 - '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)) + '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0) '@aws-sdk/middleware-host-header': 3.567.0 '@aws-sdk/middleware-logger': 3.568.0 '@aws-sdk/middleware-recursion-detection': 3.567.0 @@ -16605,52 +16611,7 @@ snapshots: '@aws-crypto/sha256-js': 3.0.0 '@aws-sdk/client-sso-oidc': 3.572.0 '@aws-sdk/core': 3.572.0 - '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0) - '@aws-sdk/middleware-host-header': 3.567.0 - '@aws-sdk/middleware-logger': 3.568.0 - '@aws-sdk/middleware-recursion-detection': 3.567.0 - '@aws-sdk/middleware-user-agent': 3.572.0 - '@aws-sdk/region-config-resolver': 3.572.0 - '@aws-sdk/types': 3.567.0 - '@aws-sdk/util-endpoints': 3.572.0 - '@aws-sdk/util-user-agent-browser': 3.567.0 - '@aws-sdk/util-user-agent-node': 3.568.0 - '@smithy/config-resolver': 2.2.0 - '@smithy/core': 1.4.2 - '@smithy/fetch-http-handler': 2.5.0 - '@smithy/hash-node': 2.2.0 - '@smithy/invalid-dependency': 2.2.0 - '@smithy/middleware-content-length': 2.2.0 - '@smithy/middleware-endpoint': 2.5.1 - '@smithy/middleware-retry': 2.3.1 - '@smithy/middleware-serde': 2.3.0 - '@smithy/middleware-stack': 2.2.0 - '@smithy/node-config-provider': 2.3.0 - '@smithy/node-http-handler': 2.5.0 - '@smithy/protocol-http': 3.3.0 - '@smithy/smithy-client': 2.5.1 - '@smithy/types': 2.12.0 - '@smithy/url-parser': 2.2.0 - '@smithy/util-base64': 2.3.0 - '@smithy/util-body-length-browser': 2.2.0 - '@smithy/util-body-length-node': 2.3.0 - '@smithy/util-defaults-mode-browser': 2.2.1 - '@smithy/util-defaults-mode-node': 2.3.1 - '@smithy/util-endpoints': 1.2.0 - '@smithy/util-middleware': 2.2.0 - '@smithy/util-retry': 2.2.0 - '@smithy/util-utf8': 2.3.0 - tslib: 2.6.2 - transitivePeerDependencies: - - aws-crt - - '@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)': - dependencies: - '@aws-crypto/sha256-browser': 3.0.0 - '@aws-crypto/sha256-js': 3.0.0 - '@aws-sdk/client-sso-oidc': 3.572.0 - '@aws-sdk/core': 3.572.0 - '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)) + '@aws-sdk/credential-provider-node': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0(@aws-sdk/client-sts@3.572.0))(@aws-sdk/client-sts@3.572.0) '@aws-sdk/middleware-host-header': 3.567.0 '@aws-sdk/middleware-logger': 3.568.0 '@aws-sdk/middleware-recursion-detection': 3.567.0 @@ -16687,7 +16648,6 @@ snapshots: '@smithy/util-utf8': 2.3.0 tslib: 2.6.2 transitivePeerDependencies: - - '@aws-sdk/client-sso-oidc' - aws-crt '@aws-sdk/core@3.572.0': @@ -16736,23 +16696,6 @@ snapshots: - '@aws-sdk/client-sso-oidc' - aws-crt - '@aws-sdk/credential-provider-ini@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0))': - dependencies: - '@aws-sdk/client-sts': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0) - '@aws-sdk/credential-provider-env': 3.568.0 - '@aws-sdk/credential-provider-process': 3.572.0 - '@aws-sdk/credential-provider-sso': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0) - '@aws-sdk/credential-provider-web-identity': 3.568.0(@aws-sdk/client-sts@3.572.0) - '@aws-sdk/types': 3.567.0 - '@smithy/credential-provider-imds': 2.3.0 - '@smithy/property-provider': 2.2.0 - '@smithy/shared-ini-file-loader': 2.4.0 - '@smithy/types': 2.12.0 - tslib: 2.6.2 - transitivePeerDependencies: - - '@aws-sdk/client-sso-oidc' - - aws-crt - '@aws-sdk/credential-provider-ini@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0)': dependencies: '@aws-sdk/client-sts': 3.572.0 @@ -16789,25 +16732,6 @@ snapshots: - '@aws-sdk/client-sts' - aws-crt - '@aws-sdk/credential-provider-node@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0))': - dependencies: - '@aws-sdk/credential-provider-env': 3.568.0 - '@aws-sdk/credential-provider-http': 3.568.0 - '@aws-sdk/credential-provider-ini': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)) - '@aws-sdk/credential-provider-process': 3.572.0 - '@aws-sdk/credential-provider-sso': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0) - '@aws-sdk/credential-provider-web-identity': 3.568.0(@aws-sdk/client-sts@3.572.0) - '@aws-sdk/types': 3.567.0 - '@smithy/credential-provider-imds': 2.3.0 - '@smithy/property-provider': 2.2.0 - '@smithy/shared-ini-file-loader': 2.4.0 - '@smithy/types': 2.12.0 - tslib: 2.6.2 - transitivePeerDependencies: - - '@aws-sdk/client-sso-oidc' - - '@aws-sdk/client-sts' - - aws-crt - '@aws-sdk/credential-provider-node@3.572.0(@aws-sdk/client-sso-oidc@3.572.0)(@aws-sdk/client-sts@3.572.0)': dependencies: '@aws-sdk/credential-provider-env': 3.568.0 @@ -16863,7 +16787,7 @@ snapshots: '@aws-sdk/credential-provider-web-identity@3.568.0(@aws-sdk/client-sts@3.572.0)': dependencies: - '@aws-sdk/client-sts': 3.572.0(@aws-sdk/client-sso-oidc@3.572.0) + '@aws-sdk/client-sts': 3.572.0 '@aws-sdk/types': 3.567.0 '@smithy/property-provider': 2.2.0 '@smithy/types': 2.12.0