eslint cleanup

package.json

@@ -115,6 +115,7 @@
     },
     "scripts": {
         "clean": "rm -rf public/assets/*.{js,css,map}",
+        "lint": "eslint ./resources/scripts/**/*.{ts,tsx} --ext .ts,.tsx",
         "watch": "cross-env NODE_ENV=development ./node_modules/.bin/webpack --watch --progress",
         "build": "cross-env NODE_ENV=development ./node_modules/.bin/webpack --progress",
         "build:production": "yarn run clean && cross-env NODE_ENV=production ./node_modules/.bin/webpack --mode production",

resources/scripts/.eslintrc.yml

@@ -49,7 +49,7 @@ rules:
   "@typescript-eslint/no-explicit-any": 0
   "@typescript-eslint/no-non-null-assertion": 0
   "@typescript-eslint/ban-ts-comment": 0
-  # @todo this would be nice to have, but don't want to deal with the warning spam at the moment.
+  # This would be nice to have, but don't want to deal with the warning spam at the moment.
   "@typescript-eslint/explicit-module-boundary-types": 0
   no-restricted-imports:
     - error
@@ -58,6 +58,8 @@ rules:
           message: Please import from styled-components/macro.
       patterns:
         - "!styled-components/macro"
+  # Not sure, this rule just doesn't work right and is protected by our use of Typescript anyways
+  # so I'm just not going to worry about it.
   "react/prop-types": 0
   "react/display-name": 0
   "react/jsx-indent-props":

resources/scripts/api/account/createApiKey.ts

@@ -3,13 +3,13 @@ import { ApiKey, rawDataToApiKey } from '@/api/account/getApiKeys';
 
 export default (description: string, allowedIps: string): Promise<ApiKey & { secretToken: string }> => {
     return new Promise((resolve, reject) => {
-        http.post(`/api/client/account/api-keys`, {
+        http.post('/api/client/account/api-keys', {
             description,
-            // eslint-disable-next-line @typescript-eslint/camelcase
             allowed_ips: allowedIps.length > 0 ? allowedIps.split('\n') : [],
         })
             .then(({ data }) => resolve({
                 ...rawDataToApiKey(data.attributes),
+                // eslint-disable-next-line camelcase
                 secretToken: data.meta?.secret_token ?? '',
             }))
             .catch(reject);

resources/scripts/api/account/updateAccountPassword.ts

@@ -9,10 +9,8 @@ interface Data {
 export default ({ current, password, confirmPassword }: Data): Promise<void> => {
     return new Promise((resolve, reject) => {
         http.put('/api/client/account/password', {
-            // eslint-disable-next-line @typescript-eslint/camelcase
             current_password: current,
             password: password,
-            // eslint-disable-next-line @typescript-eslint/camelcase
             password_confirmation: confirmPassword,
         })
             .then(() => resolve())

resources/scripts/api/auth/loginCheckpoint.ts

@@ -4,11 +4,9 @@ import { LoginResponse } from '@/api/auth/login';
 export default (token: string, code: string, recoveryToken?: string): Promise<LoginResponse> => {
     return new Promise((resolve, reject) => {
         http.post('/auth/login/checkpoint', {
-            /* eslint-disable @typescript-eslint/camelcase */
             confirmation_token: token,
             authentication_code: code,
             recovery_token: (recoveryToken && recoveryToken.length > 0) ? recoveryToken : undefined,
-            /* eslint-enable @typescript-eslint/camelcase */
         })
             .then(response => resolve({
                 complete: response.data.data.complete,

resources/scripts/api/auth/performPasswordReset.ts

@@ -17,7 +17,6 @@ export default (email: string, data: Data): Promise<PasswordResetResponse> => {
             email,
             token: data.token,
             password: data.password,
-            // eslint-disable-next-line @typescript-eslint/camelcase
             password_confirmation: data.passwordConfirmation,
         })
             .then(response => resolve({

resources/scripts/api/getServers.ts

@@ -3,10 +3,9 @@ import http, { getPaginationSet, PaginatedResult } from '@/api/http';
 
 export default (query?: string, includeAdmin?: boolean): Promise<PaginatedResult<Server>> => {
     return new Promise((resolve, reject) => {
-        http.get(`/api/client`, {
+        http.get('/api/client', {
             params: {
                 include: [ 'allocation' ],
-                // eslint-disable-next-line @typescript-eslint/camelcase
                 filter: includeAdmin ? 'all' : undefined,
                 query,
             },

resources/scripts/api/getSystemPermissions.ts

@@ -3,7 +3,7 @@ import http from '@/api/http';
 
 export default (): Promise<PanelPermissions> => {
     return new Promise((resolve, reject) => {
-        http.get(`/api/client/permissions`)
+        http.get('/api/client/permissions')
             .then(({ data }) => resolve(data.attributes.permissions))
             .catch(reject);
     });

resources/scripts/api/http.ts

@@ -5,7 +5,7 @@ const http: AxiosInstance = axios.create({
     timeout: 20000,
     headers: {
         'X-Requested-With': 'XMLHttpRequest',
-        'Accept': 'application/json',
+        Accept: 'application/json',
         'Content-Type': 'application/json',
         'X-CSRF-Token': (window as any).X_CSRF_TOKEN as string || '',
     },

resources/scripts/api/server/files/renameFile.ts

@@ -8,9 +8,7 @@ interface Data {
 export default (uuid: string, { renameFrom, renameTo }: Data): Promise<void> => {
     return new Promise((resolve, reject) => {
         http.put(`/api/client/servers/${uuid}/files/rename`, {
-            // eslint-disable-next-line @typescript-eslint/camelcase
             rename_from: renameFrom,
-            // eslint-disable-next-line @typescript-eslint/camelcase
             rename_to: renameTo,
         })
             .then(() => resolve())

resources/scripts/api/server/getServer.ts

@@ -62,7 +62,8 @@ export default (uuid: string): Promise<[ Server, string[] ]> => {
         http.get(`/api/client/servers/${uuid}`)
             .then(({ data }) => resolve([
                 rawDataToServerObject(data.attributes),
-                data.meta?.is_server_owner ? ['*'] : (data.meta?.user_permissions || []),
+                // eslint-disable-next-line camelcase
+                data.meta?.is_server_owner ? [ '*' ] : (data.meta?.user_permissions || []),
             ]))
             .catch(reject);
     });

resources/scripts/api/server/getServerDatabases.ts

@@ -18,7 +18,7 @@ export const rawDataToServerDatabase = (data: any): ServerDatabase => ({
     password: data.relationships && data.relationships.password ? data.relationships.password.attributes.password : undefined,
 });
 
-export default (uuid: string, includePassword: boolean = true): Promise<ServerDatabase[]> => {
+export default (uuid: string, includePassword = true): Promise<ServerDatabase[]> => {
     return new Promise((resolve, reject) => {
         http.get(`/api/client/servers/${uuid}/databases`, {
             params: includePassword ? { include: 'password' } : undefined,

resources/scripts/api/server/reinstallServer.ts

@@ -6,4 +6,4 @@ export default (uuid: string): Promise<void> => {
             .then(() => resolve())
             .catch(reject);
     });
-}
+};

resources/scripts/api/server/schedules/createOrUpdateScheduleTask.ts

@@ -11,7 +11,6 @@ export default (uuid: string, schedule: number, task: number | undefined, { time
     return new Promise((resolve, reject) => {
         http.post(`/api/client/servers/${uuid}/schedules/${schedule}/tasks${task ? `/${task}` : ''}`, {
             ...data,
-            // eslint-disable-next-line @typescript-eslint/camelcase
             time_offset: timeOffset,
         })
             .then(({ data }) => resolve(rawDataToServerTask(data.attributes)))

resources/scripts/api/server/schedules/deleteScheduleTask.ts

@@ -5,5 +5,5 @@ export default (uuid: string, scheduleId: number, taskId: number): Promise<void>
         http.delete(`/api/client/servers/${uuid}/schedules/${scheduleId}/tasks/${taskId}`)
             .then(() => resolve())
             .catch(reject);
-    })
+    });
 };

resources/scripts/api/server/schedules/getServerSchedule.ts

@@ -5,7 +5,7 @@ export default (uuid: string, schedule: number): Promise<Schedule> => {
     return new Promise((resolve, reject) => {
         http.get(`/api/client/servers/${uuid}/schedules/${schedule}`, {
             params: {
-                include: ['tasks'],
+                include: [ 'tasks' ],
             },
         })
             .then(({ data }) => resolve(rawDataToServerSchedule(data.attributes)))

resources/scripts/api/server/schedules/getServerSchedules.tsx

@@ -64,7 +64,7 @@ export default (uuid: string): Promise<Schedule[]> => {
     return new Promise((resolve, reject) => {
         http.get(`/api/client/servers/${uuid}/schedules`, {
             params: {
-                include: ['tasks'],
+                include: [ 'tasks' ],
             },
         })
             .then(({ data }) => resolve((data.data || []).map((row: any) => rawDataToServerSchedule(row.attributes))))

resources/scripts/api/server/users/createOrUpdateSubuser.ts

@@ -15,4 +15,4 @@ export default (uuid: string, params: Params, subuser?: Subuser): Promise<Subuse
             .then(data => resolve(rawDataToServerSubuser(data.data)))
             .catch(reject);
     });
-}
+};

resources/scripts/components/auth/LoginCheckpointContainer.tsx

@@ -17,7 +17,7 @@ interface Values {
     recoveryCode: '',
 }
 
-type OwnProps = RouteComponentProps<{}, StaticContext, { token?: string }>
+type OwnProps = RouteComponentProps<Record<string, unknown>, StaticContext, { token?: string }>
 
 type Props = OwnProps & {
     addError: ActionCreator<FlashStore['addError']['payload']>;

resources/scripts/components/auth/ResetPasswordContainer.tsx

@@ -57,7 +57,7 @@ export default ({ match, location }: RouteComponentProps<{ token: string }>) =>
                     .min(8, 'Your new password should be at least 8 characters in length.'),
                 passwordConfirmation: string()
                     .required('Your new password does not match.')
-                    .oneOf([ref('password'), null], 'Your new password does not match.'),
+                    .oneOf([ ref('password'), null ], 'Your new password does not match.'),
             })}
         >
             {({ isSubmitting }) => (

resources/scripts/components/dashboard/forms/ConfigureTwoFactorForm.tsx

@@ -14,7 +14,7 @@ export default () => {
         <div>
             {visible &&
             <DisableTwoFactorModal
-                appear={true}
+                appear
                 visible={visible}
                 onDismissed={() => setVisible(false)}
             />

resources/scripts/components/elements/ProgressBar.tsx

@@ -62,9 +62,9 @@ export default () => {
         <div className={'w-full fixed'} style={{ height: '2px' }}>
             <CSSTransition
                 timeout={250}
-                appear={true}
+                appear
                 in={visible}
-                unmountOnExit={true}
+                unmountOnExit
                 classNames={'fade'}
             >
                 <BarFill style={{ width: progress === undefined ? '100%' : `${progress}%` }}/>

resources/scripts/components/server/WebsocketHandler.tsx

@@ -67,7 +67,7 @@ export default () => {
 
     return (
         error ?
-            <CSSTransition timeout={250} in={true} appear={true} classNames={'fade'}>
+            <CSSTransition timeout={250} in appear classNames={'fade'}>
                 <div css={tw`bg-red-500 py-2`}>
                     <ContentContainer css={tw`flex items-center justify-center`}>
                         <Spinner size={'small'}/>

resources/scripts/components/server/backups/BackupContextMenu.tsx

@@ -80,7 +80,7 @@ export default ({ backup }: Props) => {
                 be recovered once deleted.
             </ConfirmationModal>
             }
-            <SpinnerOverlay visible={loading} fixed={true}/>
+            <SpinnerOverlay visible={loading} fixed/>
             <DropdownMenu
                 renderToggle={onClick => (
                     <button

resources/scripts/components/server/files/FileManagerContainer.tsx

@@ -70,7 +70,7 @@ export default () => {
                                     This directory seems to be empty.
                                 </p>
                                 :
-                                <CSSTransition classNames={'fade'} timeout={250} appear={true} in={true}>
+                                <CSSTransition classNames={'fade'} timeout={250} appear in>
                                     <React.Fragment>
                                         <div>
                                             {files.length > 250 ?

resources/scripts/components/server/schedules/ScheduleEditContainer.tsx

@@ -27,7 +27,7 @@ interface State {
     schedule?: Schedule;
 }
 
-export default ({ match, history, location: { state } }: RouteComponentProps<Params, {}, State>) => {
+export default ({ match, history, location: { state } }: RouteComponentProps<Params, Record<string, unknown>, State>) => {
     const { id, uuid } = useServer();
     const { clearFlashes, addError } = useFlash();
     const [ isLoading, setIsLoading ] = useState(true);

resources/scripts/components/server/schedules/ScheduleTaskRow.tsx

@@ -62,7 +62,7 @@ export default ({ schedule, task }: Props) => {
 
     return (
         <div css={tw`flex items-center bg-neutral-700 border border-neutral-600 mb-2 px-6 py-4 rounded`}>
-            <SpinnerOverlay visible={isLoading} fixed={true} size={'large'}/>
+            <SpinnerOverlay visible={isLoading} fixed size={'large'}/>
             {isEditing && <TaskDetailsModal
                 schedule={schedule}
                 task={task}

resources/scripts/components/server/users/RemoveSubuserButton.tsx

@@ -31,7 +31,7 @@ export default ({ subuser }: { subuser: Subuser }) => {
                 addError({ key: 'users', message: httpErrorToHuman(error) });
                 setShowConfirmation(false);
             });
-    }
+    };
 
     return (
         <>

resources/scripts/i18n.ts

@@ -17,13 +17,13 @@ i18n
                 LocalStorageBackend,
                 XHR,
             ],
-            backendOptions: [{
+            backendOptions: [ {
                 prefix: 'pterodactyl_lng__',
                 expirationTime: 7 * 24 * 60 * 60 * 1000, // 7 days, in milliseconds
                 store: window.localStorage,
             }, {
                 loadPath: '/locales/{{lng}}/{{ns}}.json',
-            }],
+            } ],
         },
     });
 

resources/scripts/plugins/useEventListener.ts

@@ -5,7 +5,7 @@ export default (eventName: string, handler: any, element: any = window) => {
 
     useEffect(() => {
         savedHandler.current = handler;
-    }, [handler]);
+    }, [ handler ]);
 
     useEffect(
         () => {
@@ -18,6 +18,6 @@ export default (eventName: string, handler: any, element: any = window) => {
                 element.removeEventListener(eventName, eventListener);
             };
         },
-        [eventName, element],
+        [ eventName, element ],
     );
 };

resources/scripts/plugins/usePersistedState.ts

@@ -1,7 +1,7 @@
 import { Dispatch, SetStateAction, useEffect, useState } from 'react';
 
 export function usePersistedState<S = undefined> (key: string, defaultValue: S): [S | undefined, Dispatch<SetStateAction<S | undefined>>] {
-    const [state, setState] = useState(
+    const [ state, setState ] = useState(
         () => {
             try {
                 const item = localStorage.getItem(key);
@@ -16,8 +16,8 @@ export function usePersistedState<S = undefined> (key: string, defaultValue: S):
     );
 
     useEffect(() => {
-        localStorage.setItem(key, JSON.stringify(state))
-    }, [key, state]);
+        localStorage.setItem(key, JSON.stringify(state));
+    }, [ key, state ]);
 
     return [ state, setState ];
 }

resources/scripts/plugins/useWebsocketEvent.ts

@@ -7,7 +7,7 @@ const useWebsocketEvent = (event: string, callback: (data: string) => void) => {
 
     useEffect(() => {
         savedCallback.current = callback;
-    }, [callback]);
+    }, [ callback ]);
 
     return useEffect(() => {
         const eventListener = (event: any) => savedCallback.current(event);

resources/scripts/routers/ServerRouter.tsx

@@ -69,7 +69,7 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
                     <Spinner size={'large'} centered/>
                 :
                 <>
-                    <CSSTransition timeout={250} classNames={'fade'} appear={true} in={true}>
+                    <CSSTransition timeout={250} classNames={'fade'} appear in>
                         <SubNavigation>
                             <div>
                                 <NavLink to={`${match.url}`} exact>Console</NavLink>
@@ -88,7 +88,7 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
                                 <Can action={'backup.*'}>
                                     <NavLink to={`${match.url}/backups`}>Backups</NavLink>
                                 </Can>
-                                <Can action={[ 'settings.*', 'file.sftp' ]} matchAny={true}>
+                                <Can action={[ 'settings.*', 'file.sftp' ]} matchAny>
                                     <NavLink to={`${match.url}/settings`}>Settings</NavLink>
                                 </Can>
                             </div>

resources/scripts/state/permissions.ts

@@ -11,7 +11,7 @@ export interface PanelPermissions {
 export interface GloablPermissionsStore {
     data: PanelPermissions;
     setPermissions: Action<GloablPermissionsStore, PanelPermissions>;
-    getPermissions: Thunk<GloablPermissionsStore, void, {}, any, Promise<void>>;
+    getPermissions: Thunk<GloablPermissionsStore, void, Record<string, unknown>, any, Promise<void>>;
 }
 
 const permissions: GloablPermissionsStore = {

resources/scripts/state/server/files.ts

@@ -6,7 +6,7 @@ import { cleanDirectoryPath } from '@/helpers';
 export interface ServerFileStore {
     directory: string;
     contents: FileObject[];
-    getDirectoryContents: Thunk<ServerFileStore, string, {}, ServerStore, Promise<void>>;
+    getDirectoryContents: Thunk<ServerFileStore, string, Record<string, unknown>, ServerStore, Promise<void>>;
     setContents: Action<ServerFileStore, FileObject[]>;
     pushFile: Action<ServerFileStore, FileObject>;
     removeFile: Action<ServerFileStore, string>;

resources/scripts/state/server/index.ts

@@ -14,7 +14,7 @@ interface ServerDataStore {
     data?: Server;
     permissions: string[];
 
-    getServer: Thunk<ServerDataStore, string, {}, ServerStore, Promise<void>>;
+    getServer: Thunk<ServerDataStore, string, Record<string, unknown>, ServerStore, Promise<void>>;
     setServer: Action<ServerDataStore, Server>;
     setPermissions: Action<ServerDataStore, string[]>;
 }

resources/scripts/state/user.ts

@@ -16,7 +16,7 @@ export interface UserStore {
     data?: UserData;
     setUserData: Action<UserStore, UserData>;
     updateUserData: Action<UserStore, Partial<UserData>>;
-    updateUserEmail: Thunk<UserStore, { email: string; password: string }, any, {}, Promise<void>>;
+    updateUserEmail: Thunk<UserStore, { email: string; password: string }, any, UserStore, Promise<void>>;
 }
 
 const user: UserStore = {