diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/credentials/credentials-manager.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/credentials/credentials-manager.tsx
index e87f0ee5cf..cf2f07519d 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/credentials/credentials-manager.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/credentials/credentials-manager.tsx
@@ -127,10 +127,11 @@ interface WorkspaceVariableRowProps {
renamingKey: string | null
pendingKeyValue: string
hasCredential: boolean
- isAdmin: boolean
+ canEdit: boolean
onRenameStart: (key: string) => void
onPendingKeyChange: (value: string) => void
onRenameEnd: (key: string, value: string) => void
+ onValueChange: (key: string, value: string) => void
onDelete: (key: string) => void
onViewDetails: (envKey: string) => void
}
@@ -141,18 +142,16 @@ function WorkspaceVariableRow({
renamingKey,
pendingKeyValue,
hasCredential,
- isAdmin,
+ canEdit,
onRenameStart,
onPendingKeyChange,
onRenameEnd,
+ onValueChange,
onDelete,
onViewDetails,
}: WorkspaceVariableRowProps) {
const [valueFocused, setValueFocused] = useState(false)
- const maskedValueStyle =
- isAdmin && !valueFocused ? ({ WebkitTextSecurity: 'disc' } as React.CSSProperties) : undefined
-
return (
e.target.removeAttribute('readOnly')}
+ onFocus={(e) => {
+ if (canEdit) e.target.removeAttribute('readOnly')
+ }}
className='h-9'
/>
onValueChange(envKey, e.target.value)}
readOnly
- onFocus={() => {
- if (isAdmin) setValueFocused(true)
+ onFocus={(e) => {
+ if (canEdit) {
+ setValueFocused(true)
+ e.target.removeAttribute('readOnly')
+ }
}}
onBlur={() => {
- if (isAdmin) setValueFocused(false)
+ if (canEdit) setValueFocused(false)
}}
+ name={`workspace_env_value_${envKey}_${Math.random()}`}
autoComplete='off'
autoCorrect='off'
autoCapitalize='off'
spellCheck='false'
- style={maskedValueStyle}
className='h-9'
/>
-
-
-
-
- Delete secret
-
+ {canEdit ? (
+
+
+
+
+ Delete secret
+
+ ) : (
+
+ )}
)
}
@@ -316,7 +326,7 @@ export function CredentialsManager() {
const { data: workspacePermissions } = useWorkspacePermissionsQuery(workspaceId || null)
const queryClient = useQueryClient()
- const isAdmin = useMemo(() => {
+ const isWorkspaceAdmin = useMemo(() => {
const userId = session?.user?.id
if (!userId || !workspacePermissions?.users) return false
const currentUser = workspacePermissions.users.find((user) => user.userId === userId)
@@ -791,6 +801,10 @@ export function CredentialsManager() {
[pendingKeyValue, renamingKey]
)
+ const handleWorkspaceValueChange = useCallback((key: string, value: string) => {
+ setWorkspaceVars((prev) => ({ ...prev, [key]: value }))
+ }, [])
+
const handleDeleteWorkspaceVar = useCallback((key: string) => {
setWorkspaceVars((prev) => {
const next = { ...prev }
@@ -1536,25 +1550,27 @@ export function CredentialsManager() {
renamingKey={renamingKey}
pendingKeyValue={pendingKeyValue}
hasCredential={envKeyToCredential.has(key)}
- isAdmin={isAdmin}
+ canEdit={isWorkspaceAdmin}
onRenameStart={setRenamingKey}
onPendingKeyChange={setPendingKeyValue}
onRenameEnd={handleWorkspaceKeyRename}
+ onValueChange={handleWorkspaceValueChange}
onDelete={handleDeleteWorkspaceVar}
onViewDetails={(envKey) => handleViewDetails(envKey, 'env_workspace')}
/>
))}
- {(searchTerm.trim()
- ? filteredNewWorkspaceRows
- : newWorkspaceRows.map((row, index) => ({ row, originalIndex: index }))
- ).map(({ row, originalIndex }) => (
-
- ))}
+ {isWorkspaceAdmin &&
+ (searchTerm.trim()
+ ? filteredNewWorkspaceRows
+ : newWorkspaceRows.map((row, index) => ({ row, originalIndex: index }))
+ ).map(({ row, originalIndex }) => (
+
+ ))}
>
)}