agentic-dev 0.2.10 → 0.2.11

package/client/mobile/src/pages/ShippingPage.tsx

@@ -1,338 +0,0 @@
-import { AlertTriangle, ArrowUpRight, CircleCheckBig, Truck } from "lucide-react";
-import { useEffect, useState } from "react";
-import { Link } from "react-router-dom";
-
-import {
-  fetchShipments,
-  fetchShippingOverview,
-  updateShipmentStatus,
-  type ShipmentSummary,
-  type ShippingOverviewResponse,
-} from "@/api/shipping";
-import { useAuth } from "@/auth/AuthProvider";
-import { Button } from "@/components/ui/button";
-import { Card } from "@/components/ui/card";
-
-function shippingStatusClassName(status: string) {
-  if (status === "Delivered") {
-    return "bg-[#dff3ec] text-[var(--in-accent)]";
-  }
-  if (status === "Delayed") {
-    return "bg-[#ffe2d7] text-[#c4663a]";
-  }
-  if (status === "Out for delivery") {
-    return "bg-[#e9f4ff] text-[#245f92]";
-  }
-
-  return "bg-[#fff0d8] text-[#b56a1f]";
-}
-
-function shippingActionPayload(status: string) {
-  if (status === "Delayed") {
-    return {
-      label: "재개",
-      body: {
-        status: "In transit",
-        last_event: "재배차 완료",
-        eta: "2026.03.14 20:30",
-      },
-      variant: "secondary" as const,
-    };
-  }
-
-  if (status === "Delivered") {
-    return null;
-  }
-
-  return {
-    label: "완료",
-    body: {
-      status: "Delivered",
-      last_event: "고객 인수 완료",
-      eta: "2026.03.14 19:10",
-    },
-    variant: "default" as const,
-  };
-}
-
-export function ShippingPage() {
-  const { token } = useAuth();
-  const [overview, setOverview] = useState<ShippingOverviewResponse | null>(null);
-  const [shipments, setShipments] = useState<ShipmentSummary[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [pendingShipmentId, setPendingShipmentId] = useState<string | null>(null);
-
-  useEffect(() => {
-    const accessToken = token?.access_token;
-    if (!accessToken) {
-      return;
-    }
-    const currentAccessToken = accessToken;
-
-    let cancelled = false;
-
-    async function loadShippingData() {
-      setLoading(true);
-      setError(null);
-
-      try {
-        const [overviewResponse, shipmentResponse] = await Promise.all([
-          fetchShippingOverview(currentAccessToken),
-          fetchShipments(currentAccessToken),
-        ]);
-        if (!cancelled) {
-          setOverview(overviewResponse);
-          setShipments(shipmentResponse);
-        }
-      } catch (nextError) {
-        if (!cancelled) {
-          const message =
-            nextError instanceof Error ? nextError.message : "Request failed";
-          setError(message);
-          setOverview(null);
-          setShipments([]);
-        }
-      } finally {
-        if (!cancelled) {
-          setLoading(false);
-        }
-      }
-    }
-
-    void loadShippingData();
-
-    return () => {
-      cancelled = true;
-    };
-  }, [token?.access_token]);
-
-  async function handleShipmentAction(shipment: ShipmentSummary) {
-    const accessToken = token?.access_token;
-    if (!accessToken) {
-      return;
-    }
-
-    const action = shippingActionPayload(shipment.status);
-    if (!action) {
-      return;
-    }
-
-    setPendingShipmentId(shipment.shipment_id);
-    setError(null);
-
-    try {
-      await updateShipmentStatus(
-        shipment.shipment_id,
-        accessToken,
-        action.body,
-      );
-      const [overviewResponse, shipmentResponse] = await Promise.all([
-        fetchShippingOverview(accessToken),
-        fetchShipments(accessToken),
-      ]);
-      setOverview(overviewResponse);
-      setShipments(shipmentResponse);
-    } catch (nextError) {
-      const message =
-        nextError instanceof Error ? nextError.message : "Request failed";
-      setError(message);
-    } finally {
-      setPendingShipmentId(null);
-    }
-  }
-
-  return (
-    <div className="grid gap-6 xl:grid-cols-[1fr_320px]">
-      <Card className="overflow-hidden shadow-[0_18px_48px_rgba(25,54,46,0.06)]">
-        <div className="border-b border-[var(--in-border)] px-6 py-5">
-          <div className="flex flex-wrap items-start justify-between gap-4">
-            <div>
-              <h2 className="text-xl font-black text-[var(--in-text)]">
-                Shipping operations
-              </h2>
-              <p className="mt-2 text-sm text-[var(--in-muted)]">
-                출고 이후 배송 상태, ETA, 마지막 이벤트를 운영자가 바로 갱신하는
-                downstream 배송 surface다.
-              </p>
-            </div>
-            <Link
-              className="inline-flex items-center gap-2 rounded-full bg-[var(--in-accent-soft)] px-3 py-2 text-sm font-semibold text-[var(--in-accent)]"
-              to="/fulfillment"
-            >
-              Fulfillment board
-              <ArrowUpRight className="h-4 w-4" />
-            </Link>
-          </div>
-        </div>
-
-        <table className="w-full border-collapse text-sm">
-          <thead className="bg-[#faf6ef] text-left text-[var(--in-muted)]">
-            <tr>
-              {["Shipment", "Carrier", "Status", "ETA", "Action"].map((cell) => (
-                <th
-                  key={cell}
-                  className="border-b border-[var(--in-border)] px-6 py-4 font-semibold"
-                >
-                  {cell}
-                </th>
-              ))}
-            </tr>
-          </thead>
-          <tbody>
-            {loading ? (
-              <tr>
-                <td
-                  className="border-b border-[var(--in-border)] px-6 py-4 text-[var(--in-muted)]"
-                  colSpan={5}
-                >
-                  배송 shipment를 불러오는 중입니다.
-                </td>
-              </tr>
-            ) : null}
-            {error ? (
-              <tr>
-                <td
-                  className="border-b border-[var(--in-border)] px-6 py-4 text-[#9d4d26]"
-                  colSpan={5}
-                >
-                  {error}
-                </td>
-              </tr>
-            ) : null}
-            {!loading && !error && !shipments.length ? (
-              <tr>
-                <td
-                  className="border-b border-[var(--in-border)] px-6 py-4 text-[var(--in-muted)]"
-                  colSpan={5}
-                >
-                  현재 표시할 shipment가 없습니다.
-                </td>
-              </tr>
-            ) : null}
-            {shipments.map((shipment) => {
-              const action = shippingActionPayload(shipment.status);
-              return (
-                <tr key={shipment.shipment_id}>
-                  <td className="border-b border-[var(--in-border)] px-6 py-4">
-                    <div className="font-semibold text-[var(--in-accent)]">
-                      {shipment.shipment_id}
-                    </div>
-                    <div className="mt-1 text-xs text-[var(--in-muted)]">
-                      {shipment.order_id} · {shipment.destination}
-                    </div>
-                    <div className="mt-1 text-xs text-[var(--in-muted)]">
-                      {shipment.tracking_number}
-                    </div>
-                  </td>
-                  <td className="border-b border-[var(--in-border)] px-6 py-4 text-[var(--in-muted)]">
-                    <div className="font-semibold text-[var(--in-text)]">
-                      {shipment.carrier}
-                    </div>
-                    <div className="mt-1 text-xs">{shipment.last_event}</div>
-                  </td>
-                  <td className="border-b border-[var(--in-border)] px-6 py-4">
-                    <span
-                      className={`rounded-full px-3 py-1 text-xs font-semibold ${shippingStatusClassName(
-                        shipment.status,
-                      )}`}
-                    >
-                      {shipment.status}
-                    </span>
-                  </td>
-                  <td className="border-b border-[var(--in-border)] px-6 py-4 text-[var(--in-text)]">
-                    {shipment.eta}
-                  </td>
-                  <td className="border-b border-[var(--in-border)] px-6 py-4">
-                    {action ? (
-                      <Button
-                        size="sm"
-                        variant={action.variant}
-                        disabled={pendingShipmentId === shipment.shipment_id}
-                        onClick={() => void handleShipmentAction(shipment)}
-                      >
-                        {pendingShipmentId === shipment.shipment_id
-                          ? "처리 중"
-                          : action.label}
-                      </Button>
-                    ) : (
-                      <span className="text-xs font-semibold text-[var(--in-muted)]">
-                        종료됨
-                      </span>
-                    )}
-                  </td>
-                </tr>
-              );
-            })}
-          </tbody>
-        </table>
-      </Card>
-
-      <div className="space-y-6">
-        <Card className="p-6 shadow-[0_18px_48px_rgba(25,54,46,0.06)]">
-          <p className="text-sm font-semibold uppercase tracking-[0.16em] text-[var(--in-accent)]">
-            Shipping pulse
-          </p>
-          <p className="mt-3 text-2xl font-black text-[var(--in-text)]">
-            {overview?.highlighted_route ?? "Route unavailable"}
-          </p>
-          <div className="mt-6 grid gap-3">
-            {(overview?.stats ?? []).map((stat) => (
-              <div
-                key={stat.label}
-                className="rounded-[22px] border border-[var(--in-border)] bg-white px-4 py-4"
-              >
-                <div className="flex items-center justify-between gap-3">
-                  <span className="text-sm text-[var(--in-muted)]">
-                    {stat.label}
-                  </span>
-                  {stat.label === "지연" ? (
-                    <AlertTriangle className="h-4 w-4 text-[#c4663a]" />
-                  ) : stat.label === "오늘 완료" ? (
-                    <CircleCheckBig className="h-4 w-4 text-[#245f92]" />
-                  ) : (
-                    <Truck className="h-4 w-4 text-[var(--in-accent)]" />
-                  )}
-                </div>
-                <div className="mt-3 text-2xl font-black text-[var(--in-text)]">
-                  {stat.value}
-                </div>
-              </div>
-            ))}
-            {loading && !overview ? (
-              <div className="text-sm text-[var(--in-muted)]">
-                배송 overview를 불러오는 중입니다.
-              </div>
-            ) : null}
-          </div>
-        </Card>
-
-        <Card className="p-6 shadow-[0_18px_48px_rgba(25,54,46,0.06)]">
-          <h2 className="text-xl font-black text-[var(--in-text)]">
-            Carrier load
-          </h2>
-          <div className="mt-5 space-y-3">
-            {!loading && !error && !(overview?.carriers.length ?? 0) ? (
-              <div className="text-sm text-[var(--in-muted)]">
-                표시할 carrier 데이터가 없습니다.
-              </div>
-            ) : null}
-            {(overview?.carriers ?? []).map((carrier) => (
-              <div
-                key={carrier.label}
-                className="rounded-[22px] border border-[var(--in-border)] bg-white px-4 py-4"
-              >
-                <div className="font-semibold text-[var(--in-text)]">
-                  {carrier.label}
-                </div>
-                <div className="mt-1 text-sm text-[var(--in-muted)]">
-                  {carrier.value}
-                </div>
-              </div>
-            ))}
-          </div>
-        </Card>
-      </div>
-    </div>
-  );
-}

package/client/mobile/src/styles/globals.css

@@ -1,23 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-:root {
-  font-family: "SUIT", "Pretendard", "Apple SD Gothic Neo", sans-serif;
-  color: #1f2c45;
-  background: #f4f7fb;
-}
-
-* {
-  box-sizing: border-box;
-}
-
-body {
-  margin: 0;
-  min-width: 320px;
-}
-
-a {
-  color: inherit;
-  text-decoration: none;
-}

package/client/mobile/src/theme-vars.ts

@@ -1,16 +0,0 @@
-import type { CSSProperties } from "react";
-
-import type { InTheme } from "./theme";
-
-export function inThemeVars(theme: InTheme): CSSProperties {
-  return {
-    "--in-shell-bg": theme.shellBg,
-    "--in-panel-bg": theme.panelBg,
-    "--in-border": theme.border,
-    "--in-accent": theme.accent,
-    "--in-accent-soft": theme.accentSoft,
-    "--in-muted": theme.muted,
-    "--in-text": theme.text,
-    "--in-card-radius": theme.cardRadius,
-  } as CSSProperties;
-}

package/client/mobile/src/theme.ts

@@ -1,21 +0,0 @@
-export type InTheme = {
-  shellBg: string;
-  panelBg: string;
-  border: string;
-  accent: string;
-  accentSoft: string;
-  muted: string;
-  text: string;
-  cardRadius: string;
-};
-
-export const inTheme: InTheme = {
-  shellBg: "#f4efe6",
-  panelBg: "#fffdf8",
-  border: "#e7dccb",
-  accent: "#18705c",
-  accentSoft: "#dff3ec",
-  muted: "#6f665b",
-  text: "#203029",
-  cardRadius: "24px",
-};

package/client/mobile/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

package/client/mobile/tailwind.config.js

@@ -1,8 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-export default {
-  content: ["./index.html", "./src/**/*.{ts,tsx}"],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-};

package/client/mobile/tsconfig.json

@@ -1,25 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "allowJs": false,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "strict": true,
-    "forceConsistentCasingInFileNames": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["src/*"]
-    }
-  },
-  "include": ["src"],
-  "references": []
-}

