@naeil/ui 0.1.0 → 0.2.0

package/src/app/[locale]/(content)/layout.tsx

@@ -1,7 +0,0 @@
-export default function ContentLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return <main className="pt-28">{children}</main>;
-}

package/src/app/[locale]/(content)/pkm/page.tsx

@@ -1,31 +0,0 @@
-import { setRequestLocale } from "next-intl/server";
-import { useTranslations } from "next-intl";
-import { ProjectLayout } from "@/components/project-layout";
-import type { ProjectData } from "@/components/project-layout";
-
-export default async function PKMPage({
-  params,
-}: {
-  params: Promise<{ locale: string }>;
-}) {
-  const { locale } = await params;
-  setRequestLocale(locale);
-
-  return <PKMContent />;
-}
-
-function PKMContent() {
-  const t = useTranslations("pkm");
-
-  const data: ProjectData = {
-    icon: "/images/jellyfish.png",
-    name: t("name"),
-    description: t("description"),
-    accent: "oklch(0.627 0.265 303)",
-    tags: ["Python", "Embeddings", "Semantic Search"],
-    github: "https://github.com/naeil-dev/pkm",
-    comingSoon: true,
-  };
-
-  return <ProjectLayout data={data} />;
-}

package/src/app/[locale]/(content)/projects/page.tsx

@@ -1,100 +0,0 @@
-import { setRequestLocale } from "next-intl/server";
-import { useTranslations } from "next-intl";
-import { Link } from "@/i18n/routing";
-import {
-  Card,
-  CardHeader,
-  CardTitle,
-  CardDescription,
-  CardContent,
-} from "@/components/ui/card";
-import { Badge } from "@/components/ui/badge";
-import { PageTitle } from "@/components/typography";
-
-export default async function ProjectsPage({
-  params,
-}: {
-  params: Promise<{ locale: string }>;
-}) {
-  const { locale } = await params;
-  setRequestLocale(locale);
-
-  return <ProjectsContent />;
-}
-
-function ProjectsContent() {
-  const t = useTranslations();
-
-  const PROJECTS = [
-    {
-      name: t("projects.cc.name"),
-      description: t("projects.cc.description"),
-      href: "/cc" as const,
-      tags: ["Python", "RSS", "AI"],
-      status: t("projects.status.active"),
-      coming: false,
-    },
-    {
-      name: t("projects.pkm.name"),
-      description: t("projects.pkm.description"),
-      href: "/pkm" as const,
-      tags: ["Python", "Embeddings", "Search"],
-      status: t("projects.status.coming"),
-      coming: true,
-    },
-    {
-      name: t("projects.naeilUi.name"),
-      description: t("projects.naeilUi.description"),
-      href: "/design" as const,
-      tags: ["React", "Tailwind", "Design Tokens"],
-      status: t("projects.status.active"),
-      coming: false,
-    },
-    {
-      name: t("projects.babyAgent.name"),
-      description: t("projects.babyAgent.description"),
-      href: "/baby-agent" as const,
-      tags: ["OpenClaw", "LINE", "AI"],
-      status: t("projects.status.coming"),
-      coming: true,
-    },
-  ];
-
-  return (
-    <section className="mx-auto max-w-4xl px-6 pb-24">
-      <div className="mb-10">
-        <PageTitle className="mb-3">{t("projects.title")}</PageTitle>
-        <p className="text-muted-foreground text-lg">
-          {t("projects.subtitle")}
-        </p>
-      </div>
-
-      <div className="grid gap-4">
-        {PROJECTS.map((project) => (
-          <Link key={project.name} href={project.href}>
-            <Card className="transition-colors hover:border-foreground/20">
-              <CardHeader>
-                <div className="flex items-center justify-between">
-                  <CardTitle className="text-base">{project.name}</CardTitle>
-                  <Badge variant={project.coming ? "outline" : "secondary"}>
-                    {project.status}
-                  </Badge>
-                </div>
-                <CardDescription>{project.description}</CardDescription>
-              </CardHeader>
-              <CardContent>
-                <div className="flex flex-wrap gap-1.5">
-                  {project.tags.map((tag) => (
-                    <Badge key={tag} variant="outline" className="text-xs">
-                      {tag}
-                    </Badge>
-                  ))}
-                </div>
-              </CardContent>
-            </Card>
-          </Link>
-        ))}
-      </div>
-    </section>
-  );
-}

