Chattery

Public

Code

HTTP

/** @jsxImportSource https://esm.sh/react@18.2.0 */

import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";

import React, { useEffect, useRef, useState } from "https://esm.sh/react@18.2.0";

function App() {

const [messages, setMessages] = useState([]);

const [input, setInput] = useState("");

const [isLoading, setIsLoading] = useState(false);

const messagesEndRef = useRef(null);

const scrollToBottom = () => {

messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });

};

useEffect(scrollToBottom, [messages]);

const handleSubmit = async (e) => {

e.preventDefault();

if (!input.trim()) return;

const newMessages = [...messages, { role: "user", content: input }];

setMessages(newMessages);

setInput("");

setIsLoading(true);

try {

const response = await fetch("/chat", {

method: "POST",

body: JSON.stringify({ messages: newMessages }),

});

if (!response.ok) throw new Error("Chat request failed");

const reader = response.body?.getReader();

const decoder = new TextDecoder();

let aiResponse = "";

Val Town is a social website to write and deploy JavaScript.

Build APIs and schedule functions from your browser.

Comments

Nobody has commented on this val yet: be the first!

Updated: March 2, 2025