package/client/mobile/vite.config.ts

@@ -1,12 +0,0 @@
-import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react";
-import { fileURLToPath, URL } from "node:url";
-
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: {
-      "@": fileURLToPath(new URL("./src", import.meta.url)),
-    },
-  },
-});

package/client/web/.dockerignore

@@ -1,3 +0,0 @@
-node_modules
-dist
-.env

package/client/web/.env.example

@@ -1 +0,0 @@
-VITE_API_BASE_URL=http://127.0.0.1:8000/api/v1

package/client/web/Dockerfile

@@ -1,16 +0,0 @@
-FROM node:20-slim
-
-WORKDIR /app
-
-COPY pnpm-lock.yaml pnpm-workspace.yaml ./
-COPY client/web/package.json ./client/web/package.json
-
-RUN npm install -g pnpm@10.32.0 && pnpm install --filter @do4ai/client-web-template...
-
-COPY . .
-
-WORKDIR /app/client/web
-
-EXPOSE 3001
-
-CMD ["pnpm", "dev", "--host", "0.0.0.0", "--port", "3001"]

package/client/web/Dockerfile.dev

@@ -1,18 +0,0 @@
-FROM node:20-slim
-
-WORKDIR /app
-
-RUN npm install -g pnpm@10.32.0
-
-COPY pnpm-lock.yaml pnpm-workspace.yaml ./
-COPY client/web/package.json ./client/web/package.json
-
-RUN pnpm install --frozen-lockfile --filter @do4ai/client-web-template...
-
-COPY client/web ./client/web
-
-WORKDIR /app/client/web
-
-EXPOSE 3001
-
-CMD ["sh", "-lc", "pnpm exec vite --host 0.0.0.0 --port ${PORT:-3001}"]