package/src/app/[locale]/(content)/sa/page.tsx

@@ -1,179 +0,0 @@
-import { setRequestLocale } from "next-intl/server";
-import { useTranslations } from "next-intl";
-import { ProjectLayout } from "@/components/project-layout";
-import type { ProjectData } from "@/components/project-layout";
-
-export default async function SAPage({
-  params,
-}: {
-  params: Promise<{ locale: string }>;
-}) {
-  const { locale } = await params;
-  setRequestLocale(locale);
-
-  return <SAContent />;
-}
-
-function SAContent() {
-  const t = useTranslations("sa");
-
-  const data: ProjectData = {
-    icon: "/images/fish.png",
-    name: t("name"),
-    description: t("description"),
-    accent: "oklch(0.723 0.219 149)",
-    tags: ["Python", "PostgreSQL", "pgvector", "BGE-M3", "Claude", "Docling"],
-    github: "https://github.com/naeil-dev/sustainability-analyzer",
-
-    overview: t("overview"),
-
-    features: [
-      {
-        icon: "📄",
-        title: t("features.ingest.title"),
-        description: t("features.ingest.desc"),
-      },
-      {
-        icon: "🔍",
-        title: t("features.embed.title"),
-        description: t("features.embed.desc"),
-      },
-      {
-        icon: "🗂️",
-        title: t("features.topics.title"),
-        description: t("features.topics.desc"),
-      },
-      {
-        icon: "📊",
-        title: t("features.assess.title"),
-        description: t("features.assess.desc"),
-      },
-      {
-        icon: "⚖️",
-        title: t("features.compare.title"),
-        description: t("features.compare.desc"),
-      },
-      {
-        icon: "⚡",
-        title: t("features.zeroCost.title"),
-        description: t("features.zeroCost.desc"),
-      },
-    ],
-
-    workflow: {
-      nodes: [
-        {
-          id: "pdf",
-          label: "ESG Reports",
-          type: "source",
-          position: { x: 50, y: 5 },
-          detail: {
-            description: t("workflow.pdf.desc"),
-            tech: ["PDF"],
-            meta: t("workflow.pdf.meta"),
-          },
-        },
-        {
-          id: "docling",
-          label: "Docling Parser",
-          type: "process",
-          position: { x: 50, y: 18 },
-          detail: {
-            description: t("workflow.docling.desc"),
-            tech: ["Docling", "Python"],
-            meta: t("workflow.docling.meta"),
-          },
-        },
-        {
-          id: "chunk",
-          label: "Hierarchical Chunker",
-          type: "process",
-          position: { x: 50, y: 32 },
-          detail: {
-            description: t("workflow.chunk.desc"),
-            tech: ["Parent-Child", "Layout-aware"],
-            meta: t("workflow.chunk.meta"),
-          },
-        },
-        {
-          id: "bgem3",
-          label: "BGE-M3",
-          type: "ai",
-          position: { x: 25, y: 46 },
-          detail: {
-            description: t("workflow.bgem3.desc"),
-            tech: ["FlagEmbedding", "PyTorch"],
-            meta: t("workflow.bgem3.meta"),
-          },
-        },
-        {
-          id: "pgvector",
-          label: "PostgreSQL",
-          type: "storage",
-          position: { x: 75, y: 46 },
-          detail: {
-            description: t("workflow.pgvector.desc"),
-            tech: ["PostgreSQL 17", "pgvector", "Docker"],
-          },
-        },
-        {
-          id: "search",
-          label: "Hybrid Search",
-          type: "process",
-          position: { x: 50, y: 60 },
-          detail: {
-            description: t("workflow.search.desc"),
-            tech: ["Dense", "Sparse", "pgvector"],
-          },
-        },
-        {
-          id: "claude",
-          label: "Claude Sonnet",
-          type: "ai",
-          position: { x: 50, y: 74 },
-          detail: {
-            description: t("workflow.claude.desc"),
-            tech: ["Claude Sonnet", "Anthropic API"],
-            meta: t("workflow.claude.meta"),
-          },
-        },
-        {
-          id: "report",
-          label: "Comparison Report",
-          type: "output",
-          position: { x: 50, y: 90 },
-          detail: {
-            description: t("workflow.report.desc"),
-            tech: ["Jinja2", "HTML"],
-            meta: t("workflow.report.meta"),
-          },
-        },
-      ],
-      edges: [
-        { from: "pdf", to: "docling" },
-        { from: "docling", to: "chunk" },
-        { from: "chunk", to: "bgem3" },
-        { from: "chunk", to: "pgvector" },
-        { from: "bgem3", to: "pgvector" },
-        { from: "pgvector", to: "search" },
-        { from: "search", to: "claude" },
-        { from: "claude", to: "pgvector" },
-        { from: "claude", to: "report" },
-      ],
-    },
-
-    stack: [
-      { icon: "🐍", name: "Python 3.12" },
-      { icon: "🐘", name: "PostgreSQL 17" },
-      { icon: "🧮", name: "pgvector 0.8" },
-      { icon: "🔤", name: "BGE-M3" },
-      { icon: "🧠", name: "Claude Sonnet" },
-      { icon: "📄", name: "Docling" },
-      { icon: "🔥", name: "PyTorch" },
-      { icon: "🐳", name: "Docker Compose" },
-      { icon: "📊", name: "Jinja2" },
-    ],
-  };
-
-  return <ProjectLayout data={data} />;
-}

