From 6df2368264b81511788eedb7b3e1a6020b93b730 Mon Sep 17 00:00:00 2001 From: Matthew Penner Date: Wed, 15 Sep 2021 11:09:54 -0600 Subject: [PATCH] ui(admin): server editing improvements --- .../Application/EggVariableTransformer.php | 3 +- package.json | 12 +-- resources/scripts/api/admin/eggs/getEgg.ts | 50 ++++++++++- .../scripts/api/admin/servers/getServers.ts | 6 +- .../scripts/api/admin/servers/updateServer.ts | 2 +- .../admin/servers/ServerSettingsContainer.tsx | 89 +++++++++++-------- .../admin/servers/ServerStartupContainer.tsx | 11 ++- .../scripts/components/elements/Editor.tsx | 2 +- yarn.lock | 68 +++++++------- 9 files changed, 153 insertions(+), 90 deletions(-) diff --git a/app/Transformers/Api/Application/EggVariableTransformer.php b/app/Transformers/Api/Application/EggVariableTransformer.php index d255a633e..629f99ab5 100644 --- a/app/Transformers/Api/Application/EggVariableTransformer.php +++ b/app/Transformers/Api/Application/EggVariableTransformer.php @@ -2,7 +2,6 @@ namespace Pterodactyl\Transformers\Api\Application; -use Pterodactyl\Models\Egg; use Pterodactyl\Models\EggVariable; use Pterodactyl\Transformers\Api\Transformer; @@ -10,7 +9,7 @@ class EggVariableTransformer extends Transformer { public function getResourceName(): string { - return Egg::RESOURCE_NAME; + return EggVariable::RESOURCE_NAME; } public function transform(EggVariable $model): array diff --git a/package.json b/package.json index cad0acf62..c65eded1b 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,7 @@ "@fortawesome/free-solid-svg-icons": "^5.15.4", "@fortawesome/react-fontawesome": "^0.1.15", "@hot-loader/react-dom": "^16.14.0", - "axios": "^0.21.3", + "axios": "^0.21.4", "chart.js": "^2.9.4", "date-fns": "^2.23.0", "debounce": "^1.2.1", @@ -53,7 +53,7 @@ "feature": "link:./resources/scripts/components/server/features", "formik": "^2.2.9", "history": "^4.10.1", - "i18next": "^20.6.0", + "i18next": "^20.6.1", "i18next-chained-backend": "^3.0.2", "i18next-localstorage-backend": "^3.1.3", "i18next-xhr-backend": "^3.2.2", @@ -77,10 +77,10 @@ "styled-components-breakpoint": "^3.0.0-preview.20", "swr": "^1.0.1", "uuid": "^3.4.0", - "xterm": "^4.13.0", + "xterm": "^4.14.1", "xterm-addon-attach": "^0.6.0", "xterm-addon-fit": "^0.5.0", - "xterm-addon-search": "^0.8.0", + "xterm-addon-search": "^0.8.1", "xterm-addon-search-bar": "^0.2.0", "xterm-addon-web-links": "^0.4.0", "yup": "^0.32.9" @@ -103,7 +103,7 @@ "@types/debounce": "^1.2.0", "@types/events": "^3.0.0", "@types/history": "^4.7.9", - "@types/node": "^16.7.10", + "@types/node": "^16.9.1", "@types/qrcode.react": "^1.0.2", "@types/query-string": "^6.3.0", "@types/react": "^16.14.15", @@ -144,7 +144,7 @@ "tailwindcss": "^2.2.7", "terser-webpack-plugin": "^4.2.3", "twin.macro": "^2.7.0", - "typescript": "^4.3.5", + "typescript": "^4.4.3", "webpack": "^4.46.0", "webpack-assets-manifest": "^4.0.6", "webpack-bundle-analyzer": "^4.4.2", diff --git a/resources/scripts/api/admin/eggs/getEgg.ts b/resources/scripts/api/admin/eggs/getEgg.ts index 12d4146a3..8769335fb 100644 --- a/resources/scripts/api/admin/eggs/getEgg.ts +++ b/resources/scripts/api/admin/eggs/getEgg.ts @@ -1,4 +1,36 @@ -import http, { FractalResponseData } from '@/api/http'; +import { Nest } from '@/api/admin/nests/getNests'; +import { rawDataToServer, Server } from '@/api/admin/servers/getServers'; +import http, { FractalResponseData, FractalResponseList } from '@/api/http'; + +export interface EggVariable { + id: number; + eggId: number; + name: string; + description: string; + envVariable: string; + defaultValue: string; + userViewable: boolean; + userEditable: boolean; + rules: string; + required: boolean; + createdAt: Date; + updatedAt: Date; +} + +const rawDataToEggVariable = ({ attributes }: FractalResponseData): EggVariable => ({ + id: attributes.id, + eggId: attributes.egg_id, + name: attributes.name, + description: attributes.description, + envVariable: attributes.env_variable, + defaultValue: attributes.default_value, + userViewable: attributes.user_viewable, + userEditable: attributes.user_editable, + rules: attributes.rules, + required: attributes.required, + createdAt: new Date(attributes.created_at), + updatedAt: new Date(attributes.updated_at), +}); export interface Egg { id: number; @@ -22,6 +54,12 @@ export interface Egg { scriptInstall: string | null; createdAt: Date; updatedAt: Date; + + relations: { + nest?: Nest; + servers?: Server[]; + variables?: EggVariable[]; + }; } export const rawDataToEgg = ({ attributes }: FractalResponseData): Egg => ({ @@ -46,11 +84,17 @@ export const rawDataToEgg = ({ attributes }: FractalResponseData): Egg => ({ scriptInstall: attributes.script?.install, createdAt: new Date(attributes.created_at), updatedAt: new Date(attributes.updated_at), + + relations: { + nest: undefined, + servers: ((attributes.relationships?.servers as FractalResponseList | undefined)?.data || []).map(rawDataToServer), + variables: ((attributes.relationships?.variables as FractalResponseList | undefined)?.data || []).map(rawDataToEggVariable), + }, }); -export default (id: number): Promise => { +export default (id: number, include: string[] = []): Promise => { return new Promise((resolve, reject) => { - http.get(`/api/application/eggs/${id}`) + http.get(`/api/application/eggs/${id}`, { params: { include: include.join(',') } }) .then(({ data }) => resolve(rawDataToEgg(data))) .catch(reject); }); diff --git a/resources/scripts/api/admin/servers/getServers.ts b/resources/scripts/api/admin/servers/getServers.ts index 92c170238..747c814fc 100644 --- a/resources/scripts/api/admin/servers/getServers.ts +++ b/resources/scripts/api/admin/servers/getServers.ts @@ -22,6 +22,7 @@ export interface Server { io: number; cpu: number; threads: string | null; + oomDisabled: boolean; } featureLimits: { @@ -43,8 +44,6 @@ export interface Server { environment: Map; } - oomKiller: boolean; - createdAt: Date; updatedAt: Date; @@ -71,6 +70,7 @@ export const rawDataToServer = ({ attributes }: FractalResponseData): Server => io: attributes.limits.io, cpu: attributes.limits.cpu, threads: attributes.limits.threads, + oomDisabled: attributes.limits.oom_disabled, }, featureLimits: { @@ -92,8 +92,6 @@ export const rawDataToServer = ({ attributes }: FractalResponseData): Server => environment: attributes.container.environment, }, - oomKiller: attributes.oom_killer, - createdAt: new Date(attributes.created_at), updatedAt: new Date(attributes.updated_at), diff --git a/resources/scripts/api/admin/servers/updateServer.ts b/resources/scripts/api/admin/servers/updateServer.ts index d338a0cdc..59ab5bf68 100644 --- a/resources/scripts/api/admin/servers/updateServer.ts +++ b/resources/scripts/api/admin/servers/updateServer.ts @@ -5,7 +5,6 @@ export interface Values { externalId: string; name: string; ownerId: number; - oomKiller: boolean; memory: number; swap: number; @@ -13,6 +12,7 @@ export interface Values { io: number; cpu: number; threads: string; + oomDisabled: boolean; databases: number; allocations: number; diff --git a/resources/scripts/components/admin/servers/ServerSettingsContainer.tsx b/resources/scripts/components/admin/servers/ServerSettingsContainer.tsx index d1ea56fc0..4293691a6 100644 --- a/resources/scripts/components/admin/servers/ServerSettingsContainer.tsx +++ b/resources/scripts/components/admin/servers/ServerSettingsContainer.tsx @@ -1,5 +1,6 @@ import { Server } from '@/api/admin/servers/getServers'; import ServerDeleteButton from '@/components/admin/servers/ServerDeleteButton'; +import { faBalanceScale, faCogs, faConciergeBell, faNetworkWired } from '@fortawesome/free-solid-svg-icons'; import React from 'react'; import AdminBox from '@/components/admin/AdminBox'; import { useHistory } from 'react-router-dom'; @@ -20,7 +21,7 @@ export function ServerFeatureContainer () { const { isSubmitting } = useFormikContext(); return ( - +
@@ -62,7 +63,7 @@ export function ServerResourceContainer () { const { isSubmitting } = useFormikContext(); return ( - +
@@ -147,7 +148,7 @@ export function ServerSettingsContainer ({ server }: { server?: Server }) { const { isSubmitting } = useFormikContext(); return ( - +
@@ -179,6 +180,18 @@ export function ServerSettingsContainer ({ server }: { server?: Server }) { ); } +export function ServerAllocationsContainer () { + const { isSubmitting } = useFormikContext(); + + return ( + + + + ); +} + +type Values2 = Omit & { oomKiller: boolean }; + export default function ServerSettingsContainer2 () { const history = useHistory(); @@ -193,11 +206,10 @@ export default function ServerSettingsContainer2 () { ); } - const submit = (values: Values, { setSubmitting }: FormikHelpers) => { + const submit = (values: Values2, { setSubmitting }: FormikHelpers) => { clearFlashes('server'); - console.log(values); - updateServer(server.id, values) + updateServer(server.id, { ...values, oomDisabled: !values.oomKiller }) .then(() => setServer({ ...server, ...values })) .catch(error => { console.error(error); @@ -213,7 +225,6 @@ export default function ServerSettingsContainer2 () { externalId: server.externalId || '', name: server.name, ownerId: server.ownerId, - oomKiller: server.oomKiller, memory: server.limits.memory, swap: server.limits.swap, @@ -221,6 +232,9 @@ export default function ServerSettingsContainer2 () { io: server.limits.io, cpu: server.limits.cpu, threads: server.limits.threads || '', + // Yes, this is named differently on purpose. Naming it like this makes the toggle switch + // be in an ON state when the oom killer is enabled, instead of when its disabled. + oomKiller: !server.limits.oomDisabled, databases: server.featureLimits.databases, allocations: server.featureLimits.allocations, @@ -229,38 +243,43 @@ export default function ServerSettingsContainer2 () { validationSchema={object().shape({ })} > - { - ({ isSubmitting, isValid }) => ( -
-
-
-
- -
-
- -
+ {({ isSubmitting, isValid }) => ( + +
+
+
+
-
-
- -
-
-
- history.push('/admin/servers')} - /> - -
+ +
+ +
+ +
+ +
+ +
+
+ history.push('/admin/servers')} + /> +
- - ) - } + +
+
+ +
+
+
+ + )} ); } diff --git a/resources/scripts/components/admin/servers/ServerStartupContainer.tsx b/resources/scripts/components/admin/servers/ServerStartupContainer.tsx index 255c51be2..7f306efe7 100644 --- a/resources/scripts/components/admin/servers/ServerStartupContainer.tsx +++ b/resources/scripts/components/admin/servers/ServerStartupContainer.tsx @@ -1,3 +1,4 @@ +import { Egg } from '@/api/admin/eggs/getEgg'; import EggSelect from '@/components/admin/servers/EggSelect'; import NestSelect from '@/components/admin/servers/NestSelect'; import FormikSwitch from '@/components/elements/FormikSwitch'; @@ -106,18 +107,20 @@ function ServerImageContainer () { export default function ServerStartupContainer () { const { clearFlashes } = useStoreActions((actions: Actions) => actions.flashes); + const [ egg, setEgg ] = useState(null); + const server = Context.useStoreState(state => state.server); + const submit = () => { + clearFlashes('server'); + }; + if (server === undefined) { return ( <> ); } - const submit = () => { - clearFlashes('server'); - }; - return ( ; +type EditorMode = LanguageSupport | LRLanguage | StreamParser; export interface Mode { name: string, diff --git a/yarn.lock b/yarn.lock index 5230474b4..2e8d52313 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2503,10 +2503,10 @@ __metadata: languageName: node linkType: hard -"@types/node@npm:^16.7.10": - version: 16.7.10 - resolution: "@types/node@npm:16.7.10" - checksum: 0518803caa1a14f4070e770a280eda1c4b4581a425cbda481cdd54b1f34a7ea497ff067fd23b90e3d4f4fdcfba15c1316182875e9cf9f5b2e880de1e595de053 +"@types/node@npm:^16.9.1": + version: 16.9.1 + resolution: "@types/node@npm:16.9.1" + checksum: 41afcf183a22d59323a0199dd7e0f46591247f45fc08a4434edb26d56dc279ae4fdb80f37989ddd7a0f45e3857c4933e6e82057ede09c5a829f77e373e680375 languageName: node linkType: hard @@ -3556,12 +3556,12 @@ __metadata: languageName: node linkType: hard -"axios@npm:^0.21.3": - version: 0.21.3 - resolution: "axios@npm:0.21.3" +"axios@npm:^0.21.4": + version: 0.21.4 + resolution: "axios@npm:0.21.4" dependencies: follow-redirects: ^1.14.0 - checksum: fdcac33adb0330e127ab0e58f8d9fb7470b49dbfb0aba251ff54f146f2fc7d9362e3300581b6c98d2ea3b8db958ed099c831c3c7832ae79b14f517d5947a029a + checksum: 44245f24ac971e7458f3120c92f9d66d1fc695e8b97019139de5b0cc65d9b8104647db01e5f46917728edfc0cfd88eb30fc4c55e6053eef4ace76768ce95ff3c languageName: node linkType: hard @@ -7051,12 +7051,12 @@ fsevents@^1.2.7: languageName: node linkType: hard -"i18next@npm:^20.6.0": - version: 20.6.0 - resolution: "i18next@npm:20.6.0" +"i18next@npm:^20.6.1": + version: 20.6.1 + resolution: "i18next@npm:20.6.1" dependencies: "@babel/runtime": ^7.12.0 - checksum: 71ba3b871e6161ddd54055440cbc1cb3da4c5ff22991e8f80b7c2ddd23c49a9fe72a254f3dc39245311043a93ef2978255f0aada39500f049bd7d59fda71b2a5 + checksum: 313cd4b17f9092eaf8ca92a02bb74d099f4a8b26de6e38018f438ce6f706220e5f72d865e1f50d815e13504ec38bc77e0f6341f670ca5162689f8d11a859e564 languageName: node linkType: hard @@ -9931,7 +9931,7 @@ fsevents@^1.2.7: "@types/debounce": ^1.2.0 "@types/events": ^3.0.0 "@types/history": ^4.7.9 - "@types/node": ^16.7.10 + "@types/node": ^16.9.1 "@types/qrcode.react": ^1.0.2 "@types/query-string": ^6.3.0 "@types/react": ^16.14.15 @@ -9950,7 +9950,7 @@ fsevents@^1.2.7: "@typescript-eslint/eslint-plugin": ^4.30.0 "@typescript-eslint/parser": ^4.30.0 autoprefixer: ^10.3.4 - axios: ^0.21.3 + axios: ^0.21.4 babel-loader: ^8.2.2 babel-plugin-macros: ^3.1.0 babel-plugin-styled-components: ^1.13.2 @@ -9974,7 +9974,7 @@ fsevents@^1.2.7: fork-ts-checker-webpack-plugin: ^6.3.3 formik: ^2.2.9 history: ^4.10.1 - i18next: ^20.6.0 + i18next: ^20.6.1 i18next-chained-backend: ^3.0.2 i18next-localstorage-backend: ^3.1.3 i18next-xhr-backend: ^3.2.2 @@ -10005,17 +10005,17 @@ fsevents@^1.2.7: tailwindcss: ^2.2.7 terser-webpack-plugin: ^4.2.3 twin.macro: ^2.7.0 - typescript: ^4.3.5 + typescript: ^4.4.3 uuid: ^3.4.0 webpack: ^4.46.0 webpack-assets-manifest: ^4.0.6 webpack-bundle-analyzer: ^4.4.2 webpack-cli: ^3.3.12 webpack-dev-server: ^3.11.2 - xterm: ^4.13.0 + xterm: ^4.14.1 xterm-addon-attach: ^0.6.0 xterm-addon-fit: ^0.5.0 - xterm-addon-search: ^0.8.0 + xterm-addon-search: ^0.8.1 xterm-addon-search-bar: ^0.2.0 xterm-addon-web-links: ^0.4.0 yup: ^0.32.9 @@ -12436,23 +12436,23 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -typescript@^4.3.5: - version: 4.3.5 - resolution: "typescript@npm:4.3.5" +typescript@^4.4.3: + version: 4.4.3 + resolution: "typescript@npm:4.4.3" bin: tsc: bin/tsc tsserver: bin/tsserver - checksum: bab033b5e2b0790dd35b77fd005df976ef80b8d84fd2c6e63cc31808151875beae9216e5a315fe7068e8499905c3c354248fe83272cdfc13b7705635f0c66c97 + checksum: 05823f21796d450531a7e4ab299715d38fd9ded0e4ce7400876053f4b5166ca3dde7a68cecfe72d9086039f03c0b6edba36516fb10ed83c5837d9600532ea4c2 languageName: node linkType: hard -"typescript@patch:typescript@^4.3.5#~builtin": - version: 4.3.5 - resolution: "typescript@patch:typescript@npm%3A4.3.5#~builtin::version=4.3.5&hash=32657b" +"typescript@patch:typescript@^4.4.3#~builtin": + version: 4.4.3 + resolution: "typescript@patch:typescript@npm%3A4.4.3#~builtin::version=4.4.3&hash=32657b" bin: tsc: bin/tsc tsserver: bin/tsserver - checksum: 4e2edec3c9b7b9a22ad9cbf9371339d9e13bfe44731f0e2d6a5287f991c3b0e3e0ac0c0ebbf9bf6fc2051e30559c789bfc9cf572cd6b836a0222ae141fac1dba + checksum: 28ab98313afab46788ff41014fdb5932430ada6e03cf9e92ac47f406526a2cac1ae2894834e7da61e46b7429318e9c47f45ba8de323332f0cb9af99b72ebae74 languageName: node linkType: hard @@ -13151,12 +13151,12 @@ typescript@^4.3.5: languageName: node linkType: hard -"xterm-addon-search@npm:^0.8.0": - version: 0.8.0 - resolution: "xterm-addon-search@npm:0.8.0" +"xterm-addon-search@npm:^0.8.1": + version: 0.8.1 + resolution: "xterm-addon-search@npm:0.8.1" peerDependencies: xterm: ^4.0.0 - checksum: dedca29de6a764530a2def6e3ace561487b9750d1bfccafbb7547284da2384776eb943ee65709ea23a3d0441a76909be911219d66922f72a92fac3c2e2d6ad57 + checksum: 1ddea94543542e135449b56cbdb4546a996e232e127171c0c08c0d94090ca3bfcf70e6315f70e84c32090d44ebc84807cc33689688f69fc615a9a5a3fffa3b86 languageName: node linkType: hard @@ -13169,10 +13169,10 @@ typescript@^4.3.5: languageName: node linkType: hard -"xterm@npm:^4.13.0": - version: 4.13.0 - resolution: "xterm@npm:4.13.0" - checksum: 4b9103d88c8e5afe193e1f425f5f59c2e47f8064c3b6760409b7a099ae997202e0fdcbc8c52067884d06279a88b47c62cc63ca1cc6ce38f13303bdb34192319e +"xterm@npm:^4.14.1": + version: 4.14.1 + resolution: "xterm@npm:4.14.1" + checksum: 49e26b1de3f6772ea980adb1f630b3e065eea921b91d9126acce1b09050575c7773358ece6cdf5bd2ae9f5daab85ab45ce8b1c5caada850cd5b293b9132a97a5 languageName: node linkType: hard