refactor: migrate from Biome to oxlint/oxfmt, remove contact form

- Replace Biome with oxlint + oxfmt (OXC toolchain) for linting and formatting
- Add .oxlintrc.json and .oxfmtrc.json configuration files
- Update VS Code settings and devcontainer to use oxc-vscode extension
- Remove contact form, Resend email integration, and related server action/schema
- Remove unused UI components (accordion, alert, card, tabs, toggle, etc.)

components/comments/comment-actions.tsx

@@ -1,14 +1,9 @@
 "use client";
 
-import {
-  EditIcon,
-  EllipsisIcon,
-  Loader2Icon,
-  ReplyIcon,
-  Trash2Icon,
-} from "lucide-react";
+import { EditIcon, EllipsisIcon, Loader2Icon, ReplyIcon, Trash2Icon } from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
+
 import {
   AlertDialog,
   AlertDialogAction,
@@ -28,6 +23,7 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { useSession } from "@/lib/auth-client";
 import { type CommentWithUser, deleteComment } from "@/lib/server/comments";
+
 import { EditCommentForm, ReplyForm } from "./comment-form";
 
 type ActionMode =
@@ -76,11 +72,7 @@ const CommentActions = ({ comment }: { comment: CommentWithUser }) => {
             variant="outline"
             size="sm"
             onClick={() =>
-              setMode(
-                mode.type === "replying"
-                  ? { type: "idle" }
-                  : { type: "replying" },
-              )
+              setMode(mode.type === "replying" ? { type: "idle" } : { type: "replying" })
             }
           >
             <ReplyIcon />
@@ -89,11 +81,9 @@ const CommentActions = ({ comment }: { comment: CommentWithUser }) => {
 
           {session.user.id === comment.user.id && (
             <DropdownMenu>
-              <DropdownMenuTrigger asChild>
-                <Button variant="outline" size="sm">
-                  <EllipsisIcon />
-                  <span className="sr-only">Actions Menu</span>
-                </Button>
+              <DropdownMenuTrigger render={<Button variant="outline" size="sm" />}>
+                <EllipsisIcon />
+                <span className="sr-only">Actions Menu</span>
               </DropdownMenuTrigger>
               <DropdownMenuContent>
                 <DropdownMenuItem onClick={() => setMode({ type: "editing" })}>
@@ -105,11 +95,7 @@ const CommentActions = ({ comment }: { comment: CommentWithUser }) => {
                   disabled={isDeleting}
                   variant="destructive"
                 >
-                  {isDeleting ? (
-                    <Loader2Icon className="animate-spin" />
-                  ) : (
-                    <Trash2Icon />
-                  )}
+                  {isDeleting ? <Loader2Icon className="animate-spin" /> : <Trash2Icon />}
                   Delete
                 </DropdownMenuItem>
               </DropdownMenuContent>
@@ -136,9 +122,7 @@ const CommentActions = ({ comment }: { comment: CommentWithUser }) => {
         <AlertDialogContent size="sm">
           <AlertDialogHeader>
             <AlertDialogTitle>Delete comment?</AlertDialogTitle>
-            <AlertDialogDescription>
-              This action cannot be undone.
-            </AlertDialogDescription>
+            <AlertDialogDescription>This action cannot be undone.</AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter>
             <AlertDialogCancel>Cancel</AlertDialogCancel>

components/comments/comment-avatar.tsx

@@ -1,4 +1,5 @@
 import { getImageProps } from "next/image";
+
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
 import { cn } from "@/lib/utils";
 

components/comments/comment-form.tsx

@@ -1,18 +1,16 @@
 "use client";
 
 import { InfoIcon, Loader2Icon } from "lucide-react";
-import { createContext, useContext, useState, useTransition } from "react";
+import { createContext, useContext, useMemo, useState, useTransition } from "react";
 import { toast } from "sonner";
+
 import { MarkdownIcon } from "@/components/icons";
 import { Button } from "@/components/ui/button";
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "@/components/ui/popover";
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
 import { Textarea } from "@/components/ui/textarea";
 import { useSession } from "@/lib/auth-client";
 import { createComment, updateComment } from "@/lib/server/comments";
+
 import { CommentAvatar } from "./comment-avatar";
 
 // Context for lifting form state to parent components
@@ -36,13 +34,12 @@ const CommentFormProvider = ({
   const [content, setContent] = useState(initialContent);
   const [isPending, startTransition] = useTransition();
 
-  return (
-    <CommentFormContext.Provider
-      value={{ content, setContent, isPending, startTransition }}
-    >
-      {children}
-    </CommentFormContext.Provider>
+  const contextValue = useMemo(
+    () => ({ content, setContent, isPending, startTransition }),
+    [content, setContent, isPending, startTransition],
   );
+
+  return <CommentFormContext.Provider value={contextValue}>{children}</CommentFormContext.Provider>;
 };
 
 // Hook to access form state from context (for sibling components like preview panels)
@@ -136,18 +133,20 @@ const SubmitButton = ({
 
 // Markdown help popover (only shown for new comments)
 const MarkdownHelp = () => (
-  <p className="text-[0.8rem] text-muted-foreground leading-relaxed">
+  <p className="text-muted-foreground text-[0.8rem] leading-relaxed">
     <MarkdownIcon className="mr-1.5 inline-block size-4 align-text-top" />
     <span className="max-md:hidden">Basic&nbsp;</span>
     <Popover>
-      <PopoverTrigger asChild>
-        <button
-          type="button"
-          className="cursor-pointer font-semibold text-primary no-underline decoration-2 decoration-primary/40 underline-offset-4 hover:underline"
-        >
-          <span>Markdown</span>
-          <span className="max-md:hidden">&nbsp;syntax</span>
-        </button>
+      <PopoverTrigger
+        render={
+          <button
+            type="button"
+            className="text-primary decoration-primary/40 cursor-pointer font-semibold no-underline decoration-2 underline-offset-4 hover:underline"
+          />
+        }
+      >
+        <span>Markdown</span>
+        <span className="max-md:hidden">&nbsp;syntax</span>
       </PopoverTrigger>
       <PopoverContent align="start">
         <p className="text-sm leading-loose">
@@ -155,7 +154,7 @@ const MarkdownHelp = () => (
           Examples:
         </p>
 
-        <ul className="my-2 list-inside list-disc pl-1 text-sm [&>li::marker]:font-normal [&>li::marker]:text-muted-foreground [&>li]:my-1.5 [&>li]:text-nowrap [&>li]:pl-1">
+        <ul className="[&>li::marker]:text-muted-foreground my-2 list-inside list-disc pl-1 text-sm [&>li]:my-1.5 [&>li]:pl-1 [&>li]:text-nowrap [&>li::marker]:font-normal">
           <li>
             <span className="font-bold">**bold**</span>
           </li>
@@ -164,18 +163,13 @@ const MarkdownHelp = () => (
           </li>
           <li>
             [
-            <a
-              href="https://jarv.is"
-              target="_blank"
-              rel="noopener"
-              className="hover:no-underline"
-            >
+            <a href="https://jarv.is" target="_blank" rel="noopener" className="hover:no-underline">
               links
             </a>
             ](https://jarv.is)
           </li>
           <li>
-            <span className="rounded-sm bg-muted px-[0.3rem] py-[0.2rem] font-medium font-mono text-sm">
+            <span className="bg-muted rounded-sm px-[0.3rem] py-[0.2rem] font-mono text-sm font-medium">
               `code`
             </span>
           </li>
@@ -203,8 +197,7 @@ const MarkdownHelp = () => (
 
 // New comment form - for creating top-level comments
 const NewCommentForm = ({ slug }: { slug: string }) => {
-  const { content, setContent, isPending, startTransition } =
-    useCommentFormState();
+  const { content, setContent, isPending, startTransition } = useCommentFormState();
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
@@ -269,8 +262,7 @@ const ReplyForm = ({
   onCancel: () => void;
   onSuccess?: () => void;
 }) => {
-  const { content, setContent, isPending, startTransition } =
-    useCommentFormState();
+  const { content, setContent, isPending, startTransition } = useCommentFormState();
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
@@ -308,12 +300,7 @@ const ReplyForm = ({
           />
 
           <div className="flex justify-end gap-2">
-            <Button
-              type="button"
-              variant="outline"
-              onClick={onCancel}
-              disabled={isPending}
-            >
+            <Button type="button" variant="outline" onClick={onCancel} disabled={isPending}>
               Cancel
             </Button>
 
@@ -345,8 +332,7 @@ const EditCommentForm = ({
   onCancel: () => void;
   onSuccess?: () => void;
 }) => {
-  const { content, setContent, isPending, startTransition } =
-    useCommentFormState(initialContent);
+  const { content, setContent, isPending, startTransition } = useCommentFormState(initialContent);
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
@@ -369,12 +355,7 @@ const EditCommentForm = ({
   };
 
   return (
-    <form
-      onSubmit={handleSubmit}
-      className="space-y-4"
-      data-intent="edit"
-      data-slug={slug}
-    >
+    <form onSubmit={handleSubmit} className="space-y-4" data-intent="edit" data-slug={slug}>
       <div className="min-w-0 flex-1 space-y-4">
         <CommentTextarea
           content={content}
@@ -385,20 +366,11 @@ const EditCommentForm = ({
         />
 
         <div className="flex justify-end gap-2">
-          <Button
-            type="button"
-            variant="outline"
-            onClick={onCancel}
-            disabled={isPending}
-          >
+          <Button type="button" variant="outline" onClick={onCancel} disabled={isPending}>
             Cancel
           </Button>
 
-          <SubmitButton
-            isPending={isPending}
-            disabled={!content.trim()}
-            pendingLabel="Updating..."
-          >
+          <SubmitButton isPending={isPending} disabled={!content.trim()} pendingLabel="Updating...">
             Edit
           </SubmitButton>
         </div>
@@ -407,10 +379,4 @@ const EditCommentForm = ({
   );
 };
 
-export {
-  NewCommentForm,
-  ReplyForm,
-  EditCommentForm,
-  CommentFormProvider,
-  useCommentForm,
-};
+export { NewCommentForm, ReplyForm, EditCommentForm, CommentFormProvider, useCommentForm };

components/comments/comment-single.tsx

@@ -1,10 +1,12 @@
 import Link from "next/link";
 import Markdown from "react-markdown";
+
 import { RelativeTime } from "@/components/relative-time";
 import { rehypeExternalLinks } from "@/lib/rehype";
 import { remarkGfm, remarkSmartypants } from "@/lib/remark";
 import type { CommentWithUser } from "@/lib/server/comments";
 import { cn } from "@/lib/utils";
+
 import { CommentActions } from "./comment-actions";
 import { CommentAvatar } from "./comment-avatar";
 
@@ -44,29 +46,17 @@ const CommentSingle = ({ comment }: { comment: CommentWithUser }) => {
             className={cn(
               "isolate max-w-none text-[0.875rem] leading-relaxed",
               "[&_p]:my-5 [&_p]:first:mt-0 [&_p]:last:mb-0",
-              "[&_a]:text-primary [&_a]:no-underline [&_a]:decoration-2 [&_a]:decoration-primary/40 [&_a]:underline-offset-4 [&_a]:hover:underline",
-              "[&_code]:rounded-sm [&_code]:bg-muted [&_code]:px-[0.3rem] [&_code]:py-[0.2rem] [&_code]:font-medium",
+              "[&_a]:text-primary [&_a]:decoration-primary/40 [&_a]:no-underline [&_a]:decoration-2 [&_a]:underline-offset-4 [&_a]:hover:underline",
+              "[&_code]:bg-muted [&_code]:rounded-sm [&_code]:px-[0.3rem] [&_code]:py-[0.2rem] [&_code]:font-medium",
               "group-has-data-[intent=edit]:hidden", // hides the rendered comment when its own edit form is active
             )}
           >
             <Markdown
               remarkPlugins={[remarkGfm, remarkSmartypants]}
               rehypePlugins={[
-                [
-                  rehypeExternalLinks,
-                  { target: "_blank", rel: "noopener noreferrer nofollow" },
-                ],
-              ]}
-              allowedElements={[
-                "p",
-                "a",
-                "em",
-                "strong",
-                "code",
-                "pre",
-                "blockquote",
-                "del",
+                [rehypeExternalLinks, { target: "_blank", rel: "noopener noreferrer nofollow" }],
               ]}
+              allowedElements={["p", "a", "em", "strong", "code", "pre", "blockquote", "del"]}
             >
               {comment.content}
             </Markdown>

components/comments/comment-thread.tsx

@@ -1,5 +1,6 @@
 import type { CommentWithUser } from "@/lib/server/comments";
 import { cn } from "@/lib/utils";
+
 import { CommentSingle } from "./comment-single";
 
 /** Maximum nesting depth for comment threads (0-indexed, so 2 = 3 levels deep) */
@@ -20,12 +21,7 @@ const CommentThread = ({
     <CommentSingle comment={comment} />
 
     {replies.length > 0 && (
-      <div
-        className={cn(
-          "mt-6 space-y-6",
-          level < MAX_NESTING_LEVEL && "ml-6 border-l-2 pl-6",
-        )}
-      >
+      <div className={cn("mt-6 space-y-6", level < MAX_NESTING_LEVEL && "ml-6 border-l-2 pl-6")}>
         {replies.map((reply) => (
           <CommentThread
             key={reply.id}

components/comments/comments.tsx

@@ -1,6 +1,8 @@
 import { headers } from "next/headers";
+
 import { auth } from "@/lib/auth";
 import { type CommentWithUser, getComments } from "@/lib/server/comments";
+
 import { NewCommentForm } from "./comment-form";
 import { CommentThread } from "./comment-thread";
 import { SignIn } from "./sign-in";
@@ -31,10 +33,8 @@ const Comments = async ({ slug }: { slug: string }) => {
       {session ? (
         <NewCommentForm slug={slug} />
       ) : (
-        <div className="flex flex-col items-center justify-center gap-y-4 rounded-lg bg-muted/40 p-6">
-          <p className="text-center font-medium">
-            Join the discussion by signing in:
-          </p>
+        <div className="bg-muted/40 flex flex-col items-center justify-center gap-y-4 rounded-lg p-6">
+          <p className="text-center font-medium">Join the discussion by signing in:</p>
           <SignIn callbackPath={`/${slug}#comments`} />
         </div>
       )}
@@ -51,7 +51,7 @@ const Comments = async ({ slug }: { slug: string }) => {
           ))}
         </div>
       ) : (
-        <div className="py-8 text-center font-medium text-foreground/80 text-lg tracking-tight">
+        <div className="text-foreground/80 py-8 text-center text-lg font-medium tracking-tight">
           Be the first to comment!
         </div>
       )}

components/comments/sign-in.tsx

@@ -3,6 +3,7 @@
 import { Loader2Icon } from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
+
 import { GitHubIcon } from "@/components/icons";
 import { Button } from "@/components/ui/button";
 import { signIn } from "@/lib/auth-client";
@@ -26,12 +27,7 @@ const SignIn = ({ callbackPath }: { callbackPath?: string }) => {
   };
 
   return (
-    <Button
-      onClick={handleSignIn}
-      disabled={isLoading}
-      size="lg"
-      variant="outline"
-    >
+    <Button onClick={handleSignIn} disabled={isLoading} size="lg" variant="outline">
       {isLoading ? <Loader2Icon className="animate-spin" /> : <GitHubIcon />}
       Sign in with GitHub
     </Button>