From 136585e5543423fc630c30bc44efd9b82d861c58 Mon Sep 17 00:00:00 2001
From: Michal Vanko <mklakakilli@gmail.com>
Date: Sat, 24 Apr 2021 18:57:13 +0200
Subject: [PATCH] Fix navigation segment parsing

---
 src/components/Nav.svelte | 7 ++++---
 src/routes/$layout.svelte | 6 ++++--
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/Nav.svelte b/src/components/Nav.svelte
index 73faabb..453bfbb 100644
--- a/src/components/Nav.svelte
+++ b/src/components/Nav.svelte
@@ -60,7 +60,7 @@
   <section class="nav-main">
     <ul>
       <li>
-        <a class={classNames({ selected: segment === undefined })} href="/">
+        <a class={classNames({ selected: segment === '/' })} href="/">
           Introduction
         </a>
       </li>
@@ -69,14 +69,14 @@
       <li>
         <a
           rel="prefetch"
-          class={classNames({ selected: segment === 'blog' })}
+          class={classNames({ selected: segment.startsWith('/blog') })}
           href="/blog">
           Blog
         </a>
       </li>
       <li>
         <a
-          class={classNames({ selected: segment === 'portfolio' })}
+          class={classNames({ selected: segment.startsWith('/portfolio') })}
           href="/portfolio">
           Portfolio
         </a>
@@ -91,6 +91,7 @@
   </section>
 
   {#if segment === 'portfolio'}
+  <!-- Move to portfolio layout -->
     <section class="page-navigation">
       <a href="portfolio#personal-information">About</a>
       <a href="portfolio#skills">Skills</a>
diff --git a/src/routes/$layout.svelte b/src/routes/$layout.svelte
index aed659a..ac8586f 100644
--- a/src/routes/$layout.svelte
+++ b/src/routes/$layout.svelte
@@ -1,11 +1,13 @@
 <script context="module" lang="typescript">
   import { take } from 'ramda'
+  import type { LoadInput, LoadOutput } from '@sveltejs/kit/types/page';
 
-  export function load({ fetch }) {
+  export function load({ fetch, page }: LoadInput): Promise<LoadOutput> {
     return fetch(`/blog.json`)
       .then((r) => r.json())
       .then((posts) => {
-        return { props: { latestPosts: take(5, posts) }}
+        console.log(page)
+        return { props: { latestPosts: take(5, posts), segment: page.path }}
       })
   }
 </script>