Hugging Face's logo

Spaces:
enzostvs
/
lora-studio
Running on CPU Upgrade

App Files Community
17
lora-studio
File size: 1,795 Bytes 
d6da254
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
83d9f5e
 
 
d6da254
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
 
<script lang="ts">
  import Button from "$lib/components/Button.svelte";
	import type { ModelCard, CommentType } from "$lib/type";
  import Comment from "./Comment.svelte";

  export let comments: CommentType[] = [];
  export let model: ModelCard;

  let text = "";
  let loading = false;
  let error: string | undefined = undefined;

  const handleSubmit = async () => {
    loading = true;
    const comment_request = await fetch(`/api/models/${model?.id?.replace("/", "@")}/comments`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({ text }),
    });

    const comment_response = await comment_request.json();
    if (comment_response.error) {
      error = comment_response.error;
    } else {
      comments = [comment_response.comment, ...comments];
      text = "";
    }
    loading = false;
  }

  const handleChange = async (event: any) => {
    text = event.target.value;
  }
</script>

<div>
  <div class="grid grid-cols-1 gap-3">
    {#if comments?.length === 0}
      <p class="text-neutral-500 text-sm">No comments yet! Be the first one!</p>
    {/if}
    {#each comments as comment}
      <Comment comment={comment} />
    {/each}
  </div>
  <div class="flex gap-4 items-start justify-between flex-col lg:flex-row mt-7">
    <textarea
      value={text}
      class="rounded-xl bg-neutral-900 text-neutral-200 text-base placeholder:text-neutral-500 outline-none resize-none p-4 w-full"
      placeholder="Write a comment..."
      on:input={handleChange}
    />
    <Button
      theme="blue"
      size="md"
      icon="carbon:send-alt-filled"
      iconPosition="right"
      loading={loading}
      disabled={text.length < 3}
      onClick={handleSubmit}
    >
      Post
    </Button>
  </div>
</div>