From dc343582d8fca52bc07be0691ae8067bc176d0ac Mon Sep 17 00:00:00 2001
From: Ryan Hopper-Lowe <ryan@acorn.io>
Date: Sun, 8 Dec 2024 00:45:53 -0600
Subject: [PATCH] chore: hardcode list of sensitive model provider fields

Determines which fields should be displayed as passwords when configuring a model provider

Signed-off-by: Craig Jellick <craig@acorn.io>
---
 .../model-providers/ModelProviderForm.tsx     | 47 +++++++++++--------
 .../components/model-providers/constants.ts   | 20 ++++++++
 2 files changed, 48 insertions(+), 19 deletions(-)

diff --git a/ui/admin/app/components/model-providers/ModelProviderForm.tsx b/ui/admin/app/components/model-providers/ModelProviderForm.tsx
index cdbb6559..fffcc716 100644
--- a/ui/admin/app/components/model-providers/ModelProviderForm.tsx
+++ b/ui/admin/app/components/model-providers/ModelProviderForm.tsx
@@ -22,6 +22,7 @@ import { ControlledInput } from "~/components/form/controlledInputs";
 import {
     ModelProviderConfigurationLinks,
     ModelProviderRequiredTooltips,
+    ModelProviderSensitiveFields,
 } from "~/components/model-providers/constants";
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 import { Button } from "~/components/ui/button";
@@ -211,26 +212,34 @@ export function ModelProviderForm({
                             className="flex flex-col gap-4"
                         >
                             {requiredConfigParamFields.fields.map(
-                                (field, i) => (
-                                    <div
-                                        key={field.id}
-                                        className="flex gap-2 items-center justify-center"
-                                    >
-                                        <ControlledInput
+                                (field, i) => {
+                                    const type = ModelProviderSensitiveFields[
+                                        field.name
+                                    ]
+                                        ? "password"
+                                        : "text";
+
+                                    return (
+                                        <div
                                             key={field.id}
-                                            label={renderLabelWithTooltip(
-                                                field.label
-                                            )}
-                                            control={form.control}
-                                            name={`requiredConfigParams.${i}.value`}
-                                            type="password"
-                                            classNames={{
-                                                wrapper:
-                                                    "flex-auto bg-background",
-                                            }}
-                                        />
-                                    </div>
-                                )
+                                            className="flex gap-2 items-center justify-center"
+                                        >
+                                            <ControlledInput
+                                                key={field.id}
+                                                label={renderLabelWithTooltip(
+                                                    field.label
+                                                )}
+                                                control={form.control}
+                                                name={`requiredConfigParams.${i}.value`}
+                                                type={type}
+                                                classNames={{
+                                                    wrapper:
+                                                        "flex-auto bg-background",
+                                                }}
+                                            />
+                                        </div>
+                                    );
+                                }
                             )}
                         </form>
                     </Form>
diff --git a/ui/admin/app/components/model-providers/constants.ts b/ui/admin/app/components/model-providers/constants.ts
index ee402be4..74839cc6 100644
--- a/ui/admin/app/components/model-providers/constants.ts
+++ b/ui/admin/app/components/model-providers/constants.ts
@@ -48,3 +48,23 @@ export const ModelProviderRequiredTooltips: {
             "Container that holds related Azure resources. Can typically be found in Azure Portal > Resource Groups > [OpenAI Resource Group] > Overview",
     },
 };
+
+export const ModelProviderSensitiveFields: Record<string, boolean | undefined> =
+    {
+        // OpenAI
+        OTTO8_OPENAI_MODEL_PROVIDER_API_KEY: true,
+
+        // Azure OpenAI
+        OTTO8_AZURE_OPENAI_MODEL_PROVIDER_ENDPOINT: false,
+        OTTO8_AZURE_OPENAI_MODEL_PROVIDER_CLIENT_ID: false,
+        OTTO8_AZURE_OPENAI_MODEL_PROVIDER_CLIENT_SECRET: true,
+        OTTO8_AZURE_OPENAI_MODEL_PROVIDER_TENANT_ID: false,
+        OTTO8_AZURE_OPENAI_MODEL_PROVIDER_SUBSCRIPTION_ID: false,
+        OTTO8_AZURE_OPENAI_MODEL_PROVIDER_RESOURCE_GROUP: false,
+
+        // Anthropic
+        OTTO8_ANTHROPIC_MODEL_PROVIDER_API_KEY: true,
+
+        // Voyage
+        OTTO8_VOYAGE_MODEL_PROVIDER_API_KEY: true,
+    };