From 3bcf54a2fe2556654d6c37bcff8f947fcb837037 Mon Sep 17 00:00:00 2001
From: Luke Shumaker <lukeshu@datawire.io>
Date: Sat, 14 Aug 2021 17:43:17 -0600
Subject: [PATCH] (from getambassador.io) Phase out nightly-version-tabs
 (NightlyVersionTabs) for Platform

---
 install/index.md                | 18 ++++++-
 install/nightly-version-tabs.js | 84 ---------------------------------
 2 files changed, 16 insertions(+), 86 deletions(-)
 delete mode 100644 install/nightly-version-tabs.js

diff --git a/install/index.md b/install/index.md
index 4ec70b082e..69a05fc89a 100644
--- a/install/index.md
+++ b/install/index.md
@@ -1,5 +1,4 @@
 import Platform from '@src/components/Platform';
-import NightlyVersionTabs from './nightly-version-tabs'
 
 # Install
 
@@ -78,7 +77,22 @@ version of Telepresence is released.
 
 Use these URLs to download the most recent nightly build.
 
-<NightlyVersionTabs/>
+<Platform.TabGroup>
+<Platform.MacOSTab>
+
+```
+https://app.getambassador.io/download/tel2/darwin/amd64/nightly/telepresence
+```
+
+</Platform.MacOSTab>
+<Platform.GNULinuxTab>
+
+```
+https://app.getambassador.io/download/tel2/linux/amd64/nightly/telepresence
+```
+
+</Platform.GNULinuxTab>
+</Platform.TabGroup>
 
 ## Installing older versions of Telepresence
 
diff --git a/install/nightly-version-tabs.js b/install/nightly-version-tabs.js
deleted file mode 100644
index 19a653e9ff..0000000000
--- a/install/nightly-version-tabs.js
+++ /dev/null
@@ -1,84 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core/styles';
-import AppBar from '@material-ui/core/AppBar';
-import Tabs from '@material-ui/core/Tabs';
-import Tab from '@material-ui/core/Tab';
-import Box from '@material-ui/core/Box';
-import CodeBlock from '@src/components/CodeBlock';
-import LinuxIcon from '@src/assets/icons/linux.inline.svg';
-import AppleIcon from '@src/assets/icons/apple.inline.svg';
-
-function TabPanel(props) {
-  const { children, value, index, ...other } = props;
-
-  return (
-    <div
-      role="tabpanel"
-      hidden={value !== index}
-      id={`simple-tabpanel-${index}`}
-      aria-labelledby={`simple-tab-${index}`}
-      {...other}
-    >
-      {value === index && (
-        <Box p={3}>
-          {children}
-        </Box>
-      )}
-    </div>
-  );
-}
-
-TabPanel.propTypes = {
-  children: PropTypes.node,
-  index: PropTypes.any.isRequired,
-  value: PropTypes.any.isRequired,
-};
-
-function a11yProps(index) {
-  return {
-    id: `simple-tab-${index}`,
-    'aria-controls': `simple-tabpanel-${index}`,
-  };
-}
-
-const useStyles = makeStyles((theme) => ({
-  root: {
-    flexGrow: 1,
-    backgroundColor: 'transparent',
-  },
-}));
-
-export default function SimpleTabs() {
-  const classes = useStyles();
-  const [value, setValue] = React.useState(0);
-
-  const handleChange = (event, newValue) => {
-    setValue(newValue);
-  };
-
-  return (
-    <div className={classes.root}>
-      <AppBar elevation={0} style={{ background: 'transparent', color: 'black', borderBottom: '1px solid #e8e8e8', }} position="static">
-        <Tabs value={value} onChange={handleChange} aria-label="operating system tabs">
-          <Tab icon={<AppleIcon />} label="macOS" {...a11yProps(0)} style={{ minWidth: "10%", textTransform: 'none' }} />
-          <Tab icon={<LinuxIcon />} label="Linux" {...a11yProps(1)} style={{ minWidth: "10%", textTransform: 'none' }} />
-        </Tabs>
-      </AppBar>
-      <TabPanel value={value} index={0}>
-        <CodeBlock>
-        {
-          'https://app.getambassador.io/download/tel2/darwin/amd64/nightly/telepresence'
-        }
-        </CodeBlock>
-      </TabPanel>
-      <TabPanel value={value} index={1}>
-        <CodeBlock>
-        {
-          'https://app.getambassador.io/download/tel2/linux/amd64/nightly/telepresence'
-        }
-        </CodeBlock>
-      </TabPanel>
-    </div >
-  );
-}