From d5243f5f133f4df949f0da25423f7e32cb02a51b Mon Sep 17 00:00:00 2001
From: Nazareno Oviedo <nazareno@basement.studio>
Date: Wed, 20 Apr 2022 13:06:43 -0300
Subject: [PATCH] feat: blog improves

---
 src/components/common/header/index.tsx        | 18 +++++++++++++++--
 .../sections/blog/post-hero/index.tsx         |  2 +-
 src/pages/about.tsx                           |  2 +-
 src/pages/blog/[slug].tsx                     | 20 ++++++-------------
 src/pages/blog/index.tsx                      |  2 +-
 src/pages/index.tsx                           |  2 +-
 src/pages/products.tsx                        |  4 +---
 7 files changed, 27 insertions(+), 23 deletions(-)

diff --git a/src/components/common/header/index.tsx b/src/components/common/header/index.tsx
index 9b9a5bf..467e7cf 100644
--- a/src/components/common/header/index.tsx
+++ b/src/components/common/header/index.tsx
@@ -21,7 +21,14 @@ const HeaderMobile = React.forwardRef<
 >(({ className, ...props }, ref) => {
   const router = useRouter()
 
-  const isActive = (href: string) => router.pathname === href
+  const isActive = (href: string) => {
+    const slug = router.query.slug as string
+    if (slug) {
+      return router.pathname.replace('/[slug]', '') === href
+    } else {
+      return router.pathname === href
+    }
+  }
   return (
     <div {...props} className={clsx(s['header__mobile'], className)} ref={ref}>
       <ul className="items">
@@ -69,7 +76,14 @@ export const Header = () => {
   const router = useRouter()
   const [ref, bounds] = useMeasure()
 
-  const isActive = (href: string) => router.pathname === href
+  const isActive = (href: string) => {
+    const slug = router.query.slug as string
+    if (slug) {
+      return router.pathname.replace('/[slug]', '') === href
+    } else {
+      return router.pathname === href
+    }
+  }
 
   React.useEffect(() => {
     const handleRouteChange = () => {
diff --git a/src/components/sections/blog/post-hero/index.tsx b/src/components/sections/blog/post-hero/index.tsx
index 5b74186..1d8a399 100644
--- a/src/components/sections/blog/post-hero/index.tsx
+++ b/src/components/sections/blog/post-hero/index.tsx
@@ -14,7 +14,7 @@ interface HeroProps {
 
 const Hero = ({ data }: HeroProps) => {
   return (
-    <Section className={s['section']}>
+    <Section className={s['section']} disableFadeIn>
       <span className={s.date}>{formatDate(data.date)}</span>
       <Heading as="h1" variant="xl" centered>
         {data.title}
diff --git a/src/pages/about.tsx b/src/pages/about.tsx
index 6fd6fe8..ea63d35 100644
--- a/src/pages/about.tsx
+++ b/src/pages/about.tsx
@@ -30,7 +30,7 @@ export const getStaticProps = async () => {
           heroBlogPost
         } ?? null
     },
-    revalidate: 1
+    revalidate: 60
   }
 }
 
diff --git a/src/pages/blog/[slug].tsx b/src/pages/blog/[slug].tsx
index b1eb7c1..c229598 100644
--- a/src/pages/blog/[slug].tsx
+++ b/src/pages/blog/[slug].tsx
@@ -18,34 +18,26 @@ import Related from '~/components/sections/about/related'
 import Content from '~/components/sections/blog/post-content'
 import Hero from '~/components/sections/blog/post-hero'
 import Shares from '~/components/sections/blog/shares'
+import { siteOrigin } from '~/lib/constants'
 
 const BlogPost = ({
   latestPosts,
   post
 }: InferGetStaticPropsType<typeof getStaticProps>) => {
+  const router = useRouter()
+
+  const completeUrl = `${siteOrigin}${router.asPath}`
+
   if (!post) {
     return <Error statusCode={404} />
   }
 
-  const router = useRouter()
-  // `${location.origin}${router.asPath}`
-  const completeUrl = `https://laconic.com${router.asPath}`
-
   return (
     <PageLayout>
       <Meta />
       <Hero data={post} />
       <Content data={post} />
       <Shares url={completeUrl} />
-      {/* <PostsGrid title="Related articles">
-        {latestPosts.map((relatedPost: BlogPostFragment, index: Key) => {
-          return (
-            <div key={index}>
-              <BlogCard data={relatedPost} />
-            </div>
-          )
-        })}
-      </PostsGrid> */}
       <Related isInPost data={latestPosts} />
     </PageLayout>
   )
@@ -83,7 +75,7 @@ export const getStaticProps: GetStaticProps = async (
         latestPosts: relatedPosts.slice(0, 3),
         post: post
       },
-      revalidate: 1
+      revalidate: 60
     }
   } catch (error) {
     return { notFound: true }
diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx
index cd278cd..67eec7a 100644
--- a/src/pages/blog/index.tsx
+++ b/src/pages/blog/index.tsx
@@ -192,7 +192,7 @@ export const getStaticProps = async () => {
           heroBlogPost
         } ?? null
     },
-    revalidate: 1
+    revalidate: 60
   }
 }
 
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 88563ef..cf7704f 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -31,7 +31,7 @@ export const getStaticProps = async () => {
           heroBlogPost
         } ?? null
     },
-    revalidate: 1
+    revalidate: 60
   }
 }
 
diff --git a/src/pages/products.tsx b/src/pages/products.tsx
index 35004d0..2038b21 100644
--- a/src/pages/products.tsx
+++ b/src/pages/products.tsx
@@ -12,7 +12,6 @@ import Hero from '~/components/sections/products/hero'
 import Network from '~/components/sections/products/network'
 import Stack from '~/components/sections/products/stack'
 import Token from '~/components/sections/products/token'
-// import Partners from '~/components/sections/products/partners'
 import Watchers from '~/components/sections/products/watchers'
 
 export const getStaticProps = async () => {
@@ -35,7 +34,7 @@ export const getStaticProps = async () => {
           heroBlogPost
         } ?? null
     },
-    revalidate: 1
+    revalidate: 60
   }
 }
 
@@ -52,7 +51,6 @@ const Products = ({
       <AppSection />
       <Token />
       <Related data={initialBlogPosts?.data} />
-      {/* <Partners /> */}
     </PageLayout>
   )
 }