agentic-dev 0.2.10 → 0.2.11

package/client/admin/src/auth/ProtectedRoute.tsx

@@ -1,22 +0,0 @@
-import { Navigate, Outlet, useLocation } from "react-router-dom";
-
-import { useAuth } from "@/auth/AuthProvider";
-
-export function ProtectedRoute() {
-  const { initializing, user } = useAuth();
-  const location = useLocation();
-
-  if (initializing) {
-    return (
-      <div className="flex min-h-screen items-center justify-center bg-[var(--admin-shell-bg)] text-sm font-medium text-[#5d6879]">
-        관리자 세션을 확인하는 중입니다.
-      </div>
-    );
-  }
-
-  if (!user) {
-    return <Navigate to="/login" replace state={{ from: location }} />;
-  }
-
-  return <Outlet />;
-}

package/client/admin/src/auth/auth-client.ts

@@ -1,38 +0,0 @@
-import type { AuthToken, AuthUser, LoginCommand } from "@/auth/types";
-
-const API_BASE_URL = (import.meta.env.VITE_API_BASE_URL as string | undefined)?.replace(/\/$/, "") ?? "";
-
-async function readJson<T>(response: Response): Promise<T> {
-  if (!response.ok) {
-    let message = "Request failed";
-    try {
-      const data = (await response.json()) as { detail?: string };
-      if (typeof data.detail === "string" && data.detail.length > 0) {
-        message = data.detail;
-      }
-    } catch {
-      message = response.statusText || message;
-    }
-    throw new Error(message);
-  }
-
-  return (await response.json()) as T;
-}
-
-export async function login(command: LoginCommand): Promise<AuthToken> {
-  const response = await fetch(`${API_BASE_URL}/auth/login`, {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify(command),
-  });
-
-  return readJson<AuthToken>(response);
-}
-
-export async function getMe(accessToken: string): Promise<AuthUser> {
-  const response = await fetch(`${API_BASE_URL}/auth/me`, {
-    headers: { Authorization: `Bearer ${accessToken}` },
-  });
-
-  return readJson<AuthUser>(response);
-}

package/client/admin/src/auth/types.ts

@@ -1,18 +0,0 @@
-export interface AuthToken {
-  access_token: string;
-  token_type: string;
-  user_id: string;
-}
-
-export interface AuthUser {
-  id: string;
-  name: string;
-  email: string;
-  role: string;
-  status: string;
-}
-
-export interface LoginCommand {
-  email: string;
-  password: string;
-}

package/client/admin/src/components/AdminNotificationsDrawer.tsx

