Merge pull request #60 from tnfshcec/fix/unlisted-tags

fix: unlisted tags
tnfshcec · Feb 23, 2024 · 07fbbcf · 07fbbcf
2 parents 54edbb5 + 398f91a
commit 07fbbcf
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 23 deletions.
diff --git a/src/lib/utils/posts.ts b/src/lib/utils/posts.ts
@@ -21,10 +21,6 @@ const posts = Object.entries(imported).reduce<Record<string, App.Post>>((acc, [p
   return acc;
 }, {});
 
-export const allTags = Object.values(posts)
-  .flatMap((p) => p.metadata.tags)
-  .filter((tag): tag is string => !!tag); // filter out undefined
-
 /**
  * @returns A list of post metadata, sorted with our method
  */
@@ -53,3 +49,13 @@ export function listSortedPosts({ all } = { all: dev }): App.PostData[] {
 export function getPost(slug: string): App.Post | undefined {
   return posts[slug];
 }
+
+/**
+ * @returns A list of available tags
+ */
+export function getTags({ all } = { all: dev }) {
+  return Object.values(posts)
+    .filter((p) => all || !p.metadata.unlisted)
+    .flatMap((p) => p.metadata.tags)
+    .filter((tag): tag is string => !!tag); // filter out undefined
+}
diff --git a/src/routes/post/+page.svelte b/src/routes/post/+page.svelte
@@ -4,7 +4,6 @@
   import { page } from "$app/stores";
   import CenteredPage from "$lib/components/CenteredPage.svelte";
   import PostCard from "$lib/components/homepage/PostCard.svelte";
-  import { allTags } from "$lib/utils/posts";
   import * as m from "$paraglide/messages";
 
   export let data;
@@ -40,7 +39,7 @@
 
   <!-- tags buttons for mobile -->
   <div class="flex w-full flex-wrap gap-2 lg:hidden">
-    {#each allTags as tag}
+    {#each data.tags as tag}
       <a class="btn-accent whitespace-nowrap" href="?tags={tag}">#{tag}</a>
     {/each}
   </div>
@@ -53,20 +52,24 @@
     {/each}
   </div>
 
-  <!-- tags buttons for desktop, on the right -->
-  <div class="sticky top-20 hidden w-max max-w-xs space-y-2 p-4 lg:block" slot="right">
-    <p class="font-bold">{m.post_filter_tags()}</p>
-    <div class="flex flex-wrap gap-2">
-      {#each allTags as tag}
-        {@const tagsParam = getTagsParam(tags, tag)}
-        <a
-          class="btn-accent whitespace-nowrap
+  <svelte:fragment slot="right">
+    <!-- tags buttons for desktop, on the right -->
+    {#if data.tags.length > 0}
+      <div class="sticky top-20 hidden w-max max-w-xs space-y-2 p-4 lg:block">
+        <p class="font-bold">{m.post_filter_tags()}</p>
+        <div class="flex flex-wrap gap-2">
+          {#each data.tags as tag}
+            {@const tagsParam = getTagsParam(tags, tag)}
+            <a
+              class="btn-accent whitespace-nowrap
                 {tags.includes(tag) ? '' : 'border-opacity-10 text-opacity-80'}"
-          href="{base}/post{tagsParam === '' ? '' : '?tags=' + tagsParam}"
-        >
-          #{tag}
-        </a>
-      {/each}
-    </div>
-  </div>
+              href="{base}/post{tagsParam === '' ? '' : '?tags=' + tagsParam}"
+            >
+              #{tag}
+            </a>
+          {/each}
+        </div>
+      </div>
+    {/if}
+  </svelte:fragment>
 </CenteredPage>
diff --git a/src/routes/post/+page.ts b/src/routes/post/+page.ts
@@ -1,8 +1,9 @@
-import { listSortedPosts } from "$lib/utils/posts";
+import { getTags, listSortedPosts } from "$lib/utils/posts";
 import type { PageServerLoad } from "./$types";
 
 export const load = (async () => {
   return {
-    posts: listSortedPosts()
+    posts: listSortedPosts(),
+    tags: getTags()
   };
 }) satisfies PageServerLoad;