Created component decorator that resets selected server and used it on Settings

src/servers/CreateServer.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect } from 'react';
+import React, { FC } from 'react';
 import { v4 as uuid } from 'uuid';
 import { RouterProps } from 'react-router';
 import classNames from 'classnames';
@@ -13,7 +13,6 @@ const SHOW_IMPORT_MSG_TIME = 4000;
 
 interface CreateServerProps extends RouterProps {
   createServer: (server: ServerWithId) => void;
-  resetSelectedServer: Function;
 }
 
 const Result: FC<{ type: 'success' | 'error' }> = ({ children, type }) => (
@@ -32,7 +31,7 @@ const Result: FC<{ type: 'success' | 'error' }> = ({ children, type }) => (
 );
 
 const CreateServer = (ImportServersBtn: FC<ImportServersBtnProps>, useStateFlagTimeout: StateFlagTimeout) => (
-  { createServer, history: { push }, resetSelectedServer }: CreateServerProps,
+  { createServer, history: { push } }: CreateServerProps,
 ) => {
   const [ serversImported, setServersImported ] = useStateFlagTimeout(false, SHOW_IMPORT_MSG_TIME);
   const [ errorImporting, setErrorImporting ] = useStateFlagTimeout(false, SHOW_IMPORT_MSG_TIME);
@@ -43,10 +42,6 @@ const CreateServer = (ImportServersBtn: FC<ImportServersBtnProps>, useStateFlagT
     push(`/server/${id}/list-short-urls/1`);
   };
 
-  useEffect(() => {
-    resetSelectedServer();
-  }, []);
-
   return (
     <NoMenuLayout>
       <ServerForm onSubmit={handleSubmit}>

src/servers/helpers/withoutSelectedServer.tsx

@@ -0,0 +1,15 @@
+import React, { FC, useEffect } from 'react';
+
+interface WithoutSelectedServerProps {
+  resetSelectedServer: Function;
+}
+
+export function withoutSelectedServer<T = {}>(WrappedComponent: FC<WithoutSelectedServerProps & T>) {
+  return (props: WithoutSelectedServerProps & T) => {
+    useEffect(() => {
+      props.resetSelectedServer();
+    }, []);
+
+    return <WrappedComponent {...props} />;
+  };
+}

src/servers/services/provideServices.ts

@@ -12,12 +12,14 @@ import { fetchServers } from '../reducers/remoteServers';
 import ForServerVersion from '../helpers/ForServerVersion';
 import { ServerError } from '../helpers/ServerError';
 import { ConnectDecorator } from '../../container/types';
+import { withoutSelectedServer } from '../helpers/withoutSelectedServer';
 import ServersImporter from './ServersImporter';
 import ServersExporter from './ServersExporter';
 
 const provideServices = (bottle: Bottle, connect: ConnectDecorator, withRouter: Decorator) => {
   // Components
   bottle.serviceFactory('CreateServer', CreateServer, 'ImportServersBtn', 'useStateFlagTimeout');
+  bottle.decorator('CreateServer', withoutSelectedServer);
   bottle.decorator('CreateServer', connect([ 'selectedServer' ], [ 'createServer', 'resetSelectedServer' ]));
 
   bottle.serviceFactory('EditServer', EditServer, 'ServerError');