Fixed coding styles

src/App.js

@@ -9,32 +9,36 @@ const propTypes = {
   servers: PropTypes.object,
 };
 
-const App = (MainHeader, Home, MenuLayout, CreateServer, EditServer, Settings) => ({ fetchServers, servers }) => {
-  // On first load, try to fetch the remote servers if the list is empty
-  useEffect(() => {
-    if (Object.keys(servers).length === 0) {
-      fetchServers();
-    }
-  }, []);
+const App = (MainHeader, Home, MenuLayout, CreateServer, EditServer, Settings) => {
+  const AppComp = ({ fetchServers, servers }) => {
+    // On first load, try to fetch the remote servers if the list is empty
+    useEffect(() => {
+      if (Object.keys(servers).length === 0) {
+        fetchServers();
+      }
+    }, []);
 
-  return (
-    <div className="container-fluid app-container">
-      <MainHeader />
+    return (
+      <div className="container-fluid app-container">
+        <MainHeader />
 
-      <div className="app">
-        <Switch>
-          <Route exact path="/" component={Home} />
-          <Route exact path="/settings" component={Settings} />
-          <Route exact path="/server/create" component={CreateServer} />
-          <Route exact path="/server/:serverId/edit" component={EditServer} />
-          <Route path="/server/:serverId" component={MenuLayout} />
-          <Route component={NotFound} />
-        </Switch>
+        <div className="app">
+          <Switch>
+            <Route exact path="/" component={Home} />
+            <Route exact path="/settings" component={Settings} />
+            <Route exact path="/server/create" component={CreateServer} />
+            <Route exact path="/server/:serverId/edit" component={EditServer} />
+            <Route path="/server/:serverId" component={MenuLayout} />
+            <Route component={NotFound} />
+          </Switch>
+        </div>
       </div>
-    </div>
-  );
+    );
+  };
+
+  AppComp.propTypes = propTypes;
+
+  return AppComp;
 };
 
-App.propTypes = propTypes;
-
 export default App;

src/common/MenuLayout.js

@@ -26,7 +26,7 @@ const MenuLayout = (
   ShortUrlVisits,
   TagVisits,
   ShlinkVersions,
-  ServerError
+  ServerError,
 ) => {
   const MenuLayoutComp = ({ match, location, selectedServer }) => {
     const [ sidebarVisible, toggleSidebar, showSidebar, hideSidebar ] = useToggle();
@@ -44,7 +44,7 @@ const MenuLayout = (
     });
     const swipeMenuIfNoModalExists = (callback) => (e) => {
       const swippedOnVisitsTable = e.event.path.some(
-        ({ classList }) => classList && classList.contains('visits-table')
+        ({ classList }) => classList && classList.contains('visits-table'),
       );
 
       if (swippedOnVisitsTable || document.querySelector('.modal')) {

src/common/services/provideServices.js

@@ -29,7 +29,7 @@ const provideServices = (bottle, connect, withRouter) => {
     'ShortUrlVisits',
     'TagVisits',
     'ShlinkVersions',
-    'ServerError'
+    'ServerError',
   );
   bottle.decorator('MenuLayout', connect([ 'selectedServer', 'shortUrlsListParams' ], [ 'selectServer' ]));
   bottle.decorator('MenuLayout', withRouter);

src/container/index.js

@@ -25,7 +25,7 @@ const mapActionService = (map, actionName) => ({
 const connect = (propsFromState, actionServiceNames = []) =>
   reduxConnect(
     propsFromState ? pick(propsFromState) : null,
-    actionServiceNames.reduce(mapActionService, {})
+    actionServiceNames.reduce(mapActionService, {}),
   );
 
 bottle.serviceFactory('App', App, 'MainHeader', 'Home', 'MenuLayout', 'CreateServer', 'EditServer', 'Settings');

src/container/store.js

@@ -15,7 +15,7 @@ const localStorageConfig = {
 };
 
 const store = createStore(reducers, load(localStorageConfig), composeEnhancers(
-  applyMiddleware(save(localStorageConfig), ReduxThunk)
+  applyMiddleware(save(localStorageConfig), ReduxThunk),
 ));
 
 export default store;

src/index.js

@@ -28,6 +28,6 @@ render(
       </ErrorHandler>
     </BrowserRouter>
   </Provider>,
-  document.getElementById('root')
+  document.getElementById('root'),
 );
 registerServiceWorker();

src/registerServiceWorker.js

@@ -18,8 +18,8 @@ const isLocalhost = Boolean(
 
     // 127.0.0.1/8 is considered localhost for IPv4.
     window.location.hostname.match(
-      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
-    )
+      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/,
+    ),
 );
 
 export default function register() {
@@ -46,7 +46,7 @@ export default function register() {
         return navigator.serviceWorker.ready.then(() => {
           console.log(
             'This web app is being served cache-first by a service ' +
-            'worker. To learn more, visit https://goo.gl/SC7cgQ'
+            'worker. To learn more, visit https://goo.gl/SC7cgQ',
           );
         });
       }
@@ -110,7 +110,7 @@ function checkValidServiceWorker(swUrl) {
     })
     .catch(() => {
       console.log(
-        'No internet connection found. App is running in offline mode.'
+        'No internet connection found. App is running in offline mode.',
       );
     });
 }

src/servers/reducers/selectedServer.js

@@ -15,7 +15,7 @@ export const LATEST_VERSION_CONSTRAINT = 'latest';
 const initialState = null;
 const versionToSemVer = pipe(
   (version) => version === LATEST_VERSION_CONSTRAINT ? MAX_FALLBACK_VERSION : version,
-  toSemVer(MIN_FALLBACK_VERSION)
+  toSemVer(MIN_FALLBACK_VERSION),
 );
 
 const getServerVersion = memoizeWith(identity, (serverId, health) => health().then(({ version }) => ({
@@ -27,7 +27,7 @@ export const resetSelectedServer = createAction(RESET_SELECTED_SERVER);
 
 export const selectServer = (buildShlinkApiClient, loadMercureInfo) => (serverId) => async (
   dispatch,
-  getState
+  getState,
 ) => {
   dispatch(resetSelectedServer());
   dispatch(resetShortUrlParams());

src/servers/reducers/servers.js

@@ -27,7 +27,7 @@ const serversListToMap = reduce((acc, server) => assoc(server.id, server, acc),
 export const createServers = pipe(
   map(assocId),
   serversListToMap,
-  (newServers) => ({ type: CREATE_SERVERS, newServers })
+  (newServers) => ({ type: CREATE_SERVERS, newServers }),
 );
 
 export const editServer = (serverId, serverData) => ({ type: EDIT_SERVER, serverId, serverData });

src/short-urls/SearchBar.js

@@ -23,7 +23,7 @@ const SearchBar = (colorGenerator, ForServerVersion) => {
     const selectedTags = shortUrlsListParams.tags || [];
     const setDate = (dateName) => pipe(
       formatDate(),
-      (date) => listShortUrls({ ...shortUrlsListParams, [dateName]: date })
+      (date) => listShortUrls({ ...shortUrlsListParams, [dateName]: date }),
     );
 
     return (
@@ -63,7 +63,7 @@ const SearchBar = (colorGenerator, ForServerVersion) => {
                   {
                     ...shortUrlsListParams,
                     tags: selectedTags.filter((selectedTag) => selectedTag !== tag),
-                  }
+                  },
                 )}
               />
             ))}

src/short-urls/helpers/ShortUrlsRow.js

@@ -23,7 +23,7 @@ const propTypes = {
 const ShortUrlsRow = (
   ShortUrlsRowMenu,
   colorGenerator,
-  useStateFlagTimeout
+  useStateFlagTimeout,
 ) => {
   const ShortUrlsRowComp = ({ shortUrl, selectedServer, refreshList, shortUrlsListParams }) => {
     const [ copiedToClipboard, setCopiedToClipboard ] = useStateFlagTimeout();

src/short-urls/reducers/shortUrlsList.js

@@ -33,9 +33,9 @@ const initialState = {
 const setPropFromActionOnMatchingShortUrl = (prop) => (state, { shortCode, domain, [prop]: propValue }) => assocPath(
   [ 'shortUrls', 'data' ],
   state.shortUrls.data.map(
-    (shortUrl) => shortUrlMatches(shortUrl, shortCode, domain) ? assoc(prop, propValue, shortUrl) : shortUrl
+    (shortUrl) => shortUrlMatches(shortUrl, shortCode, domain) ? assoc(prop, propValue, shortUrl) : shortUrl,
   ),
-  state
+  state,
 );
 
 export default handleActions({
@@ -55,9 +55,9 @@ export default handleActions({
     state.shortUrls && state.shortUrls.data && state.shortUrls.data.map(
       (shortUrl) => shortUrlMatches(shortUrl, shortCode, domain)
         ? assoc('visitsCount', visitsCount, shortUrl)
-        : shortUrl
+        : shortUrl,
     ),
-    state
+    state,
   ),
 }, initialState);
 

src/short-urls/services/provideServices.js

@@ -23,7 +23,7 @@ const provideServices = (bottle, connect) => {
   // Components
   bottle.serviceFactory('ShortUrls', ShortUrls, 'SearchBar', 'ShortUrlsList');
   bottle.decorator('ShortUrls', reduxConnect(
-    (state) => assoc('shortUrlsList', state.shortUrlsList.shortUrls, state.shortUrlsList)
+    (state) => assoc('shortUrlsList', state.shortUrlsList.shortUrls, state.shortUrlsList),
   ));
 
   bottle.serviceFactory('SearchBar', SearchBar, 'ColorGenerator', 'ForServerVersion');
@@ -32,7 +32,7 @@ const provideServices = (bottle, connect) => {
   bottle.serviceFactory('ShortUrlsList', ShortUrlsList, 'ShortUrlsRow');
   bottle.decorator('ShortUrlsList', connect(
     [ 'selectedServer', 'shortUrlsListParams', 'mercureInfo' ],
-    [ 'listShortUrls', 'resetShortUrlParams', 'createNewVisit', 'loadMercureInfo' ]
+    [ 'listShortUrls', 'resetShortUrlParams', 'createNewVisit', 'loadMercureInfo' ],
   ));
 
   bottle.serviceFactory('ShortUrlsRow', ShortUrlsRow, 'ShortUrlsRowMenu', 'ColorGenerator', 'useStateFlagTimeout');
@@ -44,14 +44,14 @@ const provideServices = (bottle, connect) => {
     'EditTagsModal',
     'EditMetaModal',
     'EditShortUrlModal',
-    'ForServerVersion'
+    'ForServerVersion',
   );
   bottle.serviceFactory('CreateShortUrlResult', CreateShortUrlResult, 'useStateFlagTimeout');
 
   bottle.serviceFactory('CreateShortUrl', CreateShortUrl, 'TagsSelector', 'CreateShortUrlResult', 'ForServerVersion');
   bottle.decorator(
     'CreateShortUrl',
-    connect([ 'shortUrlCreationResult', 'selectedServer' ], [ 'createShortUrl', 'resetCreateShortUrl' ])
+    connect([ 'shortUrlCreationResult', 'selectedServer' ], [ 'createShortUrl', 'resetCreateShortUrl' ]),
   );
 
   bottle.serviceFactory('DeleteShortUrlModal', () => DeleteShortUrlModal);

src/tags/TagsList.js

@@ -23,7 +23,7 @@ const propTypes = {
 
 const TagsList = (TagCard) => {
   const TagListComp = (
-    { filterTags, forceListTags, tagsList, selectedServer, createNewVisit, loadMercureInfo, mercureInfo }
+    { filterTags, forceListTags, tagsList, selectedServer, createNewVisit, loadMercureInfo, mercureInfo },
   ) => {
     const [ displayedTag, setDisplayedTag ] = useState();
 

src/tags/reducers/tagEdit.js

@@ -28,7 +28,7 @@ export default handleActions({
 
 export const editTag = (buildShlinkApiClient, colorGenerator) => (oldName, newName, color) => async (
   dispatch,
-  getState
+  getState,
 ) => {
   dispatch({ type: EDIT_TAG_START });
   const { editTag } = buildShlinkApiClient(getState);

src/tags/services/provideServices.js

@@ -18,7 +18,7 @@ const provideServices = (bottle, connect) => {
     'DeleteTagConfirmModal',
     'EditTagModal',
     'ForServerVersion',
-    'ColorGenerator'
+    'ColorGenerator',
   );
 
   bottle.serviceFactory('DeleteTagConfirmModal', () => DeleteTagConfirmModal);
@@ -30,7 +30,7 @@ const provideServices = (bottle, connect) => {
   bottle.serviceFactory('TagsList', TagsList, 'TagCard');
   bottle.decorator('TagsList', connect(
     [ 'tagsList', 'selectedServer', 'mercureInfo' ],
-    [ 'forceListTags', 'filterTags', 'createNewVisit', 'loadMercureInfo' ]
+    [ 'forceListTags', 'filterTags', 'createNewVisit', 'loadMercureInfo' ],
   ));
 
   // Actions

src/visits/VisitsStats.js

@@ -68,7 +68,7 @@ const VisitsStats = ({ processStatsFromVisits, normalizeVisits }, OpenMapModalBt
     const normalizedVisits = useMemo(() => normalizeVisits(visits), [ visits ]);
     const { os, browsers, referrers, countries, cities, citiesForMap } = useMemo(
       () => processStatsFromVisits(normalizedVisits),
-      [ normalizedVisits ]
+      [ normalizedVisits ],
     );
     const mapLocations = values(citiesForMap);
 

src/visits/VisitsTable.js

@@ -96,7 +96,7 @@ const VisitsTable = ({
               'visits-table__sticky': isSticky,
             })}
             onClick={() => setSelectedVisits(
-              selectedVisits.length < resultSet.total ? resultSet.visitsGroups.flat() : []
+              selectedVisits.length < resultSet.total ? resultSet.visitsGroups.flat() : [],
             )}
           >
             <FontAwesomeIcon icon={checkIcon} className={classNames({ 'text-primary': selectedVisits.length > 0 })} />
@@ -149,7 +149,7 @@ const VisitsTable = ({
               style={{ cursor: 'pointer' }}
               className={classNames({ 'table-primary': isSelected })}
               onClick={() => setSelectedVisits(
-                isSelected ? selectedVisits.filter((v) => v !== visit) : [ ...selectedVisits, visit ]
+                isSelected ? selectedVisits.filter((v) => v !== visit) : [ ...selectedVisits, visit ],
               )}
             >
               <td className="text-center">

src/visits/helpers/LineChartCard.js

@@ -117,7 +117,7 @@ const LineChartCard = ({ title, visits, highlightedVisits, highlightedLabel = 'S
   );
   const groupedHighlighted = useMemo(
     () => fillTheGaps(groupVisitsByStep(step, reverse(highlightedVisits)), labels),
-    [ highlightedVisits, step, labels ]
+    [ highlightedVisits, step, labels ],
   );
 
   const data = {

src/visits/helpers/SortableBarGraph.js

@@ -44,9 +44,9 @@ const SortableBarGraph = ({
     const sortedPairs = !order.orderField ? pairs : sortBy(
       pipe(
         prop(order.orderField === head(keys(sortingItems)) ? 0 : 1),
-        toLowerIfString
+        toLowerIfString,
       ),
-      pairs
+      pairs,
     );
 
     return !order.orderDir || order.orderDir === 'ASC' ? sortedPairs : reverse(sortedPairs);
@@ -56,7 +56,7 @@ const SortableBarGraph = ({
     const sortedKeys = sortedPairs.map(pickKeyFromPair);
     // The highlighted stats have to be ordered based on the regular stats, not on its own values
     const sortedHighlightedPairs = highlightedStats && toPairs(
-      { ...zipObj(sortedKeys, sortedKeys.map(() => 0)), ...highlightedStats }
+      { ...zipObj(sortedKeys, sortedKeys.map(() => 0)), ...highlightedStats },
     );
 
     if (sortedPairs.length <= itemsPerPage) {
@@ -94,7 +94,7 @@ const SortableBarGraph = ({
   const { currentPageStats, currentPageHighlightedStats, pagination, max } = determineStats(
     stats,
     highlightedStats && keys(highlightedStats).length > 0 ? highlightedStats : undefined,
-    sortingItems
+    sortingItems,
   );
   const activeCities = keys(currentPageStats);
   const computeTitle = () => (

src/visits/services/VisitsParser.js

@@ -56,7 +56,7 @@ export const processStatsFromVisits = (normalizedVisits) =>
 
       return stats;
     },
-    { os: {}, browsers: {}, referrers: {}, countries: {}, cities: {}, citiesForMap: {} }
+    { os: {}, browsers: {}, referrers: {}, countries: {}, cities: {}, citiesForMap: {} },
   );
 
 export const normalizeVisits = map(({ userAgent, date, referer, visitLocation }) => {

src/visits/services/provideServices.js

@@ -17,12 +17,12 @@ const provideServices = (bottle, connect) => {
   bottle.serviceFactory('ShortUrlVisits', ShortUrlVisits, 'VisitsStats');
   bottle.decorator('ShortUrlVisits', connect(
     [ 'shortUrlVisits', 'shortUrlDetail', 'mercureInfo' ],
-    [ 'getShortUrlVisits', 'getShortUrlDetail', 'cancelGetShortUrlVisits', 'createNewVisit', 'loadMercureInfo' ]
+    [ 'getShortUrlVisits', 'getShortUrlDetail', 'cancelGetShortUrlVisits', 'createNewVisit', 'loadMercureInfo' ],
   ));
   bottle.serviceFactory('TagVisits', TagVisits, 'VisitsStats', 'ColorGenerator');
   bottle.decorator('TagVisits', connect(
     [ 'tagVisits', 'mercureInfo' ],
-    [ 'getTagVisits', 'cancelGetTagVisits', 'createNewVisit', 'loadMercureInfo' ]
+    [ 'getTagVisits', 'cancelGetTagVisits', 'createNewVisit', 'loadMercureInfo' ],
   ));
 
   // Services