p-dev-harness 0.3.0 → 0.3.1

package/workspace-snapshot/files/apps/gui/components/custom/target-workflow-pr-card.tsx

@@ -0,0 +1,283 @@
+"use client";
+
+import { useMemo, useState } from "react";
+import type { TargetWorkflowFinalizationResult } from "@harness/setup/target-workflow-finalization-types";
+import type {
+  RemoteTargetWorkflowApplyResult,
+  RemoteTargetWorkflowPreview,
+} from "@harness/setup/remote-actions";
+import type { RemoteSetupRepoSummary } from "@harness/setup/remote-setup-summary";
+import { FORM } from "@/lib/constants";
+import { Button } from "@/components/ui/button";
+import { StatusBadge } from "@/components/custom/status-badge";
+import { RemoteActionPreview } from "@/components/custom/remote-action-preview";
+import { RemoteActionConfirmation } from "@/components/custom/remote-action-confirmation";
+import { SetupApplyResult } from "@/components/custom/setup-apply-result";
+
+interface TargetWorkflowPrCardProps {
+  repo: RemoteSetupRepoSummary;
+  onApplied: () => void;
+  onGuidedApplySuccess?: (
+    result: RemoteTargetWorkflowApplyResult,
+    finalization?: TargetWorkflowFinalizationResult,
+  ) => void;
+  blockedByUpstream?: boolean;
+  variant?: "advanced" | "guided";
+}
+
+function accessVariant(
+  status: RemoteSetupRepoSummary["repoAccess"],
+): "success" | "warning" | "destructive" | "secondary" {
+  if (status === "available") return "success";
+  if (status === "denied") return "destructive";
+  return "secondary";
+}
+
+function workflowVariant(
+  status: RemoteSetupRepoSummary["workflowStatus"],
+): "success" | "warning" | "destructive" | "secondary" {
+  if (status === "present") return "success";
+  if (status === "differs" || status === "missing") return "warning";
+  return "secondary";
+}
+
+function workflowStatusLabel(
+  status: RemoteSetupRepoSummary["workflowStatus"],
+  variant: "advanced" | "guided",
+): string {
+  if (variant === "guided") {
+    switch (status) {
+      case "present":
+        return "workflow ready";
+      case "missing":
+        return "workflow missing";
+      case "differs":
+        return "workflow outdated";
+      default:
+        return "workflow status unknown";
+    }
+  }
+  return status;
+}
+
+export function TargetWorkflowPrCard({
+  repo,
+  onApplied,
+  onGuidedApplySuccess,
+  blockedByUpstream = false,
+  variant = "advanced",
+}: TargetWorkflowPrCardProps) {
+  const [preview, setPreview] = useState<RemoteTargetWorkflowPreview | null>(
+    null,
+  );
+  const [previewKey, setPreviewKey] = useState<string | null>(null);
+  const [confirmed, setConfirmed] = useState(false);
+  const [loading, setLoading] = useState<"preview" | "apply" | null>(null);
+  const [error, setError] = useState<string | null>(null);
+  const [applyResult, setApplyResult] =
+    useState<RemoteTargetWorkflowApplyResult | null>(null);
+
+  const currentKey = `${repo.repoConfigId}:${repo.targetRepo}:${repo.productionBranch}`;
+  const previewIsCurrent = preview !== null && previewKey === currentKey;
+
+  const handlePreview = async () => {
+    setLoading("preview");
+    setError(null);
+    setApplyResult(null);
+    setConfirmed(false);
+    try {
+      const response = await fetch("/api/setup/preview-target-workflow", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          repoConfigId: repo.repoConfigId,
+          targetRepo: repo.targetRepo,
+          productionBranch: repo.productionBranch,
+        }),
+      });
+      const data = await response.json();
+      if (!response.ok) {
+        throw new Error(data.error ?? "Preview failed");
+      }
+      setPreview(data as RemoteTargetWorkflowPreview);
+      setPreviewKey(currentKey);
+    } catch (previewError) {
+      setPreview(null);
+      setPreviewKey(null);
+      setError(
+        previewError instanceof Error
+          ? previewError.message
+          : "Preview failed",
+      );
+    } finally {
+      setLoading(null);
+    }
+  };
+
+  const handleApply = async () => {
+    if (!preview || !previewIsCurrent || !confirmed) {
+      return;
+    }
+
+    setLoading("apply");
+    setError(null);
+    try {
+      const response = await fetch("/api/setup/apply-target-workflow", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          repoConfigId: repo.repoConfigId,
+          targetRepo: repo.targetRepo,
+          productionBranch: repo.productionBranch,
+          confirmed: true,
+          fingerprint: preview.fingerprint,
+        }),
+      });
+      const data = await response.json();
+      if (!response.ok) {
+        throw new Error(data.error ?? "Apply failed");
+      }
+      const apply = data.apply as RemoteTargetWorkflowApplyResult;
+      const finalization = data.finalization as
+        | TargetWorkflowFinalizationResult
+        | undefined;
+      setPreview(null);
+      setPreviewKey(null);
+      setConfirmed(false);
+      if (variant === "guided") {
+        onGuidedApplySuccess?.(apply, finalization);
+      } else {
+        setApplyResult(apply);
+      }
+      onApplied();
+    } catch (applyError) {
+      setError(
+        applyError instanceof Error ? applyError.message : "Apply failed",
+      );
+    } finally {
+      setLoading(null);
+    }
+  };
+
+  const successMessage = useMemo(() => {
+    if (!applyResult) return null;
+    if (applyResult.outcome === "already-installed") {
+      return "Workflow already installed on production branch. No PR opened.";
+    }
+    if (applyResult.prUrl) {
+      return `Workflow install ${applyResult.outcome}: ${applyResult.prUrl}`;
+    }
+    return `Workflow install ${applyResult.outcome} on branch ${applyResult.branchName}.`;
+  }, [applyResult]);
+
+  const upstreamBlockedReason = blockedByUpstream
+    ? "Fix harness repo access before target workflow setup can be previewed."
+    : undefined;
+  const confirmDisabledReason = upstreamBlockedReason
+    ? upstreamBlockedReason
+    : !previewIsCurrent
+      ? "Generate a preview before you can confirm this write."
+      : preview?.validationError
+        ? "Fix validation errors before confirming this write."
+        : undefined;
+  const applyDisabledReason =
+    confirmDisabledReason ??
+    (!confirmed
+      ? variant === "guided"
+        ? "Confirm the preview before creating the workflow install PR."
+        : "Confirm the preview before applying the workflow install PR."
+      : undefined);
+
+  const previewButtonLabel =
+    variant === "guided" ? "Preview workflow install PR" : "Preview workflow PR";
+  const applyButtonLabel =
+    loading === "apply"
+      ? "Creating PR…"
+      : variant === "guided"
+        ? repo.workflowStatus === "present"
+          ? "Update workflow install PR"
+          : "Create workflow install PR"
+        : "Apply workflow PR";
+
+  return (
+    <div
+      className={
+        variant === "guided"
+          ? "space-y-4"
+          : "rounded-md border border-border bg-muted/10 p-4 space-y-4"
+      }
+    >
+      {variant === "advanced" ? (
+        <div className="flex flex-wrap items-center justify-between gap-3">
+          <div>
+            <p className="text-sm font-medium">{repo.repoConfigId}</p>
+            <p className="text-sm text-muted-foreground break-all">
+              {repo.targetRepo}
+            </p>
+            <p className="text-xs text-muted-foreground">
+              Production branch: {repo.productionBranch}
+            </p>
+          </div>
+          <div className="flex flex-wrap gap-2">
+            <StatusBadge
+              label={`Access: ${repo.repoAccess}`}
+              variant={accessVariant(repo.repoAccess)}
+            />
+            <StatusBadge
+              label={`Workflow: ${repo.workflowStatus}`}
+              variant={workflowVariant(repo.workflowStatus)}
+            />
+          </div>
+        </div>
+      ) : null}
+
+      <RemoteActionPreview
+        targetWorkflowPreview={previewIsCurrent ? preview ?? undefined : undefined}
+      />
+
+      <RemoteActionConfirmation
+        scope="remote-repo-write"
+        variant={variant}
+        confirmed={confirmed}
+        disabled={!previewIsCurrent || Boolean(preview?.validationError) || blockedByUpstream}
+        disabledReason={confirmDisabledReason}
+        onConfirmedChange={setConfirmed}
+      />
+
+      <div className={FORM.actions}>
+        <Button
+          type="button"
+          onClick={handlePreview}
+          disabled={loading !== null || blockedByUpstream}
+        >
+          {loading === "preview" ? "Generating preview…" : previewButtonLabel}
+        </Button>
+        <Button
+          type="button"
+          onClick={handleApply}
+          disabled={
+            loading !== null ||
+            !previewIsCurrent ||
+            !confirmed ||
+            Boolean(preview?.validationError) ||
+            blockedByUpstream
+          }
+        >
+          {applyButtonLabel}
+        </Button>
+      </div>
+
+      {upstreamBlockedReason ? (
+        <p className="text-sm text-muted-foreground">{upstreamBlockedReason}</p>
+      ) : null}
+      {applyDisabledReason && !upstreamBlockedReason ? (
+        <p className="text-sm text-muted-foreground">{applyDisabledReason}</p>
+      ) : null}
+
+      {error ? <SetupApplyResult success={false} message={error} /> : null}
+      {variant === "advanced" && successMessage ? (
+        <SetupApplyResult success message={successMessage} />
+      ) : null}
+    </div>
+  );
+}

