ultisuite-client/components/admin/settings/sections/quotas-section.tsx
R3D347HR4Y 8f81d7aba1
Some checks are pending
E2E / Playwright e2e (push) Waiting to run
feat(admin-settings): refactor admin settings components for improved usability and consistency
- Replaced legacy components with new `SettingsCard`, `SettingsField`, and `SettingsToggleRow` for a unified design.
- Enhanced `AdminListControls` to support compact mode and improved pagination controls.
- Updated various sections including `AiAssistantSection`, `AuthenticationSection`, and `DriveMountOAuthSection` to utilize new components, streamlining the settings interface.
- Improved accessibility and user experience across admin settings with clearer labels and hints.
- Deprecated old components while maintaining backward compatibility for existing admin sections.
2026-06-15 11:10:17 +02:00

183 lines
5.4 KiB
TypeScript

"use client"
import Link from "next/link"
import { AutomationTabMasonry } from "@/components/gmail/settings/automation/automation-tab-masonry"
import {
SettingsCard,
SettingsField,
SettingsGrid,
} from "@/components/settings/settings-kit"
import { OrgSettingsSection } from "@/components/admin/settings/org-settings-form"
import { useOrgSettingsStore } from "@/lib/admin-settings/org-settings-store"
import { Button } from "@/components/ui/button"
import {
InputGroup,
InputGroupAddon,
InputGroupInput,
InputGroupText,
} from "@/components/ui/input-group"
export function QuotasSection() {
const storageQuotas = useOrgSettingsStore((s) => s.storageQuotas)
const setStorageQuotas = useOrgSettingsStore((s) => s.setStorageQuotas)
const usageQuotas = useOrgSettingsStore((s) => s.usageQuotas)
const setUsageQuotas = useOrgSettingsStore((s) => s.setUsageQuotas)
return (
<OrgSettingsSection
title="Quotas"
description="Limites de stockage et d'usage appliquées par défaut aux comptes de l'organisation."
policySection={["storage_quotas", "usage_quotas"]}
>
<AutomationTabMasonry columns={2}>
<SettingsCard
title="Stockage par défaut"
description="Mail, drive et photos. Les quotas individuels se gèrent depuis la fiche utilisateur."
>
<SettingsGrid columns={2} className="sm:grid-cols-3">
<QuotaInput
label="Mail"
unit="Go"
value={storageQuotas.default_mail_gib}
onChange={(v) => setStorageQuotas({ default_mail_gib: v })}
/>
<QuotaInput
label="Drive"
unit="Go"
value={storageQuotas.default_drive_gib}
onChange={(v) => setStorageQuotas({ default_drive_gib: v })}
/>
<QuotaInput
label="Photos"
unit="Go"
value={storageQuotas.default_photos_gib}
onChange={(v) => setStorageQuotas({ default_photos_gib: v })}
/>
</SettingsGrid>
<SettingsNumberField
label="Seuil d'alerte"
unit="%"
min={50}
max={100}
fallback={90}
className="max-w-xs"
value={storageQuotas.warn_threshold_pct}
onChange={(v) => setStorageQuotas({ warn_threshold_pct: v })}
/>
<Button asChild variant="outline" size="sm">
<Link href="/admin/settings/users">Gérer les quotas par utilisateur</Link>
</Button>
</SettingsCard>
<SettingsCard
title="Intelligence artificielle"
description="Requêtes LLM et tokens consommés par mois."
>
<SettingsGrid columns={2}>
<SettingsNumberField
label="Requêtes LLM"
unit="/ jour"
value={usageQuotas.llm_requests_per_day}
onChange={(v) => setUsageQuotas({ llm_requests_per_day: v })}
/>
<SettingsNumberField
label="Tokens LLM"
unit="/ mois"
value={usageQuotas.llm_tokens_per_month}
onChange={(v) => setUsageQuotas({ llm_tokens_per_month: v })}
/>
</SettingsGrid>
</SettingsCard>
<SettingsCard
title="Recherche et automatisations"
description="Recherche web, tokens API et webhooks par utilisateur."
>
<SettingsGrid columns={2} className="lg:grid-cols-1 xl:grid-cols-3">
<SettingsNumberField
label="Recherches web"
unit="/ jour"
value={usageQuotas.search_requests_per_day}
onChange={(v) => setUsageQuotas({ search_requests_per_day: v })}
/>
<SettingsNumberField
label="Tokens API"
unit="/ utilisateur"
value={usageQuotas.max_api_tokens_per_user}
onChange={(v) => setUsageQuotas({ max_api_tokens_per_user: v })}
/>
<SettingsNumberField
label="Webhooks"
unit="/ utilisateur"
value={usageQuotas.max_webhooks_per_user}
onChange={(v) => setUsageQuotas({ max_webhooks_per_user: v })}
/>
</SettingsGrid>
</SettingsCard>
</AutomationTabMasonry>
</OrgSettingsSection>
)
}
function QuotaInput({
label,
unit,
value,
onChange,
}: {
label: string
unit: string
value: number
onChange: (v: number) => void
}) {
return (
<SettingsNumberField
label={label}
unit={unit}
step={0.5}
value={value}
onChange={onChange}
/>
)
}
function SettingsNumberField({
label,
unit,
value,
onChange,
min = 0,
max,
step,
fallback = 0,
className,
}: {
label: string
unit: string
value: number
onChange: (v: number) => void
min?: number
max?: number
step?: number
fallback?: number
className?: string
}) {
return (
<SettingsField label={label}>
<InputGroup className={className}>
<InputGroupInput
type="number"
min={min}
max={max}
step={step}
value={value}
onChange={(e) => onChange(Number(e.target.value) || fallback)}
/>
<InputGroupAddon align="inline-end">
<InputGroupText>{unit}</InputGroupText>
</InputGroupAddon>
</InputGroup>
</SettingsField>
)
}