57 lines
1.8 KiB
TypeScript
57 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
|
|
import { useAppTranslation } from '@features/localization/renderer';
|
|
import { Checkbox } from '@renderer/components/ui/checkbox';
|
|
import { HoverTooltip } from '@renderer/components/ui/hover-tooltip';
|
|
import { Label } from '@renderer/components/ui/label';
|
|
import { Info } from 'lucide-react';
|
|
|
|
interface LimitContextCheckboxProps {
|
|
id: string;
|
|
checked: boolean;
|
|
onCheckedChange: (checked: boolean) => void;
|
|
disabled?: boolean;
|
|
scopeLabel?: string;
|
|
}
|
|
|
|
export const LimitContextCheckbox: React.FC<LimitContextCheckboxProps> = ({
|
|
id,
|
|
checked,
|
|
onCheckedChange,
|
|
disabled = false,
|
|
scopeLabel,
|
|
}) => {
|
|
const { t } = useAppTranslation('team');
|
|
return (
|
|
<div className="mt-4 flex flex-wrap items-center gap-2">
|
|
<Checkbox
|
|
id={id}
|
|
checked={disabled ? true : checked}
|
|
disabled={disabled}
|
|
onCheckedChange={(value) => onCheckedChange(value === true)}
|
|
/>
|
|
<Label
|
|
htmlFor={id}
|
|
className={`flex flex-wrap items-center gap-1.5 text-xs font-normal leading-snug ${
|
|
disabled ? 'cursor-not-allowed text-text-muted opacity-50' : 'text-text-secondary'
|
|
}`}
|
|
>
|
|
{t('contextLimit.limitTo200k')}
|
|
{scopeLabel ? (
|
|
<span className="text-[10px] text-[var(--color-text-muted)]">({scopeLabel})</span>
|
|
) : null}
|
|
{disabled && <span className="text-[10px] italic">{t('contextLimit.always200k')}</span>}
|
|
</Label>
|
|
<HoverTooltip
|
|
content={t('contextLimit.tooltipContent')}
|
|
title={t('contextLimit.tooltipTitle')}
|
|
contentClassName="max-w-[260px]"
|
|
>
|
|
<Info
|
|
className={`size-3.5 shrink-0 ${disabled ? 'text-text-muted opacity-50' : 'text-text-muted hover:text-text-secondary'} cursor-help`}
|
|
aria-hidden="true"
|
|
/>
|
|
</HoverTooltip>
|
|
</div>
|
|
);
|
|
};
|