From 906a0a0fbc8172297dfee42aecd5a9ebe2d61ec4 Mon Sep 17 00:00:00 2001
From: Bram Suurd <78373894+BramSuurdje@users.noreply.github.com>
Date: Mon, 16 Jun 2025 17:14:17 +0200
Subject: [PATCH] Refactor ScriptItem and ConfigFile components to
 conditionally render config file location. Update ConfigFile to accept
 configPath prop instead of item. (#5197)

---
 .../app/scripts/_components/ScriptItem.tsx    | 24 ++++++++++---------
 .../_components/ScriptItems/ConfigFile.tsx    |  5 ++--
 2 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/frontend/src/app/scripts/_components/ScriptItem.tsx b/frontend/src/app/scripts/_components/ScriptItem.tsx
index 5471c04f6..7b46205fd 100644
--- a/frontend/src/app/scripts/_components/ScriptItem.tsx
+++ b/frontend/src/app/scripts/_components/ScriptItem.tsx
@@ -15,12 +15,12 @@ import { ResourceDisplay } from "./ResourceDisplay";
 import { getDisplayValueFromType } from "./ScriptInfoBlocks";
 import Alerts from "./ScriptItems/Alerts";
 import Buttons from "./ScriptItems/Buttons";
+import ConfigFile from "./ScriptItems/ConfigFile";
 import DefaultPassword from "./ScriptItems/DefaultPassword";
 import Description from "./ScriptItems/Description";
 import InstallCommand from "./ScriptItems/InstallCommand";
 import InterFaces from "./ScriptItems/InterFaces";
 import Tooltips from "./ScriptItems/Tooltips";
-import ConfigFile from "./ScriptItems/ConfigFile";
 
 interface ScriptItemProps {
   item: Script;
@@ -152,16 +152,18 @@ export function ScriptItem({ item, setSelectedScript }: ScriptItemProps) {
               <div className="">
                 <InstallCommand item={item} />
               </div>
-              <Separator />
-              <div className="flex gap-3 px-4 py-2 bg-accent/25">
-                <h2 className="text-lg font-semibold">
-                  Location of config file
-                </h2>
-              </div>
-              <Separator />
-              <div className="">
-                <ConfigFile item={item} />
-              </div>
+              {item.config_path && (
+                <>
+                  <Separator />
+                  <div className="flex gap-3 px-4 py-2 bg-accent/25">
+                    <h2 className="text-lg font-semibold">Location of config file</h2>
+                  </div>
+                  <Separator />
+                  <div className="">
+                    <ConfigFile configPath={item.config_path} />
+                  </div>
+                </>
+              )}
             </div>
 
             <DefaultPassword item={item} />
diff --git a/frontend/src/app/scripts/_components/ScriptItems/ConfigFile.tsx b/frontend/src/app/scripts/_components/ScriptItems/ConfigFile.tsx
index 0f4f43fb0..d11ed24d2 100644
--- a/frontend/src/app/scripts/_components/ScriptItems/ConfigFile.tsx
+++ b/frontend/src/app/scripts/_components/ScriptItems/ConfigFile.tsx
@@ -1,10 +1,9 @@
 import ConfigCopyButton from "@/components/ui/config-copy-button";
-import { Script } from "@/lib/types";
 
-export default function ConfigFile({ item }: { item: Script }) {
+export default function ConfigFile({ configPath }: { configPath: string }) {
   return (
     <div className="px-4 pb-4">
-      <ConfigCopyButton>{item.config_path ? item.config_path : "No config path set"}</ConfigCopyButton>
+      <ConfigCopyButton>{configPath}</ConfigCopyButton>
     </div>
   );
 }