Mike/freno-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

env validation

Browse Source
This commit is contained in:
Michael Freno
2025-12-21 12:48:12 -05:00
parent f916cb1d52
commit e761844e6f
7 changed files with 107 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.tsx
View File

@@ -180,7 +180,7 @@ function AppLayout(props: { children: any }) {
<div class="flex max-w-screen flex-row"> <div class="flex max-w-screen flex-row">
<LeftBar /> <LeftBar />
<div <div
class="bg-base relative min-h-screen rounded-t-lg shadow-2xl" class="bg-base relative h-screen overflow-y-scroll rounded-t-lg p-4 pt-16 shadow-2xl"
style={{ style={{
width: `${centerWidth()}px`, width: `${centerWidth()}px`,
"margin-left": `${leftBarSize()}px` "margin-left": `${leftBarSize()}px`

3
src/components/blog/AddAttachmentSection.tsx
View File

@@ -2,6 +2,7 @@ import { createSignal, createEffect, For, Show } from "solid-js";
import Dropzone from "./Dropzone"; import Dropzone from "./Dropzone";
import XCircle from "~/components/icons/XCircle"; import XCircle from "~/components/icons/XCircle";
import AddImageToS3 from "~/lib/s3upload"; import AddImageToS3 from "~/lib/s3upload";
import { env } from "~/env/client";
export interface AddAttachmentSectionProps { export interface AddAttachmentSectionProps {
type: "blog" | "project"; type: "blog" | "project";
@@ -92,7 +93,7 @@ export default function AddAttachmentSection(props: AddAttachmentSectionProps) {
const copyToClipboard = async (key: string) => { const copyToClipboard = async (key: string) => {
try { try {
const bucketString = import.meta.env.VITE_AWS_BUCKET_STRING || ""; const bucketString = env.VITE_AWS_BUCKET_STRING || "";
await navigator.clipboard.writeText(bucketString + key); await navigator.clipboard.writeText(bucketString + key);
console.log("Text copied to clipboard"); console.log("Text copied to clipboard");
} catch (err) { } catch (err) {

7
src/components/blog/CommentSectionWrapper.tsx
View File

@@ -14,6 +14,7 @@ import { api } from "~/lib/api";
import CommentSection from "./CommentSection"; import CommentSection from "./CommentSection";
import CommentDeletionPrompt from "./CommentDeletionPrompt"; import CommentDeletionPrompt from "./CommentDeletionPrompt";
import EditCommentModal from "./EditCommentModal"; import EditCommentModal from "./EditCommentModal";
import { env } from "~/env/client";
const MAX_RETRIES = 12; const MAX_RETRIES = 12;
const RETRY_INTERVAL = 5000; const RETRY_INTERVAL = 5000;
@@ -72,7 +73,7 @@ export default function CommentSectionWrapper(
return; return;
} }
const websocketUrl = import.meta.env.VITE_WEBSOCKET; const websocketUrl = env.VITE_WEBSOCKET;
if (!websocketUrl) { if (!websocketUrl) {
console.error("VITE_WEBSOCKET environment variable not set"); console.error("VITE_WEBSOCKET environment variable not set");
return; return;
@@ -192,7 +193,7 @@ export default function CommentSectionWrapper(
parentCommentID?: number parentCommentID?: number
) => { ) => {
try { try {
const domain = import.meta.env.VITE_DOMAIN; const domain = env.VITE_DOMAIN;
const res = await fetch( const res = await fetch(
`${domain}/api/database/comments/create/blog/${props.id}`, `${domain}/api/database/comments/create/blog/${props.id}`,
{ {
@@ -228,7 +229,7 @@ export default function CommentSectionWrapper(
const id = data.commentID; const id = data.commentID;
if (body && commenterID && parentCommentID !== undefined && id) { if (body && commenterID && parentCommentID !== undefined && id) {
const domain = import.meta.env.VITE_DOMAIN; const domain = env.VITE_DOMAIN;
const res = await fetch( const res = await fetch(
`${domain}/api/database/user/public-data/${commenterID}` `${domain}/api/database/user/public-data/${commenterID}`
); );

2
src/routes/blog/index.tsx
View File

@@ -22,7 +22,7 @@ export default function BlogIndex() {
<div class="mx-auto pt-8 pb-24"> <div class="mx-auto pt-8 pb-24">
<Suspense fallback={<TerminalSplash />}> <Suspense fallback={<TerminalSplash />}>
<div class="flex flex-row justify-around gap-4"> <div class="flex flex-row justify-around gap-4 px-4">
<PostSortingSelect /> <PostSortingSelect />
<Show when={data() && Object.keys(data()!.tagMap).length > 0}> <Show when={data() && Object.keys(data()!.tagMap).length > 0}>

2
src/routes/index.tsx
View File

@@ -10,7 +10,7 @@ export default function Home() {
content="Michael Freno - Software Engineer based in Brooklyn, NY. Passionate about dev tooling, game development, and open source software." content="Michael Freno - Software Engineer based in Brooklyn, NY. Passionate about dev tooling, game development, and open source software."
/> />
<main class="flex h-full flex-col gap-8 p-4 pt-16 text-xl"> <main class="flex h-full flex-col gap-8 text-xl">
<div class="flex-1"> <div class="flex-1">
<Typewriter speed={30} keepAlive={2000}> <Typewriter speed={30} keepAlive={2000}>
<div class="text-4xl">Hey!</div> <div class="text-4xl">Hey!</div>

18
src/routes/login/index.tsx
View File

@@ -15,6 +15,7 @@ import EyeSlash from "~/components/icons/EyeSlash";
import CountdownCircleTimer from "~/components/CountdownCircleTimer"; import CountdownCircleTimer from "~/components/CountdownCircleTimer";
import { isValidEmail, validatePassword } from "~/lib/validation"; import { isValidEmail, validatePassword } from "~/lib/validation";
import { getClientCookie } from "~/lib/cookies.client"; import { getClientCookie } from "~/lib/cookies.client";
import { env } from "~/env/client";
const checkAuth = cache(async () => { const checkAuth = cache(async () => {
"use server"; "use server";
@@ -63,9 +64,9 @@ export default function LoginPage() {
let timerInterval: number | undefined; let timerInterval: number | undefined;
// Environment variables // Environment variables
const googleClientId = import.meta.env.VITE_GOOGLE_CLIENT_ID; const googleClientId = env.VITE_GOOGLE_CLIENT_ID;
const githubClientId = import.meta.env.VITE_GITHUB_CLIENT_ID; const githubClientId = env.VITE_GITHUB_CLIENT_ID;
const domain = import.meta.env.VITE_DOMAIN || "https://www.freno.me"; const domain = env.VITE_DOMAIN || "https://www.freno.me";
// Calculate remaining time from cookie // Calculate remaining time from cookie
const calcRemainder = (timer: string) => { const calcRemainder = (timer: string) => {
@@ -91,12 +92,13 @@ export default function LoginPage() {
() => calcRemainder(timer), () => calcRemainder(timer),
1000 1000
) as unknown as number; ) as unknown as number;
}
onCleanup(() => { onCleanup(() => {
if (timerInterval) { if (timerInterval) {
clearInterval(timerInterval); clearInterval(timerInterval);
} }
}); });
}
}); });
// Check for OAuth/callback errors in URL // Check for OAuth/callback errors in URL
@@ -329,7 +331,7 @@ export default function LoginPage() {
/> />
<div class="flex h-dvh flex-row justify-evenly"> <div class="flex h-dvh flex-row justify-evenly">
{/* Main content */} {/* Main content */}
<div class="pt-24 md:pt-48"> <div class="pt-12 md:pt-24">
{/* Error message */} {/* Error message */}
<div class="absolute -mt-12 text-center text-3xl text-red-400 italic"> <div class="absolute -mt-12 text-center text-3xl text-red-400 italic">
<Show when={error() === "passwordMismatch"}> <Show when={error() === "passwordMismatch"}>
@@ -347,7 +349,7 @@ export default function LoginPage() {
<Show <Show
when={!register()} when={!register()}
fallback={ fallback={
<div class="py-4 text-center md:min-w-[475px]"> <div class="py-4 text-center md:min-w-118.75">
Already have an account? Already have an account?
<button <button
onClick={() => { onClick={() => {
@@ -361,7 +363,7 @@ export default function LoginPage() {
</div> </div>
} }
> >
<div class="py-4 text-center md:min-w-[475px]"> <div class="py-4 text-center md:min-w-118.75">
Don't have an account yet? Don't have an account yet?
<button <button
onClick={() => { onClick={() => {
@@ -381,7 +383,7 @@ export default function LoginPage() {
<div class="flex justify-center"> <div class="flex justify-center">
<div class="input-group mx-4"> <div class="input-group mx-4">
<input <input
type="text" type="email"
required required
ref={emailRef} ref={emailRef}
placeholder=" " placeholder=" "

17
src/routes/login/request-password-reset.tsx
View File

@@ -42,12 +42,13 @@ export default function RequestPasswordResetPage() {
() => calcRemainder(timer), () => calcRemainder(timer),
1000 1000
) as unknown as number; ) as unknown as number;
}
onCleanup(() => { onCleanup(() => {
if (timerInterval) { if (timerInterval) {
clearInterval(timerInterval); clearInterval(timerInterval);
} }
}); });
}
}); });
// Form submission handler // Form submission handler
@@ -125,8 +126,7 @@ export default function RequestPasswordResetPage() {
name="description" name="description"
content="Request a password reset link to regain access to your account. Enter your email to receive reset instructions." content="Request a password reset link to regain access to your account. Enter your email to receive reset instructions."
/> />
<div class="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800"> <div class="pt-24 text-center text-xl font-semibold">
<div class="pt-24 text-center text-xl font-semibold text-slate-800 dark:text-slate-100">
Password Reset Request Password Reset Request
</div> </div>
@@ -140,7 +140,7 @@ export default function RequestPasswordResetPage() {
<input <input
ref={emailRef} ref={emailRef}
name="email" name="email"
type="text" type="email"
required required
disabled={loading()} disabled={loading()}
placeholder=" " placeholder=" "
@@ -160,7 +160,7 @@ export default function RequestPasswordResetPage() {
class={`${ class={`${
loading() loading()
? "bg-zinc-400" ? "bg-zinc-400"
: "bg-blue-400 hover:bg-blue-500 active:scale-90 dark:bg-blue-600 dark:hover:bg-blue-700" : "bg-blue hover:brightness-125 active:scale-90"
} my-6 flex justify-center rounded px-4 py-2 font-medium text-white transition-all duration-300 ease-out`} } my-6 flex justify-center rounded px-4 py-2 font-medium text-white transition-all duration-300 ease-out`}
> >
{loading() ? "Sending..." : "Request Password Reset"} {loading() ? "Sending..." : "Request Password Reset"}
@@ -188,7 +188,7 @@ export default function RequestPasswordResetPage() {
<div <div
class={`${ class={`${
showSuccessMessage() ? "" : "opacity-0 select-none" showSuccessMessage() ? "" : "opacity-0 select-none"
} flex justify-center text-green-500 italic transition-opacity duration-300 ease-in-out`} } text-green flex justify-center italic transition-opacity duration-300 ease-in-out`}
> >
If email exists, you will receive an email shortly! If email exists, you will receive an email shortly!
</div> </div>
@@ -196,7 +196,7 @@ export default function RequestPasswordResetPage() {
{/* Error Message */} {/* Error Message */}
<Show when={error()}> <Show when={error()}>
<div class="mt-4 flex justify-center"> <div class="mt-4 flex justify-center">
<div class="text-sm text-red-500 italic">{error()}</div> <div class="text-red text-sm italic">{error()}</div>
</div> </div>
</Show> </Show>
@@ -204,12 +204,11 @@ export default function RequestPasswordResetPage() {
<div class="mt-6 flex justify-center"> <div class="mt-6 flex justify-center">
<A <A
href="/login" href="/login"
class="text-blue-500 underline underline-offset-4 transition-colors hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300" class="text-blue underline underline-offset-4 transition-colors hover:brightness-125"
> >
Back to Login Back to Login
</A> </A>
</div> </div>
</div>
</> </>
); );
} }