Migrate from Github Pages to Netlify

mvximenko · Jul 25, 2020 · a7f7497 · a7f7497
1 parent a18fe0e
commit a7f7497
Show file tree

Hide file tree

Showing 14 changed files with 36 additions and 133 deletions.
diff --git a/.gitignore b/.gitignore
@@ -24,3 +24,6 @@ yarn-error.log*
 
 # api keys
 .env
+
+# Local Netlify folder
+.netlify
diff --git a/netlify.toml b/netlify.toml
@@ -0,0 +1,4 @@
+[[redirects]]
+  from = "/*"
+  to = "/index.html"
+  status = 200
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "dunno",
   "version": "0.1.0",
   "private": true,
-  "homepage": "https://mvximenko.github.io/dunno",
+  "homepage": "https://m-dunno.netlify.app",
   "dependencies": {
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.5.0",
@@ -15,7 +15,6 @@
     "@types/react-router-dom": "^5.1.5",
     "@types/styled-components": "^5.1.0",
     "firebase": "^7.16.1",
-    "gh-pages": "^3.1.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
     "react-indiana-drag-scroll": "^1.6.1",
@@ -28,9 +27,7 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject",
-    "predeploy": "npm run build",
-    "deploy": "gh-pages -d build"
+    "eject": "react-scripts eject"
   },
   "eslintConfig": {
     "extends": "react-app"

diff --git a/src/App.tsx b/src/App.tsx
@@ -41,14 +41,14 @@ const App: React.FC = () => {
       <GlobalStyle />
       <Header currentUser={currentUser} />
       <Switch>
-        <Route exact path='/dunno' component={Tv} />
-        <Route exact path='/dunno/movie' component={Movies} />
-        <Route exact path='/dunno/randomizer' component={Randomizer} />
-        <Route exact path='/dunno/tv/:titleId' component={Title} />
-        <Route exact path='/dunno/movie/:titleId' component={Title} />
-        <Route exact path='/dunno/person/:personId' component={Person} />
-        <Route exact path='/dunno/signin' component={SignIn} />
-        <Route exact path='/dunno/signup' component={SignUp} />
+        <Route exact path='/' component={Tv} />
+        <Route exact path='/movie' component={Movies} />
+        <Route exact path='/randomizer' component={Randomizer} />
+        <Route exact path='/tv/:titleId' component={Title} />
+        <Route exact path='/movie/:titleId' component={Title} />
+        <Route exact path='/person/:personId' component={Person} />
+        <Route exact path='/signin' component={SignIn} />
+        <Route exact path='/signup' component={SignUp} />
       </Switch>
     </>
   );

diff --git a/src/components/Person.tsx b/src/components/Person.tsx
@@ -29,7 +29,7 @@ const Person: React.FC<Props> = ({ match }) => {
         <Wrapper>
           <Heading>{name}</Heading>
           {titles.map((title) => (
-            <Link to={`/dunno/${title.media_type}/${title.id}`} key={title.id}>
+            <Link to={`/${title.media_type}/${title.id}`} key={title.id}>
               <Row>
                 <Placeholder>
                   <Img

diff --git a/src/components/SignIn.tsx b/src/components/SignIn.tsx
@@ -51,7 +51,7 @@ const SignIn: React.FC = () => {
         <Button type='button' google={true} onClick={signInWithGoogle}>
           Sign in with Google
         </Button>
-        <Link to='/dunno/signup'>{'New to Dunno? Sign up'}</Link>
+        <Link to='/signup'>{'New to Dunno? Sign up'}</Link>
       </Form>
     </Container>
   );

diff --git a/src/components/SignUp.tsx b/src/components/SignUp.tsx
@@ -69,7 +69,7 @@ const SignUp: React.FC = () => {
           required
         />
         <Button type='submit'>Sign Up</Button>
-        <Link to='/dunno/signin'>{'Already have an account? Sign in'}</Link>
+        <Link to='/signin'>{'Already have an account? Sign in'}</Link>
       </Form>
     </Container>
   );

diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx
@@ -29,20 +29,20 @@ const Header: React.FC<Props> = ({ currentUser }) => {
     <>
       <StyledHeader>
         <Logo>
-          <LogoLink to='/dunno'>dunno</LogoLink>
+          <LogoLink to='/'>dunno</LogoLink>
         </Logo>
 
         <Nav>
-          <NavLink exact to='/dunno'>
+          <NavLink exact to='/'>
             TV Shows
           </NavLink>
-          <NavLink exact to='/dunno/movie'>
+          <NavLink exact to='/movie'>
             Movies
           </NavLink>
-          <NavLink exact to='/dunno/randomizer'>
+          <NavLink exact to='/randomizer'>
             Randomizer
           </NavLink>
-          <NavLink exact to='/dunno/favorites'>
+          <NavLink exact to='/favorites'>
             Favorites
           </NavLink>
         </Nav>
@@ -51,22 +51,22 @@ const Header: React.FC<Props> = ({ currentUser }) => {
         {currentUser ? (
           <ProfileIcon src={SignOutPng} onClick={() => auth.signOut()} />
         ) : (
-          <Link to='/dunno/signin'>
+          <Link to='/signin'>
             <ProfileIcon src={ProfilePng} />
           </Link>
         )}
         <MenuIcon src={MenuPng} onClick={toggleDrawer} />
       </StyledHeader>
 
       <Menu active={drawer} onClick={toggleDrawer}>
-        <MenuLink to='/dunno'>TV Shows</MenuLink>
-        <MenuLink to='/dunno/movie'>Movies</MenuLink>
-        <MenuLink to='/dunno/randomizer'>Randomizer</MenuLink>
-        <MenuLink to='/dunno/favorites'>Favorites</MenuLink>
+        <MenuLink to='/'>TV Shows</MenuLink>
+        <MenuLink to='/movie'>Movies</MenuLink>
+        <MenuLink to='/randomizer'>Randomizer</MenuLink>
+        <MenuLink to='/favorites'>Favorites</MenuLink>
         {currentUser ? (
           <SignOut onClick={() => auth.signOut()}>Sign Out</SignOut>
         ) : (
-          <MenuLink to='/dunno/signin'>Sign In</MenuLink>
+          <MenuLink to='/signin'>Sign In</MenuLink>
         )}
       </Menu>
     </>

diff --git a/src/components/layout/SearchBar.tsx b/src/components/layout/SearchBar.tsx
@@ -59,7 +59,7 @@ const SearchBar: React.FC<Props> = ({ closeMenu }) => {
             .filter((item, index) => index < 5)
             .map((item) => (
               <Link
-                to={`/dunno/${item.media_type}/${item.id}`}
+                to={`/${item.media_type}/${item.id}`}
                 onClick={closeMenu}
                 key={item.id}
               >

diff --git a/src/components/list/ListPoster.tsx b/src/components/list/ListPoster.tsx
@@ -11,7 +11,7 @@ interface Props {
 const ListPoster: React.FC<Props> = ({ id, mediaType, title, posterPath }) => {
   const [loaded, setLoaded] = useState(false);
   return (
-    <Link to={`/dunno/${mediaType}/${id}`}>
+    <Link to={`/${mediaType}/${id}`}>
       <Img
         loading='lazy'
         alt={title}

diff --git a/src/components/title/TitleCast.tsx b/src/components/title/TitleCast.tsx
@@ -14,7 +14,7 @@ const TitleCast: React.FC<Props> = ({ id, name, profilePath }) => {
   const [loaded, setLoaded] = useState(false);
   return (
     <Column>
-      <Link to={`/dunno/person/${id}`}>
+      <Link to={`/person/${id}`}>
         <Photo>
           <Img
             src={

diff --git a/src/hooks/useLoaded.ts b/src/hooks/useLoaded.ts
@@ -10,6 +10,7 @@ export default function useLoaded(
 
   useEffect(() => {
     if (state) setState(false);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [backdropPath]);
 
   return [state, loaded];

diff --git a/src/store/title/titleActions.ts b/src/store/title/titleActions.ts
@@ -7,7 +7,7 @@ export function useFetchTitle(
   dispatch: React.Dispatch<TitleActionTypes>
 ): void {
   useEffect(() => {
-    const [, , mediaType, titleId] = url.split('/');
+    const [, mediaType, titleId] = url.split('/');
     const key: string = `${mediaType}_${titleId}`;
     if (localStorage.getItem(key)) {
       const data = JSON.parse(localStorage.getItem(key) as string);