Support deleting an allocation for a server
This commit is contained in:
parent
365f5e0806
commit
b2be067f38
8 changed files with 94 additions and 35 deletions
|
@ -138,18 +138,19 @@ class NetworkAllocationController extends ClientApiController
|
|||
* @return \Illuminate\Http\JsonResponse
|
||||
*
|
||||
* @throws \Pterodactyl\Exceptions\DisplayException
|
||||
* @throws \Pterodactyl\Exceptions\Model\DataValidationException
|
||||
* @throws \Pterodactyl\Exceptions\Repository\RecordNotFoundException
|
||||
*/
|
||||
public function delete(DeleteAllocationRequest $request, Server $server, Allocation $allocation)
|
||||
{
|
||||
if ($allocation->id === $server->allocation_id) {
|
||||
throw new DisplayException(
|
||||
'Cannot delete the primary allocation for a server.'
|
||||
'You cannot delete the primary allocation for this server.'
|
||||
);
|
||||
}
|
||||
|
||||
$this->repository->update($allocation->id, ['server_id' => null, 'notes' => null]);
|
||||
Allocation::query()->where('id', $allocation->id)->update([
|
||||
'notes' => null,
|
||||
'server_id' => null,
|
||||
]);
|
||||
|
||||
return new JsonResponse([], JsonResponse::HTTP_NO_CONTENT);
|
||||
}
|
||||
|
|
|
@ -108,7 +108,6 @@ class FindAssignableAllocationService
|
|||
throw new NoAutoAllocationSpaceAvailableException;
|
||||
}
|
||||
|
||||
// dd($available, array_rand($available));
|
||||
// Pick a random port out of the remaining available ports.
|
||||
/** @var int $port */
|
||||
$port = $available[array_rand($available)];
|
||||
|
|
|
@ -1,9 +0,0 @@
|
|||
import http from '@/api/http';
|
||||
import { rawDataToServerAllocation } from '@/api/transformers';
|
||||
import { Allocation } from '@/api/server/getServer';
|
||||
|
||||
export default async (uuid: string): Promise<Allocation[]> => {
|
||||
const { data } = await http.get(`/api/client/servers/${uuid}/network/allocations`);
|
||||
|
||||
return (data.data || []).map(rawDataToServerAllocation);
|
||||
};
|
15
resources/scripts/api/swr/getServerAllocations.ts
Normal file
15
resources/scripts/api/swr/getServerAllocations.ts
Normal file
|
@ -0,0 +1,15 @@
|
|||
import { ServerContext } from '@/state/server';
|
||||
import useSWR from 'swr';
|
||||
import http from '@/api/http';
|
||||
import { rawDataToServerAllocation } from '@/api/transformers';
|
||||
import { Allocation } from '@/api/server/getServer';
|
||||
|
||||
export default (initialData?: Allocation[]) => {
|
||||
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
|
||||
|
||||
return useSWR<Allocation[]>([ 'server:allocations', uuid ], async () => {
|
||||
const { data } = await http.get(`/api/client/servers/${uuid}/network/allocations`);
|
||||
|
||||
return (data.data || []).map(rawDataToServerAllocation);
|
||||
}, { initialData, revalidateOnFocus: false });
|
||||
};
|
|
@ -20,7 +20,7 @@ const ConfirmationModal = ({ title, children, buttonText, onConfirmed }: Props)
|
|||
<h2 css={tw`text-2xl mb-6`}>{title}</h2>
|
||||
<p css={tw`text-sm`}>{children}</p>
|
||||
<div css={tw`flex flex-wrap items-center justify-end mt-8`}>
|
||||
<Button isSecondary onClick={() => dismiss()} css={tw`w-full sm:w-auto`}>
|
||||
<Button isSecondary onClick={() => dismiss()} css={tw`w-full sm:w-auto border-transparent`}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button color={'red'} css={tw`w-full sm:w-auto mt-4 sm:mt-0 sm:ml-4`} onClick={() => onConfirmed()}>
|
||||
|
|
|
@ -15,6 +15,7 @@ import setServerAllocationNotes from '@/api/server/network/setServerAllocationNo
|
|||
import useFlash from '@/plugins/useFlash';
|
||||
import { ServerContext } from '@/state/server';
|
||||
import CopyOnClick from '@/components/elements/CopyOnClick';
|
||||
import DeleteAllocationButton from '@/components/server/network/DeleteAllocationButton';
|
||||
|
||||
const Code = styled.code`${tw`font-mono py-1 px-2 bg-neutral-900 rounded text-sm inline-block`}`;
|
||||
const Label = styled.label`${tw`uppercase text-xs mt-1 text-neutral-400 block px-1 select-none transition-colors duration-150`}`;
|
||||
|
@ -44,10 +45,11 @@ const AllocationRow = ({ allocation, onSetPrimary, onNotesChanged }: Props) => {
|
|||
<GreyRowBox $hoverable={false} css={tw`flex-wrap md:flex-no-wrap mt-2`}>
|
||||
<div css={tw`flex items-center w-full md:w-auto`}>
|
||||
<div css={tw`pl-4 pr-6 text-neutral-400`}>
|
||||
<FontAwesomeIcon icon={faNetworkWired} />
|
||||
<FontAwesomeIcon icon={faNetworkWired}/>
|
||||
</div>
|
||||
<div css={tw`mr-4 flex-1 md:w-40`}>
|
||||
{allocation.alias ? <CopyOnClick text={allocation.alias}><Code css={tw`w-40 truncate`}>{allocation.alias}</Code></CopyOnClick> :
|
||||
{allocation.alias ?
|
||||
<CopyOnClick text={allocation.alias}><Code css={tw`w-40 truncate`}>{allocation.alias}</Code></CopyOnClick> :
|
||||
<CopyOnClick text={allocation.ip}><Code>{allocation.ip}</Code></CopyOnClick>}
|
||||
<Label>{allocation.alias ? 'Hostname' : 'IP Address'}</Label>
|
||||
</div>
|
||||
|
@ -66,20 +68,25 @@ const AllocationRow = ({ allocation, onSetPrimary, onNotesChanged }: Props) => {
|
|||
/>
|
||||
</InputSpinner>
|
||||
</div>
|
||||
<div css={tw`w-full md:flex-none md:w-32 md:text-center mt-4 md:mt-0 text-right ml-4`}>
|
||||
<div css={tw`w-full md:flex-none md:w-40 md:text-center mt-4 md:mt-0 ml-4 flex items-center justify-end`}>
|
||||
{allocation.isDefault ?
|
||||
<span css={tw`bg-green-500 py-1 px-2 rounded text-green-50 text-xs`}>Primary</span>
|
||||
:
|
||||
<Can action={'allocations.update'}>
|
||||
<Button
|
||||
isSecondary
|
||||
size={'xsmall'}
|
||||
color={'primary'}
|
||||
onClick={() => onSetPrimary(allocation.id)}
|
||||
>
|
||||
Make Primary
|
||||
</Button>
|
||||
</Can>
|
||||
<>
|
||||
<Can action={'allocations.delete'}>
|
||||
<DeleteAllocationButton allocation={allocation.id}/>
|
||||
</Can>
|
||||
<Can action={'allocations.update'}>
|
||||
<Button
|
||||
isSecondary
|
||||
size={'xsmall'}
|
||||
color={'primary'}
|
||||
onClick={() => onSetPrimary(allocation.id)}
|
||||
>
|
||||
Make Primary
|
||||
</Button>
|
||||
</Can>
|
||||
</>
|
||||
}
|
||||
</div>
|
||||
</GreyRowBox>
|
||||
|
|
|
@ -0,0 +1,51 @@
|
|||
import React, { useState } from 'react';
|
||||
import { faTrashAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import tw from 'twin.macro';
|
||||
import Icon from '@/components/elements/Icon';
|
||||
import ConfirmationModal from '@/components/elements/ConfirmationModal';
|
||||
import { ServerContext } from '@/state/server';
|
||||
import deleteServerAllocation from '@/api/server/network/deleteServerAllocation';
|
||||
import getServerAllocations from '@/api/swr/getServerAllocations';
|
||||
import useFlash from '@/plugins/useFlash';
|
||||
|
||||
interface Props {
|
||||
allocation: number;
|
||||
}
|
||||
|
||||
const DeleteAllocationButton = ({ allocation }: Props) => {
|
||||
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
|
||||
const [ confirm, setConfirm ] = useState(false);
|
||||
const { mutate } = getServerAllocations();
|
||||
const { clearFlashes, clearAndAddHttpError } = useFlash();
|
||||
|
||||
const deleteAllocation = () => {
|
||||
clearFlashes('server:network');
|
||||
|
||||
mutate(data => data?.filter(a => a.id !== allocation), false);
|
||||
deleteServerAllocation(uuid, allocation)
|
||||
.catch(error => clearAndAddHttpError({ key: 'server:network', error }));
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<ConfirmationModal
|
||||
visible={confirm}
|
||||
title={'Remove this allocation?'}
|
||||
buttonText={'Delete'}
|
||||
onConfirmed={deleteAllocation}
|
||||
onModalDismissed={() => setConfirm(false)}
|
||||
>
|
||||
This allocation will be immediately removed from your server. Are you sure you want to continue?
|
||||
</ConfirmationModal>
|
||||
<button
|
||||
css={tw`text-neutral-400 px-2 py-1 mr-2 transition-colors duration-150 hover:text-red-400`}
|
||||
type={'button'}
|
||||
onClick={() => setConfirm(true)}
|
||||
>
|
||||
<Icon icon={faTrashAlt} css={tw`w-3 h-auto`}/>
|
||||
</button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default DeleteAllocationButton;
|
|
@ -1,7 +1,4 @@
|
|||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import useSWR from 'swr';
|
||||
import getServerAllocations from '@/api/server/network/getServerAllocations';
|
||||
import { Allocation } from '@/api/server/getServer';
|
||||
import Spinner from '@/components/elements/Spinner';
|
||||
import useFlash from '@/plugins/useFlash';
|
||||
import ServerContentBlock from '@/components/elements/ServerContentBlock';
|
||||
|
@ -14,6 +11,7 @@ import createServerAllocation from '@/api/server/network/createServerAllocation'
|
|||
import tw from 'twin.macro';
|
||||
import Can from '@/components/elements/Can';
|
||||
import SpinnerOverlay from '@/components/elements/SpinnerOverlay';
|
||||
import getServerAllocations from '@/api/swr/getServerAllocations';
|
||||
|
||||
const NetworkContainer = () => {
|
||||
const [ loading, setLoading ] = useState(false);
|
||||
|
@ -22,10 +20,7 @@ const NetworkContainer = () => {
|
|||
const allocations = useDeepMemoize(ServerContext.useStoreState(state => state.server.data!.allocations));
|
||||
|
||||
const { clearFlashes, clearAndAddHttpError } = useFlash();
|
||||
const { data, error, mutate } = useSWR<Allocation[]>(uuid, key => getServerAllocations(key), {
|
||||
initialData: allocations,
|
||||
revalidateOnFocus: false,
|
||||
});
|
||||
const { data, error, mutate } = getServerAllocations(allocations);
|
||||
|
||||
useEffect(() => {
|
||||
if (error) {
|
||||
|
|
Loading…
Reference in a new issue