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

23
resources/scripts/components/server/startup/StartupContainer.tsx
View file

@ -1,4 +1,5 @@
import React, { useCallback, useEffect, useState } from 'react';
import { useCallback, useEffect, useState } from 'react';
import * as React from 'react';
import TitledGreyBox from '@/components/elements/TitledGreyBox';
import tw from 'twin.macro';
import VariableBox from '@/components/server/startup/VariableBox';
@ -20,14 +21,14 @@ const StartupContainer = () => {
const [loading, setLoading] = useState(false);
const { clearFlashes, clearAndAddHttpError } = useFlash();
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const variables = ServerContext.useStoreState(
({ server }) => ({
variables: server.data!.variables,
invocation: server.data!.invocation,
dockerImage: server.data!.dockerImage,
}),
isEqual
isEqual,
);
const { data, error, isValidating, mutate } = getServerStartup(uuid, {
@ -35,11 +36,11 @@ const StartupContainer = () => {
dockerImages: { [variables.dockerImage]: variables.dockerImage },
});
const setServerFromState = ServerContext.useStoreActions((actions) => actions.server.setServerFromState);
const setServerFromState = ServerContext.useStoreActions(actions => actions.server.setServerFromState);
const isCustomImage =
data &&
!Object.values(data.dockerImages)
.map((v) => v.toLowerCase())
.map(v => v.toLowerCase())
.includes(variables.dockerImage.toLowerCase());
useEffect(() => {
@ -52,7 +53,7 @@ const StartupContainer = () => {
useDeepCompareEffect(() => {
if (!data) return;
setServerFromState((s) => ({
setServerFromState(s => ({
...s,
invocation: data.invocation,
variables: data.variables,
@ -66,14 +67,14 @@ const StartupContainer = () => {
const image = v.currentTarget.value;
setSelectedDockerImage(uuid, image)
.then(() => setServerFromState((s) => ({ ...s, dockerImage: image })))
.catch((error) => {
.then(() => setServerFromState(s => ({ ...s, dockerImage: image })))
.catch(error => {
console.error(error);
clearAndAddHttpError({ key: 'startup:image', error });
})
.then(() => setLoading(false));
},
[uuid]
[uuid],
);
return !data ? (
@ -99,7 +100,7 @@ const StartupContainer = () => {
onChange={updateSelectedDockerImage}
defaultValue={variables.dockerImage}
>
{Object.keys(data.dockerImages).map((key) => (
{Object.keys(data.dockerImages).map(key => (
<option key={data.dockerImages[key]} value={data.dockerImages[key]}>
{key}
</option>
@ -126,7 +127,7 @@ const StartupContainer = () => {
</div>
<h3 css={tw`mt-8 mb-2 text-2xl`}>Variables</h3>
<div css={tw`grid gap-8 md:grid-cols-2`}>
{data.variables.map((variable) => (
{data.variables.map(variable => (
<VariableBox key={variable.envVariable} variable={variable} />
))}
</div>

32
resources/scripts/components/server/startup/VariableBox.tsx
View file

@ -1,4 +1,4 @@
import React, { memo, useState } from 'react';
import { memo, useState } from 'react';
import { ServerEggVariable } from '@/api/server/types';
import TitledGreyBox from '@/components/elements/TitledGreyBox';
import { usePermissions } from '@/plugins/usePermissions';
@ -22,7 +22,7 @@ interface Props {
const VariableBox = ({ variable }: Props) => {
const FLASH_KEY = `server:startup:${variable.envVariable}`;
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const [loading, setLoading] = useState(false);
const [canEdit] = usePermissions(['startup.update']);
const { clearFlashes, clearAndAddHttpError } = useFlash();
@ -35,28 +35,28 @@ const VariableBox = ({ variable }: Props) => {
updateStartupVariable(uuid, variable.envVariable, value)
.then(([response, invocation]) =>
mutate(
(data) => ({
...data,
data => ({
...data!,
invocation,
variables: (data.variables || []).map((v) =>
v.envVariable === response.envVariable ? response : v
variables: (data!.variables || []).map(v =>
v.envVariable === response.envVariable ? response : v,
),
}),
false
)
false,
),
)
.catch((error) => {
.catch(error => {
console.error(error);
clearAndAddHttpError({ error, key: FLASH_KEY });
clearAndAddHttpError({ key: FLASH_KEY, error });
})
.then(() => setLoading(false));
}, 500);
const useSwitch = variable.rules.some(
(v) => v === 'boolean' || v === 'in:0,1' || v === 'in:1,0' || v === 'in:true,false' || v === 'in:false,true'
v => v === 'boolean' || v === 'in:0,1' || v === 'in:1,0' || v === 'in:true,false' || v === 'in:false,true',
);
const isStringSwitch = variable.rules.some((v) => v === 'string');
const selectValues = variable.rules.find((v) => v.startsWith('in:'))?.split(',') || [];
const isStringSwitch = variable.rules.some(v => v === 'string');
const selectValues = variable.rules.find(v => v.startsWith('in:'))?.split(',') || [];
return (
<TitledGreyBox
@ -95,12 +95,12 @@ const VariableBox = ({ variable }: Props) => {
{selectValues.length > 0 ? (
<>
<Select
onChange={(e) => setVariableValue(e.target.value)}
onChange={e => setVariableValue(e.target.value)}
name={variable.envVariable}
defaultValue={variable.serverValue}
disabled={!canEdit || !variable.isEditable}
>
{selectValues.map((selectValue) => (
{selectValues.map(selectValue => (
<option
key={selectValue.replace('in:', '')}
value={selectValue.replace('in:', '')}
@ -113,7 +113,7 @@ const VariableBox = ({ variable }: Props) => {
) : (
<>
<Input
onKeyUp={(e) => {
onKeyUp={e => {
if (canEdit && variable.isEditable) {
setVariableValue(e.currentTarget.value);
}