diff options
| -rw-r--r-- | packages/ui/src/components/provider-icon.tsx | 6 |
1 files changed, 3 insertions, 3 deletions
diff --git a/packages/ui/src/components/provider-icon.tsx b/packages/ui/src/components/provider-icon.tsx index b2a99989c..edfdd0357 100644 --- a/packages/ui/src/components/provider-icon.tsx +++ b/packages/ui/src/components/provider-icon.tsx @@ -1,5 +1,5 @@ import type { Component, JSX } from "solid-js" -import { splitProps } from "solid-js" +import { createMemo, splitProps } from "solid-js" import sprite from "./provider-icons/sprite.svg" import { iconNames, type IconName } from "./provider-icons/types" @@ -9,7 +9,7 @@ export type ProviderIconProps = JSX.SVGElementTags["svg"] & { export const ProviderIcon: Component<ProviderIconProps> = (props) => { const [local, rest] = splitProps(props, ["id", "class", "classList"]) - const resolved = iconNames.includes(local.id as IconName) ? local.id : "synthetic" + const resolved = createMemo(() => (iconNames.includes(local.id as IconName) ? local.id : "synthetic")) return ( <svg data-component="provider-icon" @@ -19,7 +19,7 @@ export const ProviderIcon: Component<ProviderIconProps> = (props) => { [local.class ?? ""]: !!local.class, }} > - <use href={`${sprite}#${resolved}`} /> + <use href={`${sprite}#${resolved()}`} /> </svg> ) } |