From 2a567b6c9a7070ed8841d21d8aa14f7dcc36f6f2 Mon Sep 17 00:00:00 2001
From: matthieu42morin <matthieu.bernard.morin@gmail.com>
Date: Sun, 28 Apr 2024 13:57:52 +0200
Subject: [PATCH] delete old blog components

---
 src/lib/components/post_action.svelte     |  12 --
 src/lib/components/post_card.svelte       | 130 ----------------------
 src/lib/components/post_comment.svelte    |  46 --------
 src/lib/components/post_container.svelte  |  39 -------
 src/lib/components/post_layout.svelte     |  32 ------
 src/lib/components/post_pagination.svelte |  59 ----------
 src/lib/components/post_reply.svelte      |  17 ---
 src/lib/components/post_status.svelte     |  35 ------
 src/lib/components/post_toc.svelte        |  80 -------------
 9 files changed, 450 deletions(-)
 delete mode 100644 src/lib/components/post_action.svelte
 delete mode 100644 src/lib/components/post_card.svelte
 delete mode 100644 src/lib/components/post_comment.svelte
 delete mode 100644 src/lib/components/post_container.svelte
 delete mode 100644 src/lib/components/post_layout.svelte
 delete mode 100644 src/lib/components/post_pagination.svelte
 delete mode 100644 src/lib/components/post_reply.svelte
 delete mode 100644 src/lib/components/post_status.svelte
 delete mode 100644 src/lib/components/post_toc.svelte