package/src/app/[locale]/(landing)/page.tsx

@@ -1,157 +0,0 @@
-import { setRequestLocale } from "next-intl/server";
-import { useTranslations } from "next-intl";
-import { Link } from "@/i18n/routing";
-import { Badge } from "@/components/ui/badge";
-import { HeroSection } from "@/components/hero-section";
-import Image from "next/image";
-
-export default async function HubPage({
-  params,
-}: {
-  params: Promise<{ locale: string }>;
-}) {
-  const { locale } = await params;
-  setRequestLocale(locale);
-
-  return <HubContent />;
-}
-
-const PROJECTS = [
-  {
-    key: "cc" as const,
-    href: "/cc" as const,
-    icon: "/images/coral.png",
-    accent: "oklch(0.704 0.140 181)",
-    tags: ["Python", "RSS", "AI"],
-    status: "active" as const,
-    featured: true,
-  },
-  {
-    key: "pkm" as const,
-    href: "/pkm" as const,
-    icon: "/images/jellyfish.png",
-    accent: "oklch(0.702 0.183 293)",
-    tags: ["Python", "Embeddings", "Search"],
-    status: "coming" as const,
-    featured: false,
-  },
-  {
-    key: "naeilUi" as const,
-    href: "/design" as const,
-    icon: "/images/whale.png",
-    accent: "oklch(0.623 0.214 259)",
-    tags: ["React", "Tailwind", "OKLCH"],
-    status: "active" as const,
-    featured: false,
-  },
-  {
-    key: "sa" as const,
-    href: "/sa" as const,
-    icon: "/images/fish.png",
-    accent: "oklch(0.723 0.219 149)",
-    tags: ["Python", "pgvector", "Claude"],
-    status: "active" as const,
-    featured: false,
-  },
-  {
-    key: "babyAgent" as const,
-    href: "/baby-agent" as const,
-    icon: "/images/turtle.png",
-    accent: "oklch(0.769 0.188 70.08)",
-    tags: ["LINE", "AI"],
-    status: "coming" as const,
-    featured: false,
-  },
-] as const;
-
-function HubContent() {
-  const t = useTranslations();
-
-  return (
-    <>
-      {/* Hero */}
-      <HeroSection />
-
-      {/* Projects — Bento Grid */}
-      <section className="mx-auto max-w-4xl px-6 py-24">
-        <h2 className="text-foreground mb-2 text-2xl font-bold tracking-tight">
-          {t("projects.title")}
-        </h2>
-        <p className="text-muted-foreground mb-10 text-sm">
-          {t("projects.subtitle")}
-        </p>
-
-        <div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
-          {PROJECTS.map((project) => (
-            <Link
-              key={project.key}
-              href={project.href}
-              className={[
-                "group relative rounded-2xl border border-border-subtle bg-surface-subtle p-7 transition-all duration-250",
-                "hover:-translate-y-0.5 hover:border-border-subtle-hover hover:shadow-[0_8px_32px_rgba(0,0,0,0.08)] dark:hover:shadow-[0_8px_32px_rgba(0,0,0,0.3)]",
-                project.featured ? "sm:col-span-2 sm:flex sm:items-center sm:gap-8" : "",
-              ].join(" ")}
-              style={{ "--accent": project.accent } as React.CSSProperties}
-            >
-              {/* Icon */}
-              <div
-                className={[
-                  "flex shrink-0 items-center justify-center rounded-[14px]",
-                  project.featured
-                    ? "mb-5 h-14 w-14 sm:mb-0 sm:h-20 sm:w-20"
-                    : "mb-5 h-14 w-14",
-                ].join(" ")}
-                style={{
-                  background: `color-mix(in oklch, ${project.accent} 8%, transparent)`,
-                  border: `1px solid color-mix(in oklch, ${project.accent} 20%, transparent)`,
-                }}
-              >
-                <Image
-                  src={project.icon}
-                  alt=""
-                  width={project.featured ? 52 : 36}
-                  height={project.featured ? 52 : 36}
-                  className="object-contain"
-                />
-              </div>
-
-              {/* Text */}
-              <div className={project.featured ? "flex-1" : ""}>
-                <div className="text-foreground mb-1.5 text-[15px] font-semibold">
-                  {t(`projects.${project.key}.name`)}
-                  {project.status === "coming" && (
-                    <Badge
-                      variant="outline"
-                      className="text-muted-foreground ml-2 px-1.5 py-0 text-[9px] align-middle"
-                    >
-                      {t("projects.status.coming")}
-                    </Badge>
-                  )}
-                </div>
-                <p className="text-muted-foreground mb-3 text-[13px] leading-relaxed">
-                  {t(`projects.${project.key}.description`)}
-                </p>
-                <div className="flex flex-wrap gap-1.5">
-                  {project.tags.map((tag) => (
-                    <span
-                      key={tag}
-                      className="rounded-full border border-border-subtle px-2 py-0.5 text-[10px] text-zinc-400"
-                    >
-                      {tag}
-                    </span>
-                  ))}
-                </div>
-              </div>
-
-              {/* Arrow */}
-              <span className="text-muted-foreground/40 group-hover:text-foreground absolute right-6 top-6 text-sm transition-colors">
-                ↗
-              </span>
-            </Link>
-          ))}
-        </div>
-      </section>
-
-    </>
-  );
-}