package/client/web/README.md

@@ -1,47 +0,0 @@
-# web
-
-일반 사용자용 제품 앱 보일러플레이트다.
-
-포함 패턴:
-
-- 상단 shell + workspace content
-- KPI cards
-- searchable list/table
-- detail side panel
-- CSS variable 기반 theme surface
-
-시작:
-
-```bash
-npm install
-npm run dev
-```
-
-기본 DEV 포트는 `3001`이다.
-
-복제 직후 초기화:
-
-```bash
-npm run ui:parity:init
-```
-
-이 단계는 repo-level contract, `ui_parity_web_contract.yaml`, route-gap manifest를 생성한다.
-
-첫 proof 부트스트랩:
-
-```bash
-npm run ui:parity:bootstrap
-```
-
-이 단계는 build, preview, reference materialization, route-gap gate, proof gate까지 한 번에 수행한다.
-
-패리티/하네스:
-
-```bash
-npm run ui:parity:scaffold
-npm run ui:parity:materialize-references
-npm run ui:parity:route-gap
-npm run ui:parity:proof
-```
-
-이 템플릿은 repo root의 `sdd/99_toolchain/01_automation` 도구를 사용하고, `client/web/scripts/ui-parity-web-adapter.mjs`는 앱별 adapter 예시다.