package/workspace-snapshot/files/apps/gui/components/custom/theme-provider.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+
+export function ThemeProvider({ children }: { children: React.ReactNode }) {
+  return (
+    <NextThemesProvider attribute="class" defaultTheme="system" enableSystem>
+      {children}
+    </NextThemesProvider>
+  );
+}

package/workspace-snapshot/files/apps/gui/components/custom/theme-toggle.tsx

@@ -0,0 +1,44 @@
+"use client";
+
+import { Moon, Sun } from "lucide-react";
+import { useTheme } from "next-themes";
+import { useEffect, useState } from "react";
+
+import { Button } from "@/components/ui/button";
+
+export function ThemeToggle() {
+  const { resolvedTheme, setTheme } = useTheme();
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  if (!mounted) {
+    return (
+      <Button type="button" variant="ghost" size="sm" className="h-8 w-8 px-0" disabled>
+        <span className="sr-only">Toggle theme</span>
+      </Button>
+    );
+  }
+
+  const isDark = resolvedTheme === "dark";
+
+  return (
+    <Button
+      type="button"
+      variant="ghost"
+      size="sm"
+      className="inline-flex h-8 items-center gap-2 px-2"
+      onClick={() => setTheme(isDark ? "light" : "dark")}
+    >
+      {isDark ? (
+        <Sun className="h-4 w-4" aria-hidden />
+      ) : (
+        <Moon className="h-4 w-4" aria-hidden />
+      )}
+      <span className="text-sm">{isDark ? "Light" : "Dark"}</span>
+      <span className="sr-only">Toggle theme</span>
+    </Button>
+  );
+}