package/src/app/[locale]/layout.tsx

@@ -1,72 +0,0 @@
-import type { Metadata } from "next";
-import { NextIntlClientProvider } from "next-intl";
-import {
-  getMessages,
-  getTranslations,
-  setRequestLocale,
-} from "next-intl/server";
-import { notFound } from "next/navigation";
-import { ThemeProvider } from "@/components/theme-provider";
-import { Toaster } from "@/components/ui/sonner";
-import { NavServerWrapper } from "@/components/nav-server-wrapper";
-import { FooterWrapper } from "@/components/footer-wrapper";
-import { locales, type Locale } from "@/i18n/config";
-
-export function generateStaticParams() {
-  return locales.map((locale) => ({ locale }));
-}
-
-export async function generateMetadata({
-  params,
-}: {
-  params: Promise<{ locale: string }>;
-}): Promise<Metadata> {
-  const { locale } = await params;
-  const t = await getTranslations({ locale, namespace: "common" });
-  return {
-    title: t("appName"),
-    description: "Personal projects by Jay",
-    alternates: {
-      canonical: `https://naeil.dev/${locale}`,
-      languages: {
-        en: "https://naeil.dev/en",
-        ko: "https://naeil.dev/ko",
-        ja: "https://naeil.dev/ja",
-        "x-default": "https://naeil.dev/en",
-      },
-    },
-  };
-}
-
-export default async function LocaleLayout({
-  children,
-  params,
-}: {
-  children: React.ReactNode;
-  params: Promise<{ locale: string }>;
-}) {
-  const { locale } = await params;
-
-  if (!locales.includes(locale as Locale)) {
-    notFound();
-  }
-
-  setRequestLocale(locale);
-  const messages = await getMessages();
-
-  return (
-    <NextIntlClientProvider messages={messages}>
-      <ThemeProvider
-        attribute="class"
-        defaultTheme="dark"
-        enableSystem
-        disableTransitionOnChange
-      >
-        <NavServerWrapper />
-        <main>{children}</main>
-        <FooterWrapper />
-        <Toaster />
-      </ThemeProvider>
-    </NextIntlClientProvider>
-  );
-}

