🛣

oogxdd · Sep 30, 2020 · 43f865e · 43f865e · vercel · Sep 30, 2020
1 parent 039ddf0
commit 43f865e
Show file tree

Hide file tree

Showing 55 changed files with 954 additions and 308 deletions.
diff --git a/package.json b/package.json
@@ -5,6 +5,8 @@
   "dependencies": {
     "@stripe/react-stripe-js": "^1.1.2",
     "@stripe/stripe-js": "^1.9.0",
+    "@urql/exchange-graphcache": "^3.1.2",
+    "crypto-js": "^4.0.0",
     "draft-js": "^0.11.7",
     "draftjs-to-html": "^0.9.1",
     "getstream": "^4.5.4",
@@ -13,6 +15,7 @@
     "html-to-draftjs": "^1.5.0",
     "html5-file-selector": "^2.1.0",
     "isomorphic-unfetch": "^3.0.0",
+    "jsonwebtoken": "^8.5.1",
     "localforage": "^1.7.4",
     "moment": "^2.27.0",
     "node-sass": "^4.14.1",

diff --git a/public/img/banner.jpg b/public/img/banner.jpg
diff --git a/public/img/empty/empty01.svg b/public/img/empty/empty01.svg
diff --git a/public/img/logo-black.svg b/public/img/logo-black.svg
diff --git a/src/api/books/queries.js b/src/api/books/queries.js
@@ -32,15 +32,22 @@ export const getBooksQuery = gql`
 
 export const getFollowedBooksQuery = gql`
   query($userId: Int!) {
-    books(where: { readers: { some: { id: { equals: $userId } } } }) {
+    books(
+      where: {
+        OR: [
+          { readers: { some: { id: { equals: $userId } } } }
+          { author: { followers: { some: { id: { equals: $userId } } } } }
+        ]
+      }
+    ) {
       ...Book
       description
-      chapters {
-        ...Chapter
-      }
       reviews {
         stars
       }
+      chapters {
+        ...Chapter
+      }
       author {
         ...User
       }

diff --git a/src/api/chapters/queries.js b/src/api/chapters/queries.js
@@ -24,6 +24,9 @@ export const getChapterQuery = gql`
           id
           stars
         }
+        readers {
+          id
+        }
       }
       author {
         ...User
@@ -93,11 +96,15 @@ export const getLastChaptersQuery = gql`
         chapters {
           id
         }
+        author {
+          ...User
+        }
         genres {
           ...Genre
         }
       }
     }
+    chaptersFeedCount
   }
   ${UserFragment}
   ${BookFragment}
@@ -124,6 +131,7 @@ export const getLastChaptersByAuthorQuery = gql`
         }
       }
     }
+    chaptersFeedByAuthorCount
   }
   ${UserFragment}
   ${BookFragment}
@@ -146,6 +154,9 @@ export const getChapterByBookQuery = gql`
           id
           stars
         }
+        readers {
+          id
+        }
         chapters(orderBy: { createdAt: asc }) {
           id
         }

