misc_pterodactyl-panel/resources/scripts/components/admin/nodes/NodeLimitContainer.tsx
2021-09-12 21:22:33 -06:00

57 lines
2 KiB
TypeScript

import { faMicrochip } from '@fortawesome/free-solid-svg-icons';
import React from 'react';
import AdminBox from '@/components/admin/AdminBox';
import tw from 'twin.macro';
import Field from '@/components/elements/Field';
import SpinnerOverlay from '@/components/elements/SpinnerOverlay';
import { useFormikContext } from 'formik';
export default () => {
const { isSubmitting } = useFormikContext();
return (
<AdminBox icon={faMicrochip} title={'Limits'} css={tw`w-full relative`}>
<SpinnerOverlay visible={isSubmitting}/>
<div css={tw`md:w-full md:flex md:flex-row mb-6`}>
<div css={tw`md:w-full md:flex md:flex-col md:mr-4 mb-6 md:mb-0`}>
<Field
id={'memory'}
name={'memory'}
label={'Memory'}
type={'number'}
/>
</div>
<div css={tw`md:w-full md:flex md:flex-col md:ml-4 mb-6 md:mb-0`}>
<Field
id={'memoryOverallocate'}
name={'memoryOverallocate'}
label={'Memory Overallocate'}
type={'number'}
/>
</div>
</div>
<div css={tw`md:w-full md:flex md:flex-row mb-6`}>
<div css={tw`md:w-full md:flex md:flex-col md:mr-4 mb-6 md:mb-0`}>
<Field
id={'disk'}
name={'disk'}
label={'Disk'}
type={'number'}
/>
</div>
<div css={tw`md:w-full md:flex md:flex-col md:ml-4 mb-6 md:mb-0`}>
<Field
id={'diskOverallocate'}
name={'diskOverallocate'}
label={'Disk Overallocate'}
type={'number'}
/>
</div>
</div>
</AdminBox>
);
};