diff --git a/src/components/CodeBlock/index.tsx b/src/components/CodeBlock/index.tsx index 4674039e84b3..8c2ff090bddc 100644 --- a/src/components/CodeBlock/index.tsx +++ b/src/components/CodeBlock/index.tsx @@ -223,6 +223,10 @@ export const CodeBlock = ({ React.useEffect(() => { if (posthog?.isFeatureEnabled('direct-to-eu-cloud')) { setRegion('eu') + const euIndex = languages.findIndex((lang) => lang.file?.toLowerCase() === 'eu') + if (euIndex >= 0) { + setSelectedIndex(euIndex) + } } }, [posthog]) diff --git a/src/components/Tab/index.tsx b/src/components/Tab/index.tsx index 576513dcbfaf..c2311baf7866 100644 --- a/src/components/Tab/index.tsx +++ b/src/components/Tab/index.tsx @@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react' import { Tab as HeadlessTab } from '@headlessui/react' import { classNames } from 'lib/utils' import Slider from 'components/Slider' +import useCloud from 'hooks/useCloud' export const Tab: React.FC & { Group: typeof HeadlessTab.Group @@ -32,7 +33,18 @@ export const Tab: React.FC & { } const TabGroup: typeof HeadlessTab.Group = ({ children, tabs }) => { - const [selectedIndex, setSelectedIndex] = useState(0) + const cloud = useCloud() + + const getInitialIndex = () => { + if (typeof window !== 'undefined' && tabs?.length > 0) { + const params = new URLSearchParams(window.location.search) + const urlIndex = tabs.indexOf(params.get('tab')) + if (urlIndex >= 0) return urlIndex + } + return 0 + } + + const [selectedIndex, setSelectedIndex] = useState(getInitialIndex) const hasTabs = tabs?.length > 0 const handleChange = (index: number) => { @@ -45,12 +57,20 @@ const TabGroup: typeof HeadlessTab.Group = ({ children, tabs }) => { } useEffect(() => { + console.log('Cloud value in TabGroup:', cloud) if (hasTabs && typeof window !== 'undefined') { const params = new URLSearchParams(window.location.search) const tabIndex = tabs.indexOf(params.get('tab')) - if (tabIndex >= 0) setSelectedIndex(tabIndex) + if (tabIndex >= 0) { + setSelectedIndex(tabIndex) + } else if (cloud) { + const cloudIndex = tabs.findIndex((tab) => tab?.toLowerCase() === cloud.toLowerCase()) + if (cloudIndex >= 0) { + setSelectedIndex(cloudIndex) + } + } } - }, []) + }, [cloud]) return (