fix: key never expires #16005 (#16692)

ui/litellm-dashboard/src/components/common_components/KeyLifecycleSettings.tsx

@@ -28,6 +28,7 @@ const KeyLifecycleSettings: React.FC<KeyLifecycleSettingsProps> = ({
 
   const [showCustomInput, setShowCustomInput] = useState(isCustomInterval);
   const [customInterval, setCustomInterval] = useState(isCustomInterval ? rotationInterval : "");
+  const [durationValue, setDurationValue] = useState<string>(form?.getFieldValue?.("duration") || "");
 
   const handleIntervalChange = (value: string) => {
     if (value === "custom") {
@@ -45,6 +46,15 @@ const KeyLifecycleSettings: React.FC<KeyLifecycleSettingsProps> = ({
     setCustomInterval(value);
     onRotationIntervalChange(value);
   };
+
+  const handleDurationChange = (value: string) => {
+    setDurationValue(value);
+    if (form && typeof form.setFieldValue === "function") {
+      form.setFieldValue("duration", value);
+    } else if (form && typeof form.setFieldsValue === "function") {
+      form.setFieldsValue({ duration: value });
+    }
+  };
   return (
     <div className="space-y-6">
       {/* Key Expiry Section */}
@@ -58,7 +68,13 @@ const KeyLifecycleSettings: React.FC<KeyLifecycleSettingsProps> = ({
               <InfoCircleOutlined className="text-gray-400 cursor-help text-xs" />
             </Tooltip>
           </label>
-          <TextInput name="duration" placeholder="e.g., 30d" className="w-full" />
+          <TextInput
+            name="duration"
+            placeholder="e.g., 30d"
+            className="w-full"
+            value={durationValue}
+            onValueChange={handleDurationChange}
+          />
         </div>
       </div>
 

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

@@ -1150,6 +1150,9 @@ const CreateKey: React.FC<CreateKeyProps> = ({
                         />
                       </div>
                     </AccordionBody>
+                    <Form.Item name="duration" hidden initialValue="">
+                      <Input />
+                    </Form.Item>
                   </Accordion>
                   <Accordion className="mt-4 mb-4">
                     <AccordionHeader>

ui/litellm-dashboard/src/components/templates/key_edit_view.tsx

@@ -517,10 +517,13 @@ export function KeyEditView({
         <KeyLifecycleSettings
           form={form}
           autoRotationEnabled={autoRotationEnabled}
-          onAutoRotationChange={setAutoRotationEnabled}
+          onAutoRotationChange={setAutoRotationEnabled}q
           rotationInterval={rotationInterval}
           onRotationIntervalChange={setRotationInterval}
         />
+        <Form.Item name="duration" hidden initialValue="">
+          <Input />
+        </Form.Item>
       </div>
 
       {/* Hidden form field for token */}