ui(admin): fix server editing

This commit is contained in:
Matthew Penner 2023-01-12 12:25:58 -07:00
parent 216c464ac8
commit 9cdbbc3a00
No known key found for this signature in database
8 changed files with 43 additions and 30 deletions

View file

@ -73,7 +73,7 @@ class ServerTransformer extends Transformer
'backups' => $model->backup_limit,
'databases' => $model->database_limit,
],
'user_id' => $model->owner_id,
'owner_id' => $model->owner_id,
'node_id' => $model->node_id,
'allocation_id' => $model->allocation_id,
'nest_id' => $model->nest_id,

View file

@ -37,7 +37,7 @@ export interface Server extends Model {
name: string;
description: string;
status: string;
userId: number;
ownerId: number;
nodeId: number;
allocationId: number;
eggId: number;

View file

@ -9,10 +9,26 @@ import { Nest } from '@/api/admin/nest';
const isList = (data: FractalResponseList | FractalResponseData): data is FractalResponseList => data.object === 'list';
function transform<T, M = undefined> (data: undefined, transformer: (callback: FractalResponseData) => T, missing?: M): undefined;
function transform<T, M> (data: FractalResponseData | undefined, transformer: (callback: FractalResponseData) => T, missing?: M): T | M | undefined;
function transform<T, M> (data: FractalResponseList | undefined, transformer: (callback: FractalResponseData) => T, missing?: M): T[] | undefined;
function transform<T> (data: FractalResponseData | FractalResponseList | undefined, transformer: (callback: FractalResponseData) => T, missing = undefined) {
function transform<T, M = undefined>(
data: undefined,
transformer: (callback: FractalResponseData) => T,
missing?: M,
): undefined;
function transform<T, M>(
data: FractalResponseData | undefined,
transformer: (callback: FractalResponseData) => T,
missing?: M,
): T | M | undefined;
function transform<T, M>(
data: FractalResponseList | undefined,
transformer: (callback: FractalResponseData) => T,
missing?: M,
): T[] | undefined;
function transform<T>(
data: FractalResponseData | FractalResponseList | undefined,
transformer: (callback: FractalResponseData) => T,
missing = undefined,
) {
if (data === undefined) return undefined;
if (isList(data)) {
@ -35,7 +51,7 @@ export default class Transformers {
name: attributes.name,
description: attributes.description,
status: attributes.status,
userId: attributes.owner_id,
ownerId: attributes.owner_id,
nodeId: attributes.node_id,
allocationId: attributes.allocation_id,
eggId: attributes.egg_id,
@ -190,7 +206,7 @@ export default class Transformers {
node: transform(attributes.relationships?.node as FractalResponseData, this.toNode),
server: transform(attributes.relationships?.server as FractalResponseData, this.toServer),
},
getDisplayText (): string {
getDisplayText(): string {
const raw = `${this.ip}:${this.port}`;
return !this.alias ? raw : `${this.alias} (${raw})`;

View file

@ -50,7 +50,7 @@ function InternalForm() {
setFieldValue('eggId', egg.id);
setFieldValue('startup', '');
setFieldValue('image', egg.dockerImages.length > 0 ? egg.dockerImages[0] : '');
setFieldValue('image', Object.values(egg.dockerImages)[0] ?? '');
}, [egg]);
useEffect(() => {

View file

@ -16,6 +16,7 @@ export default ({ selected }: { selected?: User }) => {
};
const onSelect = (user: User | null) => {
console.log(user);
setUser(user);
setFieldValue('ownerId', user?.id || null);
};

View file

@ -3,9 +3,8 @@ import type { Actions } from 'easy-peasy';
import { useStoreActions } from 'easy-peasy';
import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import tw from 'twin.macro';
import Button from '@/components/elements/Button';
import { Button } from '@/components/elements/button';
import ConfirmationModal from '@/components/elements/ConfirmationModal';
import deleteServer from '@/api/admin/servers/deleteServer';
import { useServerFromRoute } from '@/api/admin/server';
@ -52,15 +51,10 @@ export default () => {
>
Are you sure you want to delete this server?
</ConfirmationModal>
<Button
type={'button'}
size={'small'}
color={'red'}
onClick={() => setVisible(true)}
css={tw`flex items-center justify-center`}
>
<TrashIcon css={tw`w-5 h-5 mr-2`} /> Delete Server
</Button>
<Button.Danger type="button" onClick={() => setVisible(true)} className="flex items-center justify-center">
<TrashIcon className="mr-2 h-5 w-5" /> Delete Server
</Button.Danger>
</>
);
};

View file

@ -12,7 +12,7 @@ import BaseSettingsBox from '@/components/admin/servers/settings/BaseSettingsBox
import FeatureLimitsBox from '@/components/admin/servers/settings/FeatureLimitsBox';
import NetworkingBox from '@/components/admin/servers/settings/NetworkingBox';
import ServerResourceBox from '@/components/admin/servers/settings/ServerResourceBox';
import Button from '@/components/elements/Button';
import { Button } from '@/components/elements/button';
export default () => {
const { data: server } = useServerFromRoute();
@ -27,6 +27,8 @@ export default () => {
// OOM Killer is enabled, rather than when disabled.
values.limits.oomDisabled = !values.limits.oomDisabled;
console.log(values);
updateServer(server.id, values)
.then(() => {
// setServer({ ...server, ...s });
@ -48,7 +50,7 @@ export default () => {
initialValues={{
externalId: server.externalId || '',
name: server.name,
ownerId: server.userId,
ownerId: server.ownerId,
limits: {
memory: server.limits.memory,
swap: server.limits.swap,
@ -79,17 +81,15 @@ export default () => {
<FeatureLimitsBox />
<NetworkingBox />
</div>
<div css={tw`flex flex-col`}>
<ServerResourceBox />
<div css={tw`bg-neutral-700 rounded shadow-md px-4 xl:px-5 py-4 mt-6`}>
<div css={tw`flex flex-row`}>
<ServerDeleteButton />
<Button
type="submit"
size="small"
css={tw`ml-auto`}
disabled={isSubmitting || !isValid}
>
<Button type="submit" className="ml-auto" disabled={isSubmitting || !isValid}>
Save Changes
</Button>
</div>

View file

@ -33,13 +33,14 @@ function ServerStartupLineContainer({ egg, server }: { egg: Egg | null; server:
}
if (server.eggId === egg.id) {
console.log(server.container);
setFieldValue('image', server.container.image);
setFieldValue('startup', server.container.startup || '');
return;
}
// Whenever the egg is changed, set the server's startup command to the egg's default.
setFieldValue('image', egg.dockerImages.length > 0 ? egg.dockerImages[0] : '');
setFieldValue('image', Object.values(egg.dockerImages)[0] ?? '');
setFieldValue('startup', '');
}, [egg]);
@ -105,6 +106,7 @@ export function ServerImageContainer() {
<div css={tw`md:w-full md:flex md:flex-col`}>
<div>
{/* TODO: make this a proper select but allow a custom image to be specified if needed. */}
<Field id={'image'} name={'image'} label={'Docker Image'} type={'text'} />
</div>
</div>
@ -249,7 +251,7 @@ export default () => {
>
<ServerStartupForm
egg={egg}
// @ts-ignore
// @ts-expect-error fix this
setEgg={setEgg}
server={server}
/>