package/client/web/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="ko">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>client-web template</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>

package/client/web/package.json

@@ -1,42 +0,0 @@
-{
-  "name": "@do4ai/client-web-template",
-  "private": true,
-  "version": "0.1.0",
-  "type": "module",
-  "packageManager": "pnpm@10.32.0",
-  "scripts": {
-    "dev": "vite --host 0.0.0.0 --port 3001",
-    "build": "tsc -b && vite build",
-    "preview": "vite preview --host 0.0.0.0 --port 4301",
-    "ui:parity:init": "bash ../../sdd/99_toolchain/01_automation/agentic-dev/init_frontend_parity.sh ../.. web",
-    "ui:parity:bootstrap": "bash ../../sdd/99_toolchain/01_automation/agentic-dev/bootstrap_frontend_parity.sh ../.. web",
-    "ui:parity:scaffold": "bash ../../sdd/99_toolchain/01_automation/agentic-dev/run_frontend_target.sh scaffold ../.. web",
-    "ui:parity:materialize-references": "bash ../../sdd/99_toolchain/01_automation/agentic-dev/run_frontend_target.sh materialize_references ../.. web",
-    "ui:parity:route-gap": "bash ../../sdd/99_toolchain/01_automation/agentic-dev/run_frontend_target.sh route_gap ../.. web",
-    "ui:parity:proof": "bash ../../sdd/99_toolchain/01_automation/agentic-dev/run_frontend_target.sh proof ../.. web",
-    "ui:parity": "npm run ui:parity:proof"
-  },
-  "dependencies": {
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "lucide-react": "^0.576.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "react-router-dom": "^6.30.1",
-    "tailwind-merge": "^3.5.0"
-  },
-  "devDependencies": {
-    "@playwright/test": "^1.58.2",
-    "@types/react": "^18.3.18",
-    "@types/react-dom": "^18.3.5",
-    "@vitejs/plugin-react": "^4.7.0",
-    "autoprefixer": "^10.4.21",
-    "pixelmatch": "^7.1.0",
-    "pngjs": "^7.0.0",
-    "postcss": "^8.5.3",
-    "tailwindcss": "^3.4.17",
-    "typescript": "^5.8.3",
-    "vite": "^5.4.19",
-    "yaml": "^2.8.1"
-  }
-}

