Fix the migration and adds faker (#17)

migrations/0001_magical_harry_osborn.sql

@@ -1,4 +1,8 @@
-ALTER TABLE `users` RENAME COLUMN `username` TO `stagehandle`;--> statement-breakpoint
-DROP INDEX IF EXISTS `users_username_unique`;--> statement-breakpoint
-ALTER TABLE `users` ADD `private` integer DEFAULT true NOT NULL;--> statement-breakpoint
-CREATE UNIQUE INDEX `users_stagehandle_unique` ON `users` (`stagehandle`);
+ALTER TABLE `users`
+RENAME COLUMN `username` TO `stagehandle`;
+
+DROP INDEX IF EXISTS `users_username_unique`;
+
+ALTER TABLE `users` ADD `private` integer DEFAULT true NOT NULL;
+
+CREATE UNIQUE INDEX `users_stagehandle_unique` ON `users` (`stagehandle`);

package.json

@@ -23,6 +23,7 @@
 		"**/*": "prettier --write --ignore-unknown"
 	},
 	"devDependencies": {
+		"@faker-js/faker": "^9.0.3",
 		"@playwright/test": "^1.28.1",
 		"@sveltejs/adapter-cloudflare": "^4.7.2",
 		"@sveltejs/kit": "^2.0.0",

src/lib/server/db/users.ts

@@ -15,6 +15,7 @@ export async function fetchManyUsers(params?: {
 	offset?: number;
 	limit?: number;
 	includeDeleted?: boolean;
+	includePrivate?: boolean;
 }): Promise<SelectUser[]> {
 	const users = await db
 		.select()
@@ -24,6 +25,7 @@ export async function fetchManyUsers(params?: {
 		.where(
 			and(
 				params?.includeDeleted ? undefined : isNull(usersTable.deletedAt),
+				params?.includePrivate ? undefined : eq(usersTable.isPrivate, false),
 				like(usersTable.stagehandle, '%' + (params?.stageHandle ?? '') + '%')
 			)
 		)

src/lib/utils/faker/index.ts

@@ -0,0 +1,8 @@
+import { Faker, en } from '@faker-js/faker';
+
+export function generateFakeStagehandle(id?: number): string {
+	const faker = new Faker({ locale: [en] });
+	faker.seed(id);
+	const name = faker.person.firstName().toLowerCase();
+	return name;
+}

src/routes/+page.server.ts

@@ -7,9 +7,24 @@ import { redirect } from '@sveltejs/kit';
 import { issueJWT, checkPassword } from '$lib/server/crypto';
 import { fetchUserWithPasswordByStageHandle } from '$lib/server/db/users';
 import { LoginSchema } from '$lib/utils';
+import { generateFakeStagehandle } from '$lib/utils/faker';
 
 export const load: PageServerLoad = async ({ url }) => {
-	const users = await fetchManyUsers();
+	const rawUsers = await fetchManyUsers({ includePrivate: true, limit: 10 });
+	const users = rawUsers.map((u) => {
+		if (u.isPrivate) {
+			return {
+				isPrivate: true,
+				stagehandle: `?${generateFakeStagehandle(u.id)}?`,
+				createdAt: u.createdAt
+			};
+		}
+		return {
+			isPrivate: false,
+			stagehandle: u.stagehandle,
+			createdAt: u.createdAt
+		};
+	});
 	const form = await superValidate(zod(LoginSchema));
 	const isSignup = url.searchParams.get('signup') === '1';
 	return {

src/routes/+page.svelte

@@ -89,12 +89,23 @@
 		</Card>
 		<Card>
 			<H2 style="font-size: 1.25rem;">Recently Joined {JOINED}</H2>
-			{#each data.users as user}
-				<a href="/@{user.stagehandle}">
-					@<A href="/@{user.stagehandle}">{user.stagehandle}</A> joined
-					<time datetime={user.createdAt.toString()}>{fromNow(user.createdAt)}</time></a
-				>
-			{/each}
+			{#if data.users.length > 0}
+				{#each data.users as user}
+					{#if !user.isPrivate}
+						<a title="@{user.stagehandle}" href="/@{user.stagehandle}">
+							@<A href="/@{user.stagehandle}">{user.stagehandle}</A> joined
+							<time datetime={user.createdAt.toString()}>{fromNow(user.createdAt)}</time></a
+						>
+					{:else}
+						<span title="@{user.stagehandle} is Private"
+							>@{user.stagehandle} joined
+							<time datetime={user.createdAt.toString()}>{fromNow(user.createdAt)}</time>
+						</span>
+					{/if}
+				{/each}
+			{:else}
+				<em>Please be the <A href="/signup">first?</A></em>
+			{/if}
 		</Card>
 	</div>
 {:else}

src/routes/signup/+page.svelte

@@ -11,6 +11,7 @@
 	import { superForm } from 'sveltekit-superforms';
 	import { CHECKED } from '$lib/characters';
 	import H2 from '$lib/components/H2.svelte';
+	import { generateFakeStagehandle } from '$lib/utils/faker';
 
 	export let data: PageData;
 	const { form, allErrors, capture, restore, constraints, delayed, enhance } = superForm(
@@ -41,7 +42,7 @@
 							id="stagehandle"
 							name="stagehandle"
 							type="text"
-							placeholder="Name generator coming soon..."
+							placeholder={generateFakeStagehandle()}
 							bind:value={$form.stagehandle}
 							{...$constraints.stagehandle}
 						/>