From 8233902aef7092d0eac23604cc46c87f60a5adce Mon Sep 17 00:00:00 2001
From: Joshen Lim <joshenlimek@gmail.com>
Date: Tue, 3 Feb 2026 15:04:35 +0800
Subject: [PATCH] chore(studio): Edge functions secrets trim secret value for
 single value (#42382)

## Context

Addresses a small footgun where copying and paste a single value with
new lines and hitting save in the edge function secrets page will also
save the new lines in the secret name.

Fix is just adding a trim

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Chores**
* Internal code organization and refactoring improvements to enhance
codebase maintainability and consistency across the Functions module.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../EdgeFunctionSecrets/AddNewSecretForm.tsx      | 14 +++++++-------
 .../EdgeFunctionSecrets/EdgeFunctionSecrets.tsx   | 15 +++++----------
 .../pages/project/[ref]/functions/secrets.tsx     |  2 +-
 3 files changed, 13 insertions(+), 18 deletions(-)

diff --git a/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/AddNewSecretForm.tsx b/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/AddNewSecretForm.tsx
index ad744820885..cf4791ec95d 100644
--- a/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/AddNewSecretForm.tsx
+++ b/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/AddNewSecretForm.tsx
@@ -1,13 +1,11 @@
 import { zodResolver } from '@hookform/resolvers/zod'
-import { useState } from 'react'
-import { SubmitHandler, useFieldArray, useForm } from 'react-hook-form'
-import { toast } from 'sonner'
-import z from 'zod'
-
 import { useParams } from 'common'
 import { useSecretsCreateMutation } from 'data/secrets/secrets-create-mutation'
 import { useSecretsQuery } from 'data/secrets/secrets-query'
 import { Eye, EyeOff, MinusCircle } from 'lucide-react'
+import { useState } from 'react'
+import { SubmitHandler, useFieldArray, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
 import {
   Button,
   Card,
@@ -15,14 +13,16 @@ import {
   CardFooter,
   CardHeader,
   CardTitle,
-  Form_Shadcn_,
   FormControl_Shadcn_,
   FormField_Shadcn_,
   FormItem_Shadcn_,
   FormLabel_Shadcn_,
   FormMessage_Shadcn_,
+  Form_Shadcn_,
 } from 'ui'
 import { Input } from 'ui-patterns/DataInputs/Input'
+import z from 'zod'
+
 import { DuplicateSecretWarningModal } from './DuplicateSecretWarningModal'
 
 type SecretPair = {
@@ -89,7 +89,7 @@ const AddNewSecretForm = () => {
           const index = parseInt(indexStr)
           form.setValue(
             `secrets.${index}.${field}` as `secrets.${number}.name` | `secrets.${number}.value`,
-            text
+            text.trim()
           )
           return
         }
diff --git a/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx b/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx
index dc0c0c866ad..c2384362183 100644
--- a/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx
+++ b/apps/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx
@@ -1,19 +1,19 @@
 import { PermissionAction } from '@supabase/shared-types/out/constants'
-import { Search } from 'lucide-react'
-import { useEffect, useState } from 'react'
-import { toast } from 'sonner'
-
 import { useParams } from 'common'
 import AlertError from 'components/ui/AlertError'
 import NoPermission from 'components/ui/NoPermission'
 import { useSecretsDeleteMutation } from 'data/secrets/secrets-delete-mutation'
 import { useSecretsQuery } from 'data/secrets/secrets-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
+import { Search } from 'lucide-react'
 import { parseAsString, useQueryState } from 'nuqs'
+import { useEffect, useState } from 'react'
+import { toast } from 'sonner'
 import { Badge, Card, Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from 'ui'
 import { Input } from 'ui-patterns/DataInputs/Input'
 import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal'
 import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader'
+
 import AddNewSecretForm from './AddNewSecretForm'
 import EdgeFunctionSecret from './EdgeFunctionSecret'
 import { EditSecretSheet } from './EditSecretSheet'
@@ -34,12 +34,7 @@ export const EdgeFunctionSecrets = () => {
     isPending: isLoading,
     isSuccess,
     isError,
-  } = useSecretsQuery(
-    {
-      projectRef: projectRef,
-    },
-    { enabled: canReadSecrets }
-  )
+  } = useSecretsQuery({ projectRef: projectRef }, { enabled: canReadSecrets })
 
   const [selectedIdToEdit, setSelectedIdToEdit] = useQueryState(
     'edit',
diff --git a/apps/studio/pages/project/[ref]/functions/secrets.tsx b/apps/studio/pages/project/[ref]/functions/secrets.tsx
index 082063ceb3f..6ee8617a4a5 100644
--- a/apps/studio/pages/project/[ref]/functions/secrets.tsx
+++ b/apps/studio/pages/project/[ref]/functions/secrets.tsx
@@ -1,6 +1,6 @@
 import { EdgeFunctionSecrets } from 'components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets'
 import { FunctionsSecretsEmptyStateLocal } from 'components/interfaces/Functions/FunctionsEmptyState'
-import DefaultLayout from 'components/layouts/DefaultLayout'
+import { DefaultLayout } from 'components/layouts/DefaultLayout'
 import EdgeFunctionsLayout from 'components/layouts/EdgeFunctionsLayout/EdgeFunctionsLayout'
 import { IS_PLATFORM } from 'lib/constants'
 import type { NextPageWithLayout } from 'types'