From 6780fa96882160d765f56528e713e861a8b6c907 Mon Sep 17 00:00:00 2001
From: Lorenzo Migliorero <lorenzo.migliorero@wetransfer.com>
Date: Mon, 22 Jul 2024 12:21:51 +0200
Subject: [PATCH] feat: add doc link

---
 .../dashboard/application/environment/show.tsx    | 15 ++++++++++++++-
 components/ui/secrets.tsx                         |  4 ++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/components/dashboard/application/environment/show.tsx b/components/dashboard/application/environment/show.tsx
index fe5853ce..9f4de047 100644
--- a/components/dashboard/application/environment/show.tsx
+++ b/components/dashboard/application/environment/show.tsx
@@ -98,7 +98,20 @@ export const ShowEnvironment = ({ applicationId }: Props) => {
 						name="buildArgs"
 						isLoading={saveBuildArgsMutation.isLoading}
 						title="Build-time Variables"
-						description="Available only at build-time. See documentation here."
+						description={
+							<span>
+								Available only at build-time. See documentation&nbsp;
+								<a
+									className="text-primary"
+									href="https://docs.docker.com/build/guide/build-args/"
+									target="_blank"
+									rel="noopener noreferrer"
+								>
+									here
+								</a>
+								.
+							</span>
+						}
 						placeholder="NPM_TOKEN=xyz"
 					/>
 				</form>
diff --git a/components/ui/secrets.tsx b/components/ui/secrets.tsx
index acb804e8..2ad5e020 100644
--- a/components/ui/secrets.tsx
+++ b/components/ui/secrets.tsx
@@ -15,13 +15,13 @@ import {
 } from "@/components/ui/form";
 import { Toggle } from "@/components/ui/toggle";
 import { EyeIcon, EyeOffIcon } from "lucide-react";
-import { type CSSProperties, useEffect, useState } from "react";
+import { type CSSProperties, type ReactNode, useState } from "react";
 import { useFormContext } from "react-hook-form";
 
 interface Props {
 	name: string;
 	title: string;
-	description: string;
+	description: ReactNode;
 	placeholder: string;
 	isLoading: boolean;
 }