feat: add unlimited option to tier limits

Use -1 as a sentinel meaning "no cap" in tier_definitions numeric
columns. checkAndIncrementTierLimit skips the usage-cap WHERE clause
when the limit is -1. Admin tier UI gets an Unlimited switch per
field that disables the input and sends -1.

apps/web/components/admin/tier-limits-form.tsx

@@ -5,6 +5,9 @@ import { toast } from "sonner";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+import { Switch } from "@/components/ui/switch";
+
+const UNLIMITED = -1;
 
 const FIELDS = [
   { key: "maxRecipes", label: "Max Recipes" },
@@ -28,6 +31,13 @@ export function TierLimitsForm({ tierDefinition }: { tierDefinition: TierDefinit
     storageMb: tierDefinition.storageMb,
     maxPublicRecipes: tierDefinition.maxPublicRecipes,
   });
+  // Remembers the last finite value per field so toggling "Unlimited" off restores it.
+  const [lastFinite, setLastFinite] = useState<Record<string, number>>({
+    maxRecipes: tierDefinition.maxRecipes === UNLIMITED ? 0 : tierDefinition.maxRecipes,
+    aiCallsPerMonth: tierDefinition.aiCallsPerMonth === UNLIMITED ? 0 : tierDefinition.aiCallsPerMonth,
+    storageMb: tierDefinition.storageMb === UNLIMITED ? 0 : tierDefinition.storageMb,
+    maxPublicRecipes: tierDefinition.maxPublicRecipes === UNLIMITED ? 0 : tierDefinition.maxPublicRecipes,
+  });
   const [saving, setSaving] = useState(false);
 
   async function handleSave() {
@@ -55,20 +65,45 @@ export function TierLimitsForm({ tierDefinition }: { tierDefinition: TierDefinit
       <h2 className="font-semibold text-lg capitalize">{tierDefinition.tier}</h2>
 
       <div className="grid grid-cols-2 gap-4">
-        {FIELDS.map(({ key, label }) => (
-          <div key={key} className="space-y-1.5">
-            <Label htmlFor={`${tierDefinition.tier}-${key}`}>{label}</Label>
-            <Input
-              id={`${tierDefinition.tier}-${key}`}
-              type="number"
-              min={0}
-              value={values[key]}
-              onChange={(e) =>
-                setValues((prev) => ({ ...prev, [key]: Number(e.target.value) }))
-              }
-            />
-          </div>
-        ))}
+        {FIELDS.map(({ key, label }) => {
+          const isUnlimited = values[key] === UNLIMITED;
+          return (
+            <div key={key} className="space-y-1.5">
+              <div className="flex items-center justify-between">
+                <Label htmlFor={`${tierDefinition.tier}-${key}`}>{label}</Label>
+                <div className="flex items-center gap-1.5">
+                  <Switch
+                    id={`${tierDefinition.tier}-${key}-unlimited`}
+                    size="sm"
+                    checked={isUnlimited}
+                    onCheckedChange={(checked) => {
+                      if (checked) {
+                        setLastFinite((prev) => ({ ...prev, [key]: values[key] ?? 0 }));
+                        setValues((prev) => ({ ...prev, [key]: UNLIMITED }));
+                      } else {
+                        setValues((prev) => ({ ...prev, [key]: lastFinite[key] ?? 0 }));
+                      }
+                    }}
+                  />
+                  <Label htmlFor={`${tierDefinition.tier}-${key}-unlimited`} className="text-xs text-muted-foreground">
+                    Unlimited
+                  </Label>
+                </div>
+              </div>
+              <Input
+                id={`${tierDefinition.tier}-${key}`}
+                type="number"
+                min={0}
+                disabled={isUnlimited}
+                value={isUnlimited ? "" : values[key]}
+                placeholder={isUnlimited ? "Unlimited" : undefined}
+                onChange={(e) =>
+                  setValues((prev) => ({ ...prev, [key]: Number(e.target.value) }))
+                }
+              />
+            </div>
+          );
+        })}
       </div>
 
       <Button onClick={() => { void handleSave(); }} disabled={saving} size="sm">