* WIP embedded app * WIP got response from backend in embedded app * WIP streaming prints to embedded app * implemented streaming and tailwind min for styling into embedded app * WIP embedded app history functional * load params from script tag into embedded app * rough in modularization of embed chat cleanup dev process for easier dev support move all chat to components todo: build process todo: backend support * remove eslint config * Implement models and cleanup embed chat endpoints Improve build process for embed prod minification and bundle size awareness WIP * forgot files * rename to embed folder * introduce chat modal styles * add middleware validations on embed chat * auto open param and default greeting * reset chat history * Admin embed config page * Admin Embed Chats mgmt page * update embed * nonpriv * more style support reopen if chat was last opened * update comments * remove unused imports * allow change of workspace for embedconfig * update failure to lookup message * update reset script * update instructions * Add more styling options Add sponsor text at bottom Support dynamic container height Loading animations * publish new embed script * Add back syntax highlighting and keep bundle small via dynamic script build * add hint * update readme * update copy model for snippet with link to styles --------- Co-authored-by: timothycarambat <rambat1010@gmail.com>
53 lines
1.5 KiB
JavaScript
53 lines
1.5 KiB
JavaScript
import useGetScriptAttributes from "@/hooks/useScriptAttributes";
|
|
import useSessionId from "@/hooks/useSessionId";
|
|
import useOpenChat from "@/hooks/useOpen";
|
|
import Head from "@/components/Head";
|
|
import OpenButton from "@/components/OpenButton";
|
|
import ChatWindow from "./components/ChatWindow";
|
|
import { useEffect } from "react";
|
|
|
|
export default function App() {
|
|
const { isChatOpen, toggleOpenChat } = useOpenChat();
|
|
const embedSettings = useGetScriptAttributes();
|
|
const sessionId = useSessionId();
|
|
|
|
useEffect(() => {
|
|
if (embedSettings.openOnLoad === "on") {
|
|
toggleOpenChat(true);
|
|
}
|
|
}, [embedSettings.loaded]);
|
|
|
|
if (!embedSettings.loaded) return null;
|
|
return (
|
|
<>
|
|
<Head />
|
|
<div className="fixed bottom-0 right-0 mb-4 mr-4 z-50">
|
|
<div
|
|
style={{
|
|
width: isChatOpen ? 320 : "auto",
|
|
height: isChatOpen ? "93vh" : "auto",
|
|
}}
|
|
className={`${
|
|
isChatOpen
|
|
? "max-w-md px-4 py-2 bg-white rounded-lg border shadow-lg w-72"
|
|
: "w-16 h-16 rounded-full"
|
|
}`}
|
|
>
|
|
{isChatOpen && (
|
|
<ChatWindow
|
|
closeChat={() => toggleOpenChat(false)}
|
|
settings={embedSettings}
|
|
sessionId={sessionId}
|
|
/>
|
|
)}
|
|
<OpenButton
|
|
settings={embedSettings}
|
|
isOpen={isChatOpen}
|
|
toggleOpen={() => toggleOpenChat(true)}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|