diff --git a/frontend/src/components/util.tsx b/frontend/src/components/util.tsx index 5cd258bfa..b5f488b61 100644 --- a/frontend/src/components/util.tsx +++ b/frontend/src/components/util.tsx @@ -1408,6 +1408,10 @@ export const ServerContainerSelector = ({ const containers = useRead("ListDockerContainers", { server: server_id, }).data?.filter((container) => !state || container.state === state); + const first_container = containers?.[0].name; + useEffect(() => { + first_container && onSelect?.(first_container); + }, [first_container]); const name = containers?.find((r) => r.name === selected)?.name; if (!containers) return null; @@ -1509,7 +1513,11 @@ export const StackServiceSelector = ({ const services = useRead("ListStackServices", { stack: stack_id, }).data?.filter((service) => !state || service?.container?.state === state); - const name = services?.find((s) => s.service === selected)?.service; + const first_service = services?.[0].service; + useEffect(() => { + first_service && onSelect?.(first_service); + }, [first_service]); + const selected_name = services?.find((s) => s.service === selected)?.service; if (!services) return null; @@ -1536,7 +1544,7 @@ export const StackServiceSelector = ({ )} disabled={disabled} > - {name || (placeholder ?? "Select Service")} + {selected_name || (placeholder ?? "Select Service")} {!disabled && } diff --git a/frontend/src/pages/terminals.tsx b/frontend/src/pages/terminals.tsx index bf720d020..4de257c3e 100644 --- a/frontend/src/pages/terminals.tsx +++ b/frontend/src/pages/terminals.tsx @@ -248,17 +248,9 @@ const CreateTerminal = () => { Selector={Selector} /> ) : type === "Stack" ? ( - + ) : type === "Deployment" ? ( - + ) : ( <> )} @@ -409,7 +401,7 @@ const default_create_container_terminal = ( type: "Container", params: { server: first_server, container: "" }, }, - name: "term-1", + name: "exec-1", mode: Types.ContainerTerminalMode.Exec, command: undefined, }; @@ -433,6 +425,18 @@ const CreateContainerTerminal = ({ if (open) return; setRequest(default_create_container_terminal(first_server)); }, [first_server]); + useEffect(() => { + setRequest((req) => ({ + ...req, + name: + // Preserves existing name if non-default + req.name !== "attach" && !req.name.startsWith("exec-") + ? req.name + : request.mode === Types.ContainerTerminalMode.Attach + ? "attach" + : "exec-1", + })); + }, [request.mode]); const { server, container } = request.target.params as { server: string; container: string; @@ -548,30 +552,44 @@ const default_create_stack_service_terminal = ( type: "Stack", params: { stack: first_stack, service: "" }, }, - name: "term-1", + name: "exec-1", mode: Types.ContainerTerminalMode.Exec, command: undefined, }; }; const CreateStackServiceTerminal = ({ - open, setOpen, Selector, }: { - open: boolean; setOpen: (open: boolean) => void; Selector: ReactNode; }) => { const nav = useNavigate(); - const first_stack = (useRead("ListStacks", {}).data ?? [])[0]?.id ?? ""; + const first_stack = + (useRead("ListStacks", {}).data ?? []).filter((s) => + [Types.StackState.Running, Types.StackState.Unhealthy].includes( + s.info.state + ) + )[0]?.id ?? ""; const [request, setRequest] = useState( default_create_stack_service_terminal(first_stack) ); useEffect(() => { - if (open) return; setRequest(default_create_stack_service_terminal(first_stack)); }, [first_stack]); + useEffect(() => { + setRequest((req) => ({ + ...req, + name: + // Preserves existing name if non-default + req.name !== "attach" && !req.name.startsWith("exec-") + ? req.name + : request.mode === Types.ContainerTerminalMode.Attach + ? "attach" + : "exec-1", + })); + }, [request.mode]); const { stack, service } = request.target.params as { stack: string; service: string; @@ -687,31 +705,42 @@ const default_create_deployment_terminal = ( type: "Deployment", params: { deployment: first_deployment }, }, - name: "term-1", + name: "exec-1", mode: Types.ContainerTerminalMode.Exec, command: undefined, }; }; const CreateDeploymentTerminal = ({ - open, setOpen, Selector, }: { - open: boolean; setOpen: (open: boolean) => void; Selector: ReactNode; }) => { const nav = useNavigate(); const first_deployment = - (useRead("ListDeployments", {}).data ?? [])[0]?.id ?? ""; + (useRead("ListDeployments", {}).data ?? []).filter( + (d) => d.info.state === Types.DeploymentState.Running + )[0]?.id ?? ""; const [request, setRequest] = useState( default_create_deployment_terminal(first_deployment) ); useEffect(() => { - if (open) return; setRequest(default_create_deployment_terminal(first_deployment)); }, [first_deployment]); + useEffect(() => { + setRequest((req) => ({ + ...req, + name: + // Preserves existing name if non-default + req.name !== "attach" && !req.name.startsWith("exec-") + ? req.name + : request.mode === Types.ContainerTerminalMode.Attach + ? "attach" + : "exec-1", + })); + }, [request.mode]); const { deployment } = request.target.params as { deployment: string; };