@@ -1,162 +0,0 @@
-import { Check, CircleDot, X } from "lucide-react";
-import { useEffect, useState } from "react";
-
-import {
-  fetchAlerts,
-  markAlertRead,
-  markAllAlertsRead,
-  type AlertItem,
-} from "@/api/alerts";
-import { useAuth } from "@/auth/AuthProvider";
-import { Button } from "@/components/ui/button";
-
-export function AdminNotificationsDrawer({
-  open,
-  onClose,
-}: {
-  open: boolean;
-  onClose: () => void;
-}) {
-  const { token } = useAuth();
-  const [items, setItems] = useState<AlertItem[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [unreadCount, setUnreadCount] = useState(0);
-
-  useEffect(() => {
-    if (!open || !token?.access_token) {
-      return;
-    }
-
-    let cancelled = false;
-    setLoading(true);
-    setError(null);
-
-    fetchAlerts(token.access_token)
-      .then((response) => {
-        if (!cancelled) {
-          setItems(response.items);
-          setUnreadCount(response.unread_count);
-        }
-      })
-      .catch((nextError: Error) => {
-        if (!cancelled) {
-          setError(nextError.message);
-          setItems([]);
-          setUnreadCount(0);
-        }
-      })
-      .finally(() => {
-        if (!cancelled) {
-          setLoading(false);
-        }
-      });
-
-    return () => {
-      cancelled = true;
-    };
-  }, [open, token?.access_token]);
-
-  if (!open) return null;
-
-  async function handleMarkRead(alertId: string) {
-    if (!token?.access_token) {
-      return;
-    }
-
-    const updated = await markAlertRead(alertId, token.access_token);
-    setItems((current) =>
-      current.map((item) => (item.id === updated.id ? updated : item)),
-    );
-    setUnreadCount((current) => Math.max(0, updated.read ? current - 1 : current));
-  }
-
-  async function handleMarkAllRead() {
-    if (!token?.access_token) {
-      return;
-    }
-
-    const result = await markAllAlertsRead(token.access_token);
-    setItems((current) => current.map((item) => ({ ...item, read: true })));
-    setUnreadCount(result.unread_count);
-  }
-
-  return (
-    <div className="fixed inset-0 z-50 bg-black/20">
-      <div className="ml-auto flex h-full w-[var(--admin-drawer-width)] flex-col border-l border-[var(--admin-border)] bg-white shadow-2xl">
-        <div className="flex items-center justify-between border-b border-[var(--admin-border)] px-6 py-5">
-          <div>
-            <h2 className="text-lg font-bold text-[#1f2634]">알림</h2>
-            <p className="mt-1 text-sm text-[var(--admin-muted)]">
-              운영 이벤트와 시스템 상태 · 미읽음 {unreadCount}건
-            </p>
-          </div>
-          <button
-            className="inline-flex h-10 w-10 items-center justify-center rounded-full border border-[var(--admin-border)]"
-            onClick={onClose}
-          >
-            <X className="h-4 w-4" />
-          </button>
-        </div>
-        <div className="flex-1 space-y-3 overflow-y-auto p-6">
-          {loading ? (
-            <div className="text-sm text-[var(--admin-muted)]">
-              알림을 불러오는 중입니다.
-            </div>
-          ) : null}
-          {error ? (
-            <div className="text-sm font-semibold text-[var(--admin-danger)]">
-              {error}
-            </div>
-          ) : null}
-          {!loading && !error && !items.length ? (
-            <div className="text-sm text-[var(--admin-muted)]">
-              표시할 알림이 없습니다.
-            </div>
-          ) : null}
-          {items.map((item) => (
-            <div
-              key={item.id}
-              className="rounded-2xl border border-[var(--admin-border)] bg-[#fafbfd] p-4"
-            >
-              <div className="flex items-start justify-between gap-3">
-                <div>
-                  <p className="font-semibold text-[#202939]">{item.title}</p>
-                  <p className="mt-1 text-sm text-[var(--admin-muted)]">
-                    {item.message}
-                  </p>
-                  <p className="mt-2 text-xs text-[var(--admin-muted)]">
-                    {item.source} · {item.created_at}
-                  </p>
-                </div>
-                {!item.read ? (
-                  <button
-                    className="inline-flex items-center gap-1 rounded-full bg-white px-3 py-1 text-xs font-semibold text-[#344156]"
-                    onClick={() => void handleMarkRead(item.id)}
-                  >
-                    <CircleDot className="h-3.5 w-3.5" />
-                    읽음
-                  </button>
-                ) : (
-                  <span className="rounded-full bg-white px-3 py-1 text-xs font-semibold text-[var(--admin-muted)]">
-                    읽음
-                  </span>
-                )}
-              </div>
-            </div>
-          ))}
-        </div>
-        <div className="border-t border-[var(--admin-border)] p-6">
-          <Button
-            variant="outline"
-            className="w-full justify-center gap-2"
-            onClick={() => void handleMarkAllRead()}
-          >
-            <Check className="h-4 w-4" />
-            모두 읽음
-          </Button>
-        </div>
-      </div>
-    </div>
-  );
-}

package/client/admin/src/components/AdminShell.tsx

@@ -1,76 +0,0 @@
-import { Bell, LayoutDashboard, LifeBuoy, Settings2 } from "lucide-react";
-import { useState } from "react";
-import { NavLink, Outlet } from "react-router-dom";
-
-import { useAuth } from "@/auth/AuthProvider";
-import { AdminNotificationsDrawer } from "@/components/AdminNotificationsDrawer";
-import { Button } from "@/components/ui/button";
-import { adminTheme } from "@/theme";
-import { adminThemeVars } from "@/theme-vars";
-
-const navItems = [
-  { to: "/", label: "대시보드", icon: LayoutDashboard },
-  { to: "/queue", label: "거래 관리", icon: Settings2 },
-  { to: "/support", label: "고객지원", icon: LifeBuoy },
-];
-
-export function AdminShell() {
-  const [notificationsOpen, setNotificationsOpen] = useState(false);
-  const { logout, user } = useAuth();
-
-  return (
-    <div className="min-h-screen bg-[var(--admin-shell-bg)] text-[#283042]" style={adminThemeVars(adminTheme)}>
-      <div className="grid min-h-screen grid-cols-[var(--admin-rail-width)_1fr]">
-        <aside className="bg-[var(--admin-rail-bg)] px-6 py-8 text-white">
-          <div className="pb-8 text-[22px] font-black tracking-[0.18em]">ADMIN</div>
-          <nav className="space-y-2">
-            {navItems.map((item) => {
-              const Icon = item.icon;
-              return (
-                <NavLink
-                  key={item.to}
-                  to={item.to}
-                  end={item.to === "/"}
-                  className={({ isActive }) =>
-                    `flex items-center gap-3 rounded-xl px-4 py-3 text-sm font-semibold ${isActive ? "bg-white/14 text-white" : "text-white/70"}`
-                  }
-                >
-                  <Icon className="h-4 w-4" />
-                  {item.label}
-                </NavLink>
-              );
-            })}
-          </nav>
-        </aside>
-
-        <div className="min-w-0">
-          <header className="flex h-[var(--admin-topbar-height)] items-center justify-between border-b border-[var(--admin-border)] bg-white px-8">
-            <div>
-              <p className="text-sm text-[var(--admin-muted)]">운영 콘솔</p>
-              <p className="mt-1 text-lg font-bold">제품 우선 관리자 화면</p>
-            </div>
-            <div className="flex items-center gap-3">
-              <button
-                aria-label="알림 열기"
-                className="inline-flex h-10 w-10 items-center justify-center rounded-full border border-[var(--admin-border)] bg-white"
-                onClick={() => setNotificationsOpen(true)}
-              >
-                <Bell className="h-4 w-4 text-[#5d6879]" />
-              </button>
-              <div className="rounded-full bg-[#f7f8fb] px-4 py-2 text-sm font-semibold">{user?.name ?? user?.email}</div>
-              <Button variant="outline" onClick={logout}>
-                로그아웃
-              </Button>
-            </div>
-          </header>
-
-          <main className="p-8">
-            <Outlet />
-          </main>
-        </div>
-      </div>
-
-      <AdminNotificationsDrawer open={notificationsOpen} onClose={() => setNotificationsOpen(false)} />
-    </div>
-  );
-}

package/client/admin/src/components/ui/button.tsx

@@ -1,34 +0,0 @@
-import * as React from "react";
-import { cva, type VariantProps } from "class-variance-authority";
-
-import { cn } from "@/lib/cn";
-
-const buttonVariants = cva(
-  "inline-flex items-center justify-center rounded-md text-sm font-semibold transition-colors disabled:pointer-events-none disabled:opacity-50",
-  {
-    variants: {
-      variant: {
-        primary: "bg-[#f0447d] text-white hover:bg-[#d4386b]",
-        neutral: "bg-[#232a39] text-white hover:bg-[#151b28]",
-        outline: "border border-[var(--admin-border)] bg-white text-[#3a4354] hover:bg-[#f7f8fb]",
-      },
-      size: {
-        default: "h-10 px-4",
-        sm: "h-9 px-3",
-      },
-    },
-    defaultVariants: {
-      variant: "primary",
-      size: "default",
-    },
-  },
-);
-
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {}
-
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(({ className, variant, size, ...props }, ref) => {
-  return <button ref={ref} className={cn(buttonVariants({ variant, size }), className)} {...props} />;
-});
-Button.displayName = "Button";
-
-export { Button, buttonVariants };

package/client/admin/src/components/ui/input.tsx

@@ -1,21 +0,0 @@
-import * as React from "react";
-
-import { cn } from "@/lib/cn";
-
-export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
-
-const Input = React.forwardRef<HTMLInputElement, InputProps>(({ className, ...props }, ref) => {
-  return (
-    <input
-      ref={ref}
-      className={cn(
-        "flex h-11 w-full rounded-md border border-[var(--admin-border)] bg-white px-3 py-2 text-sm text-[#2a3140] outline-none placeholder:text-[#8a93a3] focus:ring-2 focus:ring-[#f5a7c1]",
-        className,
-      )}
-      {...props}
-    />
-  );
-});
-Input.displayName = "Input";
-
-export { Input };

package/client/admin/src/lib/cn.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from "clsx";
-import { twMerge } from "tailwind-merge";
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}

