diff --git a/packages/web_ui/src/components/BaseConfigTree.tsx b/packages/web_ui/src/components/BaseConfigTree.tsx index 1d808916..14b7287a 100644 --- a/packages/web_ui/src/components/BaseConfigTree.tsx +++ b/packages/web_ui/src/components/BaseConfigTree.tsx @@ -74,6 +74,7 @@ export type ConfigInheritance = { canInherit: (config: lib.Config, field: string) => boolean; isInherited: (config: lib.Config, field: string, prop?: string) => boolean; inherit: (field: string, prop?: string) => Promise; + templateValue: (field: string, prop?: string) => unknown; notice?: (config: lib.Config) => React.ReactNode; }; @@ -331,12 +332,18 @@ function computeTreeData( if (!linking.has(key)) { return button( "Not linked to the template. Click to link it again when applied.", , "Link", - () => { setLinking(new Map([...linking, [key, [fieldName, prop]]])); revert(); }, + () => { + setLinking(new Map([...linking, [key, [fieldName, prop]]])); + revert(); + // Show the value the field takes after apply + const value = inheritance.templateValue(fieldName, prop); + form.setFieldValue(key, prop === undefined ? value : JSON.stringify(value)); + }, ); } return button( "Linked to the template when applied. Click to keep this value instead.", , "Unlink", - () => setLinking(new Map([...linking].filter(([k]) => k !== key))), + () => { setLinking(new Map([...linking].filter(([k]) => k !== key))); revert(); }, ); } function isReadonly(canWrite: boolean, key: string, fieldName: string, prop?: string) { diff --git a/packages/web_ui/src/components/InstanceConfigTree.tsx b/packages/web_ui/src/components/InstanceConfigTree.tsx index ffdece11..6a914480 100644 --- a/packages/web_ui/src/components/InstanceConfigTree.tsx +++ b/packages/web_ui/src/components/InstanceConfigTree.tsx @@ -1,4 +1,4 @@ -import React, { useContext } from "react"; +import React, { useContext, useRef } from "react"; import { Alert } from "antd"; import * as lib from "@clusterio/lib"; @@ -29,9 +29,15 @@ function TemplateNotice(props: { templateId: number }) { export default function InstanceConfigTree(props: InstanceConfigTreeProps) { let control = useContext(ControlContext); + const templateConfig = useRef({}); async function retrieveConfig() { - return await control.send(new lib.InstanceConfigGetRequest(props.id)); + const config = await control.send(new lib.InstanceConfigGetRequest(props.id)); + const templateId = config["instance.template_id"]; + templateConfig.current = typeof templateId === "number" + ? await control.send(new lib.InstanceConfigGetRequest(templateId)) + : {}; + return config; } async function setConfig(fields: Record>) { @@ -47,6 +53,10 @@ export default function InstanceConfigTree(props: InstanceConfigTreeProps) { inherit: async (field, prop) => { await control.send(new lib.InstanceConfigInheritFieldRequest(props.id, field, prop)); }, + templateValue: (field, prop) => { + const value = templateConfig.current[field] as any; + return prop === undefined ? value : value?.[prop]; + }, notice: (config) => { const templateId = (config as lib.InstanceConfig).get("instance.template_id"); return templateId !== null ? : null;