Initial commit: img-infinite-canvas AI design workbench MVP
Moteva-style AI design workbench replica. Home prompt creates a project; the project page provides an infinite canvas with node drag, zoom/pan, a design chat panel, history replay, image asset upload, and project save/regenerate. - Backend: go-zero, DDD layering, sqlc/pgx, optional PostgreSQL; memory or Redis cache; asynq job queue; MinIO/S3/R2/OSS object storage; sky-valley/pi agent runtime adapter. - Frontend: Next.js App Router + Vite artifact build, TypeScript, i18n, shadcn/ui components, auth (OTP/Turnstile/Google/WeChat). - Deploy: Docker Compose and k3s manifests. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,45 @@
|
||||
"use client";
|
||||
|
||||
import { Check, X } from "lucide-react";
|
||||
import type { ProjectSummary } from "@/domain/design";
|
||||
import { useI18n } from "@/i18n/i18n";
|
||||
import { ProjectThumb } from "@/ui/components/ProjectThumb";
|
||||
|
||||
type ProjectCardProps = {
|
||||
project: ProjectSummary;
|
||||
editMode?: boolean;
|
||||
selected?: boolean;
|
||||
onActivate: () => void;
|
||||
onDelete?: () => void;
|
||||
};
|
||||
|
||||
export function ProjectCard({ project, editMode = false, selected = false, onActivate, onDelete }: ProjectCardProps) {
|
||||
const { t, locale } = useI18n();
|
||||
|
||||
return (
|
||||
<div className={`project-card-shell ${editMode ? "is-selecting" : ""} ${selected ? "selected" : ""}`}>
|
||||
{editMode && (
|
||||
<span className="project-card-selection" aria-hidden="true">
|
||||
{selected && <Check size={14} />}
|
||||
</span>
|
||||
)}
|
||||
<button className="project-card" onClick={onActivate} aria-pressed={editMode ? selected : undefined}>
|
||||
<ProjectThumb variant={project.thumbnail} />
|
||||
{!editMode && <span className="project-card-overlay">{t("continueEditing")}</span>}
|
||||
<strong>{project.title}</strong>
|
||||
<small>{formatProjectDate(project.updatedAt, locale)}</small>
|
||||
</button>
|
||||
{!editMode && onDelete && (
|
||||
<button className="project-delete-button" aria-label={t("contextDelete")} onClick={onDelete}>
|
||||
<X size={14} />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function formatProjectDate(value: string, locale: string) {
|
||||
const date = new Date(value);
|
||||
if (Number.isNaN(date.getTime())) return value;
|
||||
return new Intl.DateTimeFormat(locale, { month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" }).format(date);
|
||||
}
|
||||
Reference in New Issue
Block a user