diff --git a/src/api/users/mutations.js b/src/api/users/mutations.js
@@ -30,11 +30,9 @@ export const removeBookFromFavoritesMutation = gql`
 
 export const followUserMutation = gql`
   mutation($followingId: Int!, $followerId: Int!) {
-    updateOneUser(
-      where: { id: $followerId }
-      data: { following: { connect: { id: $followingId } } }
-    ) {
+    followUser(followingId: $followingId, followerId: $followerId) {
       id
+      ...User
       following {
         ...User
       }
@@ -64,10 +62,7 @@ export const updateUserMutation = gql`
 
 export const unfollowUserMutation = gql`
   mutation($followingId: Int!, $followerId: Int!) {
-    updateOneUser(
-      where: { id: $followerId }
-      data: { following: { disconnect: { id: $followingId } } }
-    ) {
+    unfollowUser(followingId: $followingId, followerId: $followerId) {
       id
       following {
         ...User

diff --git a/src/api/users/queries.js b/src/api/users/queries.js
@@ -24,6 +24,12 @@ export const getUserQuery = gql`
           ...User
         }
       }
+      followers {
+        ...User
+      }
+      following {
+        ...User
+      }
     }
   }
   ${UserFragment}
@@ -36,7 +42,6 @@ export const getMeQuery = gql`
       ...User
       firstname
       givenname
-      email
       username
       getStreamToken
       stripeId
@@ -49,9 +54,15 @@ export const getMeQuery = gql`
           id
         }
       }
+      books {
+        id
+      }
       following {
         id
       }
+      invited {
+        id
+      }
     }
   }
   ${UserFragment}

diff --git a/src/assets/css/index.css b/src/assets/css/index.css
@@ -374,3 +374,13 @@
   width: 100%;
   display: block;
 }
+
+.invite-link {
+  text-align: center;
+  margin-top: 30px;
+  padding-left: 10px;
+  color: #7057d2;
+  cursor: pointer;
+  font-weight: 500;
+  font-size: 14px;
+}
diff --git a/src/components/Explore.js b/src/components/Explore.js
@@ -8,6 +8,7 @@ import {
   removeBookFromFavoritesMutation,
 } from 'api'
 
+import BookCover from 'components/atoms/book-cover'
 import Loader from 'components/Loader'
 import Flex from 'components/Flex'
 
@@ -37,12 +38,7 @@ const Book = ({ book, isFirst }) => {
 
   return (
     <div className="item item01">
-      <div
-        className="item-img"
-        style={{
-          backgroundImage: `url("${book.image || '/img/placeholder.jpg'}")`,
-        }}
-      />
+      <BookCover book={book} isItem hideText />
       <div className="item-info" style={{ width: '100%' }}>
         <div className="item-head">
           <h3 className="item-title">{book.name}</h3>
@@ -63,12 +59,7 @@ const Book = ({ book, isFirst }) => {
           ))}
         </ul>
         <Flex row>
-          <button
-            className={`btn btn-follow ${
-              isFirst && !isFavorite ? 'active' : ''
-            }`}
-            onClick={addToLibrary}
-          >
+          <button className={`btn btn-follow`} onClick={addToLibrary}>
             {isFavorite ? 'Following' : 'Follow'}{' '}
             {!isFavorite && (
               <span>

diff --git a/src/components/Layout/Header/Create.js b/src/components/Layout/Header/Create.js
@@ -35,6 +35,7 @@ const CreatePopup = ({ bookId }) => {
 }
 
 const AddBook = () => {
+  return null
   return (
     <Link to="/new-book" className="header-nav__link">
       New book
@@ -44,9 +45,11 @@ const AddBook = () => {
 
 const AddChapter = ({ bookId }) => {
   return (
-    <Link to={`/books/${bookId}/new-chapter`} className="header-nav__link">
-      Add page
-    </Link>
+    <li className="header-nav__item">
+      <Link to={`/books/${bookId}/new-chapter`} className="header-nav__link">
+        Add page
+      </Link>
+    </li>
   )
 }
 

diff --git a/src/components/Layout/Header/Header.js b/src/components/Layout/Header/Header.js
@@ -5,7 +5,7 @@ import Notifications from 'components/Notifications'
 import Logo from './Logo'
 import Read from './Read'
 import Create from './Create'
-import LoginBtn from './LoginBtn'
+// import LoginBtn from './LoginBtn'
 import SignupBtn from './SignupBtn'
 import User from './User'
 
@@ -24,11 +24,7 @@ export default ({ home }) => {
                   <Read />
                 </li>
               )}
-              {user && (
-                <li className="header-nav__item">
-                  <Create />
-                </li>
-              )}
+              {user && <Create />}
               {user && (
                 <li
                   className="header-nav__item"
@@ -37,7 +33,7 @@ export default ({ home }) => {
                   <Notifications />
                 </li>
               )}
-              {!user && <LoginBtn />}
+              {/* !user && <LoginBtn /> */}
             </ul>
           </nav>
           {!user ? <SignupBtn /> : <User user={user} />}

diff --git a/src/components/Layout/Header/Read.js b/src/components/Layout/Header/Read.js
@@ -1,5 +1,6 @@
 import React, { useState, useContext } from 'react'
 import { UserContext } from 'context'
+import BookCover from 'components/atoms/book-cover'
 import { Link } from 'react-router-dom'
 
 const ReadingList = ({ books, close }) => {
@@ -17,15 +18,14 @@ const ReadingList = ({ books, close }) => {
     >
       {books.map((book) => (
         <Link to={`/books/${book.id}`} key={book.id} onClick={close}>
-          <div
-            className="catalog-img"
+          <BookCover
+            book={book}
+            isCatalog
             style={{
-              backgroundImage: `url('${book.image || '/img/placeholder.jpg'}')`,
               width: 48,
               height: 64,
             }}
           />
-
           <div className="catalog-info">
             <h3 className="catalog-title">{book.name}</h3>
             <p className="catalog-author">
@@ -53,7 +53,6 @@ export default () => {
   return user && user.favoriteBooks.length > 0 ? (
     <>
       <span
-        href="http://dev08.morozovoleg.com/home.html"
         className="header-nav__link"
         onClick={() => setShowDropdown(!showDropdown)}
       >

diff --git a/src/components/Layout/Header/SignupBtn.js b/src/components/Layout/Header/SignupBtn.js
@@ -6,7 +6,7 @@ const SignupBtn = () => (
       className="btn-login"
       href={`${process.env.REACT_APP_BACKEND_URL}/auth/google`}
     >
-      Sign Up
+      Login
     </a>
   </li>
 )

diff --git a/src/components/Layout/Header/User.js b/src/components/Layout/Header/User.js
@@ -1,6 +1,7 @@
 import React, { useState, useContext } from 'react'
 import { UserContext } from 'context'
 import { Link, useHistory } from 'react-router-dom'
+import Flex from 'components/atoms/flex'
 
 export default () => {
   const [showDropdown, setShowDropdown] = useState(false)
@@ -30,26 +31,30 @@ export default () => {
               push(`/users/${user.username ? `@${user.username}` : user.id}`)
             }
           >
-            <div
-              className="header-notification-user__avatar"
-              style={{
-                background: `url("${user.avatar}")`,
-                backgroundSize: 'cover',
-              }}
-            />
-            <div className="header-notification-user__info">
-              <div className="header-notification-user__name">
-                {user.fullname}
+            <Flex row style={{ cursor: 'pointer' }}>
+              <div
+                className="header-notification-user__avatar"
+                style={{
+                  background: `url("${user.avatar}")`,
+                  backgroundSize: 'cover',
+                  // backgroundSize: 'contain',
+                  cursor: 'pointer',
+                }}
+              />
+              <div className="header-notification-user__info">
+                <div className="header-notification-user__name">
+                  {user.fullname}
+                </div>
+                <div className="header-notification-user__username">
+                  {user.username ? `@${user.username}` : `@user${user.id}`}
+                </div>
               </div>
-              <div className="header-notification-user__username">
-                {user.username ? `@${user.username}` : `@user${user.id}`}
-              </div>
-            </div>
+            </Flex>
           </div>
           <div className="header-notification-user__body">
             <ul className="header-notification-user__list">
               <li>
-                <Link to="/new-book">New story</Link>
+                <Link to="/new-book">New book</Link>
               </li>
               <li>
                 <Link
@@ -59,11 +64,7 @@ export default () => {
                 </Link>
               </li>
               <li>
-                <Link
-                  to={`/users/${user.username ? `@${user.username}` : user.id}`}
-                >
-                  Settings
-                </Link>
+                <Link to={'/explore'}>Explore</Link>
               </li>
               <li>
                 <Link to={`/help`}>Help</Link>