nntrivi2001
acff059e92
Plugins/marketplaces GET routes were silently empty because codex-cli.js
never unwrapped the CLI's {installed,available}/{marketplaces} objects
into arrays; backup writes bypassed the symlink-escape guard entirely;
readFileSafe was stricter than every other Codex reader, showing a
symlinked skill/rule in the list and then refusing to open it;
marketplaceAdd only accepted http(s) URLs, rejecting owner/repo sources
the CLI itself takes. Also: docs drift, a dead i18n key, and a scope-cast
hazard in the shared Editor/ConfirmDelete modals.
Fixes, one per finding: unwrap installed/marketplaces in codex-cli.js so
every list route keeps returning a bare list; guard the backup path in
codex-mutate.js with the same assertNotSymlinkEscape the write path
already used (Claude's cc-mutate.js has no such guard on its primary
write path either, so left untouched there); relax readFileSafe's
containment to lexical-only, matching the other four Codex readers,
while leaving the write side's realpath check untouched; reuse
cc-plugin-cli's assertSource for marketplaceAdd instead of a third
validator (ssh remains out of scope, no credential story for it yet).
Server: 1557/1557 (was 1548). Client: tsc -b clean, 469/469 tests.
103 lines
3.7 KiB
TypeScript
103 lines
3.7 KiB
TypeScript
/**
|
|
* @file ConfirmDeleteModal.tsx
|
|
* @description Confirmation modal for deleting a config artifact. Tool-
|
|
* agnostic — the caller supplies the async delete action; the modal only
|
|
* tracks the busy state and Escape-to-cancel behavior.
|
|
* @author Nguyễn Ngọc Trí Vĩ <vinnt@smartgift.vn>
|
|
*/
|
|
|
|
import { useCallback, useEffect, useState } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { ShieldAlert, Trash2 } from "lucide-react";
|
|
import type { CcArtifactType } from "../../lib/api";
|
|
|
|
/** See EditorModal.tsx's `DefaultScope` — same reasoning: Codex instantiates
|
|
* `TScope` as `"user" | "project"` instead of casting into Claude's wider
|
|
* default. */
|
|
export type ConfirmDeleteState<
|
|
TType extends string = CcArtifactType,
|
|
TScope extends string = "user" | "project" | "auto-memory",
|
|
> = {
|
|
type: TType;
|
|
scope: TScope;
|
|
name?: string;
|
|
path: string;
|
|
project?: string; // set for type === "auto-memory"
|
|
} | null;
|
|
|
|
interface ConfirmDeleteModalProps<
|
|
TType extends string = CcArtifactType,
|
|
TScope extends string = "user" | "project" | "auto-memory",
|
|
> {
|
|
state: NonNullable<ConfirmDeleteState<TType, TScope>>;
|
|
onCancel: () => void;
|
|
onConfirm: () => Promise<void>;
|
|
}
|
|
|
|
export function ConfirmDeleteModal<
|
|
TType extends string = CcArtifactType,
|
|
TScope extends string = "user" | "project" | "auto-memory",
|
|
>({ state, onCancel, onConfirm }: ConfirmDeleteModalProps<TType, TScope>) {
|
|
const { t } = useTranslation("ccConfig");
|
|
const [busy, setBusy] = useState(false);
|
|
|
|
useEffect(() => {
|
|
const onKey = (e: KeyboardEvent) => {
|
|
if (e.key === "Escape") onCancel();
|
|
};
|
|
window.addEventListener("keydown", onKey);
|
|
return () => window.removeEventListener("keydown", onKey);
|
|
}, [onCancel]);
|
|
|
|
const handleConfirm = useCallback(async () => {
|
|
setBusy(true);
|
|
try {
|
|
await onConfirm();
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
}, [onConfirm]);
|
|
|
|
return (
|
|
<div
|
|
className="fixed inset-0 bg-black/60 z-40 flex items-center justify-center p-4"
|
|
onClick={onCancel}
|
|
>
|
|
<div
|
|
className="relative w-full max-w-lg rounded-xl border border-status-danger/40 bg-surface-1"
|
|
onClick={(e) => e.stopPropagation()}
|
|
>
|
|
<div className="border-b border-border px-4 py-2.5 flex items-center gap-2">
|
|
<ShieldAlert className="w-4 h-4 text-status-danger" />
|
|
<span className="text-sm font-medium text-fg-primary flex-1">
|
|
{t("edit.confirmDelete")}
|
|
</span>
|
|
</div>
|
|
<div className="p-4 space-y-3">
|
|
<p className="text-xs text-fg-secondary leading-relaxed">{t("edit.confirmDeleteBody")}</p>
|
|
<div className="rounded-md border border-border bg-surface-2 px-3 py-2 font-mono text-[11px] text-fg-secondary break-all">
|
|
{t("edit.confirmDeletePath", { path: state.path })}
|
|
</div>
|
|
</div>
|
|
<div className="border-t border-border px-4 py-3 flex items-center justify-end gap-2">
|
|
<button
|
|
onClick={onCancel}
|
|
disabled={busy}
|
|
className="text-[12px] font-medium px-3 py-1.5 rounded-md border border-border bg-surface-2 hover:bg-surface-3 text-fg-secondary disabled:opacity-60"
|
|
>
|
|
{t("edit.cancel")}
|
|
</button>
|
|
<button
|
|
onClick={handleConfirm}
|
|
disabled={busy}
|
|
className="text-[12px] font-medium px-3 py-1.5 rounded-md border border-status-danger/50 bg-status-danger/15 hover:bg-status-danger/25 text-status-danger inline-flex items-center gap-1.5 disabled:opacity-60"
|
|
>
|
|
<Trash2 className="w-3.5 h-3.5" />
|
|
{busy ? t("edit.deleting") : t("edit.confirmDeleteAction")}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|