[agent-pipeline] rollback to 784dc73a
This commit is contained in:
DDD1542
parent
d542e92021
commit
ffc7cb7933
|
|
@ -40,7 +40,6 @@ export default function ScreenManagementPage() {
|
|||
const [loading, setLoading] = useState(true);
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [isCreateOpen, setIsCreateOpen] = useState(false);
|
||||
const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
|
||||
|
||||
const tableCount = useMemo(() => new Set(screens.map((s) => s.tableName).filter(Boolean)).size, [screens]);
|
||||
|
||||
|
|
@ -216,100 +215,64 @@ export default function ScreenManagementPage() {
|
|||
{/* 메인 콘텐츠 */}
|
||||
{viewMode === "flow" ? (
|
||||
<div className="flex-1 overflow-hidden flex">
|
||||
{/* 왼쪽: 트리 구조 (접기/펼치기) */}
|
||||
<div
|
||||
className={`flex flex-col border-r border-border/50 bg-background/80 backdrop-blur-sm transition-all duration-300 ease-in-out ${
|
||||
sidebarCollapsed ? "w-[48px] min-w-[48px]" : "w-[320px] min-w-[280px] max-w-[400px]"
|
||||
}`}
|
||||
>
|
||||
{/* 사이드바 토글 */}
|
||||
<div className="flex-shrink-0 flex items-center justify-between p-2 border-b border-border/50">
|
||||
{!sidebarCollapsed && <span className="text-xs font-medium text-muted-foreground px-1">탐색</span>}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7"
|
||||
onClick={() => setSidebarCollapsed(!sidebarCollapsed)}
|
||||
aria-label={sidebarCollapsed ? "사이드바 펼치기" : "사이드바 접기"}
|
||||
>
|
||||
{sidebarCollapsed ? <PanelLeftOpen className="h-4 w-4" /> : <PanelLeftClose className="h-4 w-4" />}
|
||||
</Button>
|
||||
{/* 왼쪽: 트리 구조 */}
|
||||
<div className="w-[350px] min-w-[280px] max-w-[450px] flex flex-col border-r border-border/50 bg-background/80 backdrop-blur-sm">
|
||||
{/* 검색 */}
|
||||
<div className="flex-shrink-0 p-3 border-b border-border/50">
|
||||
<div className="relative">
|
||||
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||
<Input
|
||||
placeholder="화면 검색..."
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
className="pl-9 h-9 rounded-xl bg-muted/30 border-border/50 focus:bg-background focus:ring-2 focus:ring-primary/30 transition-colors"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{!sidebarCollapsed && (
|
||||
<>
|
||||
{/* 검색 */}
|
||||
<div className="flex-shrink-0 p-3 border-b border-border/50">
|
||||
<div className="relative">
|
||||
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||
<Input
|
||||
placeholder="화면 검색..."
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
className="pl-9 h-9 rounded-xl bg-muted/30 border-border/50 focus:bg-background focus:ring-2 focus:ring-primary/30 transition-colors"
|
||||
/>
|
||||
</div>
|
||||
{/* 트리 뷰 */}
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<ScreenGroupTreeView
|
||||
screens={filteredScreens}
|
||||
selectedScreen={selectedScreen}
|
||||
onScreenSelect={handleScreenSelect}
|
||||
onScreenDesign={handleDesignScreen}
|
||||
searchTerm={searchTerm}
|
||||
onGroupSelect={(group) => {
|
||||
setSelectedGroup(group);
|
||||
setSelectedScreen(null); // 화면 선택 해제
|
||||
setFocusedScreenIdInGroup(null); // 포커스 초기화
|
||||
}}
|
||||
onScreenSelectInGroup={(group, screenId) => {
|
||||
// 그룹 내 화면 클릭 시
|
||||
const isNewGroup = selectedGroup?.id !== group.id;
|
||||
|
||||
if (isNewGroup) {
|
||||
// 새 그룹 진입: 포커싱 없이 시작 (첫 진입 시 망가지는 문제 방지)
|
||||
setSelectedGroup(group);
|
||||
setFocusedScreenIdInGroup(null);
|
||||
} else {
|
||||
// 같은 그룹 내에서 다른 화면 클릭: 포커싱 유지
|
||||
setFocusedScreenIdInGroup(screenId);
|
||||
}
|
||||
setSelectedScreen(null);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
{/* 선택 미리보기 */}
|
||||
{selectedScreen && (
|
||||
<div className="flex-shrink-0 border-t border-border/50 p-3 bg-muted/5">
|
||||
<div className="flex items-center gap-2 mb-2">
|
||||
<Monitor className="h-4 w-4 text-primary" />
|
||||
<span className="text-sm font-medium truncate">{selectedScreen.screenName}</span>
|
||||
</div>
|
||||
{/* 트리 뷰 */}
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<ScreenGroupTreeView
|
||||
screens={filteredScreens}
|
||||
selectedScreen={selectedScreen}
|
||||
onScreenSelect={handleScreenSelect}
|
||||
onScreenDesign={handleDesignScreen}
|
||||
searchTerm={searchTerm}
|
||||
onGroupSelect={(group) => {
|
||||
setSelectedGroup(group);
|
||||
setSelectedScreen(null);
|
||||
setFocusedScreenIdInGroup(null);
|
||||
}}
|
||||
onScreenSelectInGroup={(group, screenId) => {
|
||||
const isNewGroup = selectedGroup?.id !== group.id;
|
||||
if (isNewGroup) {
|
||||
setSelectedGroup(group);
|
||||
setFocusedScreenIdInGroup(null);
|
||||
} else {
|
||||
setFocusedScreenIdInGroup(screenId);
|
||||
}
|
||||
setSelectedScreen(null);
|
||||
}}
|
||||
/>
|
||||
<div className="flex items-center gap-3 text-xs text-muted-foreground">
|
||||
<span className="font-mono">{selectedScreen.screenCode}</span>
|
||||
<span>{selectedScreen.tableName || "테이블 없음"}</span>
|
||||
</div>
|
||||
{/* 선택 미리보기 */}
|
||||
{selectedScreen && (
|
||||
<div className="flex-shrink-0 border-t border-border/50 p-3 bg-muted/5">
|
||||
<div className="flex items-center gap-2 mb-2">
|
||||
<Monitor className="h-4 w-4 text-primary" />
|
||||
<span className="text-sm font-medium truncate">{selectedScreen.screenName}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-xs text-muted-foreground">
|
||||
<span className="font-mono">{selectedScreen.screenCode}</span>
|
||||
<span>{selectedScreen.tableName || "테이블 없음"}</span>
|
||||
</div>
|
||||
<div className="flex gap-2 mt-2">
|
||||
<Button size="sm" variant="outline" className="h-7 text-xs flex-1" onClick={() => handleDesignScreen(selectedScreen)}>
|
||||
편집
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* 접힌 상태: 검색 아이콘 + 화면 수 배지 */}
|
||||
{sidebarCollapsed && (
|
||||
<div className="flex-1 flex flex-col items-center gap-2 py-3">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-8 w-8"
|
||||
onClick={() => setSidebarCollapsed(false)}
|
||||
aria-label="사이드바 펼치기"
|
||||
>
|
||||
<Search className="h-4 w-4 text-muted-foreground" />
|
||||
</Button>
|
||||
<div className="mt-auto">
|
||||
<Badge variant="secondary" className="text-[10px]">{screens.length}</Badge>
|
||||
<div className="flex gap-2 mt-2">
|
||||
<Button size="sm" variant="outline" className="h-7 text-xs flex-1" onClick={() => handleDesignScreen(selectedScreen)}>
|
||||
편집
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ export function AnimatedFlowEdge({
|
|||
const strokeColor = (style?.stroke as string) || "hsl(var(--primary))";
|
||||
const strokeW = (style?.strokeWidth as number) || 2;
|
||||
const isActive = data?.active !== false;
|
||||
const duration: string = typeof data?.duration === "string" ? data.duration : "3s";
|
||||
const duration = data?.duration || "3s";
|
||||
const filterId = `edge-glow-${id}`;
|
||||
|
||||
return (
|
||||
|
|
|
|||
Loading…
Reference in New Issue