package/src/app/[locale]/login/actions.ts

@@ -1,10 +0,0 @@
-"use server";
-
-import { redirect } from "@/i18n/routing";
-import { createClient } from "@/lib/supabase/server";
-
-export async function logout(locale: string) {
-  const supabase = await createClient();
-  await supabase.auth.signOut();
-  redirect({ href: "/", locale });
-}

package/src/app/[locale]/login/oauth-buttons.tsx

@@ -1,78 +0,0 @@
-"use client";
-
-import { useTranslations } from "next-intl";
-import { Button } from "@/components/ui/button";
-import { createClient } from "@/lib/supabase/client";
-
-export function OAuthButtons({ next }: { next?: string }) {
-  const t = useTranslations("auth");
-
-  const handleOAuth = async (provider: "google" | "github") => {
-    const supabase = createClient();
-    await supabase.auth.signInWithOAuth({
-      provider,
-      options: {
-        redirectTo: `${window.location.origin}/auth/callback`,
-      },
-    });
-  };
-
-  return (
-    <div className="flex flex-col gap-3">
-      <Button
-        variant="outline"
-        size="lg"
-        className="w-full"
-        onClick={() => handleOAuth("google")}
-      >
-        <GoogleIcon />
-        {t("loginWithGoogle")}
-      </Button>
-      <Button
-        variant="outline"
-        size="lg"
-        className="w-full"
-        onClick={() => handleOAuth("github")}
-      >
-        <GitHubIcon />
-        {t("loginWithGithub")}
-      </Button>
-    </div>
-  );
-}
-
-function GoogleIcon() {
-  return (
-    <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
-      <path
-        d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z"
-        fill="#4285F4"
-      />
-      <path
-        d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
-        fill="#34A853"
-      />
-      <path
-        d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
-        fill="#FBBC05"
-      />
-      <path
-        d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
-        fill="#EA4335"
-      />
-    </svg>
-  );
-}
-
-function GitHubIcon() {
-  return (
-    <svg
-      width="16"
-      height="16"
-      viewBox="0 0 24 24"
-      fill="currentColor"
-    >
-      <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
-    </svg>
-  );
-}