Skip to content

Commit ff866aa

Browse files
feat(create_key_button.tsx): add tpm/rpm rate limit type options to UI
allows user to set the type of tpm/rpm limit they're trying to set
1 parent d8e3a62 commit ff866aa

File tree

1 file changed

+80
-0
lines changed

1 file changed

+80
-0
lines changed

ui/litellm-dashboard/src/components/organisms/create_key_button.tsx

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -810,6 +810,46 @@ const CreateKey: React.FC<CreateKeyProps> = ({
810810
>
811811
<NumericalInput step={1} width={400} />
812812
</Form.Item>
813+
<Form.Item
814+
label={
815+
<span>
816+
TPM Rate Limit Type {' '}
817+
<Tooltip title="Select 'guaranteed_throughput' to prevent overallocating TPM limit when the key belongs to a Team with specific TPM limits.">
818+
<InfoCircleOutlined style={{ marginLeft: '4px' }} />
819+
</Tooltip>
820+
</span>
821+
}
822+
name="tpm_limit_type"
823+
initialValue="default"
824+
className="mt-4"
825+
>
826+
<Select
827+
defaultValue="default"
828+
placeholder="Select rate limit type"
829+
style={{ width: "100%" }}
830+
optionLabelProp="label"
831+
onChange={(value) => {
832+
form.setFieldValue('tpm_limit_type', value);
833+
}}
834+
>
835+
<Option value="default" label="Default">
836+
<div style={{ padding: '4px 0' }}>
837+
<div style={{ fontWeight: 500 }}>Default</div>
838+
<div style={{ fontSize: '11px', color: '#6b7280', marginTop: '2px' }}>
839+
Best effort throughput - no error if we're overallocating tpm (Team/Key Limits checked at runtim).
840+
</div>
841+
</div>
842+
</Option>
843+
<Option value="guaranteed_throughput" label="Guaranteed throughput">
844+
<div style={{ padding: '4px 0' }}>
845+
<div style={{ fontWeight: 500 }}>Guaranteed throughput</div>
846+
<div style={{ fontSize: '11px', color: '#6b7280', marginTop: '2px' }}>
847+
Guaranteed throughput - raise an error if we're overallocating tpm (also checks model-specific limits)
848+
</div>
849+
</div>
850+
</Option>
851+
</Select>
852+
</Form.Item>
813853
<Form.Item
814854
className="mt-4"
815855
label={
@@ -841,6 +881,46 @@ const CreateKey: React.FC<CreateKeyProps> = ({
841881
>
842882
<NumericalInput step={1} width={400} />
843883
</Form.Item>
884+
<Form.Item
885+
label={
886+
<span>
887+
RPM Rate Limit Type {' '}
888+
<Tooltip title="Select 'guaranteed_throughput' to prevent overallocating RPM limit when the key belongs to a Team with specific RPM limits.">
889+
<InfoCircleOutlined style={{ marginLeft: '4px' }} />
890+
</Tooltip>
891+
</span>
892+
}
893+
name="rpm_limit_type"
894+
initialValue="default"
895+
className="mt-4"
896+
>
897+
<Select
898+
defaultValue="default"
899+
placeholder="Select rate limit type"
900+
style={{ width: "100%" }}
901+
optionLabelProp="label"
902+
onChange={(value) => {
903+
form.setFieldValue('rpm_limit_type', value);
904+
}}
905+
>
906+
<Option value="default" label="Default">
907+
<div style={{ padding: '4px 0' }}>
908+
<div style={{ fontWeight: 500 }}>Default</div>
909+
<div style={{ fontSize: '11px', color: '#6b7280', marginTop: '2px' }}>
910+
Best effort throughput - no error if we're overallocating rpm (Team/Key Limits checked at runtim).
911+
</div>
912+
</div>
913+
</Option>
914+
<Option value="guaranteed_throughput" label="Guaranteed throughput">
915+
<div style={{ padding: '4px 0' }}>
916+
<div style={{ fontWeight: 500 }}>Guaranteed throughput</div>
917+
<div style={{ fontSize: '11px', color: '#6b7280', marginTop: '2px' }}>
918+
Guaranteed throughput - raise an error if we're overallocating rpm (also checks model-specific limits)
919+
</div>
920+
</div>
921+
</Option>
922+
</Select>
923+
</Form.Item>
844924
<Form.Item
845925
label={
846926
<span>

0 commit comments

Comments
 (0)