Move feature limits box into own component
This commit is contained in:
parent
6814811a19
commit
7ec78d9400
2 changed files with 44 additions and 37 deletions
|
@ -20,42 +20,7 @@ import { Actions, useStoreActions } from 'easy-peasy';
|
||||||
import Button from '@/components/elements/Button';
|
import Button from '@/components/elements/Button';
|
||||||
import FormikSwitch from '@/components/elements/FormikSwitch';
|
import FormikSwitch from '@/components/elements/FormikSwitch';
|
||||||
import BaseSettingsBox from '@/components/admin/servers/settings/BaseSettingsBox';
|
import BaseSettingsBox from '@/components/admin/servers/settings/BaseSettingsBox';
|
||||||
|
import FeatureLimitsBox from '@/components/admin/servers/settings/FeatureLimitsBox';
|
||||||
export function ServerFeatureContainer () {
|
|
||||||
const { isSubmitting } = useFormikContext();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<AdminBox icon={faConciergeBell} title={'Feature Limits'} css={tw`relative w-full`}>
|
|
||||||
<SpinnerOverlay visible={isSubmitting}/>
|
|
||||||
|
|
||||||
<div css={tw`grid grid-cols-1 md:grid-cols-3 gap-x-8 gap-y-6`}>
|
|
||||||
<Field
|
|
||||||
id={'featureLimits.allocations'}
|
|
||||||
name={'featureLimits.allocations'}
|
|
||||||
label={'Allocation Limit'}
|
|
||||||
type={'number'}
|
|
||||||
description={'The total number of allocations a user is allowed to create for this server.'}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Field
|
|
||||||
id={'featureLimits.backups'}
|
|
||||||
name={'featureLimits.backups'}
|
|
||||||
label={'Backup Limit'}
|
|
||||||
type={'number'}
|
|
||||||
description={'The total number of backups that can be created for this server.'}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Field
|
|
||||||
id={'featureLimits.databases'}
|
|
||||||
name={'featureLimits.databases'}
|
|
||||||
label={'Database Limit'}
|
|
||||||
type={'number'}
|
|
||||||
description={'The total number of databases a user is allowed to create for this server.'}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</AdminBox>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function ServerAllocationsContainer ({ server }: { server: Server }) {
|
export function ServerAllocationsContainer ({ server }: { server: Server }) {
|
||||||
const { isSubmitting } = useFormikContext();
|
const { isSubmitting } = useFormikContext();
|
||||||
|
@ -259,7 +224,7 @@ export default function ServerSettingsContainer2 ({ server }: { server: Server }
|
||||||
<div css={tw`grid grid-cols-1 md:grid-cols-2 gap-y-6 gap-x-8 mb-16`}>
|
<div css={tw`grid grid-cols-1 md:grid-cols-2 gap-y-6 gap-x-8 mb-16`}>
|
||||||
<div css={tw`grid grid-cols-1 gap-y-6`}>
|
<div css={tw`grid grid-cols-1 gap-y-6`}>
|
||||||
<BaseSettingsBox/>
|
<BaseSettingsBox/>
|
||||||
<ServerFeatureContainer/>
|
<FeatureLimitsBox/>
|
||||||
<ServerAllocationsContainer server={server}/>
|
<ServerAllocationsContainer server={server}/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,42 @@
|
||||||
|
import React from 'react';
|
||||||
|
import { useFormikContext } from 'formik';
|
||||||
|
import AdminBox from '@/components/admin/AdminBox';
|
||||||
|
import { faConciergeBell } from '@fortawesome/free-solid-svg-icons';
|
||||||
|
import tw from 'twin.macro';
|
||||||
|
import Field from '@/components/elements/Field';
|
||||||
|
import getServerDetails from '@/api/swr/admin/getServerDetails';
|
||||||
|
|
||||||
|
export default () => {
|
||||||
|
const { data: server } = getServerDetails();
|
||||||
|
const { isSubmitting } = useFormikContext();
|
||||||
|
|
||||||
|
if (!server) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<AdminBox icon={faConciergeBell} title={'Feature Limits'} isLoading={isSubmitting}>
|
||||||
|
<div css={tw`grid grid-cols-1 xl:grid-cols-2 gap-4 lg:gap-6`}>
|
||||||
|
<Field
|
||||||
|
id={'featureLimits.allocations'}
|
||||||
|
name={'featureLimits.allocations'}
|
||||||
|
label={'Allocation Limit'}
|
||||||
|
type={'number'}
|
||||||
|
description={'The total number of allocations a user is allowed to create for this server.'}
|
||||||
|
/>
|
||||||
|
<Field
|
||||||
|
id={'featureLimits.backups'}
|
||||||
|
name={'featureLimits.backups'}
|
||||||
|
label={'Backup Limit'}
|
||||||
|
type={'number'}
|
||||||
|
description={'The total number of backups that can be created for this server.'}
|
||||||
|
/>
|
||||||
|
<Field
|
||||||
|
id={'featureLimits.databases'}
|
||||||
|
name={'featureLimits.databases'}
|
||||||
|
label={'Database Limit'}
|
||||||
|
type={'number'}
|
||||||
|
description={'The total number of databases a user is allowed to create for this server.'}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</AdminBox>
|
||||||
|
);
|
||||||
|
};
|
Loading…
Reference in a new issue