💄 feat(components/pages): new uses page

ythecombinator · Dec 5, 2023 · be201bc · be201bc
1 parent 4a08cc6
commit be201bc
Show file tree

Hide file tree

Showing 4 changed files with 199 additions and 2 deletions.
diff --git a/src/components/pages/about/overview-section.tsx b/src/components/pages/about/overview-section.tsx
@@ -1,5 +1,5 @@
 import { FunctionComponent, PropsWithChildren } from 'react';
-import { FaLaptopCode } from 'react-icons/fa';
+import { FaLaptopCode, FaHammer } from 'react-icons/fa';
 import { GiCardRandom, GiTakeMyMoney } from 'react-icons/gi';
 
 import { Routes } from 'config/constants';
@@ -67,6 +67,9 @@ const OverviewSection: FunctionComponent<PropsWithChildren<{}>> = () => {
         <ButtonLink href={`/${Routes.clients}`} icon={<GiTakeMyMoney aria-hidden />}>
           Clients
         </ButtonLink>
+        <ButtonLink href={`/${Routes.uses}`} icon={<FaHammer aria-hidden />}>
+          My Setup
+        </ButtonLink>
       </div>
     </SectionContainer>
   );

diff --git a/src/config/constants.ts b/src/config/constants.ts
@@ -55,6 +55,7 @@ export enum Routes {
   experience = 'about/experience',
   clients = 'about/clients',
   life = 'about/life',
+  uses = 'about/uses',
   posts = 'posts',
   talks = 'talks',
   talksCFP = 'talks/cfp',

diff --git a/src/content/misc/uses.mdx b/src/content/misc/uses.mdx
@@ -0,0 +1,193 @@
+---
+title: 'Meet My Basement'
+color: 'morning'
+---
+
+Here's everything I'm currently using, categorised by some arbitrary criteria.
+
+## Laptop
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/hardware/macbook-pro-2018.png',
+      name: 'MacBook Pro 13"',
+      description: 'Personal • 2018 / Quad-Core Intel Core i7 / 16GB RAM / 512GB SSD',
+      url: 'https://support.apple.com/kb/SP831?locale=en_US',
+    },
+    {
+      image: '/content/uses/hardware/macbook-pro-2019.png',
+      name: 'MacBook Pro 16"',
+      description: 'Work • 2019 / 8-Core Intel Core i9 / 32GB RAM / 512GB SSD',
+      url: 'https://support.apple.com/kb/SP809?locale=en_US',
+    },
+    {
+      image: '/content/uses/hardware/thinkpad.png',
+      name: 'Lenovo ThinkPad Touchscreen',
+      description: 'Work • Accessibility Debugging (JAWS, NVDA, etc)',
+      url: 'https://www.lenovo.com/us/en/laptops/thinkpad/thinkpad-x1/X1-Yoga-Gen-6/p/22TP2X1X1Y6',
+    },
+  ]}
+/>
+
+## Peripherals
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/hardware/monitor.png',
+      name: 'Samsung Odyssey G5 34"',
+      description: 'LCD / Curved / Ultra Wide / QHD 3440 × 1440 / 165Hz',
+      url: 'https://www.samsung.com/us/computing/monitors/gaming/34--g5-odyssey-gaming-monitor-with-1000r-curved-screen-lc34g55twwnxza/#specs',
+    },
+    {
+      image: '/content/uses/hardware/trackpad.png',
+      name: 'Magic Trackpad 2',
+      description: 'Mouse',
+      url: 'https://support.apple.com/kb/SP729?locale=en_US',
+    },
+    {
+      image: '/content/uses/hardware/keyboard.png',
+      name: 'Keychron K2 Wireless (Version 2)',
+      description: 'Mechanical Keyboard / Hot-Swappable',
+      url: 'https://www.keychron.com/products/keychron-k2-wireless-mechanical-keyboard',
+    },
+  ]}
+/>
+
+## Audio / Video
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/hardware/microphone.png',
+      name: 'Shure MV7',
+      description: 'Podcast Microphone',
+      url: 'https://www.shure.com/en-US/products/microphones/mv7',
+    },
+    {
+      image: '/content/uses/hardware/camera.png',
+      name: 'AverMedia Live Streamer PW513',
+      description: '4K Webcam',
+      url: 'https://www.avermedia.com/us/product-detail/PW513',
+    },
+    {
+      image: '/content/uses/hardware/ring-light.png',
+      name: 'Elgato Ring Light',
+      description: 'Edge-lit Lighting',
+      url: 'https://www.elgato.com/us/en/p/ring-light',
+    },
+    {
+      image: '/content/uses/hardware/headphone.png',
+      name: 'Jabra Evolve2 65',
+      description: 'Headset',
+      url: 'https://www.jabra.com/business/office-headsets/jabra-evolve/jabra-evolve2-65',
+    },
+  ]}
+/>
+
+## Furniture
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/furniture/desk.png',
+      name: 'IKEA RODULF',
+      description: 'Standing Desk',
+      url: 'https://www.ikea.com/cz/en/p/rodulf-desk-sit-stand-grey-white-s99326170/',
+    },
+  ]}
+/>
+
+## Accessories
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/hardware/iphone-12-pro.png',
+      name: 'iPhone 12 Pro',
+      description: 'Graphite, 128GB',
+      url: 'https://support.apple.com/kb/SP831?locale=en_US',
+    },
+    {
+      image: '/content/uses/hardware/ipad-pro.png',
+      name: 'iPad Pro',
+      description: 'M1 Chip, 64GB',
+      url: 'https://support.apple.com/kb/SP843?locale=en_US',
+    },
+    {
+      image: '/content/uses/hardware/airpods-3.png',
+      name: 'AirPods 3',
+      description: 'Headphone',
+      url: 'https://www.apple.com/airpods-3rd-generation/',
+    },
+  ]}
+/>
+
+## Software (Coding)
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/software/vscode.png',
+      name: 'Visual Studio Code',
+      description: 'Editor',
+      url: 'https://code.visualstudio.com/',
+    },
+    {
+      image: '/content/uses/software/fig.png',
+      name: 'Fig',
+      description: 'Terminal',
+      url: 'https://fig.io/',
+    },
+    {
+      image: '/content/uses/software/postman.png',
+      name: 'Postman',
+      description: 'API Platform',
+      url: 'https://www.postman.com/',
+    },
+    {
+      image: '/content/uses/software/parallels.png',
+      name: 'Parallels',
+      description: 'Virtual Machine',
+      url: 'https://www.parallels.com/',
+    },
+  ]}
+/>
+
+## Software (Misc)
+
+<Inventory
+  items={[
+    {
+      image: '/content/uses/software/lightroom.png',
+      name: 'Adobe Lightroom',
+      description: 'Image Manipulation',
+      url: 'https://lightroom.adobe.com/',
+    },
+    {
+      image: '/content/uses/software/figma.png',
+      name: 'Figma',
+      description: 'Design Tool',
+      url: 'https://www.figma.com',
+    },
+    {
+      image: '/content/uses/software/spotify.png',
+      name: 'Spotify',
+      description: 'Digital Music',
+      url: 'https://spotify.com',
+    },
+    {
+      image: '/content/uses/software/1password.png',
+      name: '1Password',
+      description: 'Password Manager',
+      url: 'https://1password.com/',
+    },
+    {
+      image: '/content/uses/software/raycast.png',
+      name: 'Raycast',
+      description: 'Productivity',
+      url: 'https://www.raycast.com/',
+    },
+  ]}
+/>
diff --git a/src/pages/about/[slug].tsx b/src/pages/about/[slug].tsx
@@ -78,7 +78,7 @@ const AboutPage: NextPage<Props> = ({ content }) => {
           ],
         }}
       />
-      <MDXLayoutRenderer layout={Layouts.mdx} content={content} />{' '}
+      <MDXLayoutRenderer layout={Layouts.mdx} content={content} />
     </>
   );
 };