Add ability for user to change server's name

Author: DaneEveritt

app/Http/Controllers/Api/Client/Servers/SettingsController.php

@@ -0,0 +1,48 @@
+<?php
+
+namespace Pterodactyl\Http\Controllers\Api\Client\Servers;
+
+use Illuminate\Http\Response;
+use Pterodactyl\Models\Server;
+use Pterodactyl\Repositories\Eloquent\ServerRepository;
+use Pterodactyl\Http\Controllers\Api\Client\ClientApiController;
+use Pterodactyl\Http\Requests\Api\Client\Servers\Settings\RenameServerRequest;
+
+class SettingsController extends ClientApiController
+{
+    /**
+     * @var \Pterodactyl\Repositories\Eloquent\ServerRepository
+     */
+    private $repository;
+
+    /**
+     * SettingsController constructor.
+     *
+     * @param \Pterodactyl\Repositories\Eloquent\ServerRepository $repository
+     */
+    public function __construct(ServerRepository $repository)
+    {
+        parent::__construct();
+
+        $this->repository = $repository;
+    }
+
+    /**
+     * Renames a server.
+     *
+     * @param \Pterodactyl\Http\Requests\Api\Client\Servers\Settings\RenameServerRequest $request
+     * @param \Pterodactyl\Models\Server $server
+     * @return \Illuminate\Http\Response
+     *
+     * @throws \Pterodactyl\Exceptions\Model\DataValidationException
+     * @throws \Pterodactyl\Exceptions\Repository\RecordNotFoundException
+     */
+    public function rename(RenameServerRequest $request, Server $server)
+    {
+        $this->repository->update($server->id, [
+            'name' => $request->input('name'),
+        ]);
+
+        return Response::create('', Response::HTTP_NO_CONTENT);
+    }
+}

app/Http/Requests/Api/Client/Servers/Settings/RenameServerRequest.php

@@ -0,0 +1,34 @@
+<?php
+
+namespace Pterodactyl\Http\Requests\Api\Client\Servers\Settings;
+
+use Pterodactyl\Models\Server;
+use Pterodactyl\Contracts\Http\ClientPermissionsRequest;
+use Pterodactyl\Http\Requests\Api\Client\ClientApiRequest;
+
+class RenameServerRequest extends ClientApiRequest implements ClientPermissionsRequest
+{
+    /**
+     * Returns the permissions string indicating which permission should be used to
+     * validate that the authenticated user has permission to perform this action aganist
+     * the given resource (server).
+     *
+     * @return string
+     */
+    public function permission(): string
+    {
+        return 'settings.rename';
+    }
+
+    /**
+     * The rules to apply when validating this request.
+     *
+     * @return array
+     */
+    public function rules(): array
+    {
+        return [
+            'name' => Server::getRules()['name'],
+        ];
+    }
+}

resources/scripts/api/server/renameServer.ts

@@ -0,0 +1,9 @@
+import http from '@/api/http';
+
+export default (uuid: string, name: string): Promise<void> => {
+    return new Promise((resolve, reject) => {
+        http.post(`/api/client/servers/${uuid}/settings/rename`, { name })
+            .then(() => resolve())
+            .catch(reject);
+    });
+};

resources/scripts/components/server/settings/RenameServerBox.tsx

@@ -0,0 +1,66 @@
+import React from 'react';
+import { ServerContext } from '@/state/server';
+import TitledGreyBox from '@/components/elements/TitledGreyBox';
+import { Form, FormikProps, withFormik } from 'formik';
+import { Server } from '@/api/server/getServer';
+import { ActionCreator } from 'easy-peasy';
+import renameServer from '@/api/server/renameServer';
+import Field from '@/components/elements/Field';
+import { object, string } from 'yup';
+import SpinnerOverlay from '@/components/elements/SpinnerOverlay';
+
+interface OwnProps {
+    server: Server;
+    setServer: ActionCreator<Server>;
+}
+
+interface Values {
+    name: string;
+}
+
+const RenameServerBox = ({ isSubmitting, ...props }: OwnProps & FormikProps<Values>) => (
+    <TitledGreyBox title={'Change Server Name'} className={'relative'}>
+        <SpinnerOverlay size={'normal'} visible={isSubmitting}/>
+        <Form className={'mb-0'}>
+            <Field
+                id={'name'}
+                name={'name'}
+                label={'Server Name'}
+                type={'text'}
+            />
+            <div className={'mt-6 text-right'}>
+                <button type={'submit'} className={'btn btn-sm btn-primary'}>
+                    Save
+                </button>
+            </div>
+        </Form>
+    </TitledGreyBox>
+);
+
+const EnhancedForm = withFormik<OwnProps, Values>({
+    displayName: 'RenameServerBoxForm',
+
+    mapPropsToValues: props => ({
+        name: props.server.name,
+    }),
+
+    validationSchema: () => object().shape({
+        name: string().required().min(1),
+    }),
+
+    handleSubmit: (values, { props, setSubmitting }) => {
+        renameServer(props.server.uuid, values.name)
+            .then(() => props.setServer({ ...props.server, name: values.name }))
+            .catch(error => {
+                console.error(error);
+            })
+            .then(() => setSubmitting(false));
+    },
+})(RenameServerBox);
+
+export default () => {
+    const server = ServerContext.useStoreState(state => state.server.data!);
+    const setServer = ServerContext.useStoreActions(actions => actions.server.setServer);
+
+    return <EnhancedForm server={server} setServer={setServer}/>;
+};

resources/scripts/components/server/settings/SettingsContainer.tsx

@@ -4,14 +4,15 @@ import { ServerContext } from '@/state/server';
 import { useStoreState } from 'easy-peasy';
 import { ApplicationStore } from '@/state';
 import { UserData } from '@/state/user';
+import RenameServerBox from '@/components/server/settings/RenameServerBox';
 
 export default () => {
     const user = useStoreState<ApplicationStore, UserData>(state => state.user.data!);
     const server = ServerContext.useStoreState(state => state.server.data!);
 
     return (
-        <div className={'my-10 mb-6 flex'}>
-            <TitledGreyBox title={'SFTP Details'} className={'w-full md:w-1/2'}>
+        <div className={'my-10 mb-6 md:flex'}>
+            <TitledGreyBox title={'SFTP Details'} className={'w-full md:flex-1 md:mr-6'}>
                 <div>
                     <label className={'input-dark-label'}>Server Address</label>
                     <input
@@ -38,6 +39,9 @@ export default () => {
                     </div>
                 </div>
             </TitledGreyBox>
+            <div className={'w-full mt-6 md:flex-1 md:mt-0'}>
+                <RenameServerBox/>
+            </div>
         </div>
     );
 };

resources/scripts/routers/ServerRouter.tsx

@@ -47,7 +47,7 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
             <Provider store={ServerContext.useStore()}>
                 <WebsocketHandler/>
                 <TransitionRouter>
-                    <div className={'w-full mx-auto'} style={{ maxWidth: '1200px' }}>
+                    <div className={'w-full mx-auto px-3'} style={{ maxWidth: '1200px' }}>
                         {!server ?
                             <div className={'flex justify-center m-20'}>
                                 <Spinner size={'large'}/>

routes/api-client.php

@@ -63,4 +63,8 @@
     Route::group(['prefix' => '/users'], function () {
         Route::get('/', 'Servers\SubuserController@index');
     });
+
+    Route::group(['prefix' => '/settings'], function () {
+        Route::post('/rename', 'Servers\SettingsController@rename');
+    });
 });