@exagone313/dsh-podman 0.2.0-rc.3 → 0.2.0

package/dist/client/ContainerCard.d.ts

@@ -2,5 +2,5 @@ import { type ContainerCardFace } from "./container-card-controller.js";
 import { NS } from "./locales.js";
 import { type InjectFace, type PropsLocale, type PropsRuntime } from "@deepseek-ai/dsh-client-ui-slots";
 import { type ReactNode } from "react";
-export type ContainerCardProps = PropsRuntime<"settings.plugin.item"> & PropsLocale<typeof NS> & InjectFace<ContainerCardFace>;
+export type ContainerCardProps = PropsRuntime<"plugins.bundle.config"> & PropsLocale<typeof NS> & InjectFace<ContainerCardFace>;
 export declare function ContainerCard(props: ContainerCardProps): ReactNode;

package/dist/client/ContainerCard.js

@@ -2,34 +2,63 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 // SPDX-FileCopyrightText: 2026 Elouan Martinet <exa@elou.world>
 //
 // SPDX-License-Identifier: MIT
-import { BaseImageRow, ImageBuildModal, ImageItem } from "./container-card-images.js";
+import { BaseImageRow, ImageBuildModal, ImageItem, } from "./container-card-images.js";
 import { CachesSection } from "./container-card-caches.js";
+import { DefaultEnvironmentSection } from "./container-card-default-env.js";
 import { SecretsSection } from "./container-card-secrets.js";
-import { CardChevron, ConfigField, ConfirmButton } from "./container-card-shared.js";
-import { banner, cardBodyStyle, cardDescriptionStyle, cardHeadTextStyle, cardHeaderStyle, cardHoverStyle, cardNameStyle, cardOpenStyle, cardStyle, footerRow, hint, imageSelect, sectionTitle, } from "./container-card-styles.js";
+import { ConfirmButton } from "./container-card-shared.js";
+import { banner, footerRow, hint, imageSelect, sectionTitle, } from "./container-card-styles.js";
 import { VolumesSection } from "./container-card-volumes.js";
 import { WorkspaceSection } from "./container-card-workspace.js";