diff --git a/src/lib/components/post_action.svelte b/src/lib/components/post_action.svelte
deleted file mode 100644
index 4c98b17..0000000
--- a/src/lib/components/post_action.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script lang="ts">
-  export let post: Urara.Post
-  const actions = import.meta.glob<any>('/src/lib/components/actions/*.svelte', { eager: true, import: 'default' })
-</script>
-
-<div class="sticky top-24 hidden xl:flex flex-col gap-4 w-fit h-[calc(100vh-12rem)] ml-auto mr-8 my-8 justify-center">
-  {#if Object.keys(actions).length}
-    {#each Object.values(actions) as action}
-      <svelte:component this={action} {post} />
-    {/each}
-  {/if}
-</div>
diff --git a/src/lib/components/post_card.svelte b/src/lib/components/post_card.svelte
deleted file mode 100644
index 472dd70..0000000
--- a/src/lib/components/post_card.svelte
+++ /dev/null
@@ -1,130 +0,0 @@
-<script lang="ts">
-  import { browser } from '$app/environment'
-  import { post as postConfig } from '$lib/config/post'
-  import { posts as storedPosts } from '$lib/stores/posts'
-  import { title as storedTitle } from '$lib/stores/title'
-  import Reply from '$lib/components/post_reply.svelte'
-  import Status from '$lib/components/post_status.svelte'
-  import Image from '$lib/components/prose/img.svelte'
-  import Pagination from '$lib/components/post_pagination.svelte'
-  import Comment from '$lib/components/post_comment.svelte'
-  export let post: Urara.Post
-  export let preview: boolean = false
-  export let loading: 'eager' | 'lazy' = 'lazy'
-  export let decoding: 'async' | 'sync' | 'auto' = 'async'
-  // pagination
-  let index: number
-  let prev: Urara.Post | undefined = undefined
-  let next: Urara.Post | undefined = undefined
-  if (browser && !preview)
-    storedPosts.subscribe((storedPosts: Urara.Post[]) => {
-      index = storedPosts.findIndex(storedPost => storedPost.path === post.path)
-      prev = storedPosts
-        .slice(0, index)
-        .reverse()
-        .find(post => !post.flags?.includes('unlisted'))
-      next = storedPosts.slice(index + 1).find(post => !post.flags?.includes('unlisted'))
-      storedTitle.set(post.title ?? post.path.slice(1))
-    })
-</script>
-
-<svelte:element
-  this={post.type === 'article' ? 'article' : 'div'}
-  itemscope
-  itemtype="https://schema.org/BlogPosting"
-  itemprop="blogPost"
-  class:md:mb-8={!preview}
-  class:lg:mb-16={!preview}
-  class:group={preview}
-  class:image-full={preview && post.type === 'article' && post.image}
-  class:before:!rounded-none={preview && post.image}
-  class="h-entry card bg-base-100 rounded-none md:rounded-box md:shadow-xl overflow-hidden z-10">
-  {#if !preview && postConfig.bridgy}
-    <div id="bridgy" class="hidden">
-      {#each post.flags?.some( flag => flag.startsWith('bridgy') ) ? post.flags.flatMap( flag => (flag.startsWith('bridgy') ? flag.slice(7) : []) ) : [...(postConfig.bridgy.post ?? []), ...(postConfig.bridgy[post.type] ?? [])] as target}
-        {#if target === 'fed'}
-          <a href="https://fed.brid.gy/">fed</a>
-        {:else}
-          <a href="https://brid.gy/publish/{target}">{target}</a>
-        {/if}
-      {/each}
-    </div>
-  {/if}
-  {#if post.in_reply_to}
-    <Reply in_reply_to={post.in_reply_to} class="mt-4 mx-4" />
-  {/if}
-  {#if post.image && preview}
-    <figure class="!block">
-      <Image
-        class={post.type === 'article'
-          ? 'u-featured object-center h-full w-full absolute group-hover:scale-105 transition-transform duration-500 ease-in-out'
-          : 'u-photo rounded-xl md:rounded-b-none -mb-6 md:-mb-2'}
-        src={post.image}
-        alt={post.alt ?? post.image}
-        {loading}
-        {decoding} />
-    </figure>
-  {/if}
-  <div
-    class={`card-body gap-0 ${
-      preview && post.type === 'article' && post.image ? 'md:col-start-1 md:row-start-1 md:text-neutral-content md:z-20' : ''
-    }`}>
-    <div class="flex flex-col gap-2">
-      {#if post.image && !preview}
-        <figure
-          class={`md:order-last rounded-box shadow-xl mb-4 ${
-            post.type === 'article' ? 'flex-col gap-2 -mx-4 -mt-8 md:mt-0' : 'flex-col -mx-8'
-          }`}>
-          <Image
-            class={`${post.type === 'article' ? 'u-featured' : 'u-photo'}`}
-            src={post.image}
-            alt={post.alt ?? post.image}
-            {loading}
-            {decoding} />
-        </figure>
-      {/if}
-      <Status {post} {preview} />
-      {#if post.title}
-        {#if preview}
-          <h2
-            itemprop="name headline"
-            class="card-title text-3xl mr-auto bg-[length:100%_0%] bg-[position:0_88%] underline decoration-4 decoration-transparent group-hover:decoration-primary hover:bg-[length:100%_100%] hover:text-primary-content bg-gradient-to-t from-primary to-primary bg-no-repeat transition-all ease-in-out duration-300">
-            <a itemprop="url" class="u-url p-name" href={post.path}>{post.title ?? post.path.slice(1)}</a>
-          </h2>
-        {:else}
-          <h1 itemprop="name headline" class="card-title text-3xl mb-8 p-name">{post.title ?? post.path.slice(1)}</h1>
-        {/if}
-      {/if}
-      {#if post.summary}
-        <p itemprop="description" class:hidden={!preview || post.type !== 'article'} class="p-summary mb-auto">
-          {post.summary}
-        </p>
-      {/if}
-    </div>
-    <main itemprop="articleBody" class:mt-4={post.type !== 'article'} class="urara-prose prose e-content">
-      {#if !preview}
-        <slot />
-      {:else if post.html}
-        {@html post.html}
-      {/if}
-    </main>
-    {#if !preview && post.tags}
-      <div class="divider mt-4 mb-0" />
-      <div>
-        {#each post.tags as tag}
-          <a href="/?tags={tag}" class="btn btn-sm btn-ghost normal-case mt-2 mr-2 p-category">
-            #{tag}
-          </a>
-        {/each}
-      </div>
-    {/if}
-  </div>
-  {#if !preview}
-    {#if (prev || next) && !post.flags?.includes('pagination-disabled') && !post.flags?.includes('unlisted')}
-      <Pagination {next} {prev} />
-    {/if}
-    {#if browser && postConfig.comment && !post.flags?.includes('comment-disabled')}
-      <Comment {post} config={postConfig.comment} />
-    {/if}
-  {/if}
-</svelte:element>
diff --git a/src/lib/components/post_comment.svelte b/src/lib/components/post_comment.svelte
deleted file mode 100644
index 19666b7..0000000
--- a/src/lib/components/post_comment.svelte
+++ /dev/null
@@ -1,46 +0,0 @@
-<script lang="ts">
-  import type { CommentConfig } from '$lib/types/post'
-  import { toSnake } from '$lib/utils/case'
-  export let post: Urara.Post
-  export let config: CommentConfig
-  const comments = import.meta.glob<any>('/src/lib/components/comments/*.svelte', { eager: true, import: 'default' })
-  let currentComment: string | undefined = undefined
-  let currentConfig: unknown | undefined = undefined
-  currentComment = localStorage.getItem('comment') ?? toSnake(config.use[0])
-  // @ts-ignore No index signature with a parameter of type 'string' was found on type 'CommentConfig'. ts(7053)
-  $: if (currentComment) currentConfig = config[currentComment]
-</script>
-
-{#if config?.use.length > 0}
-  <div id="post-comment" class="card card-body">
-    {#if config.use.length > 1}
-      <div
-        class="tabs w-full mb-8"
-        class:tabs-boxed={config?.['style'] === 'boxed'}
-        class:tab-bordered={config?.['style'] === 'bordered'}
-        class:tab-lifted={config?.['style'] === 'lifted'}>
-        {#each config.use as name}
-          <!-- svelte-ignore a11y-click-events-have-key-events -->
-          <!-- svelte-ignore a11y-no-static-element-interactions -->
-          <span
-            on:click={() => {
-              currentComment = toSnake(name)
-              localStorage.setItem('comment', toSnake(name))
-            }}
-            class="flex-1 tab transition-all"
-            class:tab-active={currentComment === toSnake(name)}>
-            {name}
-          </span>
-        {/each}
-      </div>
-    {/if}
-    {#if currentComment}
-      {#key currentComment}
-        <svelte:component
-          this={comments[`/src/lib/components/comments/${currentComment}.svelte`]}
-          {post}
-          config={currentConfig} />
-      {/key}
-    {/if}
-  </div>
-{/if}
diff --git a/src/lib/components/post_container.svelte b/src/lib/components/post_container.svelte
deleted file mode 100644
index 96488d8..0000000
--- a/src/lib/components/post_container.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script lang="ts">
-  import { fly } from 'svelte/transition'
-  import { browser } from '$app/environment'
-  import Card from '$lib/components/post_card.svelte'
-  import Head from '$lib/components/head.svelte'
-  import Toc from '$lib/components/post_toc.svelte'
-  import Action from '$lib/components/post_action.svelte'
-  import Footer from '$lib/components/footer.svelte'
-  export let post: Urara.Post
-</script>
-
-<Head {post} />
-
-<div class="flex flex-col flex-nowrap justify-center xl:flex-row xl:flex-wrap">
-  <div
-    in:fly={{ x: 25, duration: 300, delay: 500 }}
-    out:fly={{ x: 25, duration: 300 }}
-    class="flex-1 w-full order-first ease-out transform mx-auto xl:mr-0 xl:ml-0">
-    {#if browser}
-      <Action {post} />
-    {/if}
-  </div>
-  <div
-    in:fly={{ x: -25, duration: 300, delay: 500 }}
-    out:fly={{ x: -25, duration: 300 }}
-    class="flex-1 w-full xl:order-last ease-out transform mx-auto xl:ml-0 xl:mr-0">
-    {#if browser && post.toc}
-      <div class="h-full hidden xl:block">
-        <Toc toc={post.toc} />
-      </div>
-    {/if}
-  </div>
-  <div class="flex-none w-full max-w-screen-md mx-auto xl:mx-0">
-    <Card {post}>
-      <slot />
-    </Card>
-    <Footer sticky={true} />
-  </div>
-</div>
diff --git a/src/lib/components/post_layout.svelte b/src/lib/components/post_layout.svelte
deleted file mode 100644
index 52f324f..0000000
--- a/src/lib/components/post_layout.svelte
+++ /dev/null
@@ -1,32 +0,0 @@
-<script lang="ts" context="module">
-  import Image from '$lib/components/prose/img.svelte'
-  import table from '$lib/components/prose/table.svelte'
-  export { Image as img, table }
-</script>
-
-<script lang="ts">
-  import { typeOfPost } from '$lib/utils/posts'
-  import Container from '$lib/components/post_container.svelte'
-  // auto-generated
-  export let path
-  export let slug
-  export let toc
-  // common
-  export let created
-  export let updated
-  export let published
-  export let summary
-  export let tags
-  export let flags
-  // specify
-  export let title
-  export let image
-  export let in_reply_to
-  // post
-  let fm = { path, slug, toc, created, updated, published, summary, tags, flags, title, image, in_reply_to }
-  let post = { type: typeOfPost(fm), ...fm }
-</script>
-
-<Container {post}>
-  <slot />
-</Container>
diff --git a/src/lib/components/post_pagination.svelte b/src/lib/components/post_pagination.svelte
deleted file mode 100644
index a56ccb2..0000000
--- a/src/lib/components/post_pagination.svelte
+++ /dev/null
@@ -1,59 +0,0 @@
-<script lang="ts">
-  import Image from '$lib/components/prose/img.svelte'
-  export let prev: Urara.Post | undefined = undefined
-  export let next: Urara.Post | undefined = undefined
-</script>
-
-<nav class="flex flex-col md:flex-row flex-warp justify-evenly">
-  {#if prev}
-    <div
-      class:image-full={prev['image']}
-      class:md:rounded-r-box={next && !next['image']}
-      class="flex-1 card group rounded-none before:!rounded-none overflow-hidden">
-      {#if prev['image']}
-        <figure class="!block">
-          <Image
-            class="object-center h-full w-full absolute group-hover:scale-105 transition-transform duration-500 ease-in-out"
-            src={prev['image']}
-            alt={prev['alt'] ?? prev['image']} />
-        </figure>
-      {/if}
-      <div class="card-body">
-        <span class="i-heroicons-outline-chevron-left opacity-50 group-hover:opacity-100 mr-auto" />
-        <a
-          rel="prev"
-          href={prev.path}
-          class="card-title block text-left mb-0 mr-auto bg-[length:100%_0%] bg-[position:0_88%] underline decoration-3 decoration-transparent group-hover:decoration-primary hover:bg-[length:100%_100%] hover:text-primary-content bg-gradient-to-t from-primary to-primary bg-no-repeat transition-all ease-in-out duration-300">
-          {prev['title'] ?? prev['summary'] ?? prev.path.slice(1)}
-        </a>
-      </div>
-    </div>
-    {#if next && !next['image'] && !prev['image']}
-      <div class="flex-0 divider mx-4 md:divider-horizontal md:mx-0 md:my-4" />
-    {/if}
-  {/if}
-  {#if next}
-    <div
-      class:image-full={next['image']}
-      class:md:rounded-l-box={prev && !prev['image']}
-      class="flex-1 card group rounded-none before:!rounded-none overflow-hidden">
-      {#if next['image']}
-        <figure class="!block">
-          <Image
-            class="object-center h-full w-full absolute group-hover:scale-105 transition-transform duration-500 ease-in-out"
-            src={next['image']}
-            alt={next['alt'] ?? next['image']} />
-        </figure>
-      {/if}
-      <div class="card-body">
-        <a
-          rel="next"
-          href={next.path}
-          class="card-title block text-right mb-0 ml-auto bg-[length:100%_0%] bg-[position:0_88%] underline decoration-3 decoration-transparent group-hover:decoration-primary hover:bg-[length:100%_100%] hover:text-primary-content bg-gradient-to-t from-primary to-primary bg-no-repeat transition-all ease-in-out duration-300">
-          {next['title'] ?? next['summary'] ?? next.path.slice(1)}
-        </a>
-        <span class="i-heroicons-outline-chevron-right opacity-50 group-hover:opacity-100 ml-auto" />
-      </div>
-    </div>
-  {/if}
-</nav>
diff --git a/src/lib/components/post_reply.svelte b/src/lib/components/post_reply.svelte
deleted file mode 100644
index 4d3c0be..0000000
--- a/src/lib/components/post_reply.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-<script lang="ts">
-  let className = ''
-  export { className as class }
-  export let in_reply_to: Urara.Post['in_reply_to']
-</script>
-
-<div class="flex flex-wrap gap-2 rounded-box outline outline-neutral/10 p-4 {className}">
-  <span class="flex-none font-bold uppercase opacity-30">Reply to:&nbsp;</span>
-  <a
-    href={in_reply_to}
-    rel="noopener noreferrer external"
-    target="_blank"
-    class="ml-auto flex-none flex rounded-badge bg-base-200 hover:bg-base-300 transition-all gap-2 px-4 u-in-reply-to">
-    <span class="i-heroicons-outline-reply my-auto !w-4 !h-4" />
-    {in_reply_to}
-  </a>
-</div>
diff --git a/src/lib/components/post_status.svelte b/src/lib/components/post_status.svelte
deleted file mode 100644
index 6665b95..0000000
--- a/src/lib/components/post_status.svelte
+++ /dev/null
@@ -1,35 +0,0 @@
-<script lang="ts">
-  import { date } from '$lib/config/general'
-  import { site } from '$lib/config/site'
-  export let post: Urara.Post
-  export let preview: boolean = false
-  const stringPublished = new Date(post.published ?? post.created).toLocaleString(date.locales, date.options)
-  const stringUpdated = new Date(post.updated ?? post.published ?? post.created).toLocaleString(date.locales, date.options)
-  const jsonPublished = new Date(post.published ?? post.created).toJSON()
-  const jsonUpdated = new Date(post.updated ?? post.published ?? post.created).toJSON()
-</script>
-
-<div class:md:mb-4={!preview && post.type !== 'article'} class="flex font-semibold gap-1.5">
-  <a
-    class:hidden={preview}
-    rel="author"
-    class="opacity-75 hover:opacity-100 hover:text-primary duration-500 ease-in-out p-author h-card"
-    href={site.protocol + site.domain}>
-    {site.author.name}
-  </a>
-  <span class:hidden={preview} class="opacity-50">/</span>
-  <a href={post.path} class="u-url u-uid swap group/time">
-    <time
-      class="group-hover/time:opacity-0 font-semibold opacity-75 duration-500 ease-in-out mr-auto dt-published"
-      datetime={jsonPublished}
-      itemprop="datePublished">
-      {stringPublished}
-    </time>
-    <time
-      class="opacity-0 group-hover/time:opacity-100 font-semibold text-primary duration-500 ease-in-out mr-auto dt-updated"
-      datetime={jsonUpdated}
-      itemprop="dateModified">
-      {stringUpdated}
-    </time>
-  </a>
-</div>
diff --git a/src/lib/components/post_toc.svelte b/src/lib/components/post_toc.svelte
deleted file mode 100644
index 82a0c1b..0000000
--- a/src/lib/components/post_toc.svelte
+++ /dev/null
@@ -1,80 +0,0 @@
-<script lang="ts" context="module">
-  export const prerender = true
-</script>
-
-<script lang="ts">
-  import { onMount, onDestroy } from 'svelte'
-  export let toc: Urara.Post.Toc[]
-
-  let intersecting: string[] = []
-  let intersectingArticle: boolean = true
-  let bordered: string[] = []
-
-  onMount(() => {
-    if (window.screen.availWidth >= 1280) {
-      const headingsObserver = new IntersectionObserver(
-        headings =>
-          headings.forEach(heading =>
-            heading.isIntersecting
-              ? intersecting.push(heading.target.id)
-              : (intersecting = intersecting.filter(h => h !== heading.target.id))
-          ),
-        { rootMargin: '-64px 0px 0px 0px' }
-      )
-      const articleObserver = new IntersectionObserver(article => (intersectingArticle = article[0].isIntersecting))
-      Array.from(document.querySelectorAll('main h2, main h3, main h4, main h5, main h6')).forEach(element =>
-        headingsObserver.observe(element)
-      )
-      articleObserver.observe(document.getElementsByTagName('main')[0])
-    }
-  })
-
-  onDestroy(() => {
-    // @ts-ignore: Cannot find name 'headingsObserver'
-    if (typeof headingsObserver !== 'undefined') headingsObserver.disconnect()
-    // @ts-ignore: Cannot find name 'articleObserver'
-    if (typeof articleObserver !== 'undefined') articleObserver.disconnect()
-  })
-
-  $: if (intersecting.length > 0) bordered = intersecting
-  $: if (intersectingArticle === false) bordered = []
-  $: if (bordered)
-    toc.forEach(heading =>
-      bordered.includes(heading.slug!)
-        ? document.getElementById(`toc-link-${heading.slug}`)?.classList.add('!border-accent')
-        : document.getElementById(`toc-link-${heading.slug}`)?.classList.remove('!border-accent')
-    )
-</script>
-
-<aside class="sticky top-16 py-8">
-  <nav
-    id="post-toc"
-    aria-label="TableOfContent"
-    dir="rtl"
-    class="max-h-[calc(100vh-12rem)] overflow-y-hidden hover:overflow-y-auto">
-    <ul dir="ltr" id="toc-list-root">
-      {#each toc as { depth, title, slug }}
-        <li id={`toc-item-${slug}`} class="flex flex-col">
-          <!-- svelte-ignore a11y-click-events-have-key-events -->
-          <span
-            dir="ltr"
-            on:click={() =>
-              // @ts-ignore Object is possibly 'null'. ts(2531)
-              document.getElementById(slug).scrollIntoView({ behavior: 'smooth' })}
-            id={`toc-link-${slug}`}
-            class="cursor-pointer border-l-4 border-transparent transition-all hover:border-primary hover:bg-base-content hover:bg-opacity-10 active:bg-primary active:text-primary-content active:font-bold pr-4 {depth <=
-            2
-              ? 'py-3'
-              : 'py-2'}"
-            class:pl-4={depth <= 2}
-            class:pl-8={depth === 3}
-            class:pl-12={depth === 4}
-            class:pl-16={depth === 5}
-            class:pl-20={depth === 6}>
-            {title}
-          </span>
-        </li>
-      {/each}
-    </ul>
-  </nav>
-</aside>