fix: save dockerfile, root dir, port, command, and healthcheck settings to all environments (#5293)

Settings without per-environment UI were only saving to the currently
active environment (defaults to production). This meant preview and
other environments would silently get out of sync.

Author: Flo4604

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/build-settings/dockerfile-settings.tsx

@@ -1,10 +1,10 @@
-import { collection } from "@/lib/collections";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { FileSettings } from "@unkey/icons";
 import { FormInput } from "@unkey/ui";
 import { useForm, useWatch } from "react-hook-form";
 import { z } from "zod";
 import { useEnvironmentSettings } from "../../environment-provider";
+import { useUpdateAllEnvironments } from "../../hooks/use-update-all-environments";
 import { FormSettingCard, resolveSaveState } from "../shared/form-setting-card";
 
 const dockerfileSchema = z.object({
@@ -13,7 +13,8 @@ const dockerfileSchema = z.object({
 
 export const Dockerfile = () => {
   const { settings, variant } = useEnvironmentSettings();
-  const { environmentId, dockerfile: defaultValue } = settings;
+  const { dockerfile: defaultValue } = settings;
+  const updateAllEnvironments = useUpdateAllEnvironments();
 
   const {
     register,
@@ -35,7 +36,7 @@ export const Dockerfile = () => {
   ]);
 
   const onSubmit = async (values: z.infer<typeof dockerfileSchema>) => {
-    collection.environmentSettings.update(environmentId, (draft) => {
+    updateAllEnvironments((draft) => {
       draft.dockerfile = values.dockerfile;
     });
   };

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/build-settings/root-directory-settings.tsx

@@ -1,10 +1,10 @@
-import { collection } from "@/lib/collections";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { FolderLink } from "@unkey/icons";
 import { FormInput } from "@unkey/ui";
 import { useForm, useWatch } from "react-hook-form";
 import { z } from "zod";
 import { useEnvironmentSettings } from "../../environment-provider";
+import { useUpdateAllEnvironments } from "../../hooks/use-update-all-environments";
 import { FormSettingCard, resolveSaveState } from "../shared/form-setting-card";
 
 const rootDirectorySchema = z.object({
@@ -13,7 +13,8 @@ const rootDirectorySchema = z.object({
 
 export const RootDirectory = () => {
   const { settings, variant } = useEnvironmentSettings();
-  const { environmentId, dockerContext: defaultValue } = settings;
+  const { dockerContext: defaultValue } = settings;
+  const updateAllEnvironments = useUpdateAllEnvironments();
 
   const {
     register,
@@ -35,7 +36,7 @@ export const RootDirectory = () => {
   ]);
 
   const onSubmit = async (values: z.infer<typeof rootDirectorySchema>) => {
-    collection.environmentSettings.update(environmentId, (draft) => {
+    updateAllEnvironments((draft) => {
       draft.dockerContext = values.dockerContext;
     });
   };

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/runtime-settings/command.tsx

@@ -1,13 +1,13 @@
 "use client";
 
-import { collection } from "@/lib/collections";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { SquareTerminal } from "@unkey/icons";
 import { FormTextarea, InfoTooltip } from "@unkey/ui";
 import { useEffect } from "react";
 import { useForm, useWatch } from "react-hook-form";
 import { z } from "zod";
 import { useEnvironmentSettings } from "../../environment-provider";
+import { useUpdateAllEnvironments } from "../../hooks/use-update-all-environments";
 import { FormSettingCard, resolveSaveState } from "../shared/form-setting-card";
 
 const commandSchema = z.object({
@@ -18,7 +18,8 @@ type CommandFormValues = z.infer<typeof commandSchema>;
 
 export const Command = () => {
   const { settings, variant } = useEnvironmentSettings();
-  const { command, environmentId } = settings;
+  const { command } = settings;
+  const updateAllEnvironments = useUpdateAllEnvironments();
   const defaultCommand = command.join(" ");
 
   const {
@@ -49,7 +50,7 @@ export const Command = () => {
   const onSubmit = async (values: CommandFormValues) => {
     const trimmed = values.command.trim();
     const command = trimmed === "" ? [] : trimmed.split(/\s+/).filter(Boolean);
-    collection.environmentSettings.update(environmentId, (draft) => {
+    updateAllEnvironments((draft) => {
       draft.command = command;
     });
   };

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/runtime-settings/healthcheck/index.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { collection } from "@/lib/collections";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { ChevronDown, HeartPulse } from "@unkey/icons";
 import {
@@ -14,6 +13,7 @@ import {
 import { useEffect } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { useEnvironmentSettings } from "../../../environment-provider";
+import { useUpdateAllEnvironments } from "../../../hooks/use-update-all-environments";
 import { FormSettingCard, resolveSaveState } from "../../shared/form-setting-card";
 import { RemoveButton } from "../../shared/remove-button";
 import { MethodBadge } from "./method-badge";
@@ -22,7 +22,8 @@ import { intervalToSeconds, secondsToInterval } from "./utils";
 
 export const Healthcheck = () => {
   const { settings, variant } = useEnvironmentSettings();
-  const { healthcheck, environmentId } = settings;
+  const { healthcheck } = settings;
+  const updateAllEnvironments = useUpdateAllEnvironments();
 
   const defaultValues: HealthcheckFormValues = {
     method: healthcheck?.method ?? "GET",
@@ -48,7 +49,7 @@ export const Healthcheck = () => {
   }, [defaultValues.method, defaultValues.path, defaultValues.interval, reset]);
 
   const onSubmit = async (values: HealthcheckFormValues) => {
-    collection.environmentSettings.update(environmentId, (draft) => {
+    updateAllEnvironments((draft) => {
       draft.healthcheck =
         values.path.trim() === ""
           ? null
@@ -64,7 +65,7 @@ export const Healthcheck = () => {
   };
 
   const handleRemove = () => {
-    collection.environmentSettings.update(environmentId, (draft) => {
+    updateAllEnvironments((draft) => {
       draft.healthcheck = null;
     });
     reset({ method: "GET", path: "", interval: "" });

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/components/runtime-settings/port-settings.tsx

@@ -1,10 +1,10 @@
-import { collection } from "@/lib/collections";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { NumberInput } from "@unkey/icons";
 import { FormInput } from "@unkey/ui";
 import { useForm, useWatch } from "react-hook-form";
 import { z } from "zod";
 import { useEnvironmentSettings } from "../../environment-provider";
+import { useUpdateAllEnvironments } from "../../hooks/use-update-all-environments";
 import { FormSettingCard, resolveSaveState } from "../shared/form-setting-card";
 
 const portSchema = z.object({
@@ -13,7 +13,8 @@ const portSchema = z.object({
 
 export const Port = () => {
   const { settings, variant } = useEnvironmentSettings();
-  const { environmentId, port: defaultValue } = settings;
+  const { port: defaultValue } = settings;
+  const updateAllEnvironments = useUpdateAllEnvironments();
 
   const {
     register,
@@ -35,7 +36,7 @@ export const Port = () => {
   ]);
 
   const onSubmit = async (values: z.infer<typeof portSchema>) => {
-    collection.environmentSettings.update(environmentId, (draft) => {
+    updateAllEnvironments((draft) => {
       draft.port = values.port;
     });
   };

web/apps/dashboard/app/(app)/[workspaceSlug]/projects/[projectId]/(overview)/settings/hooks/use-update-all-environments.ts

@@ -0,0 +1,26 @@
+"use client";
+
+import { collection } from "@/lib/collections";
+import type { EnvironmentSettings } from "@/lib/collections/deploy/environment-settings";
+import { useCallback } from "react";
+import { useProjectData } from "../../data-provider";
+
+/**
+ * Returns a function that applies a settings mutation to every environment.
+ *
+ * Use this for settings that don't have per-environment UI (e.g. dockerfile,
+ * root directory, port, command, healthcheck) so they stay consistent across
+ * all environments.
+ */
+export function useUpdateAllEnvironments() {
+  const { environments } = useProjectData();
+
+  return useCallback(
+    (updater: (draft: EnvironmentSettings) => void) => {
+      for (const env of environments) {
+        collection.environmentSettings.update(env.id, updater);
+      }
+    },
+    [environments],
+  );
+}