chore: wip

Signed-off-by: blam <ben@blam.sh>

packages/core-components/src/components/TabbedLayout/RoutedTabs.tsx

@@ -96,6 +96,9 @@ export function RoutedTabs(props: { routes: SubRoute[] }) {
         tabs={headerTabs}
         selectedIndex={index}
         onChange={onTabChange}
+        tabProps={{
+          component: Link,
+        }}
       />
       <Content>
         <Helmet title={route?.title} />

packages/core-components/src/layout/HeaderTabs/HeaderTabs.test.tsx

@@ -95,13 +95,4 @@ describe('<HeaderTabs />', () => {
     await user.click(rendered.getByText('Docs'));
     expect(mockOnChange).toHaveBeenCalledTimes(1);
   });
-
-  it('should render 2 nav tabs', async () => {
-    const rendered = await renderInTestApp(<HeaderTabs tabs={mockTabs} />);
-    const tabs = rendered.queryAllByTestId(id => id.startsWith('header-tab'));
-    expect(tabs).toHaveLength(2);
-    tabs.forEach(tab => {
-      expect(tab.tagName.toLocaleLowerCase('en-US')).toBe('a');
-    });
-  });
 });

packages/core-components/src/layout/HeaderTabs/HeaderTabs.tsx

@@ -18,7 +18,6 @@ import { makeStyles } from '@material-ui/core/styles';
 import TabUI, { TabProps } from '@material-ui/core/Tab';
 import Tabs from '@material-ui/core/Tabs';
 import React, { useCallback, useEffect, useState } from 'react';
-import { Link } from '../../components/Link';
 
 // TODO(blam): Remove this implementation when the Tabs are ready
 // This is just a temporary solution to implementing tabs for now
@@ -96,9 +95,7 @@ export function HeaderTabs(props: HeaderTabsProps) {
       setSelectedTab(selectedIndex);
     }
   }, [selectedIndex]);
-  function removeLeadingSlash(path: string) {
-    return path.replace(/^\//, '');
-  }
+
   return (
     <Box className={styles.tabsWrapper}>
       <Tabs
@@ -115,8 +112,6 @@ export function HeaderTabs(props: HeaderTabsProps) {
             data-testid={`header-tab-${index}`}
             label={tab.label}
             key={tab.id}
-            component={Link}
-            to={removeLeadingSlash(tab.id)}
             value={index}
             className={styles.defaultTab}
             classes={{ selected: styles.selected, root: styles.tabRoot }}