Feat #179: 36 Monate (3 Jahre) Laufzeit im Wizard + Verlängern

src/api/deployments.ts

@@ -125,7 +125,7 @@ export type DeploymentLogDto = {
 
 // Allowed deployment runtimes in months. Must mirror the backend's
 // ALLOWED_RUNTIME_MONTHS — wizard <Select> options must stay in sync.
-export type RuntimeMonths = 1 | 3 | 4 | 6 | 12 | 24;
+export type RuntimeMonths = 1 | 3 | 4 | 6 | 12 | 24 | 36;
 
 export type DeploymentCreateRequest = {
   name?: string;

src/pages/DeploymentDetails.tsx

@@ -297,14 +297,14 @@ export function DeploymentDetails({ deployment, onBack, onDelete, onRetry }: Dep
   }, [deployment.id, activeProjectId, selectedExtendMonths, extendInFlight]);
 
   const getAvailableExtendMonths = useCallback(() => {
-    if (!deployment.expires_at) return [1, 3, 4, 6, 12, 24];
+    if (!deployment.expires_at) return [1, 3, 4, 6, 12, 24, 36];
     const today = new Date();
     const expiresDate = new Date(deployment.expires_at);
     const monthsDiff =
       (expiresDate.getFullYear() - today.getFullYear()) * 12 +
       (expiresDate.getMonth() - today.getMonth());
-    const maxExtension = 24 - Math.max(0, monthsDiff);
-    return [1, 3, 4, 6, 12, 24].filter(m => m <= maxExtension);
+    const maxExtension = 36 - Math.max(0, monthsDiff);
+    return [1, 3, 4, 6, 12, 24, 36].filter(m => m <= maxExtension);
   }, [deployment.expires_at]);
 
   const accessTypeLabels: Record<AccessType, string> = {
@@ -641,11 +641,11 @@ export function DeploymentDetails({ deployment, onBack, onDelete, onRetry }: Dep
                   <AlertDialogHeader>
                     <AlertDialogTitle>Deployment verlängern</AlertDialogTitle>
                     <AlertDialogDescription>
-                      Wählen Sie aus, um wie viele Monate Sie das Deployment verlängern möchten. Maximal 24 Monate ab heute.
+                      Wählen Sie aus, um wie viele Monate Sie das Deployment verlängern möchten. Maximal 36 Monate ab heute.
                     </AlertDialogDescription>
                   </AlertDialogHeader>
                   <div className="grid grid-cols-2 gap-2 py-4">
-                    {[1, 3, 4, 6, 12, 24].map((months) => {
+                    {[1, 3, 4, 6, 12, 24, 36].map((months) => {
                       const availableMonths = getAvailableExtendMonths();
                       const isAvailable = availableMonths.includes(months);
                       return (

src/pages/DeploymentDetailsPage.tsx

@@ -307,7 +307,7 @@ export function DeploymentDetailsPage() {
       // doesn't store the original choice on the row, only the resulting
       // expires_at. We round to the nearest allowed value so the wizard's
       // <Select> can show it without the user reseating the field.
-      const ALLOWED: Array<1 | 3 | 4 | 6 | 12 | 24> = [1, 3, 4, 6, 12, 24];
+      const ALLOWED: Array<1 | 3 | 4 | 6 | 12 | 24 | 36> = [1, 3, 4, 6, 12, 24, 36];
       let runtimeMonths: number | undefined;
       if (raw.expires_at && raw.created_at) {
         const createdMs = new Date(raw.created_at).getTime();

src/pages/DeploymentWizard.tsx

@@ -1243,6 +1243,7 @@ export function DeploymentWizard({
                     <SelectItem value="6">6 Monate</SelectItem>
                     <SelectItem value="12">1 Jahr</SelectItem>
                     <SelectItem value="24">2 Jahre</SelectItem>
+                    <SelectItem value="36">3 Jahre</SelectItem>
                   </SelectContent>
                 </Select>
                 <p className="text-xs text-slate-500 mt-2 flex items-center gap-1">
@@ -1519,6 +1520,7 @@ export function DeploymentWizard({
         "6": "6 Monate",
         "12": "1 Jahr",
         "24": "2 Jahre",
+        "36": "3 Jahre",
       };
 
       return (