package/client/web/postcss.config.js

@@ -1,6 +0,0 @@
-export default {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};

package/client/web/scripts/ui-parity-web-adapter.mjs

@@ -1,66 +0,0 @@
-import fs from "node:fs";
-import path from "node:path";
-import { fileURLToPath } from "node:url";
-
-const scriptDir = path.dirname(fileURLToPath(import.meta.url));
-const screens = JSON.parse(
-  fs.readFileSync(path.resolve(scriptDir, "../src/lib/specScreens.json"), "utf8"),
-);
-const routes = JSON.parse(
-  fs.readFileSync(path.resolve(scriptDir, "../src/lib/specRouteCatalog.json"), "utf8"),
-);
-
-const routeMap = new Map(routes.map((entry) => [entry.id, entry.route]));
-
-export default {
-  service: "templates-web",
-  targetBaseUrl: "http://127.0.0.1:4301",
-  viewport: {
-    width: 1440,
-    height: 1024,
-  },
-  screens: screens.map((screen) => ({
-    id: screen.id,
-    title: screen.title,
-    route: routeMap.get(screen.id) ?? "/",
-    referenceImage: `sdd/03_verify/10_test/ui_parity/reference/${screen.id}.png`,
-    readySelector: "body",
-    readyTimeoutMs: 10000,
-    tags: ["template", "web"],
-  })),
-  async preparePage(page, { route }) {
-    await page.route("**/auth/me", async (routeRequest) => {
-      await routeRequest.fulfill({
-        status: 200,
-        contentType: "application/json",
-        body: JSON.stringify({
-          id: "tmpl-web",
-          name: "Template Web User",
-          email: "operator@example.com",
-          role: "member",
-        }),
-      });
-    });
-    await page.addInitScript(() => {
-      window.localStorage.setItem(
-        "web.auth.token",
-        JSON.stringify({
-          access_token: "template-access-token",
-          token_type: "bearer",
-          user_id: "tmpl-web",
-        }),
-      );
-    });
-    if (route === "/login") {
-      await page.addInitScript(() => {
-        window.localStorage.removeItem("web.auth.token");
-      });
-    }
-  },
-  async waitForReady(page) {
-    await page.waitForLoadState("networkidle");
-  },
-  async resolveMaskRects() {
-    return [];
-  },
-};