editor bug fix

project-ait · Oct 20, 2023 · 7fc9905 · 7fc9905
1 parent e030332
commit 7fc9905
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 22 deletions.
diff --git a/src/lib/components/Input.svelte b/src/lib/components/Input.svelte
@@ -1,22 +1,27 @@
 <script lang="ts">
   import { InsertBeforeSplitContent } from "$lib/utils/InsertBeforeSplitContent";
-  import { onMount } from "svelte";
-  import type { Readable } from "svelte/store";
   import { createEditor, Editor, EditorContent } from "svelte-tiptap";
   import StarterKit from "@tiptap/starter-kit";
+  import { NodeState } from "$lib/store/NodeState";
+  import { onMount } from "svelte";
+  import type { Readable } from "svelte/store";
+  import { goto } from "$app/navigation";
 
-  export let value = `Hello World`;
-  export let ChatNode: HTMLDivElement;
   let test = false;
   let editor: Readable<Editor>;
+
   function onSubmit() {
-    InsertBeforeSplitContent(
-      $editor.getText({ blockSeparator: "\n" }),
-      test,
-      ChatNode
-    );
+    if ($NodeState) {
+      InsertBeforeSplitContent(
+        $editor.getText({ blockSeparator: "\n" }),
+        test,
+        $NodeState
+      );
+    } else {
+      goto("/1");
+    }
+    $editor.commands.setContent(``);
     test = !test;
-    value = "";
   }
   onMount(() => {
     editor = createEditor({
@@ -27,7 +32,6 @@
 </script>
 
 <form on:submit|preventDefault={onSubmit} class="input-form">
-  <!-- Editor 버그 있어서 나중에 고쳐야됨 -->
   <EditorContent editor={$editor} />
   <button type="submit">Enter</button>
 </form>

diff --git a/src/lib/components/Sidebar.svelte b/src/lib/components/Sidebar.svelte
@@ -15,7 +15,7 @@
     <ul class="side-chats">
       {#each new Array(15).fill("") as arr, i}
         <li class="side-chat">
-          <a href="/1" class="side-chat-btn">
+          <a href="/test" class="side-chat-btn">
             <div class="side-chat-title">
               <i />
               <span>Chat Btn</span>

diff --git a/src/lib/store/NodeState.ts b/src/lib/store/NodeState.ts
@@ -0,0 +1,3 @@
+import { writable } from "svelte/store";
+
+export const NodeState = writable<HTMLDivElement | null>(null);
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+  import Input from "$lib/components/Input.svelte";
   import Sidebar from "$lib/components/Sidebar.svelte";
   import "./styles.css";
 </script>
@@ -7,6 +8,7 @@
   <!-- Header 필요시 Header Component 추가 -->
   <main>
     <Sidebar />
+    <Input />
     <slot />
   </main>
   <!-- Footer 필요시 Footer Component 추가 -->

diff --git a/src/routes/[id]/+page.server.ts b/src/routes/[id]/+page.server.ts
@@ -0,0 +1 @@
+// 채팅 기록 가져오기
diff --git a/src/routes/[id]/+page.svelte b/src/routes/[id]/+page.svelte
@@ -1,11 +1,17 @@
 <script lang="ts">
-  import Input from "$lib/components/Input.svelte";
+  import { NodeState } from "$lib/store/NodeState";
+  import { onDestroy, onMount } from "svelte";
+
   let ChatNode: HTMLDivElement;
-  let value = "";
+  onMount(() => {
+    $NodeState = ChatNode;
+  });
+  onDestroy(() => {
+    $NodeState = null;
+  });
 </script>
 
 <div bind:this={ChatNode} class="chat-blocks main-width" />
-<Input bind:value bind:ChatNode />
 
 <style>
   .chat-blocks {
@@ -15,6 +21,4 @@
     background-color: #343540;
     padding: 100px 0;
   }
-
-  /*  */
 </style>
diff --git a/src/routes/[id]/+page.ts b/src/routes/[id]/+page.ts
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import { writable } from "svelte/store";

		export const NodeState = writable<HTMLDivElement \| null>(null);