Format the whole codebase

.eslintrc.json

@@ -0,0 +1,27 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "extends": [
+    "plugin:react/recommended",
+    "standard"
+  ],
+  "overrides": [
+  ],
+  "parserOptions": {
+    "ecmaVersion": "latest",
+     "sourceType": "module"
+  },
+  "plugins": [
+    "react"
+  ],
+  "rules": {
+    // Indent with 2 spaces
+    "indent": ["error", 2],
+    // Indent JSX with 2 spaces
+    "react/jsx-indent": ["error", 2],
+    // Indent props with 2 spaces
+    "react/jsx-indent-props": ["error", 2]
+  }
+}

jsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "target": "ES2020",
+    "jsx": "react",
+    "strictNullChecks": true,
+    "strictFunctionTypes": true
+  },
+  "exclude": [
+    "node_modules",
+    "**/node_modules/*"
+  ]
+}

package.json

@@ -23,7 +23,7 @@
     "react-remove-scroll": "^2",
     "react-responsive": "^8",
     "react-router-dom": "^5",
-    "react-scripts": "3.4.1",
+    "react-scripts": "^5.0.1",
     "react-share": "^4",
     "react-slick": "^0.29",
     "react-text-loop-next": "^0.0.3",
@@ -53,5 +53,13 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "eslint": "^8.37.0",
+    "eslint-config-standard": "^17.0.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-n": "^15.7.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-react": "^7.32.2"
   }
 }

src/App.js

@@ -1,18 +1,16 @@
-import React, { useEffect, useState } from 'react'
+import React from 'react'
 import { Switch, Route } from 'react-router-dom'
-import { useLocation } from 'react-router'
 import { RemoveScroll } from 'react-remove-scroll'
-import { useSelector, useDispatch } from 'react-redux'
-import { setUser, setRedirectUrl } from './redux/actions'
+import { useSelector } from 'react-redux'
 
 import ProtectedRoute from './components/Routes/protectedRoute'
-import Navbar from "./components/Other/navbar"
-import Home from "./components/Home/home"
-import Browse from "./components/Browse/browse"
-import Item from "./components/Item/item"
-import AboutModal from "./components/Modals/aboutModal"
+import Navbar from './components/Other/navbar'
+import Home from './components/Home/home'
+import Browse from './components/Browse/browse'
+import Item from './components/Item/item'
+import AboutModal from './components/Modals/aboutModal'
 import HamburgerModal from './components/Modals/hamburgerModal'
-import DeleteModal from "./components/Modals/deleteModal"
+import DeleteModal from './components/Modals/deleteModal'
 import SearchModal from './components/Modals/searchModal'
 import CurrencyModal from './components/Modals/currencyModal'
 import PageNotFound from './components/Other/pageNotFound'
@@ -42,125 +40,84 @@ import SanctuaryStory from './components/Newsroom/Articles/sanctuaryStory'
 import AdidasCarbon3D from './components/Newsroom/Articles/adidasCarbon3D'
 import TopDrops2020 from './components/Newsroom/Articles/topDrops2020'
 import SneakerMarket from './components/Newsroom/Articles/sneakerMarket'