-import { Button, Input, Modal } from "@deepseek-ai/dsh-client-ui-primitives";
-import { useEffect, useId, useState } from "react";
+import { Button, Modal, writeClipboard, } from "@deepseek-ai/dsh-client-ui-primitives";
+import { useEffect, useRef, useState } from "react";
+// The labels of the version lines, emphasised against their values.
+const versionLabel = { fontWeight: 600 };
 export function ContainerCard(props) {
     const { t } = props;
     const state = props.useContainerCard((snapshot) => snapshot);
-    const [open, setOpen] = useState(false);
-    const [hovered, setHovered] = useState(false);
     const [buildOpen, setBuildOpen] = useState(false);
     const [imageId, setImageId] = useState("");
     const [parent, setParent] = useState("");
     const [packages, setPackages] = useState([]);
     const [defaultOpen, setDefaultOpen] = useState(false);
     const [defaultImage, setDefaultImage] = useState(state.defaultImage);
-    const projectsRootId = useId();
-    // The card mounts with the settings panel, so this re-reads the live state
-    // every time the Plugins section is opened: a workspace created since the
-    // last read shows up without pressing Reload this view.
-    // biome-ignore lint/correctness/useExhaustiveDependencies: mount-only refresh
-    useEffect(() => {
-        props.reload();
+    const [copyState, setCopyState] = useState("idle");
+    const copyResetTimer = useRef();
+    // Copies the version lines as displayed, so a user can paste them into a bug
+    // report without transcribing anything.
+    const copyVersions = async () => {
+        const lines = [
+            `${t("dsh")} ${state.dshVersion || t("versionUnknown")}`,
+            `${t("cardTitle")} ${state.version}${state.commit ? ` · ${state.commit}` : ""}`,
+            `${t("orchestrator")} ${state.orchestratorVersion || t("versionUnknown")}`,
+        ];
+        setCopyState((await writeClipboard(lines.join("\n"))) ? "copied" : "failed");
+        if (copyResetTimer.current !== undefined) {
+            clearTimeout(copyResetTimer.current);
+        }
+        copyResetTimer.current = setTimeout(() => setCopyState("idle"), 1500);
+    };
+    // The reset timer is cancelled on unmount, so it cannot fire against an
+    // unmounted component.
+    useEffect(() => () => {
+        if (copyResetTimer.current !== undefined) {
+            clearTimeout(copyResetTimer.current);
+        }
     }, []);
+    // The Plugins page renders a one-liner in its list and this component again
+    // as the entry's page, so the orchestrator snapshot is only fetched for the
+    // page. Re-reading on every page view keeps a workspace created since the
+    // last visit visible without pressing Reload.
+    // biome-ignore lint/correctness/useExhaustiveDependencies: refresh per page view
+    useEffect(() => {
+        if (props.view === "page")
+            props.reload();
+    }, [props.view]);
+    // The list shows only the one-liner; the page heading already carries the
+    // plugin's title and description.
+    if (props.view === "summary")
+        return t("cardDescription");
     const baseImages = state.images.filter((image) => image.isBase);
     const customImages = state.images.filter((image) => !image.isBase);
     const defaultCandidates = [
@@ -37,43 +66,56 @@ export function ContainerCard(props) {
         ...customImages.map((image) => image.imageId),
     ];
     if (!state.available) {
-        return (_jsx("p", { style: { padding: "8px 0", fontSize: "13px", opacity: 0.8 }, children: t("unavailable") }));
+        return (_jsxs("div", { style: { padding: "8px 0", fontSize: "13px", opacity: 0.8 }, children: [_jsx("p", { style: { margin: 0 }, children: t("unavailable") }), state.notice === ""
+                    ? null
+                    : (_jsxs("p", { style: { margin: "4px 0 0" }, role: "status", children: [t("notice"), ": ", state.notice] })), _jsx("div", { style: { marginTop: "8px" }, children: _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: props.reload, children: state.busy ? t("busy") : t("reload") }) })] }));
     }
-    return (_jsxs("li", { style: {
-            ...cardStyle,
-            ...(open ? cardOpenStyle : {}),
-            ...(hovered && !open ? cardHoverStyle : {}),
-        }, onPointerEnter: () => setHovered(true), onPointerLeave: () => setHovered(false), children: [_jsxs("button", { type: "button", style: cardHeaderStyle, "aria-expanded": open, onClick: () => setOpen(!open), children: [_jsxs("span", { style: cardHeadTextStyle, children: [_jsxs("span", { style: cardNameStyle, children: [t("cardTitle"), state.version ? ` ${state.version}` : "", state.commit ? ` · ${state.commit}` : ""] }), _jsx("span", { style: cardDescriptionStyle, children: t("cardDescription") })] }), _jsx(CardChevron, { open: open })] }), open ? (_jsxs("div", { style: cardBodyStyle, children: [state.notice === "" ? null : (_jsxs("div", { style: banner, role: "status", children: [t("notice"), ": ", state.notice] })), _jsx("div", { style: sectionTitle, children: t("workspacesTitle") }), state.workspaces.length === 0 ? (_jsx("p", { style: hint, children: t("none") })) : (state.workspaces.map((workspace) => (_jsx(WorkspaceSection, { t: t, workspace: workspace, containers: state.containers.filter((container) => container.workspaceSlug === workspace.workspaceSlug), images: state.images, volumes: state.volumes, secrets: state.secrets, busy: state.busy, defaultImage: state.defaultImage, projectsRoot: state.projectsRoot, directoryPicker: state.directoryPicker, onRemove: props.remove, onRemoveWorkspace: props.removeWorkspace, onRecreate: props.recreate, onCreate: props.createContainer, onStartContainer: props.startContainer, onAddContainerMount: props.addContainerMount, onRemoveContainerMount: props.removeContainerMount, onUpdateContainerMount: props.updateContainerMount, onSetContainerPaths: props.setContainerPaths, onAddContainerSecret: props.addContainerSecret, onRemoveContainerSecret: props.removeContainerSecret }, workspace.workspaceSlug)))), _jsxs("div", { style: {
-                            display: "flex",
-                            flexWrap: "wrap",
-                            alignItems: "center",
-                            gap: "8px",
-                        }, children: [_jsx("div", { style: { ...sectionTitle, flex: 1 }, children: t("imagesTitle") }), _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: () => {
-                                    setDefaultImage(state.defaultImage);
-                                    setDefaultOpen(true);
-                                }, children: t("setDefaultImage") }), _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: () => {
-                                    setImageId("");
-                                    setParent(baseImages[0]?.imageId ?? customImages[0]?.imageId ?? "");
-                                    setPackages([]);
-                                    setBuildOpen(true);
-                                }, children: t("buildImage") }), _jsx(ConfirmButton, { t: t, label: t("rebuildAllImages"), title: t("confirmTitle"), description: t("confirmRebuildAllImages"), disabled: state.busy, onConfirm: props.rebuildAllImages })] }), _jsx("div", { style: sectionTitle, children: t("baseImagesTitle") }), baseImages.length === 0 ? (_jsx("p", { style: hint, children: t("none") })) : (baseImages.map((image) => (_jsx(BaseImageRow, { t: t, image: image, busy: state.busy, defaultImage: state.defaultImage, onRebuild: props.rebuildBaseImage, onPull: props.pullBaseImage, onSetDefault: props.setDefaultImage }, image.imageId)))), _jsx("div", { style: sectionTitle, children: t("customImagesTitle") }), customImages.length === 0 ? (_jsx("p", { style: hint, children: t("none") })) : (customImages.map((image) => (_jsx(ImageItem, { t: t, image: image, busy: state.busy, defaultImage: state.defaultImage, onRemove: props.removeImage, onRebuild: props.rebuildImage, onSetDefault: props.setDefaultImage }, image.imageId)))), _jsx(ImageBuildModal, { t: t, images: state.images, open: buildOpen, imageId: imageId, parent: parent, packages: packages, onImageId: setImageId, onParent: setParent, onPackages: setPackages, onClose: () => setBuildOpen(false), onBuild: () => {
-                            props.buildImage(imageId.trim(), parent.trim(), packages);
+    return (_jsxs("div", { children: [state.notice === "" ? null : (_jsxs("div", { style: banner, role: "status", children: [t("notice"), ": ", state.notice] })), state.versionState === "ok" ? null : (_jsx("div", { style: state.versionState === "major-mismatch"
+                    ? { ...banner, borderColor: "var(--dsw-alias-state-error-primary)" }
+                    : banner, role: state.versionState === "major-mismatch" ? "alert" : "status", children: t(state.versionState === "major-mismatch"
+                    ? "versionMismatchMajor"
+                    : "versionMismatchMinor") })), _jsx("div", { style: sectionTitle, children: t("workspacesTitle") }), state.workspaces.length === 0 ? _jsx("p", { style: hint, children: t("none") }) : (state.workspaces.map((workspace) => (_jsx(WorkspaceSection, { t: t, workspace: workspace, containers: state.containers.filter((container) => container.workspaceSlug === workspace.workspaceSlug), images: state.images, volumes: state.volumes, secrets: state.secrets, busy: state.busy, defaultImage: state.defaultImage, projectsRoot: state.projectsRoot, directoryPicker: state.directoryPicker, onRemove: props.remove, onRemoveWorkspace: props.removeWorkspace, onRecreate: props.recreate, onCreate: props.createContainer, onStartContainer: props.startContainer, onAddContainerMount: props.addContainerMount, onRemoveContainerMount: props.removeContainerMount, onUpdateContainerMount: props.updateContainerMount, onSetContainerPaths: props.setContainerPaths, onAddContainerSecret: props.addContainerSecret, onRemoveContainerSecret: props.removeContainerSecret, onSyncDefaults: props.syncDefaultEnv, defaultEnvCount: Object.keys(state.containerEnv).length }, workspace.workspaceSlug)))), _jsxs("div", { style: {
+                    display: "flex",
+                    flexWrap: "wrap",
+                    alignItems: "center",
+                    gap: "8px",
+                }, children: [_jsx("div", { style: { ...sectionTitle, flex: 1 }, children: t("imagesTitle") }), _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: () => {
+                            setDefaultImage(state.defaultImage);
+                            setDefaultOpen(true);
+                        }, children: t("setDefaultImage") }), _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: () => {
                             setImageId("");
-                            setParent("");
+                            setParent(baseImages[0]?.imageId ?? customImages[0]?.imageId ?? "");
                             setPackages([]);
-                            setBuildOpen(false);
-                        } }), _jsx(Modal, { open: defaultOpen, onClose: () => setDefaultOpen(false), title: t("setDefaultImageTitle"), closeLabel: t("cancel"), footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", size: "sm", onClick: () => setDefaultOpen(false), children: t("cancel") }), _jsx(Button, { variant: "primary", size: "sm", disabled: defaultImage === "", onClick: () => {
-                                        props.setDefaultImage(defaultImage);
-                                        setDefaultOpen(false);
-                                    }, children: t("setDefaultImage") })] }), children: _jsxs("select", { style: imageSelect, value: defaultImage, onChange: (event) => setDefaultImage(event.target.value), children: [defaultCandidates.length === 0 ? (_jsx("option", { value: "", children: t("none") })) : null, defaultCandidates.map((name) => (_jsx("option", { value: name, children: name }, name)))] }) }), _jsx(CachesSection, { t: t, caches: state.caches, busy: state.busy, onClean: props.cleanCaches }), _jsx(VolumesSection, { t: t, volumes: state.volumes, busy: state.busy, writable: state.writable, onCreate: props.createVolume, onRemove: props.removeVolume }), _jsx(SecretsSection, { t: t, secrets: state.secrets, busy: state.busy, writable: state.writable, onCreate: props.createSecret, onRemove: props.removeSecret, onSet: props.setSecret }), _jsx("div", { style: sectionTitle, children: t("configTitle") }), _jsxs("div", { style: {
-                            display: "flex",
-                            flexWrap: "wrap",
-                            alignItems: "center",
-                            gap: "8px",
-                            padding: "8px 0",
-                        }, children: [_jsx("label", { htmlFor: projectsRootId, style: {
-                                    fontSize: "13px",
-                                    color: "var(--dsw-alias-label-secondary)",
-                                    minWidth: "110px",
-                                }, children: t("projectsRoot") }), _jsx(Input, { id: projectsRootId, value: state.projectsRoot, disabled: true, style: { width: "200px" } })] }), _jsx(ConfigField, { t: t, label: t("socketsRoot"), value: state.socketsRootDraft, current: state.socketsRoot, writable: state.writable, onChange: props.editSocketsRoot, onSave: props.saveSocketsRoot, onDiscard: props.discardSocketsRoot }), _jsx("div", { style: footerRow, children: _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: props.reload, children: state.busy ? t("busy") : t("reload") }) })] })) : null] }));
+                            setBuildOpen(true);
+                        }, children: t("buildImage") }), _jsx(ConfirmButton, { t: t, label: t("rebuildAllImages"), title: t("confirmTitle"), description: t("confirmRebuildAllImages"), disabled: state.busy, onConfirm: props.rebuildAllImages })] }), _jsx("div", { style: sectionTitle, children: t("baseImagesTitle") }), baseImages.length === 0 ? _jsx("p", { style: hint, children: t("none") }) : (baseImages.map((image) => (_jsx(BaseImageRow, { t: t, image: image, busy: state.busy, defaultImage: state.defaultImage, onRebuild: props.rebuildBaseImage, onPull: props.pullBaseImage, onSetDefault: props.setDefaultImage }, image.imageId)))), _jsx("div", { style: sectionTitle, children: t("customImagesTitle") }), customImages.length === 0 ? _jsx("p", { style: hint, children: t("none") }) : (customImages.map((image) => (_jsx(ImageItem, { t: t, image: image, busy: state.busy, defaultImage: state.defaultImage, onRemove: props.removeImage, onRebuild: props.rebuildImage, onSetDefault: props.setDefaultImage }, image.imageId)))), _jsx(ImageBuildModal, { t: t, images: state.images, open: buildOpen, imageId: imageId, parent: parent, packages: packages, onImageId: setImageId, onParent: setParent, onPackages: setPackages, onClose: () => setBuildOpen(false), onBuild: () => {
+                    props.buildImage(imageId.trim(), parent.trim(), packages);
+                    setImageId("");
+                    setParent("");
+                    setPackages([]);
+                    setBuildOpen(false);
+                } }), _jsxs(Modal, { open: defaultOpen, onClose: () => setDefaultOpen(false), title: t("setDefaultImageTitle"), closeLabel: t("cancel"), footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", size: "sm", onClick: () => setDefaultOpen(false), children: t("cancel") }), _jsx(Button, { variant: "primary", size: "sm", disabled: defaultImage === "", onClick: () => {
+                                props.setDefaultImage(defaultImage);
+                                setDefaultOpen(false);
+                            }, children: t("setDefaultImage") })] }), children: [_jsxs("select", { style: imageSelect, value: defaultImage, onChange: (event) => setDefaultImage(event.target.value), children: [defaultCandidates.length === 0
+                                ? _jsx("option", { value: "", children: t("none") })
+                                : null, defaultCandidates.map((name) => (_jsx("option", { value: name, children: name }, name)))] }), _jsx("p", { style: hint, children: t("defaultImageHint") })] }), _jsx(CachesSection, { t: t, caches: state.caches, busy: state.busy, onClean: props.cleanCaches }), _jsx(VolumesSection, { t: t, volumes: state.volumes, busy: state.busy, writable: state.writable, onCreate: props.createVolume, onRemove: props.removeVolume }), _jsx(SecretsSection, { t: t, secrets: state.secrets, busy: state.busy, writable: state.writable, onCreate: props.createSecret, onRemove: props.removeSecret, onSet: props.setSecret }), _jsx(DefaultEnvironmentSection, { t: t, env: state.containerEnv, busy: state.busy, writable: state.writable, onSave: props.saveContainerEnv, onSync: props.syncDefaultEnv }), _jsxs("div", { style: {
+                    display: "flex",
+                    flexWrap: "wrap",
+                    alignItems: "center",
+                    gap: "8px",
+                }, children: [_jsx("div", { style: { ...sectionTitle, flex: 1 }, children: t("versionsTitle") }), _jsx(Button, { variant: "outline", size: "sm", onClick: () => void copyVersions(), children: copyState === "copied"
+                            ? t("copied")
+                            : copyState === "failed"
+                                ? t("copyFailed")
+                                : t("copyVersions") })] }), _jsxs("div", { style: {
+                    ...hint,
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: "2px",
+                    margin: 0,
+                }, children: [_jsxs("span", { children: [_jsx("span", { style: versionLabel, children: t("dsh") }), state.dshVersion
+                                ? (` ${state.dshVersion}`)
+                                : (_jsxs(_Fragment, { children: [" ", _jsx("span", { style: { color: "var(--dsw-alias-state-error-primary)" }, children: t("versionUnknown") })] }))] }), _jsxs("span", { children: [_jsx("span", { style: versionLabel, children: t("cardTitle") }), state.version ? ` ${state.version}` : "", state.commit ? ` · ${state.commit}` : ""] }), _jsxs("span", { children: [_jsx("span", { style: versionLabel, children: t("orchestrator") }), state.orchestratorVersion
+                                ? (` ${state.orchestratorVersion}`)
+                                : (_jsxs(_Fragment, { children: [" ", _jsx("span", { style: { color: "var(--dsw-alias-state-error-primary)" }, children: t("versionUnknown") })] }))] })] }), _jsx("div", { style: footerRow, children: _jsx(Button, { variant: "outline", size: "sm", disabled: state.busy, onClick: props.reload, children: state.busy ? t("busy") : t("reload") }) })] }));
 }

