env validation

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

View File

@@ -180,7 +180,7 @@ function AppLayout(props: { children: any }) {
<div class="flex max-w-screen flex-row">
<LeftBar />
<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={{
width: `${centerWidth()}px`,
"margin-left": `${leftBarSize()}px`

View File

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

View File

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

View File

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

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."
/>
<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">
<Typewriter speed={30} keepAlive={2000}>
<div class="text-4xl">Hey!</div>

View File

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

View File

@@ -42,12 +42,13 @@ export default function RequestPasswordResetPage() {
() => calcRemainder(timer),
1000
) as unknown as number;
}
onCleanup(() => {
if (timerInterval) {
clearInterval(timerInterval);
}
});
}
});
// Form submission handler
@@ -125,8 +126,7 @@ export default function RequestPasswordResetPage() {
name="description"
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 text-slate-800 dark:text-slate-100">
<div class="pt-24 text-center text-xl font-semibold">
Password Reset Request
</div>
@@ -140,7 +140,7 @@ export default function RequestPasswordResetPage() {
<input
ref={emailRef}
name="email"
type="text"
type="email"
required
disabled={loading()}
placeholder=" "
@@ -160,7 +160,7 @@ export default function RequestPasswordResetPage() {
class={`${
loading()
? "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`}
>
{loading() ? "Sending..." : "Request Password Reset"}
@@ -188,7 +188,7 @@ export default function RequestPasswordResetPage() {
<div
class={`${
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!
</div>
@@ -196,7 +196,7 @@ export default function RequestPasswordResetPage() {
{/* Error Message */}
<Show when={error()}>
<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>
</Show>
@@ -204,12 +204,11 @@ export default function RequestPasswordResetPage() {
<div class="mt-6 flex justify-center">
<A
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
</A>
</div>
</div>
</>
);
}