-import BuyYourPair from "./components/Newsroom/Articles/buyYourPair"
-
-import firebase from './services/firebase'
-import Loader from './components/Other/loader'
-
-
-
-export default function App() {
-
-    const dispatch = useDispatch()
-    const urlLocation = useLocation()
-
-    useLocationDetection()
-
-    const locationPopup = useSelector(state => state.modals.locationPopupVisible)
-    const currencyModalVisible = useSelector(state => state.modals.currencyModalVisible)
-    const searchModalVisible = useSelector(state => state.modals.searchModalVisible)
-    const aboutModalVisible = useSelector(state => state.modals.aboutModalVisible)
-    const categoryFilterModalVisible = useSelector(state => state.modals.categoryFilterModalVisible)
-    const deleteModalVisible = useSelector(state => state.modals.deleteModalVisible)
-    const redirect = useSelector(state => state.redirect)
-    const [loader, setLoader] = useState(true)
-
-    useEffect(() => {
-        firebase.auth().onAuthStateChanged(async (user) => {
-            if (user) {
-                dispatch(setUser(user))
-                setLoader(false)
-
-                if (redirect) {
-                    let redirectCopy = redirect
-                    dispatch(setRedirectUrl(null))
-                    const jwt = await user.getIdToken()
-                    window.location.href = `${redirectCopy}id_token=${jwt}&refresh_token=${user.refreshToken}`
-                }
-            } else {
-                dispatch(setUser(null))
-                setLoader(false)
-            }
-        })
-    }, [])
-
-    // useEffect(() => {
-    //     window.analytics.page(); 
-    // }, [urlLocation.pathname])
-
-
-    if (loader) {
-        return (
-            <Loader />
-        )
-    } else {
-        return (
-            <React.Fragment>
-                <Navbar />
-                <Switch>
-                <Route exact path="/" component={Home} />
-                <Route path="/home" component={Home} />
-                <Route path="/browse/:searchTerm?" component={Browse} />
-                <Route path="/item/:itemKey/:gender?" component={Item} />
-
-                <ProtectedRoute path="/sign-in/:redirect?" component={SignInOptions} isEnabled={!firebase.auth().currentUser} />
-                <ProtectedRoute path="/sign-in-email" component={SignInEmail} isEnabled={!firebase.auth().currentUser} />
-                <ProtectedRoute path="/create-account/:redirect?" component={CreateAccountOptions} isEnabled={!firebase.auth().currentUser} />
-                <ProtectedRoute path="/create-account-email" component={CreateAccountEmail} isEnabled={!firebase.auth().currentUser} />
-                <ProtectedRoute path="/sign-in-forgot-password" component={ForgotPassword} isEnabled={!firebase.auth().currentUser} />
-
-                <ProtectedRoute path="/profile/:redirect?" component={Profile} isEnabled={firebase.auth().currentUser} />
-                <ProtectedRoute path="/profile-edit-name" component={EditProfileName} isEnabled={firebase.auth().currentUser} />
-                <ProtectedRoute path="/profile-edit-email" component={EditProfileEmail} isEnabled={firebase.auth().currentUser} />
-                <ProtectedRoute path="/profile-edit-password" component={EditProfilePassword} isEnabled={firebase.auth().currentUser} />
-                <ProtectedRoute path="/sign-out/:redirect?" component={SignOut} isEnabled={firebase.auth().currentUser} />
-
-                <Route path="/privacy-policy" component={PrivacyPolicy} />
-                <Route path="/terms-of-use" component={TermsOfUse} />
-                <Route path="/contact-us" component={ContactUs} />
-                <Route path="/how-it-works" component={HowItWorks} />
-                <Route path="/newsroom" component={Newsroom} />
-                <Route path="/newsroom-sanctuary-our-story" component={SanctuaryStory} />
-                <Route path="/newsroom-buy-your-pair" component={BuyYourPair} />
-                <Route path="/newsroom-how-adidas-and-carbon-3d-are-revolutionizing-sneaker-production" component={AdidasCarbon3D} />
-                <Route path="/newsroom-our-top-drops-of-2020" component={TopDrops2020} />
-                <Route path="/newsroom-demystifying-the-sneaker-market" component={SneakerMarket} />
-                <Route path="/item-not-supported" component={ItemNotSupported} />
-                <Route component={PageNotFound} />
-                </Switch>
-
-                { locationPopup && 
-                    <RemoveScroll>
-                        <LocationModal />
-                    </RemoveScroll>
-                }
-                { categoryFilterModalVisible &&
-                    <RemoveScroll>
-                        <CategoryFilterModal />
-                    </RemoveScroll>
-                } 
-                { currencyModalVisible &&
-                    <RemoveScroll>
-                        <CurrencyModal />
-                    </RemoveScroll>
-                }
-                { aboutModalVisible &&
-                    <RemoveScroll>
-                        <AboutModal />
-                    </RemoveScroll>
-                }
-                { deleteModalVisible &&
-                    <RemoveScroll>
-                        <DeleteModal />
-                    </RemoveScroll>
-                }
-                { searchModalVisible &&
-                    <RemoveScroll>
-                        <SearchModal />
-                    </RemoveScroll>
-                }
-                <HamburgerModal />
-            </React.Fragment>
-        )
-    }
-}
+import BuyYourPair from './components/Newsroom/Articles/buyYourPair'
+
+export default function App () {
+  useLocationDetection()
+
+  const locationPopup = useSelector(state => state.modals.locationPopupVisible)
+  const currencyModalVisible = useSelector(state => state.modals.currencyModalVisible)
+  const searchModalVisible = useSelector(state => state.modals.searchModalVisible)
+  const aboutModalVisible = useSelector(state => state.modals.aboutModalVisible)
+  const categoryFilterModalVisible = useSelector(state => state.modals.categoryFilterModalVisible)
+  const deleteModalVisible = useSelector(state => state.modals.deleteModalVisible)
+
+  return (
+    <React.Fragment>
+      <Navbar />
+      <Switch>
+        <Route exact path="/" component={Home} />
+        <Route path="/home" component={Home} />
+        <Route path="/browse/:searchTerm?" component={Browse} />
+        <Route path="/item/:itemKey/:gender?" component={Item} />
+
+        <ProtectedRoute path="/sign-in/:redirect?" component={SignInOptions} isEnabled={false} />
+        <ProtectedRoute path="/sign-in-email" component={SignInEmail} isEnabled={false} />
+        <ProtectedRoute path="/create-account/:redirect?" component={CreateAccountOptions} isEnabled={false} />
+        <ProtectedRoute path="/create-account-email" component={CreateAccountEmail} isEnabled={false} />
+        <ProtectedRoute path="/sign-in-forgot-password" component={ForgotPassword} isEnabled={false} />
+
+        <ProtectedRoute path="/profile/:redirect?" component={Profile} isEnabled={false} />
+        <ProtectedRoute path="/profile-edit-name" component={EditProfileName} isEnabled={false} />
+        <ProtectedRoute path="/profile-edit-email" component={EditProfileEmail} isEnabled={false} />
+        <ProtectedRoute path="/profile-edit-password" component={EditProfilePassword} isEnabled={false} />
+        <ProtectedRoute path="/sign-out/:redirect?" component={SignOut} isEnabled={false} />
+
+        <Route path="/privacy-policy" component={PrivacyPolicy} />
+        <Route path="/terms-of-use" component={TermsOfUse} />
+        <Route path="/contact-us" component={ContactUs} />
+        <Route path="/how-it-works" component={HowItWorks} />
+        <Route path="/newsroom" component={Newsroom} />
+        <Route path="/newsroom-sanctuary-our-story" component={SanctuaryStory} />
+        <Route path="/newsroom-buy-your-pair" component={BuyYourPair} />
+        <Route path="/newsroom-how-adidas-and-carbon-3d-are-revolutionizing-sneaker-production" component={AdidasCarbon3D} />
+        <Route path="/newsroom-our-top-drops-of-2020" component={TopDrops2020} />
+        <Route path="/newsroom-demystifying-the-sneaker-market" component={SneakerMarket} />
+        <Route path="/item-not-supported" component={ItemNotSupported} />
+        <Route component={PageNotFound} />
+      </Switch>
+
+      { locationPopup &&
+        <RemoveScroll>
+          <LocationModal />
+        </RemoveScroll>
+      }
+      { categoryFilterModalVisible &&
+        <RemoveScroll>
+          <CategoryFilterModal />
+        </RemoveScroll>
+      }
+      { currencyModalVisible &&
+        <RemoveScroll>
+          <CurrencyModal />
+        </RemoveScroll>
+      }
+      { aboutModalVisible &&
+        <RemoveScroll>
+          <AboutModal />
+        </RemoveScroll>
+      }
+      { deleteModalVisible &&
+        <RemoveScroll>
+          <DeleteModal />
+        </RemoveScroll>
+      }
+      { searchModalVisible &&
+        <RemoveScroll>
+          <SearchModal />
+        </RemoveScroll>
+      }
+      <HamburgerModal />
+    </React.Fragment>
+  )
+}