clean up

mbart13 · May 17, 2021 · 03809c9 · 03809c9 · vercel · May 17, 2021
1 parent 797ae12
commit 03809c9
Show file tree

Hide file tree

Showing 8 changed files with 8 additions and 53 deletions.
diff --git a/readmetemplate.md b/readmetemplate.md
diff --git a/src/App.tsx b/src/App.tsx
@@ -24,14 +24,15 @@ function App() {
       .then(data => {
         setCountries(data);
         setIsLoading(false);
+        setIsError(false);
       })
       .catch(() => {
         setIsLoading(false);
         setIsError(true);
       });
   }, []);
 
-  const handleSelectedRegion = (target: any) => {
+  const handleSelectedRegion = (target: any): void => {
     setSelectedRegion(target.selectedItem);
   };
 

diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
diff --git a/src/components/CountriesList/CountriesList.styles.ts b/src/components/CountriesList/CountriesList.styles.ts
@@ -27,9 +27,3 @@ export const Notification = styled.p`
   padding-top: 2rem;
   color: var(--color-text);
 `;
-
-export const ButtonWrapper = styled.div`
-  display: flex;
-  justify-content: center;
-  padding-bottom: 2rem;
-`;
diff --git a/src/components/CountriesList/CountriesList.tsx b/src/components/CountriesList/CountriesList.tsx
@@ -1,10 +1,8 @@
-import { useState } from 'react';
 import ClipLoader from 'react-spinners/ClipLoader';
 import { css } from '@emotion/core';
-import { Wrapper, Notification, ButtonWrapper } from './CountriesList.styles';
+import { Wrapper, Notification } from './CountriesList.styles';
 import CountryCard from 'components/CountryCard/CountryCard';
 import Country from 'models/Country';
-import Button from 'components/Button/Button';
 
 const CountriesList: React.FC<{
   countries: Country[];
@@ -13,8 +11,6 @@ const CountriesList: React.FC<{
   isLoading: boolean;
   isError: boolean;
 }> = ({ countries, searchQuery, isLoading, isError }) => {
-  const [showAll, setShowAll] = useState(false);
-
   const override = css`
     display: block;
     margin: 3rem auto;
@@ -37,8 +33,6 @@ const CountriesList: React.FC<{
     );
   }
 
-  const DISPLAY_LIMIT = 20;
-
   return (
     <>
       <ClipLoader
@@ -48,19 +42,10 @@ const CountriesList: React.FC<{
         size={60}
       ></ClipLoader>
       <Wrapper>
-        {countries
-          .slice(0, showAll ? countries.length - 1 : DISPLAY_LIMIT)
-          .map((country: Country) => {
-            return <CountryCard key={country.alpha3Code} {...country} />;
-          })}
+        {countries.map((country: Country) => {
+          return <CountryCard key={country.alpha3Code} {...country} />;
+        })}
       </Wrapper>
-      {!showAll && countries.length > DISPLAY_LIMIT && (
-        <ButtonWrapper>
-          <Button handleClick={() => setShowAll(prevState => !prevState)}>
-            Show All
-          </Button>
-        </ButtonWrapper>
-      )}
     </>
   );
 };

diff --git a/src/components/DropDownSelect/DropDownSelect.tsx b/src/components/DropDownSelect/DropDownSelect.tsx
@@ -12,7 +12,7 @@ const items = ['All', 'Africa', 'Americas', 'Asia', 'Europe', 'Oceania'];
 
 type DropDownSelectProps = {
   selectedRegion: string;
-  handleSelectedItem: any;
+  handleSelectedItem: (target: any) => void;
 };
 
 const DropDownSelect = ({

diff --git a/src/hooks/useDarkMode.ts b/src/hooks/useDarkMode.ts
@@ -7,7 +7,6 @@ const useDarkMode = (): [string, () => void] => {
   const setMode = useCallback((mode: string) => {
     window.localStorage.setItem('theme', mode);
     setTheme(mode);
-    document.body.className = mode;
   }, []);
 
   const themeToggler = (): void => {

diff --git a/src/pages/CountryDetails/CountryDetails.styles.ts b/src/pages/CountryDetails/CountryDetails.styles.ts
@@ -84,7 +84,7 @@ export const CountryInfo = styled.div`
 
   ul:first-child {
     @media (min-width: ${breakpoints.desktop}) {
-      margin-right: 7.3125rem;
+      margin-right: 5rem;
     }
   }