diff --git a/src/components/_albums/_ImageList.tsx b/src/components/_albums/_ImageList.tsx
deleted file mode 100644
index 7585898..0000000
--- a/src/components/_albums/_ImageList.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import { Image } from "@/generated/prisma";
-import clsx from "clsx";
-import NextImage from "next/image";
-import Link from "next/link";
-
-export default function ImageList({ images, gallerySlug, albumSlug }: { images: Image[], gallerySlug: string, albumSlug: string }) {
-
-  return (
-    <section>
-      <h1 className="text-2xl font-bold mb-4">Images</h1>
-      <div className="grid gap-6 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">
-        {images ? images.map((img) => (
-          <Link href={`/galleries/${gallerySlug}/${albumSlug}/${img.id}`} key={img.id}>
-            <div className="group rounded-lg border overflow-hidden hover:shadow-lg transition-shadow bg-background">
-              <div className="relative aspect-[4/3] w-full bg-muted items-center justify-center">
-                {img.fileKey ? (
-                  <NextImage
-                    src={`/api/image/thumbnails/${img.fileKey}.webp`}
-                    alt={img.imageName}
-                    fill
-                    className={clsx(
-                      " object-cover",
-                      img.nsfw && "blur-md scale-105"
-                    )}
-                  />
-                ) : (
-                  <div className="flex items-center justify-center h-full text-muted-foreground text-sm">
-                    No cover image
-                  </div>
-                )}
-              </div>
-              <div className="p-4">
-                <h2 className="text-lg font-semibold truncate text-center">{img.imageName}</h2>
-              </div>
-            </div>
-          </Link>
-        )) : "There are no images here!"}
-      </div>
-    </section>
-  );
-}
\ No newline at end of file
diff --git a/src/components/artists/_ArtistImageGrid.tsx b/src/components/artists/_ArtistImageGrid.tsx
deleted file mode 100644
index 3366894..0000000
--- a/src/components/artists/_ArtistImageGrid.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-"use client";
-
-// import ImageCard from "@/components/image/ImageCard"; // You likely have this already
-// import type { Album, Gallery, Image, ImageVariant } from "@prisma/client";
-import { Album, Gallery, Image, ImageVariant } from "@/generated/prisma";
-import { useState } from "react";
-import ImageCard from "./ImageCard";
-
-type Props = {
-  images: (Image & {
-    album: Album & { gallery: Gallery | null } | null;
-    variants: ImageVariant[];
-  })[];
-};
-
-export default function ArtistImageGrid({ images }: Props) {
-  const [showNSFW, setShowNSFW] = useState(false);
-
-  return (
-    <div className="space-y-4">
-      <button
-        onClick={() => setShowNSFW(!showNSFW)}
-        className="text-sm underline text-muted-foreground"
-      >
-        {showNSFW ? "Hide NSFW" : "Show NSFW"} content
-      </button>
-      <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
-        {images.map((img) => (
-          <ImageCard key={img.id} image={img} showNSFW={showNSFW} />
-        ))}
-      </div>
-    </div>
-  );
-}
diff --git a/src/components/artists/_ImageCard.tsx b/src/components/artists/_ImageCard.tsx
deleted file mode 100644
index 0cae72b..0000000
--- a/src/components/artists/_ImageCard.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { Album, Gallery, Image, ImageVariant } from "@/generated/prisma";
-import NextImage from "next/image";
-import Link from "next/link";
-
-type Props = {
-  image: Image & {
-    variants: ImageVariant[];
-    album: Album & { gallery: Gallery | null } | null;
-  };
-  showNSFW?: boolean;
-};
-
-export default function ImageCard({ image, showNSFW = false }: Props) {
-  const variant = image.variants.find(v => v.type === "thumbnail") || image.variants[0];
-  if (!variant) return null;
-
-  const href = image.album?.gallery && image.album
-    ? `/galleries/${image.album.gallery.slug}/${image.album.slug}/${image.id}`
-    : `/image/${image.id}`;
-
-  const shouldBlur = image.nsfw && !showNSFW;
-
-  return (
-    <Link href={href} className="group relative overflow-hidden rounded-lg border bg-background shadow transition hover:shadow-lg">
-      <div className="aspect-[4/5] w-full relative">
-        <NextImage
-          src={`/api/image/${variant.s3Key}`}
-          alt={image.altText || image.imageName}
-          width={variant.width}
-          height={variant.height}
-          className={`object-cover h-full transition duration-200 ease-in-out ${shouldBlur ? "blur-md scale-105" : ""
-            }`}
-        />
-        {image.nsfw && (
-          <div className="absolute top-1 left-1 bg-black/60 text-white text-xs px-2 py-0.5 rounded z-10">
-            NSFW
-          </div>
-        )}
-        <div className="absolute bottom-0 left-0 w-full bg-black/50 text-white text-sm px-2 py-1 line-clamp-1 truncate">
-          {image.imageName}
-        </div>
-      </div>
-    </Link>
-  );
-}
diff --git a/src/components/cards/_AlbumCard.tsx b/src/components/cards/_AlbumCard.tsx
deleted file mode 100644
index 2adc6b1..0000000
--- a/src/components/cards/_AlbumCard.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { Album, Image } from "@/generated/prisma";
-import NextImage from "next/image";
-import Link from "next/link";
-
-type Props = {
-  album: Album & {
-    coverImage: Image | null;
-  };
-  gallerySlug: string;
-};
-
-export default function AlbumCard({ album, gallerySlug }: Props) {
-  const href = `/galleries/${gallerySlug}/${album.slug}`;
-  const cover = album.coverImage;
-
-  return (
-    <Link
-      href={href}
-      className="group relative overflow-hidden rounded-lg border bg-background shadow transition hover:shadow-lg"
-    >
-      <div className="aspect-[4/3] w-full relative">
-        {cover ? (
-          <NextImage
-            src={`/api/image/thumbnails/${cover.fileKey}.webp`}
-            alt={cover.imageName}
-            fill
-            className="object-cover"
-          />
-        ) : (
-          <div className="flex items-center justify-center h-full w-full bg-muted text-muted-foreground text-sm">
-            No cover image
-          </div>
-        )}
-
-        {/* Overlay: Album label */}
-        <div className="absolute top-1 left-1 bg-black/60 text-white text-xs px-2 py-0.5 rounded z-10">
-          Album
-        </div>
-
-        {/* Bottom: Album name */}
-        <div className="absolute bottom-0 left-0 w-full bg-black/50 text-white text-sm px-2 py-1 line-clamp-1 truncate">
-          {album.name}
-        </div>
-      </div>
-    </Link>
-  );
-}
diff --git a/src/components/categories/_CategoryImageList.tsx b/src/components/categories/_CategoryImageList.tsx
deleted file mode 100644
index 46f5e23..0000000
--- a/src/components/categories/_CategoryImageList.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import { Album, Gallery, Image } from "@/generated/prisma";
-import NextImage from "next/image";
-import Link from "next/link";
-
-type ImagesWithItems = (Pick<Image, "id" | "fileKey" | "imageName" | "altText" | "nsfw"> & {
-  album?: (Pick<Album, "slug"> & {
-    gallery?: Pick<Gallery, "slug"> | null
-  }) | null
-})[]
-
-export default function CategoryImageList({ images }: { images: ImagesWithItems }) {
-  return (
-    <section>
-      <h1 className="text-2xl font-bold mb-4">Images</h1>
-      <div className="grid gap-6 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">
-        {images ? images.map((img) => {
-          const gallerySlug = img.album?.gallery?.slug;
-          const albumSlug = img.album?.slug;
-          if (!gallerySlug || !albumSlug || !img.id) return null;
-
-          return (
-            <Link href={`/${gallerySlug}/${albumSlug}/${img.id}`} key={img.id}>
-              <div className="group rounded-lg border overflow-hidden hover:shadow-lg transition-shadow bg-background">
-                <div className="relative aspect-[4/3] w-full bg-muted items-center justify-center">
-                  {img.fileKey ? (
-                    <NextImage
-                      src={`/api/image/thumbnails/${img.fileKey}.webp`}
-                      alt={img.altText || ""}
-                      fill
-                      className="object-cover"
-                    />
-                  ) : (
-                    <div className="flex items-center justify-center h-full text-muted-foreground text-sm">
-                      No cover image
-                    </div>
-                  )}
-                </div>
-                <div className="p-4">
-                  <h2 className="text-lg font-semibold truncate text-center">{img.imageName}</h2>
-                </div>
-              </div>
-            </Link>
-          )
-        }) : "There are no images here!"}
-      </div>
-    </section>
-  );
-}
\ No newline at end of file
diff --git a/src/components/galleries/_AlbumList.tsx b/src/components/galleries/_AlbumList.tsx
deleted file mode 100644
index 8e3a82b..0000000
--- a/src/components/galleries/_AlbumList.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { Album, Image } from "@/generated/prisma";
-import NextImage from "next/image";
-import Link from "next/link";
-
-type AlbumsWithItems = Album & {
-  coverImage: Image | null;
-}
-
-export default function AlbumList({ albums, gallerySlug }: { albums: AlbumsWithItems[], gallerySlug: string }) {
-  return (
-    <section>
-      <h1 className="text-2xl font-bold mb-4">Albums</h1>
-      <div className="grid gap-6 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">
-        {albums ? albums.map((album) => (
-          <Link href={`/galleries/${gallerySlug}/${album.slug}`} key={album.id}>
-            <div className="group rounded-lg border overflow-hidden hover:shadow-lg transition-shadow bg-background">
-              <div className="relative aspect-[4/3] w-full bg-muted items-center justify-center">
-                {album.coverImage?.fileKey ? (
-                  <NextImage
-                    src={`/api/image/thumbnails/${album.coverImage.fileKey}.webp`}
-                    alt={album.coverImage.imageName}
-                    fill
-                    className="object-cover"
-                  />
-                ) : (
-                  <div className="flex items-center justify-center h-full text-muted-foreground text-sm">
-                    No cover image
-                  </div>
-                )}
-              </div>
-              <div className="p-4">
-                <h2 className="text-lg font-semibold truncate text-center">{album.name}</h2>
-              </div>
-            </div>
-          </Link>
-        )) : "There are no albums here!"}
-      </div>
-    </section>
-  );
-}
\ No newline at end of file
diff --git a/src/components/images/_GlowingImageBorder.tsx b/src/components/images/_GlowingImageBorder.tsx
deleted file mode 100644
index dddc173..0000000
--- a/src/components/images/_GlowingImageBorder.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-"use client"
-
-import { Color, ImageColor, ImageVariant } from "@/generated/prisma"
-import clsx from "clsx"
-import { useTheme } from "next-themes"
-import NextImage from "next/image"
-import { useEffect, useState } from "react"
-
-type Colors = ImageColor & {
-  color: Color
-}
-
-type Props = {
-  alt: string,
-  variant: ImageVariant,
-  colors: Colors[],
-  src: string,
-  revealed?: boolean,
-  className?: string,
-  animate?: boolean
-}
-
-export default function GlowingImageBorder({
-  alt,
-  variant,
-  colors,
-  src,
-  className,
-  revealed = true,
-  animate = true,
-}: Props) {
-  const { resolvedTheme } = useTheme()
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-
-  const getColor = (type: string) =>
-    colors.find((c) => c.type === type)?.color.hex
-
-  const vibrantLight = getColor("Vibrant") || "#ff5ec4"
-  const mutedLight = getColor("Muted") || "#5ecaff"
-
-  const darkVibrant = getColor("DarkVibrant") || "#fc03a1"
-  const darkMuted = getColor("DarkMuted") || "#035efc"
-
-  const vibrant = resolvedTheme === "dark" ? darkVibrant : vibrantLight
-  const muted = resolvedTheme === "dark" ? darkMuted : mutedLight
-
-  if (!mounted) return null;
-
-  return (
-    <div
-      className={clsx(
-        "relative inline-block rounded-xl overflow-hidden p-[12px]",
-        animate ? "glow-border" : "static-glow-border",
-        className
-      )}
-      style={
-        {
-          "--vibrant": vibrant,
-          "--muted": muted,
-        } as React.CSSProperties
-      }
-    >
-      <div className="relative z-10 rounded-xl overflow-hidden group">
-        <NextImage
-          src={src}
-          alt={alt || "Image"}
-          width={variant.width}
-          height={variant.height}
-          className={clsx(
-            "rounded-xl transition duration-300",
-            !revealed && "blur-md scale-105"
-          )}
-        />
-      </div>
-    </div>
-  )
-}
diff --git a/src/components/images/_GlowingImageWithToggle.tsx b/src/components/images/_GlowingImageWithToggle.tsx
deleted file mode 100644
index c2b1fae..0000000
--- a/src/components/images/_GlowingImageWithToggle.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-"use client"
-
-import { Color, ImageColor, ImageVariant } from "@/generated/prisma";
-import Link from "next/link";
-import { useState } from "react";
-import { Label } from "../ui/label";
-import { Switch } from "../ui/switch";
-import GlowingImageBorder from "./GlowingImageBorder";
-
-type Props = {
-  variant: ImageVariant;
-  colors: (ImageColor & { color: Color })[];
-  alt: string;
-  src: string;
-  nsfw: boolean;
-  imageId: string;
-}
-
-export default function GlowingImageWithToggle({ variant, colors, alt, src, nsfw, imageId }: Props) {
-  const [animate, setAnimate] = useState(true);
-  const [revealed, setRevealed] = useState(!nsfw)
-
-  return (
-    <div className="relative w-full max-w-fit">
-
-      <Link href={`/raw/${imageId}`} passHref>
-        <GlowingImageBorder
-          alt={alt}
-          variant={variant}
-          colors={colors}
-          src={src}
-          animate={animate}
-          revealed={revealed}
-        />
-      </Link>
-
-      <div className="flex flex-col items-center gap-4 pt-8">
-        <div className="flex items-center gap-2">
-          <Switch id="animate" checked={animate} onCheckedChange={setAnimate} />
-          <Label htmlFor="animate">Animate glow</Label>
-        </div>
-      </div>
-
-      {
-        nsfw && (
-          <div className="flex flex-col items-center gap-4 pt-8">
-            <div className="flex items-center gap-2">
-              <Switch id="animate" checked={revealed} onCheckedChange={setRevealed} />
-              <Label htmlFor="animate">Reveal NSFW</Label>
-            </div>
-          </div>
-        )
-      }
-    </div >
-  );
-}
diff --git a/src/components/images/_ImageInfoPanel.tsx b/src/components/images/_ImageInfoPanel.tsx
deleted file mode 100644
index fba4a30..0000000
--- a/src/components/images/_ImageInfoPanel.tsx
+++ /dev/null
@@ -1,100 +0,0 @@
-import { Image as ImageType } from "@/generated/prisma";
-import Link from "next/link";
-// import { SocialIcon } from "react-social-icons";
-
-type Props = {
-  image: ImageType & {
-    artist?: {
-      id: string;
-      slug: string;
-      displayName: string;
-      socials?: { type: string; handle: string; link: string }[];
-    };
-    categories?: { id: string; name: string }[];
-    tags?: { id: string; name: string }[];
-    album?: { id: string; name: string; slug: string };
-  };
-};
-
-export default function ImageInfoPanel({ image }: Props) {
-  return (
-    <div className="w-full max-w-2xl mt-8 border border-border rounded-lg p-6 shadow-sm bg-background">
-      {/* Creator */}
-      {image.artist && (
-        <div className="mb-4">
-          <h2 className="text-lg font-semibold mb-1">Creator</h2>
-          <Link
-            href={`/artists/${image.artist.slug}`}
-            className="text-primary hover:underline font-medium"
-          >
-            {image.artist.displayName}
-          </Link>
-
-          {image.artist.socials?.length > 0 && (
-            <div className="flex gap-2 mt-2">
-              {image.artist.socials.map((social, i) => (
-                <SocialIcon
-                  key={i}
-                  url={social.link}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  style={{ height: 28, width: 28 }}
-                  title={social.type}
-                />
-              ))}
-            </div>
-          )}
-        </div>
-      )}
-
-      {/* Album */}
-      {image.album && (
-        <div className="mb-4">
-          <h2 className="text-lg font-semibold mb-1">Album</h2>
-          <Link
-            href={`/galleries/${image.album.slug}`}
-            className="text-primary hover:underline"
-          >
-            {image.album.name}
-          </Link>
-        </div>
-      )}
-
-      {/* Categories */}
-      {image.categories?.length > 0 && (
-        <div className="mb-4">
-          <h2 className="text-lg font-semibold mb-1">Categories</h2>
-          <div className="flex flex-wrap gap-2">
-            {image.categories.map((cat) => (
-              <Link
-                key={cat.id}
-                href={`/categories/${cat.id}`}
-                className="bg-muted text-sm px-2 py-1 rounded hover:bg-accent"
-              >
-                {cat.name}
-              </Link>
-            ))}
-          </div>
-        </div>
-      )}
-
-      {/* Tags */}
-      {image.tags?.length > 0 && (
-        <div>
-          <h2 className="text-lg font-semibold mb-1">Tags</h2>
-          <div className="flex flex-wrap gap-2">
-            {image.tags.map((tag) => (
-              <Link
-                key={tag.id}
-                href={`/tags/${tag.id}`}
-                className="bg-muted text-sm px-2 py-1 rounded hover:bg-accent"
-              >
-                #{tag.name}
-              </Link>
-            ))}
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}