github/sim
1
0
Fork 0
mirror of https://github.com/simstudioai/sim.git synced 2026-01-29 16:58:11 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(oauth): use createElement for icon components to fix React hooks error (#3064)

Browse Source
This commit is contained in:
Waleed
2026-01-28 23:37:00 -08:00
committed by GitHub
parent 0d8d9fb238
commit 0b2b7ed9c8
3 changed files with 6 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/credential-selector/credential-selector.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import { useCallback, useEffect, useMemo, useState } from 'react'
import { createElement, useCallback, useEffect, useMemo, useState } from 'react'
import { createLogger } from '@sim/logger'
import { ExternalLink, Users } from 'lucide-react'
import { Button, Combobox } from '@/components/emcn/components'
@@ -203,7 +203,7 @@ export function CredentialSelector({
if (!baseProviderConfig) {
return <ExternalLink className='h-3 w-3' />
}
return baseProviderConfig.icon({ className: 'h-3 w-3' })
return createElement(baseProviderConfig.icon, { className: 'h-3 w-3' })
}, [])
const getProviderName = useCallback((providerName: OAuthProvider) => {

4
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/tool-input/components/tool-credential-selector.tsx
View File

@@ -1,4 +1,4 @@
import { useCallback, useEffect, useMemo, useState } from 'react'
import { createElement, useCallback, useEffect, useMemo, useState } from 'react'
import { ExternalLink } from 'lucide-react'
import { Button, Combobox } from '@/components/emcn/components'
import {
@@ -22,7 +22,7 @@ const getProviderIcon = (providerName: OAuthProvider) => {
if (!baseProviderConfig) {
return <ExternalLink className='h-3 w-3' />
}
return baseProviderConfig.icon({ className: 'h-3 w-3' })
return createElement(baseProviderConfig.icon, { className: 'h-3 w-3' })
}
const getProviderName = (providerName: OAuthProvider) => {

6
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/settings-modal/components/integrations/integrations.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import { useEffect, useRef, useState } from 'react'
import { createElement, useEffect, useRef, useState } from 'react'
import { createLogger } from '@sim/logger'
import { Check, ChevronDown, ExternalLink, Search } from 'lucide-react'
import { useRouter, useSearchParams } from 'next/navigation'
@@ -339,9 +339,7 @@ export function Integrations({ onOpenChange, registerCloseHandler }: Integration
>
<div className='flex items-center gap-[12px]'>
<div className='flex h-9 w-9 flex-shrink-0 items-center justify-center overflow-hidden rounded-[6px] bg-[var(--surface-5)]'>
{typeof service.icon === 'function'
? service.icon({ className: 'h-4 w-4' })
: service.icon}
{createElement(service.icon, { className: 'h-4 w-4' })}
</div>
<div className='flex flex-col justify-center gap-[1px]'>
<span className='font-medium text-[14px]'>{service.name}</span>