package/client/admin/src/lib/specRouteCatalog.json

@@ -1,30 +0,0 @@
-[
-  {
-    "id": "TADM_001",
-    "route": "/",
-    "binding": "direct",
-    "notes": ["Primary admin dashboard surface."],
-    "tags": ["shell"]
-  },
-  {
-    "id": "TADM_002",
-    "route": "/queue",
-    "binding": "direct",
-    "notes": ["Admin operations queue view."],
-    "tags": ["queue"]
-  },
-  {
-    "id": "TADM_003",
-    "route": "/support",
-    "binding": "direct",
-    "notes": ["Support workflow and response workspace."],
-    "tags": ["support"]
-  },
-  {
-    "id": "TADM_004",
-    "route": "/login",
-    "binding": "direct",
-    "notes": ["Public admin authentication route."],
-    "tags": ["public"]
-  }
-]

package/client/admin/src/lib/specScreens.json

@@ -1,22 +0,0 @@
-[
-  {
-    "id": "TADM_001",
-    "title": "Admin Dashboard",
-    "tags": ["admin", "overview"]
-  },
-  {
-    "id": "TADM_002",
-    "title": "Admin Queue",
-    "tags": ["admin", "operations"]
-  },
-  {
-    "id": "TADM_003",
-    "title": "Admin Support",
-    "tags": ["admin", "support"]
-  },
-  {
-    "id": "TADM_004",
-    "title": "Admin Login",
-    "tags": ["auth"]
-  }
-]

