make paid alert position more consistent on resource

This commit is contained in:
miloschwartz
2026-06-11 12:37:54 -07:00
parent 5f0bc71bcd
commit 3e977ba00d
2 changed files with 54 additions and 77 deletions

View File

@@ -984,7 +984,7 @@
"sharedPolicy": "Shared Policy", "sharedPolicy": "Shared Policy",
"sharedPolicyNoneDescription": "This resource has its own policy.", "sharedPolicyNoneDescription": "This resource has its own policy.",
"resourceSharedPolicyOwnDescription": "This resource has its own authentication and access rules controls.", "resourceSharedPolicyOwnDescription": "This resource has its own authentication and access rules controls.",
"resourceSharedPolicyInheritedDescription": "This resource inherits authentication and access rules controls from <policyLink>{policyName}</policyLink>.", "resourceSharedPolicyInheritedDescription": "This resource inherits from <policyLink>{policyName}</policyLink>.",
"resourceSharedPolicyAuthenticationNotice": "This resource is using a shared policy. Some authentication settings can be edited on this resource to add to the policy. To change the underlying policy, you must edit to <policyLink>{policyName}</policyLink>.", "resourceSharedPolicyAuthenticationNotice": "This resource is using a shared policy. Some authentication settings can be edited on this resource to add to the policy. To change the underlying policy, you must edit to <policyLink>{policyName}</policyLink>.",
"resourceSharedPolicyRulesNotice": "This resource is using a shared policy. Some access rules can be edited on this resource. To change the underlying policy, you must edit <policyLink>{policyName}</policyLink>.", "resourceSharedPolicyRulesNotice": "This resource is using a shared policy. Some access rules can be edited on this resource. To change the underlying policy, you must edit <policyLink>{policyName}</policyLink>.",
"resourceUsersRoles": "Access Controls", "resourceUsersRoles": "Access Controls",

View File

@@ -169,20 +169,27 @@ export default function ResourceMaintenancePage() {
{ {
id: "automatic", id: "automatic",
title: `${t("automatic")} (${t("recommended")})`, title: `${t("automatic")} (${t("recommended")})`,
description: t("automaticModeDescription"), description: t("automaticModeDescription")
disabled: isMaintenanceDisabled
}, },
{ {
id: "forced", id: "forced",
title: t("forced"), title: t("forced"),
description: t("forcedModeDescription"), description: t("forcedModeDescription")
disabled: isMaintenanceDisabled
} }
]; ];
return ( return (
<SettingsContainer> <>
<SettingsSection> <PaidFeaturesAlert tiers={tierMatrix.maintencePage} />
<div
className={
isMaintenanceDisabled
? "pointer-events-none opacity-50"
: undefined
}
>
<SettingsContainer>
<SettingsSection>
<SettingsSectionHeader> <SettingsSectionHeader>
<SettingsSectionTitle> <SettingsSectionTitle>
{t("maintenanceMode")} {t("maintenanceMode")}
@@ -193,7 +200,6 @@ export default function ResourceMaintenancePage() {
</SettingsSectionHeader> </SettingsSectionHeader>
<SettingsSectionBody> <SettingsSectionBody>
<PaidFeaturesAlert tiers={tierMatrix.maintencePage} />
<SettingsSectionForm variant="half"> <SettingsSectionForm variant="half">
<Form {...maintenanceForm}> <Form {...maintenanceForm}>
<form <form
@@ -205,46 +211,33 @@ export default function ResourceMaintenancePage() {
<FormField <FormField
control={maintenanceForm.control} control={maintenanceForm.control}
name="maintenanceModeEnabled" name="maintenanceModeEnabled"
render={({ field }) => { render={({ field }) => (
const isDisabled = !isPaidUser( <FormItem>
tierMatrix.maintencePage <FormControl>
); <SwitchInput
id="enable-maintenance"
return ( checked={
<FormItem> field.value
<FormControl> }
<SwitchInput label={t(
id="enable-maintenance" "enableMaintenanceMode"
checked={ )}
field.value description={t(
} "enableMaintenanceModeDescription"
label={t( )}
"enableMaintenanceMode" onCheckedChange={(
)} val
description={t( ) => {
"enableMaintenanceModeDescription" maintenanceForm.setValue(
)} "maintenanceModeEnabled",
disabled={
isDisabled
}
onCheckedChange={(
val val
) => { );
if ( }}
!isDisabled />
) { </FormControl>
maintenanceForm.setValue( <FormMessage />
"maintenanceModeEnabled", </FormItem>
val )}
);
}
}}
/>
</FormControl>
<FormMessage />
</FormItem>
);
}}
/> />
</SettingsFormCell> </SettingsFormCell>
@@ -329,11 +322,6 @@ export default function ResourceMaintenancePage() {
<FormControl> <FormControl>
<Input <Input
{...field} {...field}
disabled={
!isPaidUser(
tierMatrix.maintencePage
)
}
placeholder="We'll be back soon!" placeholder="We'll be back soon!"
/> />
</FormControl> </FormControl>
@@ -365,11 +353,6 @@ export default function ResourceMaintenancePage() {
<Textarea <Textarea
{...field} {...field}
rows={4} rows={4}
disabled={
!isPaidUser(
tierMatrix.maintencePage
)
}
placeholder={t( placeholder={t(
"maintenancePageMessagePlaceholder" "maintenancePageMessagePlaceholder"
)} )}
@@ -402,11 +385,6 @@ export default function ResourceMaintenancePage() {
<FormControl> <FormControl>
<Input <Input
{...field} {...field}
disabled={
!isPaidUser(
tierMatrix.maintencePage
)
}
placeholder={t( placeholder={t(
"maintenanceTime" "maintenanceTime"
)} )}
@@ -430,20 +408,19 @@ export default function ResourceMaintenancePage() {
</SettingsSectionForm> </SettingsSectionForm>
</SettingsSectionBody> </SettingsSectionBody>
<SettingsSectionFooter> <SettingsSectionFooter>
<Button <Button
type="submit" type="submit"
loading={maintenanceSaveLoading} loading={maintenanceSaveLoading}
disabled={ disabled={maintenanceSaveLoading}
maintenanceSaveLoading || form="maintenance-settings-form"
!isPaidUser(tierMatrix.maintencePage) >
} {t("saveSettings")}
form="maintenance-settings-form" </Button>
> </SettingsSectionFooter>
{t("saveSettings")} </SettingsSection>
</Button> </SettingsContainer>
</SettingsSectionFooter> </div>
</SettingsSection> </>
</SettingsContainer>
); );
} }