From fc159ecb9b47dc18d52f79183da36b2a2e344143 Mon Sep 17 00:00:00 2001
From: Kamran Ahmed <kamranahmed.se@gmail.com>
Date: Thu, 2 Sep 2021 18:08:02 +0200
Subject: [PATCH] Guides listing

---
 components/links-list-item.tsx | 4 +++-
 content/guides.json            | 2 +-
 pages/index.tsx                | 1 +
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/components/links-list-item.tsx b/components/links-list-item.tsx
index 0a210a42e..a2022e1f9 100644
--- a/components/links-list-item.tsx
+++ b/components/links-list-item.tsx
@@ -2,6 +2,7 @@ import React from 'react';
 import { Badge, Flex, Link, Text } from '@chakra-ui/react';
 
 type LinksListItemProps = {
+  href: string;
   title: string;
   subtitle: string;
   badgeText?: string;
@@ -10,10 +11,11 @@ type LinksListItemProps = {
 };
 
 export function LinksListItem(props: LinksListItemProps) {
-  const { title, subtitle, badgeText, icon, hideSubtitleOnMobile = false } = props;
+  const { title, subtitle, badgeText, icon, hideSubtitleOnMobile = false, href } = props;
 
   return (
     <Link
+      href={href}
       fontSize={['14px', '14px', '15px']}
       py='9px'
       d='flex'
diff --git a/content/guides.json b/content/guides.json
index 2c721f30b..6fc60b97a 100644
--- a/content/guides.json
+++ b/content/guides.json
@@ -20,7 +20,7 @@
     "createdAt": "2020-07-01T19:59:14.191Z"
   },
   {
-    "title": "OAuth — Open Authorization",
+    "title": "OAuth — Open Authorization",
     "description": "Learn and understand what is OAuth and how it works",
     "url": "/guides/oauth",
     "fileName": "oauth",
diff --git a/pages/index.tsx b/pages/index.tsx
index 513e2367a..70a24464f 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -66,6 +66,7 @@ export default function Home(props: HomeProps) {
             {guides.map(guide => (
               <LinksListItem
                 key={guide.url}
+                href={guide.url}
                 title={guide.title}
                 badgeText={guide.isPro ? 'PRO' : ''}
                 subtitle={guide.formattedUpdatedAt}