diff --git a/components/guides/ButtonGroupOSSelector.tsx b/components/guides/ButtonGroupOSSelector.tsx
index 19684e88..e04687f3 100644
--- a/components/guides/ButtonGroupOSSelector.tsx
+++ b/components/guides/ButtonGroupOSSelector.tsx
@@ -6,12 +6,14 @@ import { useRouter } from 'next/router';
function ButtonGroupOSSelector() {
const router = useRouter();
const osList = {
- linux: 'Linux',
- windows: 'Windows',
- macOS: 'macOS',
+ linux: { label: 'Linux', logoURL: 'https://static.flexpool.io/assets/os/linux.png' },
+ windows: {
+ label: 'Windows',
+ logoURL: 'https://static.flexpool.io/assets/os/windows.png',
+ },
};
const [selectedOS, setSelectedOS] = useState('');
- let search;
+ let search: string;
useEffect(() => {
if (typeof window !== 'undefined') {
diff --git a/components/guides/flexfarmer/FlexfarmerDownloads.tsx b/components/guides/flexfarmer/FlexfarmerDownloads.tsx
index 11d0ae21..7f52986d 100644
--- a/components/guides/flexfarmer/FlexfarmerDownloads.tsx
+++ b/components/guides/flexfarmer/FlexfarmerDownloads.tsx
@@ -41,7 +41,7 @@ function FlexfarmerDownloads() {
return (
<>
- {downloadData && (
+ {downloadData && downloadData.map && (
{downloadData.map((item) => (
-
diff --git a/src/pages/GetStarted/ChiaShared/ButtonGroup.tsx b/src/pages/GetStarted/ChiaShared/ButtonGroup.tsx
index 276735f4..9c92af92 100644
--- a/src/pages/GetStarted/ChiaShared/ButtonGroup.tsx
+++ b/src/pages/GetStarted/ChiaShared/ButtonGroup.tsx
@@ -36,8 +36,14 @@ const ButtonGroupWrapper = styled.div`
}
`;
+const OptionThumbnail = styled.img`
+ height: 2em;
+ width: 2em;
+ margin-right: 1em;
+`;
+
type ButtonGroupProps = {
- options: { [key: string]: string };
+ options: { [key: string]: { label: string; logoURL?: string } };
selectedOption: string;
setSelectedOption: (s: string) => void;
};
@@ -51,7 +57,10 @@ export const ButtonGroup = (props: ButtonGroupProps) => {
onClick={() => props.setSelectedOption(key)}
className={`${props.selectedOption === key ? 'selected' : ''}`}
>
- {props.options[key] as string}
+ {props.options[key].logoURL && (
+
+ )}
+ {props.options[key].label as string}
);
}
diff --git a/src/pages/GetStarted/ChiaShared/FarmerOptionSelector.tsx b/src/pages/GetStarted/ChiaShared/FarmerOptionSelector.tsx
index b08a642c..4e978876 100644
--- a/src/pages/GetStarted/ChiaShared/FarmerOptionSelector.tsx
+++ b/src/pages/GetStarted/ChiaShared/FarmerOptionSelector.tsx
@@ -14,8 +14,8 @@ export const FarmerOptionSelector = (props: FarmerOptionProps) => {
return (
{
setSelectedFarmerOption(s);