change requests

src/components/UI/downloads/DownloadsHero.tsx

@@ -56,10 +56,10 @@ export const DownloadsHero: FC<DownloadsHero> = ({
         </Text>
 
         {
-          Object.keys(DOWNLOAD_HEADER_BUTTONS).map((key: string, idx) => {
+          Object.keys(DOWNLOAD_HEADER_BUTTONS).map((key: string) => {
             return (
               <NextLink
-                key={idx}
+                key={key}
                 href={DOWNLOAD_HEADER_BUTTONS[key].buildURL}
                 passHref
               >

src/components/UI/downloads/DownloadsTable.tsx

@@ -38,7 +38,7 @@ export const DownloadsTable: FC<Props> = ({
             DOWNLOAD_TABS.map((tab, idx) => {
               return (
                 <Tab
-                  key={idx}
+                  key={tab}
                   w={'20%'}
                   p={4}
                   _selected={{

src/pages/downloads.tsx

@@ -27,10 +27,18 @@ import { testDownloadData } from '../data/test/download-testdata'
 import { pgpBuildTestData } from '../data/test/pgpbuild-testdata';
 import { pgpDeveloperTestData } from '../data/test/pgpdeveloper-testdata';
 
-const DownloadsPage: NextPage = ({}) => {
+const DownloadsPage: NextPage = () => {
   const [amountStableReleases, updateAmountStables] = useState(DEFAULT_BUILD_AMOUNT_TO_SHOW)
   const [amountDevelopBuilds, updateAmountDevelopBuilds] = useState(DEFAULT_BUILD_AMOUNT_TO_SHOW)
 
+  const showMoreStableReleases = () => {
+    updateAmountStables(amountStableReleases+10)
+  }
+
+  const showMoreDevelopBuilds = () => {
+    updateAmountDevelopBuilds(amountDevelopBuilds+10)
+  }
+
   return (
     <>
      {/* TODO: add PageMetadata */}
@@ -108,9 +116,7 @@ const DownloadsPage: NextPage = ({}) => {
           <DownloadsTable data={testDownloadData.slice(0, amountStableReleases)}/>
 
           <Stack sx={{ mt: '0 !important' }}>
-            <Link as='button' variant='button-link-secondary' onClick={() => {
+            <Link as='button' variant='button-link-secondary' onClick={showMoreStableReleases}>
-              updateAmountStables(amountStableReleases+10)
-            }}>
               <Text
                 fontFamily='"JetBrains Mono", monospace'
                 fontWeight={700}
@@ -142,9 +148,7 @@ const DownloadsPage: NextPage = ({}) => {
           <DownloadsTable data={testDownloadData.slice(0, amountDevelopBuilds)} />
 
           <Stack sx={{ mt: '0 !important' }}>
-            <Link as='button' variant='button-link-secondary' onClick={() => {
+            <Link as='button' variant='button-link-secondary' onClick={showMoreDevelopBuilds}>
-              updateAmountDevelopBuilds(amountDevelopBuilds+10)
-            }}>
               <Text
                 fontFamily='"JetBrains Mono", monospace'
                 fontWeight={700}

src/theme/components/Link.ts

@@ -25,6 +25,6 @@ export const Link = {
         color: 'brand.light.secondary',
         textDecorationColor: 'brand.light.secondary'
       }
-    },
+    }
   }
 };