Skynet/misc_pterodactyl-panel
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

React 18 and Vite (#4510)

Browse source
This commit is contained in:
Matthew Penner 2022-11-25 13:25:03 -07:00 • committed by GitHub
parent 1bb1b13f6d
commit 21613fa602
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
244 changed files with 4547 additions and 8933 deletions
Download patch file Download diff file Expand all files Collapse all files

14
resources/scripts/components/server/features/Features.tsx
View file

@ -1,21 +1,23 @@
import React, { useMemo } from 'react';
import type { ComponentType } from 'react';
import { Suspense, useMemo } from 'react';
import features from './index';
import { getObjectKeys } from '@/lib/objects';
type ListItems = [string, React.ComponentType][];
type ListItems = [string, ComponentType][];
export default ({ enabled }: { enabled: string[] }) => {
const mapped: ListItems = useMemo(() => {
return getObjectKeys(features)
.filter((key) => enabled.map((v) => v.toLowerCase()).includes(key.toLowerCase()))
.reduce((arr, key) => [...arr, [key, features[key]]], [] as ListItems);
.filter(key => enabled.map(v => v.toLowerCase()).includes(key.toLowerCase()))
.reduce((arr, key) => [...arr, [key, features[key]]] as ListItems, [] as ListItems);
}, [enabled]);
return (
<React.Suspense fallback={null}>
<Suspense fallback={null}>
{mapped.map(([key, Component]) => (
<Component key={key} />
))}
</React.Suspense>
</Suspense>
);
};

12
resources/scripts/components/server/features/GSLTokenModalFeature.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import { useEffect, useState } from 'react';
import { ServerContext } from '@/state/server';
import Modal from '@/components/elements/Modal';
import tw from 'twin.macro';
@ -18,10 +18,10 @@ const GSLTokenModalFeature = () => {
const [visible, setVisible] = useState(false);
const [loading, setLoading] = useState(false);
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
const status = ServerContext.useStoreState((state) => state.status.value);
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const status = ServerContext.useStoreState(state => state.status.value);
const { clearFlashes, clearAndAddHttpError } = useFlash();
const { connected, instance } = ServerContext.useStoreState((state) => state.socket);
const { connected, instance } = ServerContext.useStoreState(state => state.socket);
useEffect(() => {
if (!connected || !instance || status === 'running') return;
@ -29,7 +29,7 @@ const GSLTokenModalFeature = () => {
const errors = ['(gsl token expired)', '(account not found)'];
const listener = (line: string) => {
if (errors.some((p) => line.toLowerCase().includes(p))) {
if (errors.some(p => line.toLowerCase().includes(p))) {
setVisible(true);
}
};
@ -54,7 +54,7 @@ const GSLTokenModalFeature = () => {
setLoading(false);
setVisible(false);
})
.catch((error) => {
.catch(error => {
console.error(error);
clearAndAddHttpError({ key: 'feature:gslToken', error });
})

22
resources/scripts/components/server/features/JavaVersionModalFeature.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import { useEffect, useState } from 'react';
import { ServerContext } from '@/state/server';
import Modal from '@/components/elements/Modal';
import tw from 'twin.macro';
@ -26,25 +26,25 @@ const JavaVersionModalFeature = () => {
const [loading, setLoading] = useState(false);
const [selectedVersion, setSelectedVersion] = useState('');
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
const status = ServerContext.useStoreState((state) => state.status.value);
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const status = ServerContext.useStoreState(state => state.status.value);
const { clearFlashes, clearAndAddHttpError } = useFlash();
const { instance } = ServerContext.useStoreState((state) => state.socket);
const { instance } = ServerContext.useStoreState(state => state.socket);
const { data, isValidating, mutate } = getServerStartup(uuid, null, { revalidateOnMount: false });
const { data, isValidating, mutate } = getServerStartup(uuid, undefined, { revalidateOnMount: false });
useEffect(() => {
if (!visible) return;
mutate().then((value) => {
mutate().then(value => {
setSelectedVersion(Object.values(value?.dockerImages || [])[0] || '');
});
}, [visible]);
useWebsocketEvent(SocketEvent.CONSOLE_OUTPUT, (data) => {
useWebsocketEvent(SocketEvent.CONSOLE_OUTPUT, data => {
if (status === 'running') return;
if (MATCH_ERRORS.some((p) => data.toLowerCase().includes(p.toLowerCase()))) {
if (MATCH_ERRORS.some(p => data.toLowerCase().includes(p.toLowerCase()))) {
setVisible(true);
}
});
@ -60,7 +60,7 @@ const JavaVersionModalFeature = () => {
}
setVisible(false);
})
.catch((error) => clearAndAddHttpError({ key: 'feature:javaVersion', error }))
.catch(error => clearAndAddHttpError({ key: 'feature:javaVersion', error }))
.then(() => setLoading(false));
};
@ -86,11 +86,11 @@ const JavaVersionModalFeature = () => {
<Can action={'startup.docker-image'}>
<div css={tw`mt-4`}>
<InputSpinner visible={!data || isValidating}>
<Select disabled={!data} onChange={(e) => setSelectedVersion(e.target.value)}>
<Select disabled={!data} onChange={e => setSelectedVersion(e.target.value)}>
{!data ? (
<option disabled />
) : (
Object.keys(data.dockerImages).map((key) => (
Object.keys(data.dockerImages).map(key => (
<option key={key} value={data.dockerImages[key]}>
{key}
</option>

10
resources/scripts/components/server/features/PIDLimitModalFeature.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import { useEffect, useState } from 'react';
import { ServerContext } from '@/state/server';
import Modal from '@/components/elements/Modal';
import tw from 'twin.macro';
@ -14,10 +14,10 @@ const PIDLimitModalFeature = () => {
const [visible, setVisible] = useState(false);
const [loading] = useState(false);
const status = ServerContext.useStoreState((state) => state.status.value);
const status = ServerContext.useStoreState(state => state.status.value);
const { clearFlashes } = useFlash();
const { connected, instance } = ServerContext.useStoreState((state) => state.socket);
const isAdmin = useStoreState((state) => state.user.data!.rootAdmin);
const { connected, instance } = ServerContext.useStoreState(state => state.socket);
const isAdmin = useStoreState(state => state.user.data!.rootAdmin);
useEffect(() => {
if (!connected || !instance || status === 'running') return;
@ -32,7 +32,7 @@ const PIDLimitModalFeature = () => {
];
const listener = (line: string) => {
if (errors.some((p) => line.toLowerCase().includes(p))) {
if (errors.some(p => line.toLowerCase().includes(p))) {
setVisible(true);
}
};

10
resources/scripts/components/server/features/SteamDiskSpaceFeature.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import { useEffect, useState } from 'react';
import { ServerContext } from '@/state/server';
import Modal from '@/components/elements/Modal';
import tw from 'twin.macro';
@ -12,10 +12,10 @@ const SteamDiskSpaceFeature = () => {
const [visible, setVisible] = useState(false);
const [loading] = useState(false);
const status = ServerContext.useStoreState((state) => state.status.value);
const status = ServerContext.useStoreState(state => state.status.value);
const { clearFlashes } = useFlash();
const { connected, instance } = ServerContext.useStoreState((state) => state.socket);
const isAdmin = useStoreState((state) => state.user.data!.rootAdmin);
const { connected, instance } = ServerContext.useStoreState(state => state.socket);
const isAdmin = useStoreState(state => state.user.data!.rootAdmin);
useEffect(() => {
if (!connected || !instance || status === 'running') return;
@ -23,7 +23,7 @@ const SteamDiskSpaceFeature = () => {
const errors = ['steamcmd needs 250mb of free disk space to update', '0x202 after update job'];
const listener = (line: string) => {
if (errors.some((p) => line.toLowerCase().includes(p))) {
if (errors.some(p => line.toLowerCase().includes(p))) {
setVisible(true);
}
};

12
resources/scripts/components/server/features/eula/EulaModalFeature.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import { useEffect, useState } from 'react';
import { ServerContext } from '@/state/server';
import Modal from '@/components/elements/Modal';
import tw from 'twin.macro';
@ -12,10 +12,10 @@ const EulaModalFeature = () => {
const [visible, setVisible] = useState(false);
const [loading, setLoading] = useState(false);
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
const status = ServerContext.useStoreState((state) => state.status.value);
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const status = ServerContext.useStoreState(state => state.status.value);
const { clearFlashes, clearAndAddHttpError } = useFlash();
const { connected, instance } = ServerContext.useStoreState((state) => state.socket);
const { connected, instance } = ServerContext.useStoreState(state => state.socket);
useEffect(() => {
if (!connected || !instance || status === 'running') return;
@ -46,7 +46,7 @@ const EulaModalFeature = () => {
setLoading(false);
setVisible(false);
})
.catch((error) => {
.catch(error => {
console.error(error);
clearAndAddHttpError({ key: 'feature:eula', error });
})
@ -72,7 +72,7 @@ const EulaModalFeature = () => {
target={'_blank'}
css={tw`text-primary-300 underline transition-colors duration-150 hover:text-primary-400`}
rel={'noreferrer noopener'}
href='https://account.mojang.com/documents/minecraft_eula'
href="https://account.mojang.com/documents/minecraft_eula"
>
Minecraft&reg; EULA
</a>