Fixes

client/src/components/App.js

@@ -1,13 +1,10 @@
-// import logo from './../logo.svg';
-// import './../styles/App.css';
-
-import React, { Component } from 'react';
+import React from 'react';
 import LinkList from './LinkList';
 import CreateLink from './CreateLink'
 import Header from './Header';
 import Login from './Login'
 import Search from './Search';
-import { Redirect, Route, Switch } from 'react-router-dom';
+import { Route, Switch } from 'react-router-dom';
 
 const App = () => {
   return (
@@ -34,31 +31,4 @@ const App = () => {
   );
 };
 
-// class App extends Component {
-//   render() {
-//     return <CreateLink />;
-//   }
-// }
-
-// function App() {
-//   return (
-//     <div className="App">
-//       <header className="App-header">
-//         <img src={logo} className="App-logo" alt="logo" />
-//         <p>
-//           Edit <code>src/App.js</code> and save to reload.
-//         </p>
-//         <a
-//           className="App-link"
-//           href="https://reactjs.org"
-//           target="_blank"
-//           rel="noopener noreferrer"
-//         >
-//           Learn React
-//         </a>
-//       </header>
-//     </div>
-//   );
-// }
-
 export default App;

client/src/components/CreateLink.js

@@ -36,7 +36,7 @@ const CreateLink = () => {
             const skip = 0;
             const orderBy = { createdAt: 'desc' };
 
-            const data = cache.readQuery({
+            const { data } = cache.readQuery({
                 query: FEED_QUERY,
                 variables: {
                     take,

client/src/components/Header.js

@@ -12,15 +12,15 @@ const Header = () => {
                 <div className="fw7 mr1">Hacker News</div>
                 <Link to="/" className="ml1 no-underline black">
                     new
-        </Link>
+                </Link>
                 <div className="ml1">|</div>
                 <Link to="/top" className="ml1 no-underline black">
                     top
-</Link>
+                </Link>
                 <div className="ml1">|</div>
                 <Link to="/search" className="ml1 no-underline black">
                     search
-  </Link>
+                </Link>
                 {authToken && (
                     <div className="flex">
                         <div className="ml1">|</div>
@@ -29,7 +29,7 @@ const Header = () => {
                             className="ml1 no-underline black"
                         >
                             submit
-            </Link>
+                        </Link>
                     </div>
                 )}
             </div>
@@ -57,31 +57,4 @@ const Header = () => {
     );
 };
 
-export default Header;
-
-// import React from 'react';
-// import { useHistory } from 'react-router';
-// import { Link, withRouter } from 'react-router-dom';
-
-// const Header = () => {
-//     const history = useHistory();
-//     return (
-//         <div className="flex pa1 justify-between nowrap orange">
-//             <div className="flex flex-fixed black">
-//                 <div className="fw7 mr1">Hacker News</div>
-//                 <Link to="/" className="ml1 no-underline black">
-//                     new
-//         </Link>
-//                 <div className="ml1">|</div>
-//                 <Link
-//                     to="/create"
-//                     className="ml1 no-underline black"
-//                 >
-//                     submit
-//         </Link>
-//             </div>
-//         </div>
-//     );
-// };
-
-// export default Header;
+export default Header;

client/src/components/Link.js

@@ -85,7 +85,7 @@ const Link = (props) => {
         </div>
                 {authToken && (
                     <div className="f6 lh-copy gray">
-                        {link.votes.length} votes | by{' '}
+                        {link.votes.length} votes, submitted by{' '}
                         {link.postedBy ? link.postedBy.name : 'Unknown'}{' '}
                         {timeDifferenceForDate(link.createdAt)}
                     </div>
@@ -95,15 +95,4 @@ const Link = (props) => {
     );
 };
 
-// const Link = (props) => {
-//     const { link } = props;
-//     return (
-//         <div>
-//             <div>
-//                 {link.id} - {link.description} ({link.url})
-//       </div>
-//         </div>
-//     );
-// };
-
 export default Link;

client/src/components/LinkList.js

@@ -11,7 +11,6 @@ export const FEED_QUERY = gql`
     $orderBy: LinkOrderByInput
   ) {
     feed(take: $take, skip: $skip, orderBy: $orderBy) {
-      id
       links {
         id
         createdAt
@@ -171,28 +170,4 @@ const LinkList = () => {
   );
 };
 
-// const LinkList = () => {
-//     const linksToRender = [
-//         {
-//             id: '1',
-//             description:
-//                 'Link first😎',
-//             url: 'https://prisma.io'
-//         },
-//         {
-//             id: '2',
-//             description: 'Link zwei',
-//             url: 'https://www.apollographql.com/docs/react/'
-//         }
-//     ];
-// 
-//     return (
-//         <div>
-//             {linksToRender.map((link) => (
-//                 <Link key={link.id} link={link} />
-//             ))}
-//         </div>
-//     );
-// };
-
 export default LinkList;

client/src/components/Search.js

@@ -1,5 +1,4 @@
 import React, { useState } from 'react';
-import { useMutation } from '@apollo/client';
 import { useLazyQuery } from '@apollo/client';
 import gql from 'graphql-tag';
 import Link from './Link';

client/src/constants.js

@@ -1,2 +1,2 @@
 export const AUTH_TOKEN = 'auth-token';
-export const LINKS_PER_PAGE = 3;
+export const LINKS_PER_PAGE = 5;

client/src/index.js

@@ -2,28 +2,15 @@ import React from 'react';
 import { BrowserRouter } from 'react-router-dom';
 import { setContext } from '@apollo/client/link/context';
 import { AUTH_TOKEN } from './constants';
-
 import { split } from '@apollo/client';
 import { WebSocketLink } from '@apollo/client/link/ws';
 import { getMainDefinition } from '@apollo/client/utilities';
-// import LinkList from './components/LinkList';
-
-// class App extends Component {
-//   render() {
-//     return <LinkList />;
-//   }
-// }
-
-// export default App;
-
-// import React from 'react';
 import ReactDOM from 'react-dom';
 import './styles/index.css';
 import './styles/tachyons.min.css'
 import App from './components/App';
-// // import * as serviceWorker from './serviceWorker';
 
-// // 1
+// 1
 import {
   ApolloProvider,
   ApolloClient,