Create article editor route

package.json

@@ -1,6 +1,6 @@
 {
   "name": "alexandria",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "private": true,
   "type": "module",
   "scripts": {

src/lib/Toc.svelte

@@ -1,24 +0,0 @@
-<script lang="ts">
-	import type { NDKEvent } from '@nostr-dev-kit/ndk';
- 	import {nip19} from 'nostr-tools';
-	export let notes: NDKEvent[] = [];
-    // check if notes is empty
-    if (notes.length === 0) {
-        console.debug('notes is empty');
-    }
-</script>
-
-<div class="toc">
-	<h2>Table of contents</h2>
-	<ul>
-		{#each notes as note}
-			<li><a href="#{nip19.noteEncode(note.id)}">{note.getMatchingTags('title')[0][1]}</a></li>
-		{/each}
-	</ul>
-</div>
-
-<style>
-	.toc h2 {
-		text-align: center;
-	}
-</style>

src/lib/components/Article.svelte

@@ -6,7 +6,7 @@
   import showdown from 'showdown';
   import { onMount } from 'svelte';
   import { BookOutline } from 'flowbite-svelte-icons';
-  import { zettelKinds } from './consts';
+  import { zettelKinds } from '../consts';
 
   export let index: NDKEvent | null | undefined;
 

src/lib/components/ArticleHeader.svelte

@@ -2,10 +2,10 @@
   import { page } from "$app/stores";
   import { neventEncode } from "$lib/utils";
   import type { NDKEvent } from "@nostr-dev-kit/ndk";
-  import { standardRelays } from "./consts";
+  import { standardRelays } from "../consts";
   import { Card, Button, Modal, Tooltip } from "flowbite-svelte";
   import { ClipboardCheckOutline, ClipboardCleanOutline, CodeOutline, ShareNodesOutline } from "flowbite-svelte-icons";
-  import { ndk } from "./ndk";
+  import { ndk } from "../ndk";
 
   export let event: NDKEvent;
 

src/lib/components/EditorArticle.svelte

@@ -0,0 +1,5 @@
+<script lang='ts'>
+
+  export let html: string;
+
+</script>

src/lib/components/Toc.svelte

@@ -2,7 +2,10 @@
 	import type { NDKEvent } from '@nostr-dev-kit/ndk';
  	import {nip19} from 'nostr-tools';
 	export let notes: NDKEvent[] = [];
-    console.debug(notes);
+    // check if notes is empty
+    if (notes.length === 0) {
+        console.debug('notes is empty');
+    }
 </script>
 
 <div class="toc">

src/routes/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import ArticleHeader from "$lib/ArticleHeader.svelte";
+  import ArticleHeader from "$lib/components/ArticleHeader.svelte";
   import { FeedType, indexKind, standardRelays } from "$lib/consts";
   import { ndk } from "$lib/ndk";
   import { filterValidIndexEvents } from "$lib/utils";

src/routes/[id]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import Article from '$lib/Article.svelte';
+	import Article from '$lib/components/Article.svelte';
 	import type { PageData } from './$types';
 
 	export let data: PageData;

src/routes/d/[tag]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import Article from '$lib/Article.svelte';
+	import Article from '$lib/components/Article.svelte';
   import { ndk } from '$lib/ndk';
   import { TextPlaceholder } from 'flowbite-svelte';
   import type { PageData } from './$types';

src/routes/new/edit/+page.svelte

@@ -15,12 +15,12 @@
   };
 
   const hidePreview = () => {
-    isEditing = false;
+    isEditing = true;
   };
 </script>
 
-<main>
-  <form>
+<main class='w-full flex justify-center'>
+  <form class='max-w-2xl w-full'>
     <div class='flex flex-col space-y-4'>
       <div>
         <Label for='article-title' class='mb-2'>Article Title</Label>