init

.gitignore

@@ -0,0 +1,12 @@
+# dotenv environment variable files
+.env
+.env.development.local
+.env.test.local
+.env.production.local
+.env.local
+
+# Fresh build directory
+_fresh/
+# npm dependencies
+node_modules/
+/local

.vscode/extensions.json

@@ -0,0 +1,5 @@
+{
+  "recommendations": [
+    "denoland.vscode-deno"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,18 @@
+{
+	"deno.enable": true,
+	"deno.lint": true,
+	"deno.unstable": true,
+	"editor.defaultFormatter": "denoland.vscode-deno",
+	"[typescriptreact]": {
+		"editor.defaultFormatter": "denoland.vscode-deno"
+	},
+	"[typescript]": {
+		"editor.defaultFormatter": "denoland.vscode-deno"
+	},
+	"[javascriptreact]": {
+		"editor.defaultFormatter": "denoland.vscode-deno"
+	},
+	"[javascript]": {
+		"editor.defaultFormatter": "denoland.vscode-deno"
+	}
+}

README.md

@@ -0,0 +1,16 @@
+# Fresh project
+
+Your new Fresh project is ready to go. You can follow the Fresh "Getting
+Started" guide here: https://fresh.deno.dev/docs/getting-started
+
+### Usage
+
+Make sure to install Deno: https://deno.land/manual/getting_started/installation
+
+Then start the project:
+
+```
+deno task start
+```
+
+This will watch the project directory and restart as necessary.

components/Button.tsx

@@ -0,0 +1,12 @@
+import { JSX } from "preact";
+import { IS_BROWSER } from "$fresh/runtime.ts";
+
+export function Button(props: JSX.HTMLAttributes<HTMLButtonElement>) {
+  return (
+    <button
+      {...props}
+      disabled={!IS_BROWSER || props.disabled}
+      class="px-2 py-1 border-gray-500 border-2 rounded bg-white hover:bg-gray-200 transition-colors"
+    />
+  );
+}

deno.json

@@ -0,0 +1,39 @@
+{
+	"lock": false,
+	"tasks": {
+		"check": "deno fmt --check && deno lint && deno check **/*.ts && deno check **/*.tsx",
+		"cli": "echo \"import '\\$fresh/src/dev/cli.ts'\" | deno run --unstable -A -",
+		"manifest": "deno task cli manifest $(pwd)",
+		"start": "deno run -A --unstable --watch=static/,routes/ dev.ts",
+		"build": "deno run -A dev.ts build",
+		"preview": "deno run -A main.ts",
+		"update": "deno run -A -r https://fresh.deno.dev/update ."
+	},
+	"lint": {
+		"rules": {
+			"tags": [
+				"fresh",
+				"recommended"
+			]
+		}
+	},
+	"exclude": [
+		"**/_fresh/*"
+	],
+	"imports": {
+		"$fresh/": "https://deno.land/x/fresh@1.6.8/",
+		"preact": "https://esm.sh/preact@10.19.6",
+		"preact/": "https://esm.sh/preact@10.19.6/",
+		"@preact/signals": "https://esm.sh/*@preact/signals@1.2.2",
+		"@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.5.1",
+		"$std/": "https://deno.land/std@0.216.0/"
+	},
+	"compilerOptions": {
+		"jsx": "react-jsx",
+		"jsxImportSource": "preact"
+	},
+	"fmt": {
+		"useTabs": true,
+		"lineWidth": 120
+	}
+}

dev.ts

@@ -0,0 +1,8 @@
+#!/usr/bin/env -S deno run -A --watch=static/,routes/
+
+import dev from "$fresh/dev.ts";
+import config from "./fresh.config.ts";
+
+import "$std/dotenv/load.ts";
+
+await dev(import.meta.url, "./main.ts", config);

doc/models.md

@@ -0,0 +1,42 @@
+## Views
+
+- Home
+  - Landing
+  - Feed (logged)
+
+- Post
+  - new
+  - view
+    - likes
+      - add (logged)
+    - comment section
+      - new (logged)
+
+## Models
+
+- User
+  - name
+  - email
+  - password
+  - pfp_url
+  * posts
+  * comments
+  * like_set
+
+- Post
+  - title
+  - content
+  - date
+  - like_count
+  + author
+  * comments
+
+- Comment
+  - date
+  + post
+  + author
+
+---
+
+- trend algo ?
+- notifications ?

fresh.config.ts

@@ -0,0 +1,3 @@
+import { defineConfig } from "$fresh/server.ts";
+
+export default defineConfig({});

fresh.gen.ts

@@ -0,0 +1,27 @@
+// DO NOT EDIT. This file is generated by Fresh.
+// This file SHOULD be checked into source version control.
+// This file is automatically updated during development when running `dev.ts`.
+
+import * as $_404 from "./routes/_404.tsx";
+import * as $_app from "./routes/_app.tsx";
+import * as $api_joke from "./routes/api/joke.ts";
+import * as $greet_name_ from "./routes/greet/[name].tsx";
+import * as $index from "./routes/index.tsx";
+import * as $Counter from "./islands/Counter.tsx";
+import { type Manifest } from "$fresh/server.ts";
+
+const manifest = {
+	routes: {
+		"./routes/_404.tsx": $_404,
+		"./routes/_app.tsx": $_app,
+		"./routes/api/joke.ts": $api_joke,
+		"./routes/greet/[name].tsx": $greet_name_,
+		"./routes/index.tsx": $index,
+	},
+	islands: {
+		"./islands/Counter.tsx": $Counter,
+	},
+	baseUrl: import.meta.url,
+} satisfies Manifest;
+
+export default manifest;

islands/Counter.tsx

@@ -0,0 +1,16 @@
+import type { Signal } from "@preact/signals";
+import { Button } from "../components/Button.tsx";
+
+interface CounterProps {
+  count: Signal<number>;
+}
+
+export default function Counter(props: CounterProps) {
+  return (
+    <div class="flex gap-8 py-6">
+      <Button onClick={() => props.count.value -= 1}>-1</Button>
+      <p class="text-3xl tabular-nums">{props.count}</p>
+      <Button onClick={() => props.count.value += 1}>+1</Button>
+    </div>
+  );
+}

main.ts

@@ -0,0 +1,14 @@
+/// <reference no-default-lib="true" />
+/// <reference lib="dom" />
+/// <reference lib="dom.iterable" />
+/// <reference lib="dom.asynciterable" />
+/// <reference lib="deno.ns" />
+/// <reference lib="deno.unstable" />
+
+import "$std/dotenv/load.ts";
+
+import { start } from "$fresh/server.ts";
+import manifest from "./fresh.gen.ts";
+import config from "./fresh.config.ts";
+
+await start(manifest, config);

routes/_404.tsx

@@ -0,0 +1,27 @@
+import { Head } from "$fresh/runtime.ts";
+
+export default function Error404() {
+  return (
+    <>
+      <Head>
+        <title>404 - Page not found</title>
+      </Head>
+      <div class="px-4 py-8 mx-auto bg-[#86efac]">
+        <div class="max-w-screen-md mx-auto flex flex-col items-center justify-center">
+          <img
+            class="my-6"
+            src="/logo.svg"
+            width="128"
+            height="128"
+            alt="the Fresh logo: a sliced lemon dripping with juice"
+          />
+          <h1 class="text-4xl font-bold">404 - Page not found</h1>
+          <p class="my-4">
+            The page you were looking for doesn't exist.
+          </p>
+          <a href="/" class="underline">Go back home</a>
+        </div>
+      </div>
+    </>
+  );
+}

routes/_app.tsx

@@ -0,0 +1,16 @@
+import { type PageProps } from "$fresh/server.ts";
+export default function App({ Component }: PageProps) {
+  return (
+    <html>
+      <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>twifeur</title>
+        <link rel="stylesheet" href="/styles.css" />
+      </head>
+      <body>
+        <Component />
+      </body>
+    </html>
+  );
+}

routes/api/joke.ts

@@ -0,0 +1,21 @@
+import { FreshContext } from "$fresh/server.ts";
+
+// Jokes courtesy of https://punsandoneliners.com/randomness/programmer-jokes/
+const JOKES = [
+  "Why do Java developers often wear glasses? They can't C#.",
+  "A SQL query walks into a bar, goes up to two tables and says “can I join you?”",
+  "Wasn't hard to crack Forrest Gump's password. 1forrest1.",
+  "I love pressing the F5 key. It's refreshing.",
+  "Called IT support and a chap from Australia came to fix my network connection.  I asked “Do you come from a LAN down under?”",
+  "There are 10 types of people in the world. Those who understand binary and those who don't.",
+  "Why are assembly programmers often wet? They work below C level.",
+  "My favourite computer based band is the Black IPs.",
+  "What programme do you use to predict the music tastes of former US presidential candidates? An Al Gore Rhythm.",
+  "An SEO expert walked into a bar, pub, inn, tavern, hostelry, public house.",
+];
+
+export const handler = (_req: Request, _ctx: FreshContext): Response => {
+  const randomIndex = Math.floor(Math.random() * JOKES.length);
+  const body = JOKES[randomIndex];
+  return new Response(body);
+};

routes/greet/[name].tsx

@@ -0,0 +1,5 @@
+import { PageProps } from "$fresh/server.ts";
+
+export default function Greet(props: PageProps) {
+  return <div>Hello {props.params.name}</div>;
+}

routes/index.tsx

@@ -0,0 +1,39 @@
+import { useSignal } from "@preact/signals";
+import Counter from "../islands/Counter.tsx";
+import { Handlers } from "$fresh/server.ts";
+import { getCookies } from "$std/http/cookie.ts";
+import { User } from "../storage/models/User.ts";
+
+interface Data {
+	user: User;
+}
+
+export const handler: Handlers = {
+	GET(req, ctx) {
+		const cookies = getCookies(req.headers);
+		return ctx.render!({ allowed: cookies.auth === "bar" });
+	},
+};
+
+export default function Home() {
+	const count = useSignal(3);
+	return (
+		<div class="px-4 py-8 mx-auto bg-[#86efac]">
+			<div class="max-w-screen-md mx-auto flex flex-col items-center justify-center">
+				<img
+					class="my-6"
+					src="/logo.svg"
+					width="128"
+					height="128"
+					alt="the Fresh logo: a sliced lemon dripping with juice"
+				/>
+				<h1 class="text-4xl font-bold">Welcome to Fresh</h1>
+				<p class="my-4">
+					Try updating this message in the
+					<code class="mx-2">./routes/index.tsx</code> file, and refresh.
+				</p>
+				<Counter count={count} />
+			</div>
+		</div>
+	);
+}

static/logo.svg

@@ -0,0 +1,6 @@
+<svg width="40" height="40" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M34.092 8.845C38.929 20.652 34.092 27 30 30.5c1 3.5-2.986 4.222-4.5 2.5-4.457 1.537-13.512 1.487-20-5C2 24.5 4.73 16.714 14 11.5c8-4.5 16-7 20.092-2.655Z" fill="#FFDB1E"/>
+  <path d="M14 11.5c6.848-4.497 15.025-6.38 18.368-3.47C37.5 12.5 21.5 22.612 15.5 25c-6.5 2.587-3 8.5-6.5 8.5-3 0-2.5-4-5.183-7.75C2.232 23.535 6.16 16.648 14 11.5Z" fill="#fff" stroke="#FFDB1E"/>
+  <path d="M28.535 8.772c4.645 1.25-.365 5.695-4.303 8.536-3.732 2.692-6.606 4.21-7.923 4.83-.366.173-1.617-2.252-1.617-1 0 .417-.7 2.238-.934 2.326-1.365.512-4.223 1.29-5.835 1.29-3.491 0-1.923-4.754 3.014-9.122.892-.789 1.478-.645 2.283-.645-.537-.773-.534-.917.403-1.546C17.79 10.64 23 8.77 25.212 8.42c.366.014.82.35.82.629.41-.14 2.095-.388 2.503-.278Z" fill="#FFE600"/>
+  <path d="M14.297 16.49c.985-.747 1.644-1.01 2.099-2.526.566.121.841-.08 1.29-.701.324.466 1.657.608 2.453.701-.715.451-1.057.852-1.452 2.106-1.464-.611-3.167-.302-4.39.42Z" fill="#fff"/>
+</svg>

static/styles.css

@@ -0,0 +1,129 @@
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+* {
+  margin: 0;
+}
+button {
+  color: inherit;
+}
+button, [role="button"] {
+  cursor: pointer;
+}
+code {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+    "Liberation Mono", "Courier New", monospace;
+  font-size: 1em;
+}
+img,
+svg {
+  display: block;
+}
+img,
+video {
+  max-width: 100%;
+  height: auto;
+}
+
+html {
+  line-height: 1.5;
+  -webkit-text-size-adjust: 100%;
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+.transition-colors {
+  transition-property: background-color, border-color, color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+.my-6 {
+  margin-bottom: 1.5rem;
+  margin-top: 1.5rem;
+}
+.text-4xl {
+  font-size: 2.25rem;
+  line-height: 2.5rem;
+}
+.mx-2 {
+  margin-left: 0.5rem;
+  margin-right: 0.5rem;
+}
+.my-4 {
+  margin-bottom: 1rem;
+  margin-top: 1rem;
+}
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+.px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+.py-8 {
+  padding-bottom: 2rem;
+  padding-top: 2rem;
+}
+.bg-\[\#86efac\] {
+  background-color: #86efac;
+}
+.text-3xl {
+  font-size: 1.875rem;
+  line-height: 2.25rem;
+}
+.py-6 {
+  padding-bottom: 1.5rem;
+  padding-top: 1.5rem;
+}
+.px-2 {
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+.py-1 {
+  padding-bottom: 0.25rem;
+  padding-top: 0.25rem;
+}
+.border-gray-500 {
+  border-color: #6b7280;
+}
+.bg-white {
+  background-color: #fff;
+}
+.flex {
+  display: flex;
+}
+.gap-8 {
+  grid-gap: 2rem;
+  gap: 2rem;
+}
+.font-bold {
+  font-weight: 700;
+}
+.max-w-screen-md {
+  max-width: 768px;
+}
+.flex-col {
+  flex-direction: column;
+}
+.items-center {
+  align-items: center;
+}
+.justify-center {
+  justify-content: center;
+}
+.border-2 {
+  border-width: 2px;
+}
+.rounded {
+  border-radius: 0.25rem;
+}
+.hover\:bg-gray-200:hover {
+  background-color: #e5e7eb;
+}
+.tabular-nums {
+  font-variant-numeric: tabular-nums;
+}

storage/models/User.ts

@@ -0,0 +1,9 @@
+import { z } from "https://deno.land/x/zod@v3.23.8/mod.ts";
+
+export const UserModel = z.object({
+	id: z.string().uuid().describe("primary"),
+	name: z.string(),
+	email: z.string(),
+	password: z.string(),
+	pfp_url: z.string(),
+});

storage/store.ts

@@ -0,0 +1,58 @@
+import { createPentagon } from "https://deno.land/x/pentagon@v0.1.5/mod.ts";
+import { project_root_dir } from "../utils.ts";
+import { z } from "https://deno.land/x/zod@v3.21.4/mod.ts";
+import mimeDbV1520 from "$std/media_types/vendor/mime-db.v1.52.0.ts";
+
+const kv = await Deno.openKv(project_root_dir() + "local/kv");
+
+export type User = z.infer<typeof user_model>;
+export const user_model = z.object({
+	id: z.string().uuid().describe("primary"),
+	name: z.string(),
+	email: z.string(),
+	password: z.string(),
+	pfp_url: z.string(),
+	like_set: z.set(z.string().uuid()),
+});
+
+export type Post = z.infer<typeof post_model>;
+export const post_model = z.object({
+	id: z.string().uuid().describe("primary"),
+	title: z.string(),
+	content: z.string(),
+	date: z.number(),
+	like_count: z.number(),
+	author_id: z.string().uuid(),
+});
+
+export type Comment = z.infer<typeof comment_model>;
+export const comment_model = z.object({
+	id: z.string().uuid().describe("primary"),
+	date: z.number(),
+	post_id: z.string().uuid(),
+	author_id: z.string().uuid(),
+});
+
+export const db = createPentagon(kv, {
+	users: {
+		schema: user_model,
+		relations: {
+			posts: ["posts", [post_model], "id", "author_id"],
+			comments: ["comments", [comment_model], "id", "author_id"],
+		},
+	},
+	posts: {
+		schema: post_model,
+		relations: {
+			author: ["users", user_model, "author_id", "id"],
+			comments: ["comments", [comment_model], "id", "post_id"],
+		},
+	},
+	comments: {
+		schema: comment_model,
+		relations: {
+			author: ["users", user_model, "author_id", "id"],
+			post: ["post", post_model, "post_id", "id"],
+		},
+	},
+});

utils.ts

@@ -0,0 +1,7 @@
+import { dirname } from "$std/path/dirname.ts";
+
+export function project_root_dir() {
+	const this_url = new URL(import.meta.url);
+	const this_dir = dirname(this_url.pathname);
+	return this_dir + "/";
+}