From 940bf990f97a5a5767ea128193294eeace29d2a9 Mon Sep 17 00:00:00 2001
From: Oscar Zhou <100548325+oscarzhou-portainer@users.noreply.github.com>
Date: Fri, 4 Apr 2025 11:56:42 +1300
Subject: [PATCH] fix(edgeconfig): add edge config file interpolation info
 message on edge stack page [BE-11741] (#606)

---
 .../RelativePathFieldset/RelativePathFieldset.tsx | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/app/react/portainer/gitops/RelativePathFieldset/RelativePathFieldset.tsx b/app/react/portainer/gitops/RelativePathFieldset/RelativePathFieldset.tsx
index 4b4dac139..3c143394a 100644
--- a/app/react/portainer/gitops/RelativePathFieldset/RelativePathFieldset.tsx
+++ b/app/react/portainer/gitops/RelativePathFieldset/RelativePathFieldset.tsx
@@ -10,6 +10,7 @@ import { TextTip } from '@@/Tip/TextTip';
 import { FormControl } from '@@/form-components/FormControl';
 import { Input, Select } from '@@/form-components/Input';
 import { useDocsUrl } from '@@/PageHeader/ContextHelp';
+import { InsightsBox } from '@@/InsightsBox';
 
 import { RelativePathModel, getPerDevConfigsFilterType } from './types';
 
@@ -135,6 +136,20 @@ export function RelativePathFieldset({
 
           {value.SupportPerDeviceConfigs && (
             <>
+              <InsightsBox
+                content={
+                  <p>
+                    Files named <code>$&#123;PORTAINER_EDGE_ID&#125;.env</code>{' '}
+                    and/or <code>$&#123;PORTAINER_EDGE_GROUP&#125;.env</code>{' '}
+                    contained by the config folder will be loaded for compose
+                    file interpolation.
+                  </p>
+                }
+                header="GitOps Edge Configurations"
+                insightCloseId="edge-config-interpolation-info"
+                className="mb-3"
+              />
+
               <div className="form-group">
                 <div className="col-sm-12">
                   <TextTip color="blue">{pathTipSwarm}</TextTip>