25 lines
807 B
TypeScript
25 lines
807 B
TypeScript
import Icon from "@/Components/Icons/Icon";
|
|
import Spinner from "@/Components/Icons/Spinner";
|
|
import useLoading from "@/Hooks/useLoading";
|
|
|
|
export type AsyncIconProps = React.HTMLProps<HTMLDivElement> & {
|
|
iconName: string;
|
|
iconSize?: number;
|
|
onClick?: (e: React.MouseEvent) => Promise<void> | void;
|
|
};
|
|
|
|
export function AsyncIcon(props: AsyncIconProps) {
|
|
const { loading, handle } = useLoading(props.onClick, props.disabled);
|
|
|
|
const mergedProps = { ...props } as Record<string, unknown>;
|
|
delete mergedProps["iconName"];
|
|
delete mergedProps["iconSize"];
|
|
delete mergedProps["loading"];
|
|
return (
|
|
<div {...mergedProps} onClick={handle} className={props.className}>
|
|
{loading ? <Spinner /> : <Icon name={props.iconName} size={props.iconSize} />}
|
|
{props.children}
|
|
</div>
|
|
);
|
|
}
|