2023-04-28 19:48:34 -04:00
|
|
|
import { useState } from "preact/hooks";
|
|
|
|
|
import { Database } from "types";
|
|
|
|
|
import { Head } from "$fresh/runtime.ts";
|
|
|
|
|
import { DEFAULT_STYLE } from "style";
|
|
|
|
|
import { fetch_db } from "db";
|
|
|
|
|
import { URL } from "utils";
|
2023-04-28 20:20:05 -04:00
|
|
|
import ConversationLink from "components/ConversationLink.tsx";
|
|
|
|
|
import WithStyleSheet from "components/WithStyleSheet.tsx";
|
|
|
|
|
import Meta from "components/Meta.tsx";
|
2023-04-28 19:48:34 -04:00
|
|
|
|
|
|
|
|
export default function Home({ db }: { db: Database }) {
|
|
|
|
|
const [data, setData] = useState(db);
|
|
|
|
|
|
|
|
|
|
const links = Object.keys(data.conversations)
|
|
|
|
|
.reverse()
|
|
|
|
|
.map(c => <ConversationLink conv={c} db={data} interactive={true} />);
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<Head>
|
|
|
|
|
<title>Freshter Logs</title>
|
|
|
|
|
</Head>
|
2023-04-28 20:20:05 -04:00
|
|
|
<Meta
|
|
|
|
|
title="freshter logs"
|
|
|
|
|
description="append-only pester logs, built with fresh"
|
|
|
|
|
after_slash=""
|
|
|
|
|
color="#FFD80B"
|
|
|
|
|
></Meta>
|
2023-04-28 19:48:34 -04:00
|
|
|
<WithStyleSheet href="/index.css" />
|
|
|
|
|
<a href="/">
|
|
|
|
|
<h1 className="title" style={DEFAULT_STYLE}>
|
|
|
|
|
freshter logs
|
|
|
|
|
</h1>
|
|
|
|
|
</a>
|
|
|
|
|
<MakeConversation
|
|
|
|
|
onsubmit={async () => (await fetch_db()).map(db => setData(db))}
|
|
|
|
|
/>
|
|
|
|
|
{links}
|
|
|
|
|
<div className="promo" style={DEFAULT_STYLE}>
|
2023-04-28 20:30:17 -04:00
|
|
|
by <a href="https://pl.pyrope.net/terezi">mehbark</a>; code{" "}
|
|
|
|
|
<a href="https://git.pyrope.net/mbk/freshter-logs">here</a>
|
2023-04-28 19:48:34 -04:00
|
|
|
</div>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function MakeConversation({ onsubmit }: { onsubmit?: () => void }) {
|
|
|
|
|
const [name, setName] = useState("");
|
|
|
|
|
const [desc, setDesc] = useState("");
|
|
|
|
|
|
|
|
|
|
async function handleClick() {
|
|
|
|
|
await fetch(`${URL}/api/conv`, {
|
|
|
|
|
method: "PUT",
|
|
|
|
|
body: JSON.stringify({ name, description: desc }),
|
|
|
|
|
});
|
|
|
|
|
setName("");
|
|
|
|
|
setDesc("");
|
|
|
|
|
onsubmit && onsubmit();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<WithStyleSheet href="/MakeConversation.css" />
|
|
|
|
|
<div className="make-conversation">
|
|
|
|
|
<input
|
|
|
|
|
value={name}
|
|
|
|
|
onInput={(e: any) => setName(e.target.value)}
|
|
|
|
|
className="mc-name"
|
|
|
|
|
placeholder="name"
|
|
|
|
|
/>
|
|
|
|
|
<textarea
|
|
|
|
|
value={desc}
|
|
|
|
|
onInput={(e: any) => setDesc(e.target.value)}
|
|
|
|
|
className="mc-desc"
|
|
|
|
|
placeholder="description"
|
|
|
|
|
/>
|
|
|
|
|
<button className="mc-submit" onClick={handleClick}>
|
|
|
|
|
create
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//TODO: making new conversations
|
|
|
|
|
//TODO: ui obv
|
|
|
|
|
|
|
|
|
|
//TODO: adding presets to convs (i think i'll have global presets be just manual tbh, people can email)
|
|
|
|
|
|
|
|
|
|
//TODO: conversation browser (ez)
|
|
|
|
|
//TODO: maybe preview but ehh name and description sbs
|
|
|
|
|
//TODO: oo def integrate their custom colors
|
