feat: display secrets in pipeline run view

src/components/PipelineRun/components/ClonePipelineButton.tsx

@@ -9,7 +9,11 @@ import useToastNotification from "@/hooks/useToastNotification";
 import { useExecutionDataOptional } from "@/providers/ExecutionDataProvider";
 import { copyRunToPipeline } from "@/services/pipelineRunService";
 import { extractCanonicalName } from "@/utils/canonicalPipelineName";
-import type { ComponentSpec } from "@/utils/componentSpec";
+import {
+  type ArgumentType,
+  type ComponentSpec,
+  isSecretArgument,
+} from "@/utils/componentSpec";
 import { getInitialName } from "@/utils/getComponentName";
 import { extractTaskArguments } from "@/utils/nodes/taskArguments";
 
@@ -53,11 +57,26 @@ export const ClonePipelineButton = ({
   });
 
   const handleClone = useCallback(() => {
-    const taskArguments = extractTaskArguments(
-      runDetails?.rootDetails?.task_spec.arguments,
+    /**
+     * We cannnot convert SecretArguments into strings compatible with inputs,
+     * so we need to override them with undefined.
+     */
+    const secretArgumentsOverrides = Object.fromEntries(
+      Object.entries(runDetails?.rootDetails?.task_spec.arguments ?? {})
+        .filter(([_, value]) => isSecretArgument(value as ArgumentType))
+        .map(([key, _]) => [key, undefined] as const),
     );
 
-    clonePipeline({ taskArguments });
+    const plainTaskArguments = extractTaskArguments(
+      runDetails?.rootDetails?.task_spec.arguments ?? {},
+    );
+
+    const taskArguments = {
+      ...plainTaskArguments,
+      ...secretArgumentsOverrides,
+    };
+
+    clonePipeline({ taskArguments: taskArguments as Record<string, string> });
   }, [clonePipeline, runDetails]);
 
   return (

src/utils/nodes/taskArguments.ts

@@ -1,6 +1,10 @@
 import type { TaskSpecOutput } from "@/api/types.gen";
 
-import type { ComponentSpec } from "../componentSpec";
+import {
+  type ArgumentType,
+  type ComponentSpec,
+  isSecretArgument,
+} from "../componentSpec";
 
 /**
  * Gets the string value of a task argument.
@@ -17,11 +21,16 @@ export function getArgumentValue(
     return undefined;
   }
 
-  const argument = taskArguments?.[inputName];
+  const argument = taskArguments?.[inputName] as ArgumentType;
+
   if (typeof argument === "string") {
     return argument;
   }
 
+  if (isSecretArgument(argument)) {
+    return `🔒 ${argument.dynamicData.secret.name}`;
+  }
+
   return undefined;
 }