package/dist/client/card-protocol.d.ts

@@ -7,7 +7,7 @@ export interface MountInput {
     volume: string;
     secret: string;
 }
-export type CommandOp = "remove" | "workspace_remove" | "recreate" | "create" | "volume_create" | "volume_remove" | "image_remove" | "secret_create" | "secret_remove" | "secret_set" | "image_rebuild" | "image_rebuild_all" | "image_build" | "image_base_rebuild" | "image_base_pull" | "container_secret_add" | "container_secret_remove" | "container_mount_add" | "container_mount_remove" | "container_mount_update" | "container_path_set" | "cache_clean";
+export type CommandOp = "remove" | "workspace_remove" | "recreate" | "create" | "volume_create" | "volume_remove" | "image_remove" | "secret_create" | "secret_remove" | "secret_set" | "image_rebuild" | "image_rebuild_all" | "image_build" | "image_base_rebuild" | "image_base_pull" | "container_secret_add" | "container_secret_remove" | "container_mount_add" | "container_mount_remove" | "container_mount_update" | "container_path_set" | "default_env_sync" | "cache_clean";
 export interface CommandRequest {
     op: CommandOp;
     workspace: string;
@@ -19,11 +19,11 @@ export interface CommandRequest {
     env: Record<string, string>;
     container: string;
     secret: string;
-    secretEnv: string;
+    secretEnvName: string;
     length: number;
     charset: string;
     packages: string[];
-    secretEnvMap: Record<string, string>;
+    secretEnv: Record<string, string>;
     cacheMode: string;
     mount: MountInput | null;
 }
@@ -85,6 +85,9 @@ export interface WorkspaceView {
 export interface CardSnapshot {
     version: string;
     commit: string;
+    dshVersion: string;
+    orchestratorVersion: string;
+    versionState: "ok" | "minor-mismatch" | "major-mismatch";
     projectsRoot: string;
     workspaces: readonly WorkspaceView[];
     containers: readonly ContainerView[];

package/dist/client/container-card-caches.js

@@ -22,10 +22,15 @@ function formatBytes(bytes) {
 export function CachesSection(props) {
     const { t, caches, busy, onClean } = props;
     const disabled = busy || caches.length === 0;
-    return (_jsxs(_Fragment, { children: [_jsx("div", { style: sectionTitle, children: t("cachesTitle") }), _jsxs("div", { style: wsBody, children: [caches.length === 0 ? (_jsx("p", { style: { ...hint, margin: 0 }, children: t("noCaches") })) : (caches.map((cache) => (_jsxs("div", { style: {
-                            display: "flex",
-                            flexWrap: "wrap",
-                            alignItems: "center",
-                            gap: "8px",
-                        }, children: [_jsx("strong", { style: { color: "var(--dsw-alias-label-primary)" }, children: cache.manager }), _jsx("span", { style: hint, children: t("cacheUsage", { size: formatBytes(cache.bytes), n: cache.files }) })] }, cache.manager)))), _jsxs("div", { style: { display: "flex", flexWrap: "wrap", gap: "8px" }, children: [_jsx(ConfirmButton, { t: t, label: t("cacheKeepLatest"), title: t("confirmTitle"), description: t("confirmCacheKeepLatest"), disabled: disabled, onConfirm: () => onClean("keep-latest") }), _jsx(ConfirmButton, { t: t, label: t("cacheRemoveAll"), title: t("confirmTitle"), description: t("confirmCacheRemoveAll"), disabled: disabled, onConfirm: () => onClean("all") })] })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { style: sectionTitle, children: t("cachesTitle") }), _jsxs("div", { style: wsBody, children: [caches.length === 0
+                        ? _jsx("p", { style: { ...hint, margin: 0 }, children: t("noCaches") })
+                        : (caches.map((cache) => (_jsxs("div", { style: {
+                                display: "flex",
+                                flexWrap: "wrap",
+                                alignItems: "center",
+                                gap: "8px",
+                            }, children: [_jsx("strong", { style: { color: "var(--dsw-alias-label-primary)" }, children: cache.manager }), _jsx("span", { style: hint, children: t("cacheUsage", {
+                                        size: formatBytes(cache.bytes),
+                                        n: cache.files,
+                                    }) })] }, cache.manager)))), _jsxs("div", { style: { display: "flex", flexWrap: "wrap", gap: "8px" }, children: [_jsx(ConfirmButton, { t: t, label: t("cacheKeepLatest"), title: t("confirmTitle"), description: t("confirmCacheKeepLatest"), disabled: disabled, onConfirm: () => onClean("keep-latest") }), _jsx(ConfirmButton, { t: t, label: t("cacheRemoveAll"), title: t("confirmTitle"), description: t("confirmCacheRemoveAll"), disabled: disabled, onConfirm: () => onClean("all") })] })] })] }));
 }

package/dist/client/container-card-controller.d.ts

@@ -1,13 +1,13 @@
 import { type SnapshotStore } from "@deepseek-ai/dsh-client-store";
-import type { SettingsScope, SettingsScopeSnapshot } from "@deepseek-ai/dsh-client-ui-settings/client";
+import type { ConfigForm, ConfigFormSnapshot } from "@deepseek-ai/dsh-client-ui-settings/client";
 import type { CacheView, ContainerView, ImageView, MountInput, SecretView, VolumeView, WorkspaceView } from "./card-protocol.js";
 import { type CardClient } from "./card-client.js";
 import { type DirectoryPickerFace } from "./directory-picker.js";
 export declare const CONTAINER_NS = "podman";
 export interface ContainerSettings {
     defaultImage: string;
-    socketsRoot: string;
     uiLocale?: string;
+    containerEnv?: Record<string, string>;
 }
 export interface ProjectMountView {
     projectName: string;
@@ -32,10 +32,11 @@ export interface CardState {
     notice: string;
     version: string;
     commit: string;
+    dshVersion: string;
+    orchestratorVersion: string;
+    versionState: "ok" | "minor-mismatch" | "major-mismatch";
     defaultImage: string;
-    defaultImageDraft: string;
-    socketsRoot: string;
-    socketsRootDraft: string;
+    containerEnv: Record<string, string>;
     projectsRoot: string;
     directoryPicker?: DirectoryPickerFace;
     workspaces: readonly WorkspaceView[];
@@ -50,10 +51,10 @@ export interface ContainerCardFace {
         containerCard: SnapshotStore<CardState>;
     };
     reload: () => void;
-    remove: (workspace: string) => void;
+    remove: (workspace: string, container: string) => void;
     cleanCaches: (mode: string) => void;
     removeWorkspace: (workspace: string) => void;
-    recreate: (workspace: string, image: string, env?: Record<string, string>) => void;
+    recreate: (workspace: string, container: string, image: string, env?: Record<string, string>) => void;
     createContainer: (workspace: WorkspaceView, config?: ContainerCreateConfig) => void;
     startContainer: (workspace: WorkspaceView, container: string, config?: ContainerCreateConfig) => void;
     addContainerMount: (workspace: string, container: string, mount: MountInput) => void;
@@ -72,14 +73,10 @@ export interface ContainerCardFace {
     createSecret: (name: string, length?: number, charset?: string) => void;
     removeSecret: (name: string) => void;
     setSecret: (name: string, value: string) => void;
-    addContainerSecret: (workspace: string, envVar: string, secret: string) => void;
-    removeContainerSecret: (workspace: string, envVar: string) => void;
-    editDefaultImage: (text: string) => void;
-    saveDefaultImage: () => void;
-    discardDefaultImage: () => void;
-    editSocketsRoot: (text: string) => void;
-    saveSocketsRoot: () => void;
-    discardSocketsRoot: () => void;
+    addContainerSecret: (workspace: string, container: string, envVar: string, secret: string) => void;
+    removeContainerSecret: (workspace: string, container: string, envVar: string) => void;
+    saveContainerEnv: (env: Record<string, string>) => void;
+    syncDefaultEnv: (workspace: string) => void;
 }
 export declare class ContainerCardController {
     private readonly scope;
@@ -87,10 +84,11 @@ export declare class ContainerCardController {
     private readonly drafts;
     private readonly client;
     private snapshot;
-    private busy;
+    private pending;
+    private generation;
     private notice;
     private directoryPicker;
-    constructor(scope: SettingsScope<ContainerSettings>, client?: CardClient);
+    constructor(scope: ConfigForm<ContainerSettings>, client?: CardClient);
     private draft;
     private project;
     private publish;
@@ -104,4 +102,4 @@ export declare class ContainerCardController {
     inject(): ContainerCardFace;
     private defaultImage;
 }
-export type { SettingsScopeSnapshot };
+export type { ConfigFormSnapshot };

package/dist/client/container-card-controller.js

@@ -1,12 +1,15 @@
 // SPDX-FileCopyrightText: 2026 Elouan Martinet <exa@elou.world>
 //
 // SPDX-License-Identifier: MIT
-import { createSnapshotStore } from "@deepseek-ai/dsh-client-store";
+import { createSnapshotStore, } from "@deepseek-ai/dsh-client-store";
 import { createCardClient } from "./card-client.js";
 export const CONTAINER_NS = "podman";
 const EMPTY_SNAPSHOT = {
     version: "",
     commit: "",
+    dshVersion: "",
+    orchestratorVersion: "",
+    versionState: "ok",
     projectsRoot: "",
     workspaces: [],
     containers: [],
@@ -24,7 +27,10 @@ export class ContainerCardController {
     drafts = new Map();
     client;
     snapshot = EMPTY_SNAPSHOT;
-    busy = false;
+    // Counts in-flight commands, so overlapping ones cannot clear the busy state
+    // early; generation makes a superseded response drop its stale snapshot.
+    pending = 0;
+    generation = 0;
     notice = "";
     directoryPicker;
     constructor(scope, client = createCardClient()) {
@@ -45,14 +51,15 @@ export class ContainerCardController {
         return {
             available: snapshot.status === "ready" && value !== undefined,
             writable: snapshot.writable,
-            busy: this.busy,
+            busy: this.pending > 0,
             notice: this.notice,
             version: this.snapshot.version,
             commit: this.snapshot.commit,
+            dshVersion: this.snapshot.dshVersion,
+            orchestratorVersion: this.snapshot.orchestratorVersion,
+            versionState: this.snapshot.versionState,
             defaultImage: value?.defaultImage ?? "",
-            defaultImageDraft: this.draft("defaultImage", value?.defaultImage ?? ""),
-            socketsRoot: value?.socketsRoot ?? "",
-            socketsRootDraft: this.draft("socketsRoot", value?.socketsRoot ?? ""),
+            containerEnv: value?.containerEnv ?? {},
             projectsRoot: this.snapshot.projectsRoot,
             ...(this.directoryPicker === undefined
                 ? {}
@@ -86,43 +93,62 @@ export class ContainerCardController {
             env: extra.env ?? {},
             container: extra.container ?? "",
             secret: extra.secret ?? "",
-            secretEnv: extra.secretEnv ?? "",
+            secretEnvName: extra.secretEnvName ?? "",
             length: extra.length ?? 0,
             charset: extra.charset ?? "",
             packages: extra.packages ?? [],
-            secretEnvMap: extra.secretEnvMap ?? {},
+            secretEnv: extra.secretEnv ?? {},
             cacheMode: extra.cacheMode ?? "",
             mount: extra.mount ?? null,
         });
     }
     async dispatch(request) {
-        this.busy = true;
+        const generation = ++this.generation;
+        this.pending++;
         this.notice = "";
         this.publish();
         try {
             const result = await this.client.command(request);
+            const snapshot = await this.client.snapshot();
+            // A reload (or another command) started after this one wins: applying
+            // this response would overwrite the fresher state with a stale snapshot.
+            if (generation !== this.generation)
+                return;
             this.notice = result.notice ?? "";
-            this.snapshot = await this.client.snapshot();
+            this.snapshot = snapshot;
         }
         catch (error) {
-            this.notice = error instanceof Error ? error.message : String(error);
+            if (generation === this.generation) {
+                this.notice = error instanceof Error ? error.message : String(error);
+            }
         }
         finally {
-            this.busy = false;
+            this.pending--;
             this.publish();
         }
     }
     async reload() {
+        const generation = ++this.generation;
+        this.pending++;
+        this.publish();
         try {
-            this.snapshot = await this.client.snapshot();
+            const snapshot = await this.client.snapshot();
+            if (generation !== this.generation)
+                return;
+            this.snapshot = snapshot;
             // A refresh clears the previous action's notice, so reopening the
             // settings does not replay feedback from an earlier session.
             this.notice = "";
         }
         catch (error) {
-            this.notice = error instanceof Error ? error.message : String(error);
+            if (generation === this.generation) {
+                this.notice = error instanceof Error ? error.message : String(error);
+            }
+        }
+        finally {
+            this.pending--;
+            this.publish();
         }
-        this.publish();
     }
     edit(field, text) {
         this.drafts.set(field, text);
@@ -144,27 +170,55 @@ export class ContainerCardController {
             reload: () => {
                 void this.reload();
             },
-            remove: (workspace) => this.command("remove", workspace, ""),
+            remove: (workspace, container) => this.command("remove", workspace, "", { container }),
             cleanCaches: (mode) => this.command("cache_clean", "", "", { cacheMode: mode }),
             removeWorkspace: (workspace) => this.command("workspace_remove", workspace, ""),
-            recreate: (workspace, image, env) => this.command("recreate", workspace, image, { ...(env ? { env } : {}) }),
+            recreate: (workspace, container, image, env) => this.command("recreate", workspace, image, {
+                container,
+                ...(env ? { env } : {}),
+            }),
             createContainer: (workspace, config) => this.command("create", workspace.workspaceSlug, config?.image ?? (workspace.imageId || this.defaultImage() || ""), {
                 projectName: workspace.projectName,
-                ...(config?.mounts && config.mounts.length > 0 ? { mounts: config.mounts } : {}),
-                ...(config?.env && Object.keys(config.env).length > 0 ? { env: config.env } : {}),
-                ...(config?.paths && config.paths.length > 0 ? { paths: config.paths } : {}),
-                ...(config?.secretEnv && Object.keys(config.secretEnv).length > 0 ? { secretEnvMap: config.secretEnv } : {}),
+                ...(config?.mounts && config.mounts.length > 0
+                    ? { mounts: config.mounts }
+                    : {}),
+                ...(config?.env && Object.keys(config.env).length > 0
+                    ? { env: config.env }
+                    : {}),
+                ...(config?.paths && config.paths.length > 0
+                    ? { paths: config.paths }
+                    : {}),
+                ...(config?.secretEnv && Object.keys(config.secretEnv).length > 0
+                    ? { secretEnv: config.secretEnv }
+                    : {}),
             }),
             startContainer: (workspace, container, config) => this.command("create", workspace.workspaceSlug, config?.image ?? (workspace.imageId || this.defaultImage() || ""), {
                 container,
-                ...(config?.mounts && config.mounts.length > 0 ? { mounts: config.mounts } : {}),
-                ...(config?.env && Object.keys(config.env).length > 0 ? { env: config.env } : {}),
-                ...(config?.paths && config.paths.length > 0 ? { paths: config.paths } : {}),
-                ...(config?.secretEnv && Object.keys(config.secretEnv).length > 0 ? { secretEnvMap: config.secretEnv } : {}),
+                ...(config?.mounts && config.mounts.length > 0
+                    ? { mounts: config.mounts }
+                    : {}),
+                ...(config?.env && Object.keys(config.env).length > 0
+                    ? { env: config.env }
+                    : {}),
+                ...(config?.paths && config.paths.length > 0
+                    ? { paths: config.paths }
+                    : {}),
+                ...(config?.secretEnv && Object.keys(config.secretEnv).length > 0
+                    ? { secretEnv: config.secretEnv }
+                    : {}),
+            }),
+            addContainerMount: (workspace, container, mount) => this.command("container_mount_add", workspace, "", {
+                container,
+                mount,
+            }),
+            removeContainerMount: (workspace, container, mount) => this.command("container_mount_remove", workspace, "", {
+                container,
+                mount,
+            }),
+            updateContainerMount: (workspace, container, mount) => this.command("container_mount_update", workspace, "", {
+                container,
+                mount,
             }),
-            addContainerMount: (workspace, container, mount) => this.command("container_mount_add", workspace, "", { container, mount }),
-            removeContainerMount: (workspace, container, mount) => this.command("container_mount_remove", workspace, "", { container, mount }),
-            updateContainerMount: (workspace, container, mount) => this.command("container_mount_update", workspace, "", { container, mount }),
             setContainerPaths: (workspace, container, paths) => this.command("container_path_set", workspace, "", { container, paths }),
             createVolume: (name) => this.command("volume_create", name, ""),
             removeVolume: (name) => this.command("volume_remove", name, ""),
@@ -184,21 +238,19 @@ export class ContainerCardController {
             }),
             removeSecret: (name) => this.command("secret_remove", name, ""),
             setSecret: (name, value) => this.command("secret_set", name, "", { value }),
-            addContainerSecret: (workspace, envVar, secret) => this.command("container_secret_add", workspace, "", {
-                container: "default",
-                secretEnv: envVar,
+            addContainerSecret: (workspace, container, envVar, secret) => this.command("container_secret_add", workspace, "", {
+                container,
+                secretEnvName: envVar,
                 secret,
             }),
-            removeContainerSecret: (workspace, envVar) => this.command("container_secret_remove", workspace, "", {
-                container: "default",
-                secretEnv: envVar,
+            removeContainerSecret: (workspace, container, envVar) => this.command("container_secret_remove", workspace, "", {
+                container,
+                secretEnvName: envVar,
             }),
-            editDefaultImage: (text) => this.edit("defaultImage", text),
-            saveDefaultImage: () => this.save("defaultImage"),
-            discardDefaultImage: () => this.discard("defaultImage"),
-            editSocketsRoot: (text) => this.edit("socketsRoot", text),
-            saveSocketsRoot: () => this.save("socketsRoot"),
-            discardSocketsRoot: () => this.discard("socketsRoot"),
+            saveContainerEnv: (env) => {
+                void this.scope.set("containerEnv", env);
+            },
+            syncDefaultEnv: (workspace) => this.command("default_env_sync", workspace, ""),
         };
     }
     defaultImage() {

package/dist/client/container-card-create-modal.d.ts

@@ -1,9 +1,9 @@
 import { type ContainerCreateConfig, type ImageView, type WorkspaceView } from "./container-card-controller.js";
 import { type DirectoryPickerFace } from "./directory-picker.js";
-import { type ContainerPluginKey } from "./locales.js";
+import type { Translate } from "./locales.js";
 import { type ReactNode } from "react";
 export declare function CreateContainerModal(props: {
-    t: (key: ContainerPluginKey) => string;
+    t: Translate;
     workspace: WorkspaceView;
     images: readonly ImageView[];
     volumes: readonly {

package/dist/client/container-card-create-modal.js

@@ -2,7 +2,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { EnvEditor, MountsEditor } from "./container-card-editors.js";
 import { PathsList } from "./container-card-paths.js";
 import { Field, namePattern, sanitizeName } from "./container-card-shared.js";
-import { greyId, hint, imageSelect, sectionTitle } from "./container-card-styles.js";
+import { greyId, hint, imageSelect, sectionTitle, } from "./container-card-styles.js";
 import { Button, Input, Modal } from "@deepseek-ai/dsh-client-ui-primitives";
 import { useEffect, useId, useState } from "react";
 export function CreateContainerModal(props) {
@@ -81,9 +81,15 @@ export function CreateContainerModal(props) {
                 display: "flex",
                 flexDirection: "column",
                 gap: "12px",
-            }, children: [_jsx(Field, { label: t("image"), htmlFor: imageLabel, children: _jsxs("select", { id: imageLabel, style: imageSelect, value: image, disabled: busy, onChange: (event) => setImage(event.target.value), children: [candidates.length === 0 ? (_jsx("option", { value: "", children: t("none") })) : null, candidates.map((imageId) => (_jsx("option", { value: imageId, children: imageId }, imageId)))] }) }), named ? (_jsxs(Field, { label: t("containerName"), htmlFor: nameLabel, children: [_jsx(Input, { id: nameLabel, value: name, disabled: busy, onChange: (event) => setName(sanitizeName(event.target.value)) }), name !== "" && !validName ? (_jsx("p", { style: { ...hint, margin: 0 }, children: nameTaken
-                                ? t("containerNameTaken")
-                                : t("invalidContainerName") })) : null] })) : null, _jsx("div", { style: sectionTitle, children: t("envTitle") }), _jsx(EnvEditor, { t: t, env: env, busy: busy, onChange: setEnv }), _jsx("div", { style: sectionTitle, children: t("mountsTitle") }), _jsx(MountsEditor, { t: t, mounts: mounts, volumes: volumes, secrets: secrets, busy: busy, enabled: !busy, projectsRoot: projectsRoot, directoryPicker: directoryPicker, modeControl: "select", onAdd: (mount) => setMounts([...mounts, mount]), onRemove: (mount) => setMounts(mounts.filter((item) => item !== mount)), onUpdate: (updated, index) => setMounts(mounts.map((item, at) => (at === index ? updated : item))) }), _jsx("div", { style: sectionTitle, children: t("pathsTitle") }), _jsx(PathsList, { t: t, entries: paths, busy: busy, onChange: setPaths }), _jsx("div", { style: sectionTitle, children: t("containerSecretsTitle") }), Object.entries(secretEnv).map(([envVar, secretName]) => (_jsxs("div", { style: {
+            }, children: [_jsx(Field, { label: t("image"), htmlFor: imageLabel, children: _jsxs("select", { id: imageLabel, style: imageSelect, value: image, disabled: busy, onChange: (event) => setImage(event.target.value), children: [candidates.length === 0
+                                ? _jsx("option", { value: "", children: t("none") })
+                                : null, candidates.map((imageId) => (_jsx("option", { value: imageId, children: imageId }, imageId)))] }) }), named
+                    ? (_jsxs(Field, { label: t("containerName"), htmlFor: nameLabel, children: [_jsx(Input, { id: nameLabel, value: name, disabled: busy, onChange: (event) => setName(sanitizeName(event.target.value)) }), name !== "" && !validName
+                                ? (_jsx("p", { style: { ...hint, margin: 0 }, children: nameTaken
+                                        ? t("containerNameTaken")
+                                        : t("invalidContainerName") }))
+                                : null] }))
+                    : null, _jsx("div", { style: sectionTitle, children: t("envTitle") }), _jsx(EnvEditor, { t: t, env: env, busy: busy, onChange: setEnv }), _jsx("div", { style: sectionTitle, children: t("mountsTitle") }), _jsx(MountsEditor, { t: t, mounts: mounts, volumes: volumes, secrets: secrets, busy: busy, enabled: !busy, projectsRoot: projectsRoot, directoryPicker: directoryPicker, modeControl: "select", onAdd: (mount) => setMounts([...mounts, mount]), onRemove: (mount) => setMounts(mounts.filter((item) => item !== mount)), onUpdate: (updated, index) => setMounts(mounts.map((item, at) => (at === index ? updated : item))) }), _jsx("div", { style: sectionTitle, children: t("pathsTitle") }), _jsx(PathsList, { t: t, entries: paths, busy: busy, onChange: setPaths }), _jsx("div", { style: sectionTitle, children: t("containerSecretsTitle") }), Object.entries(secretEnv).map(([envVar, secretName]) => (_jsxs("div", { style: {
                         display: "flex",
                         flexWrap: "wrap",
                         alignItems: "center",
@@ -102,7 +108,9 @@ export function CreateContainerModal(props) {
                         flexWrap: "wrap",
                         alignItems: "center",
                         gap: "8px",
-                    }, children: [_jsxs("select", { style: imageSelect, value: attachSecret, disabled: busy, onChange: (event) => setAttachSecret(event.target.value), "aria-label": t("attachSecret"), children: [secrets.length === 0 ? (_jsx("option", { value: "", children: t("none") })) : null, secrets.map((secret) => (_jsx("option", { value: secret.name, children: secret.name }, secret.name)))] }), _jsx(Input, { value: attachVar, disabled: busy, placeholder: t("secretEnvName"), onChange: (event) => setAttachVar(event.target.value), onKeyDown: (event) => {
+                    }, children: [_jsxs("select", { style: imageSelect, value: attachSecret, disabled: busy, onChange: (event) => setAttachSecret(event.target.value), "aria-label": t("attachSecret"), children: [secrets.length === 0
+                                    ? _jsx("option", { value: "", children: t("none") })
+                                    : null, secrets.map((secret) => (_jsx("option", { value: secret.name, children: secret.name }, secret.name)))] }), _jsx(Input, { value: attachVar, disabled: busy, placeholder: t("secretEnvName"), onChange: (event) => setAttachVar(event.target.value), onKeyDown: (event) => {
                                 if (event.key === "Enter")
                                     attach();
                             }, style: { width: "200px" } }), _jsx(Button, { variant: "outline", size: "sm", disabled: busy || attachVar.trim() === "" || attachSecret === "", onClick: attach, children: t("attachSecret") })] })] }) }));