package/workspace-snapshot/files/apps/gui/components/custom/workflow-install-pending-panel.tsx

@@ -0,0 +1,116 @@
+"use client";
+
+import type { TargetWorkflowFinalizationResult } from "@harness/setup/target-workflow-finalization-types";
+import { Button } from "@/components/ui/button";
+import { StatusBadge } from "@/components/custom/status-badge";
+
+interface WorkflowInstallProgressPanelProps {
+  finalization: TargetWorkflowFinalizationResult;
+  onRetry?: () => void;
+  retrying?: boolean;
+}
+
+function lifecycleLabel(lifecycle: TargetWorkflowFinalizationResult["lifecycle"]): string {
+  switch (lifecycle) {
+    case "preparing":
+      return "Creating workflow install";
+    case "pr-created":
+    case "pr-updated":
+      return "Workflow install PR ready";
+    case "waiting-for-checks":
+      return "Waiting for checks";
+    case "updating-branch":
+      return "Updating install branch";
+    case "merging":
+      return "Merging automatically";
+    case "verifying":
+      return "Verifying workflow";
+    case "complete":
+      return "Workflow installed";
+    case "blocked":
+      return "Workflow install blocked";
+    default:
+      return "Finalizing workflow install";
+  }
+}
+
+function lifecycleVariant(
+  lifecycle: TargetWorkflowFinalizationResult["lifecycle"],
+): "success" | "warning" | "destructive" | "secondary" {
+  if (lifecycle === "complete") {
+    return "success";
+  }
+  if (lifecycle === "blocked") {
+    return "destructive";
+  }
+  if (lifecycle === "waiting-for-checks" || lifecycle === "verifying") {
+    return "warning";
+  }
+  return "secondary";
+}
+
+export function WorkflowInstallProgressPanel({
+  finalization,
+  onRetry,
+  retrying = false,
+}: WorkflowInstallProgressPanelProps) {
+  const blocked = finalization.lifecycle === "blocked";
+  const complete = finalization.lifecycle === "complete";
+
+  return (
+    <div className="rounded-md border border-border bg-muted/20 p-4 space-y-3">
+      <div className="flex flex-wrap items-center gap-2">
+        <StatusBadge
+          label={lifecycleLabel(finalization.lifecycle)}
+          variant={lifecycleVariant(finalization.lifecycle)}
+        />
+      </div>
+      <p className="text-sm text-muted-foreground">{finalization.message}</p>
+
+      {blocked ? (
+        <div className="flex flex-wrap gap-2">
+          {finalization.canRetry && onRetry ? (
+            <Button type="button" onClick={onRetry} disabled={retrying}>
+              {retrying ? "Retrying…" : "Retry finalization"}
+            </Button>
+          ) : null}
+          {finalization.requiresGitHubIntervention && finalization.prUrl ? (
+            <Button asChild variant="outline">
+              <a
+                href={finalization.prUrl}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                Open GitHub details
+              </a>
+            </Button>
+          ) : null}
+        </div>
+      ) : null}
+
+      {!blocked && !complete && finalization.prUrl ? (
+        <details className="text-xs text-muted-foreground">
+          <summary className="cursor-pointer">Advanced details</summary>
+          <p className="mt-2 break-all">Install PR: {finalization.prUrl}</p>
+        </details>
+      ) : null}
+    </div>
+  );
+}
+
+interface WorkflowInstallReadyPanelProps {
+  repoConfigId: string;
+}
+
+export function WorkflowInstallReadyPanel({
+  repoConfigId,
+}: WorkflowInstallReadyPanelProps) {
+  return (
+    <div className="rounded-md border border-border bg-muted/20 p-4 space-y-2">
+      <StatusBadge label="Workflow ready" variant="success" />
+      <p className="text-sm text-muted-foreground">
+        {repoConfigId} has the expected harness workflow on its production branch.
+      </p>
+    </div>
+  );
+}

