diff --git a/packages/client/src/App.tsx b/packages/client/src/App.tsx
index cc0398a..9e9088f 100644
--- a/packages/client/src/App.tsx
+++ b/packages/client/src/App.tsx
@@ -14,14 +14,14 @@ import './App.css'
 // 	// TagsPage,
 // } from "./page/mod";
 
-import { TooltipProvider } from "./components/ui/tooltip";
+import { TooltipProvider } from "./components/ui/tooltip.tsx";
 
-import Gallery from "./page/galleryPage";
-import Layout from "./components/layout/layout";
-import NotFoundPage from "./page/404";
-import LoginPage from "./page/loginPage";
-import ProfilePage from "./page/profilesPage";
-import ContentInfoPage from "./page/contentInfoPage";
+import Gallery from "./page/galleryPage.tsx";
+import Layout from "./components/layout/layout.tsx";
+import NotFoundPage from "./page/404.tsx";
+import LoginPage from "./page/loginPage.tsx";
+import ProfilePage from "./page/profilesPage.tsx";
+import ContentInfoPage from "./page/contentInfoPage.tsx";
 
 const App = () => {
 	return (
diff --git a/packages/client/src/components/gallery/GalleryCard.tsx b/packages/client/src/components/gallery/GalleryCard.tsx
index 4e0aaac..97eafcb 100644
--- a/packages/client/src/components/gallery/GalleryCard.tsx
+++ b/packages/client/src/components/gallery/GalleryCard.tsx
@@ -1,9 +1,9 @@
 import type { Document } from "dbtype/api";
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
-import TagBadge from "@/components/gallery/TagBadge";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card.tsx";
+import TagBadge from "@/components/gallery/TagBadge.tsx";
 import { useEffect, useRef, useState } from "react";
 import { Link, useLocation } from "wouter";
-import { LazyImage } from "./LazyImage";
+import { LazyImage } from "./LazyImage.tsx";
 
 function clipTagsWhenOverflow(tags: string[], limit: number) {
     let l = 0;
diff --git a/packages/client/src/components/gallery/TagBadge.tsx b/packages/client/src/components/gallery/TagBadge.tsx
index 19c0c7d..4a46a7a 100644
--- a/packages/client/src/components/gallery/TagBadge.tsx
+++ b/packages/client/src/components/gallery/TagBadge.tsx
@@ -1,6 +1,6 @@
-import { badgeVariants } from "@/components/ui/badge";
+import { badgeVariants } from "@/components/ui/badge.tsx";
 import { Link } from "wouter";
-import { cn } from "@/lib/utils";
+import { cn } from "@/lib/utils.ts";
 
 const femaleTagPrefix = "female:";
 const maleTagPrefix = "male:";
diff --git a/packages/client/src/components/layout/nav.tsx b/packages/client/src/components/layout/nav.tsx
index 3c86c34..10ee170 100644
--- a/packages/client/src/components/layout/nav.tsx
+++ b/packages/client/src/components/layout/nav.tsx
@@ -1,8 +1,8 @@
-import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip"
 import { Link } from "wouter"
 import { MagnifyingGlassIcon, GearIcon, ActivityLogIcon, ArchiveIcon, PersonIcon } from "@radix-ui/react-icons"
-import { buttonVariants } from "../ui/button"
-import { useLogin } from "@/state/user";
+import { buttonVariants } from "@/components/ui/button.tsx"
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip.tsx"
+import { useLogin } from "@/state/user.ts";
 
 interface NavItemProps {
     icon: React.ReactNode;
diff --git a/packages/client/src/components/ui/badge.tsx b/packages/client/src/components/ui/badge.tsx
index e87d62b..3eb4c0d 100644
--- a/packages/client/src/components/ui/badge.tsx
+++ b/packages/client/src/components/ui/badge.tsx
@@ -1,7 +1,7 @@
 import * as React from "react"
 import { cva, type VariantProps } from "class-variance-authority"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 const badgeVariants = cva(
   "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
diff --git a/packages/client/src/components/ui/button.tsx b/packages/client/src/components/ui/button.tsx
index 0270f64..5b05535 100644
--- a/packages/client/src/components/ui/button.tsx
+++ b/packages/client/src/components/ui/button.tsx
@@ -2,7 +2,7 @@ import * as React from "react"
 import { Slot } from "@radix-ui/react-slot"
 import { cva, type VariantProps } from "class-variance-authority"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 const buttonVariants = cva(
   "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
diff --git a/packages/client/src/components/ui/card.tsx b/packages/client/src/components/ui/card.tsx
index 77e9fb7..b751f76 100644
--- a/packages/client/src/components/ui/card.tsx
+++ b/packages/client/src/components/ui/card.tsx
@@ -1,6 +1,6 @@
 import * as React from "react"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 const Card = React.forwardRef<
   HTMLDivElement,
diff --git a/packages/client/src/components/ui/input.tsx b/packages/client/src/components/ui/input.tsx
index a92b8e0..0174a6b 100644
--- a/packages/client/src/components/ui/input.tsx
+++ b/packages/client/src/components/ui/input.tsx
@@ -1,6 +1,6 @@
 import * as React from "react"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 export interface InputProps
   extends React.InputHTMLAttributes<HTMLInputElement> {}
diff --git a/packages/client/src/components/ui/label.tsx b/packages/client/src/components/ui/label.tsx
index 683faa7..ef29585 100644
--- a/packages/client/src/components/ui/label.tsx
+++ b/packages/client/src/components/ui/label.tsx
@@ -2,7 +2,7 @@ import * as React from "react"
 import * as LabelPrimitive from "@radix-ui/react-label"
 import { cva, type VariantProps } from "class-variance-authority"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 const labelVariants = cva(
   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
diff --git a/packages/client/src/components/ui/resizable.tsx b/packages/client/src/components/ui/resizable.tsx
index 35784da..1cdd646 100644
--- a/packages/client/src/components/ui/resizable.tsx
+++ b/packages/client/src/components/ui/resizable.tsx
@@ -1,7 +1,7 @@
 import { DragHandleDots2Icon } from "@radix-ui/react-icons"
 import * as ResizablePrimitive from "react-resizable-panels"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 const ResizablePanelGroup = ({
   className,
diff --git a/packages/client/src/components/ui/skeleton.tsx b/packages/client/src/components/ui/skeleton.tsx
index d7e45f7..7851593 100644
--- a/packages/client/src/components/ui/skeleton.tsx
+++ b/packages/client/src/components/ui/skeleton.tsx
@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 function Skeleton({
   className,
diff --git a/packages/client/src/components/ui/tooltip.tsx b/packages/client/src/components/ui/tooltip.tsx
index a9c71ba..4737dd6 100644
--- a/packages/client/src/components/ui/tooltip.tsx
+++ b/packages/client/src/components/ui/tooltip.tsx
@@ -1,7 +1,7 @@
 import * as React from "react"
 import * as TooltipPrimitive from "@radix-ui/react-tooltip"
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils.ts"
 
 const TooltipProvider = TooltipPrimitive.Provider
 
diff --git a/packages/client/src/page/galleryPage.tsx b/packages/client/src/page/galleryPage.tsx
index 4142100..0648bbe 100644
--- a/packages/client/src/page/galleryPage.tsx
+++ b/packages/client/src/page/galleryPage.tsx
@@ -1,10 +1,10 @@
 import useSWR from "swr";
 import { useSearch } from "wouter";
 import type { Document } from "dbtype/api";
-import { Input } from "@/components/ui/input";
-import { Button } from "@/components/ui/button";
-import { GalleryCard } from "../components/gallery/GalleryCard";
-import TagBadge from "@/components/gallery/TagBadge";
+import { Input } from "@/components/ui/input.tsx";
+import { Button } from "@/components/ui/button.tsx";
+import { GalleryCard } from "@/components/gallery/GalleryCard.tsx";
+import TagBadge from "@/components/gallery/TagBadge.tsx";
 
 async function fetcher(url: string) {
     const res = await fetch(url);
diff --git a/packages/client/src/page/loginPage.tsx b/packages/client/src/page/loginPage.tsx
index 36f0c00..882f16b 100644
--- a/packages/client/src/page/loginPage.tsx
+++ b/packages/client/src/page/loginPage.tsx
@@ -1,8 +1,8 @@
-import { Button } from "@/components/ui/button";
-import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import { doLogin } from "@/state/user";
+import { Button } from "@/components/ui/button.tsx";
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card.tsx";
+import { Input } from "@/components/ui/input.tsx";
+import { Label } from "@/components/ui/label.tsx";
+import { doLogin } from "@/state/user.ts";
 import { useState } from "react";
 import { useLocation } from "wouter";
 
diff --git a/packages/client/src/state/user.ts b/packages/client/src/state/user.ts
index 5c8c82a..5c2fe7f 100644
--- a/packages/client/src/state/user.ts
+++ b/packages/client/src/state/user.ts
@@ -1,4 +1,4 @@
-import { atom, useAtomValue, setAtomValue } from "../lib/atom";
+import { atom, useAtomValue, setAtomValue } from "../lib/atom.ts";
 
 type LoginLocalStorage = {
 	username: string;