package/client/admin/src/main.tsx

@@ -1,17 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom/client";
-import { BrowserRouter } from "react-router-dom";
-
-import { AuthProvider } from "@/auth/AuthProvider";
-import { App } from "./app/App";
-import "./styles/globals.css";
-
-ReactDOM.createRoot(document.getElementById("root")!).render(
-  <React.StrictMode>
-    <AuthProvider>
-      <BrowserRouter>
-        <App />
-      </BrowserRouter>
-    </AuthProvider>
-  </React.StrictMode>,
-);

package/client/admin/src/pages/AdminDashboardPage.tsx

@@ -1,171 +0,0 @@
-import { useEffect, useState } from "react";
-
-import { fetchAlerts, type AlertItem, type AlertsPayload } from "@/api/alerts";
-import { fetchAdminOverview, type AdminOverviewResponse } from "@/api/orders";
-import { useAuth } from "@/auth/AuthProvider";
-
-function alertToneClassName(tone: string) {
-  if (tone === "danger") {
-    return "bg-[#fff3f5] text-[#8a274b]";
-  }
-  if (tone === "warning") {
-    return "bg-[#fff4df] text-[#9a5b20]";
-  }
-
-  return "bg-[#f5f7fb] text-[#344156]";
-}
-
-export function AdminDashboardPage() {
-  const { token } = useAuth();
-  const [overview, setOverview] = useState<AdminOverviewResponse | null>(null);
-  const [alerts, setAlerts] = useState<AlertsPayload | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-
-  useEffect(() => {
-    if (!token?.access_token) {
-      return;
-    }
-
-    let cancelled = false;
-
-    setLoading(true);
-    setError(null);
-
-    Promise.all([
-      fetchAdminOverview(token.access_token),
-      fetchAlerts(token.access_token),
-    ])
-      .then(([overviewResponse, alertsResponse]) => {
-        if (!cancelled) {
-          setOverview(overviewResponse);
-          setAlerts(alertsResponse);
-        }
-      })
-      .catch((nextError: Error) => {
-        if (!cancelled) {
-          setError(nextError.message);
-          setOverview(null);
-          setAlerts(null);
-        }
-      })
-      .finally(() => {
-        if (!cancelled) {
-          setLoading(false);
-        }
-      });
-
-    return () => {
-      cancelled = true;
-    };
-  }, [token?.access_token]);
-
-  return (
-    <div className="space-y-6">
-      <section className="grid gap-4 md:grid-cols-3">
-        {(overview?.cards ?? []).map((card) => (
-          <div
-            key={card.label}
-            className="rounded-[var(--admin-card-radius)] border border-[var(--admin-border)] bg-white p-6"
-          >
-            <p className="text-sm text-[var(--admin-muted)]">{card.label}</p>
-            <p
-              className={`mt-3 text-3xl font-bold text-[#202939] ${card.tone ?? ""}`}
-            >
-              {card.value}
-            </p>
-          </div>
-        ))}
-        {loading && !overview ? (
-          <div className="rounded-[var(--admin-card-radius)] border border-[var(--admin-border)] bg-white p-6 md:col-span-3">
-            <p className="text-sm text-[var(--admin-muted)]">운영 요약</p>
-            <p className="mt-3 text-lg font-semibold text-[#202939]">
-              데이터를 불러오는 중입니다.
-            </p>
-          </div>
-        ) : null}
-        {error ? (
-          <div className="rounded-[var(--admin-card-radius)] border border-[var(--admin-border)] bg-white p-6 md:col-span-3">
-            <p className="text-sm text-[var(--admin-muted)]">운영 요약</p>
-            <p className="mt-3 text-lg font-semibold text-[var(--admin-danger)]">
-              {error}
-            </p>
-          </div>
-        ) : null}
-      </section>
-
-      <section className="grid gap-6 xl:grid-cols-[1.1fr_0.9fr]">
-        <div className="rounded-[var(--admin-card-radius)] border border-[var(--admin-border)] bg-white p-6">
-          <h2 className="text-lg font-bold">거래 상태별 현황</h2>
-          <div className="mt-6 grid gap-3 text-sm">
-            {loading && !(overview?.stage_statuses.length ?? 0) ? (
-              <div className="text-[var(--admin-muted)]">
-                상태별 현황을 불러오는 중입니다.
-              </div>
-            ) : null}
-            {error ? (
-              <div className="text-[var(--admin-danger)]">{error}</div>
-            ) : null}
-            {!loading && !error && !(overview?.stage_statuses.length ?? 0) ? (
-              <div className="text-[var(--admin-muted)]">
-                표시할 상태 데이터가 없습니다.
-              </div>
-            ) : null}
-            {(overview?.stage_statuses ?? []).map(({ label, value }) => (
-              <div
-                key={label}
-                className="flex items-center justify-between rounded-xl bg-[#f7f8fb] px-4 py-3"
-              >
-                <span className="text-[#344156]">{label}</span>
-                <span className="font-semibold">{value}</span>
-              </div>
-            ))}
-          </div>
-        </div>
-
-        <div className="rounded-[var(--admin-card-radius)] border border-[var(--admin-border)] bg-white p-6">
-          <div className="flex items-center justify-between gap-3">
-            <h2 className="text-lg font-bold">운영 알림</h2>
-            <span className="rounded-full bg-[#f5f7fb] px-3 py-1 text-xs font-semibold text-[#5d6879]">
-              미읽음 {alerts?.unread_count ?? 0}
-            </span>
-          </div>
-          <div className="mt-6 space-y-3 text-sm">
-            {loading && !(alerts?.items.length ?? 0) ? (
-              <div className="text-[var(--admin-muted)]">
-                운영 알림을 불러오는 중입니다.
-              </div>
-            ) : null}
-            {error ? (
-              <div className="text-[var(--admin-danger)]">{error}</div>
-            ) : null}
-            {!loading && !error && !(alerts?.items.length ?? 0) ? (
-              <div className="text-[var(--admin-muted)]">
-                운영 알림이 없습니다.
-              </div>
-            ) : null}
-            {(alerts?.items ?? []).slice(0, 4).map((alert: AlertItem) => (
-              <div
-                key={alert.id}
-                className={`rounded-xl px-4 py-3 ${alertToneClassName(alert.tone)}`}
-              >
-                <div className="flex items-center justify-between gap-3">
-                  <span className="font-semibold">{alert.title}</span>
-                  {!alert.read ? (
-                    <span className="rounded-full bg-white/70 px-2 py-1 text-[10px] font-bold">
-                      NEW
-                    </span>
-                  ) : null}
-                </div>
-                <p className="mt-2">{alert.message}</p>
-                <p className="mt-2 text-xs opacity-70">
-                  {alert.source} · {alert.created_at}
-                </p>
-              </div>
-            ))}
-          </div>
-        </div>
-      </section>
-    </div>
-  );
-}