package/workspace-snapshot/files/apps/gui/components/ui/badge.tsx

@@ -0,0 +1,40 @@
+import * as React from "react";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "@/lib/utils";
+
+const badgeVariants = cva(
+  "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default:
+          "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+        secondary:
+          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline: "text-foreground",
+        success:
+          "border-transparent bg-emerald-100 text-emerald-800 dark:bg-emerald-950 dark:text-emerald-200",
+        warning:
+          "border-transparent bg-amber-100 text-amber-800 dark:bg-amber-950 dark:text-amber-200",
+        destructive:
+          "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  },
+);
+
+export interface BadgeProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof badgeVariants> {}
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+  return (
+    <div className={cn(badgeVariants({ variant }), className)} {...props} />
+  );
+}
+
+export { Badge, badgeVariants };

package/workspace-snapshot/files/apps/gui/components/ui/button.tsx

@@ -0,0 +1,52 @@
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "@/lib/utils";
+
+const buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        secondary:
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline:
+          "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+);
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
+    VariantProps<typeof buttonVariants> {
+  asChild?: boolean;
+}
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return (
+      <Comp
+        className={cn(buttonVariants({ variant, size, className }))}
+        ref={ref}
+        {...props}
+      />
+    );
+  },
+);
+Button.displayName = "Button";
+
+export { Button, buttonVariants };

package/workspace-snapshot/files/apps/gui/components/ui/card.tsx

@@ -0,0 +1,64 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Card = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn(
+      "rounded-xl border border-border bg-card text-card-foreground shadow-sm",
+      className,
+    )}
+    {...props}
+  />
+));
+Card.displayName = "Card";
+
+const CardHeader = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex flex-col space-y-1.5 p-6", className)}
+    {...props}
+  />
+));
+CardHeader.displayName = "CardHeader";
+
+const CardTitle = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("font-semibold leading-none tracking-tight", className)}
+    {...props}
+  />
+));
+CardTitle.displayName = "CardTitle";
+
+const CardDescription = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("text-sm text-muted-foreground", className)}
+    {...props}
+  />
+));
+CardDescription.displayName = "CardDescription";
+
+const CardContent = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
+));
+CardContent.displayName = "CardContent";
+
+export { Card, CardHeader, CardTitle, CardDescription, CardContent };

package/workspace-snapshot/files/apps/gui/components/ui/checkbox.tsx

@@ -0,0 +1,21 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Checkbox = React.forwardRef<
+  HTMLInputElement,
+  React.ComponentProps<"input">
+>(({ className, type = "checkbox", ...props }, ref) => (
+  <input
+    type={type}
+    className={cn(
+      "h-4 w-4 shrink-0 cursor-pointer rounded border border-input accent-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+      className,
+    )}
+    ref={ref}
+    {...props}
+  />
+));
+Checkbox.displayName = "Checkbox";
+
+export { Checkbox };

package/workspace-snapshot/files/apps/gui/components/ui/input.tsx

@@ -0,0 +1,22 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
+  ({ className, type, ...props }, ref) => {
+    return (
+      <input
+        type={type}
+        className={cn(
+          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          className,
+        )}
+        ref={ref}
+        {...props}
+      />
+    );
+  },
+);
+Input.displayName = "Input";
+
+export { Input };

package/workspace-snapshot/files/apps/gui/components/ui/label.tsx

@@ -0,0 +1,20 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Label = React.forwardRef<
+  HTMLLabelElement,
+  React.ComponentProps<"label">
+>(({ className, ...props }, ref) => (
+  <label
+    ref={ref}
+    className={cn(
+      "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+      className,
+    )}
+    {...props}
+  />
+));
+Label.displayName = "Label";
+
+export { Label };