add optional icon to strategy select

This commit is contained in:
miloschwartz
2025-09-04 18:02:29 -07:00
parent 838e3efbca
commit 1dad7e86a0

View File

@@ -2,13 +2,14 @@
import { cn } from "@app/lib/cn";
import { RadioGroup, RadioGroupItem } from "./ui/radio-group";
import { useState } from "react";
import { useState, ReactNode } from "react";
export interface StrategyOption<TValue extends string> {
id: TValue;
id: TValue;
title: string;
description: string;
disabled?: boolean;
icon?: ReactNode;
}
interface StrategySelectProps<TValue extends string> {
@@ -58,10 +59,17 @@ export function StrategySelect<TValue extends string>({
disabled={option.disabled}
className="absolute left-4 top-5 h-4 w-4 border-primary text-primary"
/>
<div className="pl-7">
<div className="font-medium">{option.title}</div>
<div className="text-sm text-muted-foreground">
{option.description}
<div className="flex items-center gap-3 pl-7">
{option.icon && (
<div className="flex-shrink-0 flex items-center justify-center">
{option.icon}
</div>
)}
<div className="flex-1">
<div className="font-medium">{option.title}</div>
<div className="text-sm text-muted-foreground">
{option.description}
</div>
</div>
</div>
</label>