Apply new eslint rules; default to prettier for styling

This commit is contained in:
DaneEveritt 2022-06-26 15:13:52 -04:00
parent f22cce8881
commit dc84af9937
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
218 changed files with 3876 additions and 3564 deletions

View file

@ -14,11 +14,11 @@ import isEqual from 'react-fast-compare';
import { useDeepCompareEffect } from '@/plugins/useDeepCompareEffect';
const NetworkContainer = () => {
const [ loading, setLoading ] = useState(false);
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const allocationLimit = ServerContext.useStoreState(state => state.server.data!.featureLimits.allocations);
const allocations = ServerContext.useStoreState(state => state.server.data!.allocations, isEqual);
const setServerFromState = ServerContext.useStoreActions(actions => actions.server.setServerFromState);
const [loading, setLoading] = useState(false);
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
const allocationLimit = ServerContext.useStoreState((state) => state.server.data!.featureLimits.allocations);
const allocations = ServerContext.useStoreState((state) => state.server.data!.allocations, isEqual);
const setServerFromState = ServerContext.useStoreActions((actions) => actions.server.setServerFromState);
const { clearFlashes, clearAndAddHttpError } = useFlashKey('server:network');
const { data, error, mutate } = getServerAllocations();
@ -29,59 +29,54 @@ const NetworkContainer = () => {
useEffect(() => {
clearAndAddHttpError(error);
}, [ error ]);
}, [error]);
useDeepCompareEffect(() => {
if (!data) return;
setServerFromState(state => ({ ...state, allocations: data }));
}, [ data ]);
setServerFromState((state) => ({ ...state, allocations: data }));
}, [data]);
const onCreateAllocation = () => {
clearFlashes();
setLoading(true);
createServerAllocation(uuid)
.then(allocation => {
setServerFromState(s => ({ ...s, allocations: s.allocations.concat(allocation) }));
.then((allocation) => {
setServerFromState((s) => ({ ...s, allocations: s.allocations.concat(allocation) }));
return mutate(data?.concat(allocation), false);
})
.catch(error => clearAndAddHttpError(error))
.catch((error) => clearAndAddHttpError(error))
.then(() => setLoading(false));
};
return (
<ServerContentBlock showFlashKey={'server:network'} title={'Network'}>
{!data ?
<Spinner size={'large'} centered/>
:
{!data ? (
<Spinner size={'large'} centered />
) : (
<>
{
data.map(allocation => (
<AllocationRow
key={`${allocation.ip}:${allocation.port}`}
allocation={allocation}
/>
))
}
{allocationLimit > 0 &&
{data.map((allocation) => (
<AllocationRow key={`${allocation.ip}:${allocation.port}`} allocation={allocation} />
))}
{allocationLimit > 0 && (
<Can action={'allocation.create'}>
<SpinnerOverlay visible={loading}/>
<SpinnerOverlay visible={loading} />
<div css={tw`mt-6 sm:flex items-center justify-end`}>
<p css={tw`text-sm text-neutral-300 mb-4 sm:mr-6 sm:mb-0`}>
You are currently using {data.length} of {allocationLimit} allowed allocations for
this server.
</p>
{allocationLimit > data.length &&
{allocationLimit > data.length && (
<Button css={tw`w-full sm:w-auto`} color={'primary'} onClick={onCreateAllocation}>
Create Allocation
</Button>
}
)}
</div>
</Can>
}
)}
</>
}
)}
</ServerContentBlock>
);
};