Skip to content

Commit 63f7edb

Browse files
arul28arul28
committed
Refactor lane dialogs and extract lane work session state
1 parent 59647ff commit 63f7edb

7 files changed

Lines changed: 871 additions & 312 deletions

File tree

‎apps/desktop/src/renderer/components/lanes/AttachLaneDialog.tsx‎

Lines changed: 78 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
1-
import * as Dialog from "@radix-ui/react-dialog";
21
import { Link, WarningCircle } from "@phosphor-icons/react";
32
import { Button } from "../ui/Button";
3+
import { LaneDialogShell } from "./LaneDialogShell";
4+
5+
const SECTION_CLASS_NAME = "rounded-xl border border-white/[0.06] bg-white/[0.03] p-4 shadow-card";
6+
const LABEL_CLASS_NAME = "text-[11px] font-semibold uppercase tracking-[0.14em] text-muted-fg/70";
7+
const INPUT_CLASS_NAME =
8+
"mt-2 h-11 w-full rounded-lg border border-white/[0.06] bg-white/[0.03] px-3 text-sm text-fg outline-none transition-colors placeholder:text-muted-fg/45 focus:border-accent/40";
49

510
export function AttachLaneDialog({
611
open,
@@ -24,70 +29,80 @@ export function AttachLaneDialog({
2429
onSubmit: () => void;
2530
}) {
2631
return (
27-
<Dialog.Root open={open} onOpenChange={onOpenChange}>
28-
<Dialog.Portal>
29-
<Dialog.Overlay className="fixed inset-0 z-50 bg-black/5 backdrop-blur-md" />
30-
<Dialog.Content className="fixed left-1/2 top-[14%] z-50 w-[min(700px,calc(100vw-24px))] -translate-x-1/2 rounded border border-border/40 bg-card p-4 shadow-float focus:outline-none">
31-
<div className="mb-3 flex items-center justify-between gap-3">
32-
<Dialog.Title className="flex items-center gap-2 text-base font-semibold">
33-
<Link size={16} />
34-
Attach Existing Worktree
35-
</Dialog.Title>
36-
<Dialog.Close asChild><Button variant="ghost" size="sm" disabled={busy}>Esc</Button></Dialog.Close>
37-
</div>
38-
<p className="text-xs text-muted-fg">
39-
Link an existing git worktree into ADE without moving files. The path must be the root of a worktree from this repository.
40-
</p>
41-
<div className="mt-4 space-y-3">
42-
<div>
43-
<label className="mb-1 block text-xs font-semibold text-muted-fg">Lane Name</label>
44-
<input
45-
value={attachName}
46-
onChange={(e) => setAttachName(e.target.value)}
47-
placeholder="e.g. bugfix/from-other-worktree"
48-
className="h-10 w-full rounded border border-border/20 bg-surface-recessed shadow-card px-3 text-sm outline-none placeholder:text-muted-fg"
49-
autoFocus
50-
disabled={busy}
51-
/>
52-
</div>
53-
<div>
54-
<label className="mb-1 block text-xs font-semibold text-muted-fg">Worktree Path</label>
55-
<input
56-
value={attachPath}
57-
onChange={(e) => setAttachPath(e.target.value)}
58-
placeholder="/absolute/path/to/existing/worktree"
59-
className="h-10 w-full rounded border border-border/20 bg-surface-recessed px-3 font-mono text-xs outline-none placeholder:text-muted-fg"
60-
disabled={busy}
61-
/>
62-
<p className="mt-1 text-[11px] text-muted-fg">
63-
Example: <span className="font-mono">/Users/you/repo-worktrees/feature-auth</span>
64-
</p>
65-
</div>
32+
<LaneDialogShell
33+
open={open}
34+
onOpenChange={onOpenChange}
35+
title="Add existing worktree as lane"
36+
description="Link an existing git worktree into ADE without moving files. The path must point at a worktree root from this repository."
37+
icon={Link}
38+
widthClassName="w-[min(760px,calc(100vw-24px))]"
39+
busy={busy}
40+
>
41+
<div className="space-y-4">
42+
<section className={SECTION_CLASS_NAME}>
43+
<div className="text-sm text-muted-fg">
44+
ADE will keep the existing files where they are and start tracking the worktree as a lane in this project.
6645
</div>
67-
{error ? (
68-
<div className="mt-3 flex items-start gap-2 rounded border border-red-500/30 bg-red-500/10 px-3 py-2 text-xs text-red-300">
69-
<WarningCircle size={14} className="mt-0.5 shrink-0" />
70-
<span>{error}</span>
71-
</div>
72-
) : null}
73-
<div className="mt-4 flex items-center justify-end gap-2">
74-
<Button
75-
variant="outline"
76-
onClick={() => { onOpenChange(false); setAttachName(""); setAttachPath(""); }}
46+
</section>
47+
48+
<section className={SECTION_CLASS_NAME}>
49+
<label className="block">
50+
<span className={LABEL_CLASS_NAME}>Lane name</span>
51+
<input
52+
value={attachName}
53+
onChange={(event) => setAttachName(event.target.value)}
54+
placeholder="e.g. bugfix/from-other-worktree"
55+
className={INPUT_CLASS_NAME}
56+
autoFocus
57+
disabled={busy}
58+
/>
59+
</label>
60+
</section>
61+
62+
<section className={SECTION_CLASS_NAME}>
63+
<label className="block">
64+
<span className={LABEL_CLASS_NAME}>Worktree path</span>
65+
<input
66+
value={attachPath}
67+
onChange={(event) => setAttachPath(event.target.value)}
68+
placeholder="/absolute/path/to/existing/worktree"
69+
className={`${INPUT_CLASS_NAME} font-mono text-xs`}
7770
disabled={busy}
78-
>
79-
Cancel
80-
</Button>
81-
<Button
82-
variant="primary"
83-
disabled={!attachPath.trim().length || !attachName.trim().length || busy}
84-
onClick={onSubmit}
85-
>
86-
{busy ? "Attaching..." : "Attach Lane"}
87-
</Button>
71+
/>
72+
</label>
73+
<div className="mt-2 text-xs text-muted-fg/80">
74+
Example: <span className="font-mono text-fg/80">/Users/you/repo-worktrees/feature-auth</span>
75+
</div>
76+
</section>
77+
78+
{error ? (
79+
<div className="flex items-start gap-2 rounded-xl border border-red-500/25 bg-red-500/10 px-3 py-2 text-sm text-red-200">
80+
<WarningCircle size={16} className="mt-0.5 shrink-0" />
81+
<span>{error}</span>
8882
</div>
89-
</Dialog.Content>
90-
</Dialog.Portal>
91-
</Dialog.Root>
83+
) : null}
84+
85+
<div className="flex items-center justify-end gap-2">
86+
<Button
87+
variant="outline"
88+
onClick={() => {
89+
onOpenChange(false);
90+
setAttachName("");
91+
setAttachPath("");
92+
}}
93+
disabled={busy}
94+
>
95+
Cancel
96+
</Button>
97+
<Button
98+
variant="primary"
99+
disabled={!attachPath.trim().length || !attachName.trim().length || busy}
100+
onClick={onSubmit}
101+
>
102+
{busy ? "Attaching..." : "Attach lane"}
103+
</Button>
104+
</div>
105+
</div>
106+
</LaneDialogShell>
92107
);
93108
}

0 commit comments

Comments
 (0)