fix(playground-tabs): show arrows on long list (#3009)

ionic-team · Jun 22, 2023 · 113dee7 · 113dee7 · vercel · Jun 22, 2023
1 parent dc99a6e
commit 113dee7
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/src/components/global/Playground/index.tsx b/src/components/global/Playground/index.tsx
@@ -417,7 +417,7 @@ export default function Playground({
         return null;
       }
       return (
-        <PlaygroundTabs className="playground__tabs">
+        <PlaygroundTabs groupId={usageTarget} className="playground__tabs">
           {Object.keys(codeSnippets[usageTarget]).map((fileName) => (
             <TabItem
               className="playground__tab-item"

diff --git a/src/components/global/PlaygroundTabs/index.tsx b/src/components/global/PlaygroundTabs/index.tsx
@@ -108,7 +108,7 @@ function TabsComponent(props: Props): JSX.Element {
   useEffect(() => {
     setLeftNavVisible(tabsNavEl.current?.scrollLeft > 40);
     setRightNavVisible(tabsNavEl.current?.scrollWidth > tabsNavEl.current?.offsetWidth);
-  }, []);
+  }, [groupId]);
 
   /**
    * If the selected value is not in the available tabs, fall back to the first tab.