Committed at 23:40, help

README.md

@@ -4,7 +4,6 @@
 
 -   [The Stack](#the-stack)
 -   [Building](#building)
--   [Project Structure](#project-structure)
 
 # The Stack
 
@@ -47,28 +46,3 @@ bun run build
 # Run the build, should be done in a docker container
 bun ./build/index.js
 ```
-
-# Project Structure
-
-```py
-(project root)
-├── src
-│   ├── contrib
-│   │   └── # code to establish a database
-│   ├── lib
-│   │   ├── components
-│   │   │   └── # shadcn components
-│   │   ├── crypto
-│   │   │   └── # modules for handling cryptography
-│   │   ├── drizzle.ts # database schemas
-│   │   └── server
-│   │       └── # server only modules
-│   ├── routes
-│   │   └── # application front-end structure
-│   └── test
-│       └── # automated tests for testing cryptography modules
-├── drizzle
-│   └── # database migration history
-└── static
-    └── # static assets
-```

drizzle/0001_spicy_thena.sql

@@ -0,0 +1,5 @@
+CREATE TABLE `public_assets` (
+	`file_name` text PRIMARY KEY NOT NULL,
+	`type` text NOT NULL,
+	`blob` blob NOT NULL
+);

drizzle/meta/0001_snapshot.json

@@ -0,0 +1,177 @@
+{
+	"version": "6",
+	"dialect": "sqlite",
+	"id": "d18f7878-d194-4bdd-971d-79e9645dc74c",
+	"prevId": "f3c55a7a-8bd7-451f-b5c2-ad2370a0829c",
+	"tables": {
+		"email_addresses": {
+			"name": "email_addresses",
+			"columns": {
+				"email_id": {
+					"name": "email_id",
+					"type": "integer",
+					"primaryKey": true,
+					"notNull": true,
+					"autoincrement": true
+				},
+				"user_id": {
+					"name": "user_id",
+					"type": "text(26)",
+					"primaryKey": false,
+					"notNull": false,
+					"autoincrement": false
+				},
+				"email_address": {
+					"name": "email_address",
+					"type": "text",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false
+				},
+				"is_verified": {
+					"name": "is_verified",
+					"type": "integer",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false,
+					"default": "0"
+				}
+			},
+			"indexes": {
+				"email_addresses_email_address_unique": {
+					"name": "email_addresses_email_address_unique",
+					"columns": ["email_address"],
+					"isUnique": true
+				}
+			},
+			"foreignKeys": {
+				"email_addresses_user_id_users_id_fk": {
+					"name": "email_addresses_user_id_users_id_fk",
+					"tableFrom": "email_addresses",
+					"tableTo": "users",
+					"columnsFrom": ["user_id"],
+					"columnsTo": ["id"],
+					"onDelete": "cascade",
+					"onUpdate": "no action"
+				}
+			},
+			"compositePrimaryKeys": {},
+			"uniqueConstraints": {}
+		},
+		"public_assets": {
+			"name": "public_assets",
+			"columns": {
+				"file_name": {
+					"name": "file_name",
+					"type": "text",
+					"primaryKey": true,
+					"notNull": true,
+					"autoincrement": false
+				},
+				"type": {
+					"name": "type",
+					"type": "text",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false
+				},
+				"blob": {
+					"name": "blob",
+					"type": "blob",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false
+				}
+			},
+			"indexes": {},
+			"foreignKeys": {},
+			"compositePrimaryKeys": {},
+			"uniqueConstraints": {}
+		},
+		"user_aliases": {
+			"name": "user_aliases",
+			"columns": {
+				"id": {
+					"name": "id",
+					"type": "integer",
+					"primaryKey": true,
+					"notNull": true,
+					"autoincrement": true
+				},
+				"user_ref": {
+					"name": "user_ref",
+					"type": "text",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false
+				},
+				"alias_name": {
+					"name": "alias_name",
+					"type": "text",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false
+				}
+			},
+			"indexes": {},
+			"foreignKeys": {
+				"user_aliases_user_ref_users_id_fk": {
+					"name": "user_aliases_user_ref_users_id_fk",
+					"tableFrom": "user_aliases",
+					"tableTo": "users",
+					"columnsFrom": ["user_ref"],
+					"columnsTo": ["id"],
+					"onDelete": "cascade",
+					"onUpdate": "no action"
+				}
+			},
+			"compositePrimaryKeys": {},
+			"uniqueConstraints": {}
+		},
+		"users": {
+			"name": "users",
+			"columns": {
+				"id": {
+					"name": "id",
+					"type": "text",
+					"primaryKey": true,
+					"notNull": true,
+					"autoincrement": false
+				},
+				"display_name": {
+					"name": "display_name",
+					"type": "text",
+					"primaryKey": false,
+					"notNull": false,
+					"autoincrement": false
+				},
+				"username": {
+					"name": "username",
+					"type": "text",
+					"primaryKey": false,
+					"notNull": true,
+					"autoincrement": false
+				}
+			},
+			"indexes": {
+				"users_username_unique": {
+					"name": "users_username_unique",
+					"columns": ["username"],
+					"isUnique": true
+				}
+			},
+			"foreignKeys": {},
+			"compositePrimaryKeys": {},
+			"uniqueConstraints": {}
+		}
+	},
+	"enums": {},
+	"_meta": {
+		"schemas": {},
+		"tables": {},
+		"columns": {}
+	},
+	"internal": {
+		"indexes": {}
+	}
+}

drizzle/meta/_journal.json

@@ -8,6 +8,13 @@
 			"when": 1723761059597,
 			"tag": "0000_open_famine",
 			"breakpoints": true
+		},
+		{
+			"idx": 1,
+			"version": "6",
+			"when": 1723979465707,
+			"tag": "0001_spicy_thena",
+			"breakpoints": true
 		}
 	]
 }

package.json

@@ -50,7 +50,7 @@
 		"bits-ui": "^0.21.13",
 		"clsx": "^2.1.1",
 		"drizzle-orm": "^0.33.0",
-		"lucide-svelte": "^0.427.0",
+		"lucide-svelte": "^0.428.0",
 		"mode-watcher": "^0.4.1",
 		"svelte-radix": "^1.1.0",
 		"tailwind-merge": "^2.5.2",

src/app.css

@@ -28,7 +28,7 @@
 		--accent-foreground: 222.2 47.4% 11.2%;
 
 		--destructive: 0 72.2% 50.6%;
-		--destructive-foreground: 210 40% 98%;
+		--destructive-foreground: 0 73% 56%;
 
 		--ring: 222.2 84% 4.9%;
 
@@ -61,7 +61,7 @@
 		--accent-foreground: 210 40% 98%;
 
 		--destructive: 0 62.8% 30.6%;
-		--destructive-foreground: 210 40% 98%;
+		--destructive-foreground: 0 73% 56%;
 
 		--ring: hsl(212.7, 26.8%, 83.9);
 	}

src/lib/components/account/account-header-component.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { User } from "lucide-svelte";
+
+	import * as Avatar from "@/ui/avatar";
+	import * as DropdownMenu from "@/ui/dropdown-menu";
+	import { goto } from "$app/navigation";
+</script>
+
+<DropdownMenu.Root>
+	<DropdownMenu.Trigger>
+		<Avatar.Root>
+			<Avatar.Image
+				src="https://cdn.d3rpp.dev/haaaaaaaa"
+				alt="Profile Photo"
+			/>
+			<Avatar.Fallback><User /></Avatar.Fallback>
+		</Avatar.Root>
+	</DropdownMenu.Trigger>
+	<DropdownMenu.Content align="end">
+		<DropdownMenu.Item onclick={() => goto("/auth/login")}>
+			Login
+		</DropdownMenu.Item>
+		<DropdownMenu.Item onclick={() => goto("/auth/sign-up")}>
+			Sign Up
+		</DropdownMenu.Item>
+	</DropdownMenu.Content>
+</DropdownMenu.Root>

src/lib/components/account/index.ts

@@ -0,0 +1 @@
+export { default as AccountHeaderComponent } from "./account-header-component.svelte";

src/lib/components/footers/app-footer.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	import ThemeToggle from "@/theme-toggle.svelte";
+</script>
+
+<footer class="border-t border-border/40 bg-background/95">
+	<div
+		class="hidden h-24 max-w-screen-2xl px-4 md:flex md:flex-row md:items-center md:justify-end"
+	>
+		<ThemeToggle />
+	</div>
+</footer>

src/lib/components/footers/index.ts

@@ -0,0 +1,2 @@
+export { default as LandingFooter } from "./landing-footer.svelte";
+export { default as AppFooter } from "./app-footer.svelte";

src/lib/components/footers/landing-footer.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	import ThemeToggle from "@/theme-toggle.svelte";
+</script>
+
+<footer class="border-t border-border/40 bg-background/95">
+	<div
+		class="hidden h-24 max-w-screen-2xl px-4 md:flex md:flex-row md:items-center md:justify-end"
+	>
+		<ThemeToggle />
+	</div>
+</footer>

src/lib/components/headers/app-header.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { APPLICATION_NAME, APPLICATION_ICON } from ".";
 
-	import ThemeToggle from "@/theme-toggle.svelte";
+	import { AccountHeaderComponent } from "@/account";
 </script>
 
 <header
@@ -19,7 +19,7 @@
 		<div
 			class="hidden flex-1 items-center justify-between space-x-2 md:flex md:justify-end"
 		>
-			<ThemeToggle />
+			<AccountHeaderComponent />
 		</div>
 	</div>
 </header>

src/lib/components/headers/index.ts

@@ -2,3 +2,6 @@ import Icons from "../../icons";
 
 export const APPLICATION_NAME = "Jail Bird";
 export const APPLICATION_ICON = Icons.Lock;
+
+export { default as AppHeader } from "./app-header.svelte";
+export { default as LandingHeader } from "./landing-header.svelte";

src/lib/components/headers/landing-header.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { APPLICATION_NAME, APPLICATION_ICON } from ".";
 
-	import ThemeToggle from "@/theme-toggle.svelte";
+	import { AccountHeaderComponent } from "@/account";
 </script>
 
 <header
@@ -19,7 +19,7 @@
 		<div
 			class="hidden flex-1 items-center justify-between space-x-2 md:flex md:justify-end"
 		>
-			<ThemeToggle />
+			<AccountHeaderComponent />
 		</div>
 	</div>
 </header>

src/lib/components/main.svelte

@@ -1,10 +1,22 @@
+<script lang="ts">
+	import { cn } from "$lib/utils";
+	import type { HTMLAttributes } from "svelte/elements";
+	const {
+		class: className,
+
+		children,
+	}: HTMLAttributes<HTMLDivElement> = $props();
+</script>
+
 <!-- 
 	@component
 	
 	This is a reusable `<main>` tag, it has all of the classes to be nice and 
 	usable and can be expanded later to also work on mobile.
 -->
 
-<main class="mx-auto max-w-screen-2xl py-4">
-	<slot />
+<main class={cn("mx-auto max-w-screen-2xl py-4", className)}>
+	{#if children}
+		{@render children()}
+	{/if}
 </main>