fix: remove lint errors

package.json

@@ -45,9 +45,9 @@
     ]
   },
   "scripts": {
-    "dev": "next dev -p ${PORT:=3000}",
+    "dev": "next dev",
     "build": "next build",
-    "start": "next start -p ${PORT:=3000}",
+    "start": "next start",
     "lint": "eslint src/*",
     "test": "jest"
   },

src/components/layout/Container.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from "theme-ui";
 
-export function Container({ props }) {
+export function Container(props) {
   return (
     <div
       {...props}

src/components/layout/Stack.js

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+import PropTypes from "prop-types";
 import { jsx } from "theme-ui";
 
 export function Stack({ gap = "medium", ...props }) {
@@ -12,3 +13,14 @@ export function Stack({ gap = "medium", ...props }) {
     />
   );
 }
+Stack.propTypes = {
+  gap: PropTypes.oneOf([
+    "xxsmall",
+    "xsmall",
+    "small",
+    "medium",
+    "large",
+    "xlarge",
+    "xxlarge",
+  ]),
+};

src/components/layout/auth.layout.js

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+import PropTypes from "prop-types";
 import { IconContext } from "react-icons";
 import { Box, Flex, jsx } from "theme-ui";
 import { Header } from "./header";
@@ -19,3 +20,6 @@ export function Layout({ children }) {
     </IconContext.Provider>
   );
 }
+Layout.propTypes = {
+  children: PropTypes.node,
+};

src/components/layout/header.js

@@ -9,7 +9,6 @@ import { Container } from "next/app";
 export function Header() {
   console.log("[header]");
   const { user, logout } = useAuth();
-  console.log({ user });
   return (
     <Container>
       <header

src/components/list/index.js

@@ -1,10 +1,17 @@
 /** @jsx jsx */
 import { jsx } from "theme-ui";
+import PropTypes from "prop-types";
 
 export function List({ children }) {
   return <ul sx={{ px: 0 }}>{children}</ul>;
 }
+List.propTypes = {
+  children: PropTypes.node,
+};
 
 export function Li({ children }) {
   return <li sx={{ listStyle: "none" }}>{children}</li>;
 }
+Li.propTypes = {
+  children: PropTypes.node,
+};

src/hooks/useAuth.js

@@ -1,6 +1,6 @@
 import PropTypes from "prop-types";
 import React, { createContext, useContext, useEffect, useState } from "react";
-import { getToken, setToken } from "src/lib/auth";
+import { setToken } from "src/lib/auth";
 import { request } from "src/lib/request";
 import { useQuery } from "urql";
 
@@ -25,7 +25,6 @@ query getUser {
 `;
 
 export function AuthProvider({ children }) {
-  console.log("[AuthProvider] token", getToken() ? "✅" : "❌");
   const [user, setUser] = useState(null);
   const [result] = useQuery({ query: getUserQuery });
   useEffect(() => {
@@ -45,7 +44,6 @@ AuthProvider.propTypes = {
 };
 
 export function useAuth() {
-  console.log("[useAuth]");
   const { user, setUser } = useContext(AuthContext);
   async function logout() {
     setToken(null);

src/lib/auth.js

@@ -8,7 +8,6 @@ import { setRefreshTokenCookie } from "./setRefreshTokenCookie";
 
 let token = null;
 
-console.log("[ AUTHJS ]", { token });
 function getToken() {
   return token ? token.jwt_token : null;
 }
@@ -18,9 +17,9 @@ function getUserId() {
 }
 
 function isTokenExpired() {
-  console.log("[ isTokenExpired ]", token);
-  if (!token) return true;
-  return Date.now() > new Date(token.jwt_token_expiry);
+  const expired = !token || Date.now() > new Date(token.jwt_token_expiry);
+  console.log("[ isTokenExpired ]", { expired });
+  return expired;
 }
 
 async function refreshToken(ctx) {
@@ -51,11 +50,10 @@ async function refreshToken(ctx) {
     if (ctx && ctx.res) {
       setRefreshTokenCookie(ctx.res, tokenData.refresh_token);
     }
-
-    setToken(tokenData);
+    return tokenData;
   } catch (error) {
     console.error("[ auth.refreshToken error ]", { error });
-    console.log("[auth.refreshToken error]", token);
+    console.log("[auth.refreshToken error]", { token });
     if (ctx && ctx.res) {
       ctx.res.writeHead(302, { Location: "/login" });
       ctx.res.end();
@@ -65,8 +63,6 @@ async function refreshToken(ctx) {
       return;
     }
   }
-
-  return getToken();
 }
 
 function setToken(tokenData) {
@@ -75,26 +71,27 @@ function setToken(tokenData) {
 
 function withAuthProvider(WrappedComponent) {
   return class extends React.Component {
-    static displayName = `withAuthSync(${getDisplayName(WrappedComponent)})`;
+    static displayName = `withAuthProvider(${getDisplayName(
+      WrappedComponent
+    )})`;
     static async getInitialProps(ctx) {
       console.log(
         "[withAuthProvider] getInitialProps",
         ctx.req ? "server" : "client",
-        getToken() ? "found token" : "no token"
+        token ? "found token" : "no token"
       );
 
+      // eachtime we render a page on the server
+      // we need to set token to null to be sure
+      // that will not re-use an old token since
+      // token is a global var
+      // Once urlq exchange will have access to context
+      // we could use context to pass token to urlqclient
       if (ctx?.req) {
-        console.log("init page context for server");
-        setToken(null);
+        token = null;
       }
-
-      const jwt_token = getToken();
-      if (!jwt_token) {
-        try {
-          await refreshToken(ctx);
-        } catch {
-          console.error("[withAuthProvider] no token");
-        }
+      if (!token) {
+        token = await refreshToken(ctx);
       }
 
       const componentProps =

src/lib/authTokenExchange.js

@@ -67,12 +67,10 @@ export const authExchange = ({ forward }) => {
         const refreshTokenFn = operation.context.fetchOptions.refreshToken;
         // check whether the token is expired
         const isExpired = isTokenExpired();
-        console.log(["authExchange"], getToken() ? " ok !!" : "nope :(");
         // If it's not expired then just add it to the operation immediately
         if (!isExpired) {
           return fromValue(addTokenToOperation(operation, getToken()));
         }
-        console.log("[authExchange] expired token");
 
         // If it's expired and we aren't refreshing it yet, start refreshing it
         if (isExpired && !refreshTokenPromise) {

src/pages/_app.js

@@ -18,7 +18,7 @@ class MyApp extends App {
     });
     // force onload swapping on stylesheet since it's not work on nextjs
     // @see _document.js
-    const fontCss = window.document.getElementById("fonts");
+    const fontCss = document.getElementById("fonts");
     if (fontCss) {
       fontCss.media = "all";
     }

src/pages/_document.js

@@ -23,13 +23,7 @@ class MyDocument extends Document {
         <Head>
           <link rel="shortcut icon" href="/favicon.ico" />
           <link rel="preload" href="/fonts.css" as="style" />
-          <link
-            rel="stylesheet"
-            id="fonts"
-            onLoad={(this.media = "all")}
-            href="/fonts.css"
-            media="print"
-          />
+          <link rel="stylesheet" id="fonts" href="/fonts.css" media="print" />
         </Head>
         <body>
           <Main />

src/pages/_error.js

@@ -1,4 +1,5 @@
 import React from "react";
+import PropTypes from "prop-types";
 import Error from "next/error";
 import * as Sentry from "@sentry/node";
 
@@ -13,6 +14,12 @@ const MyError = ({ hasGetInitialPropsRun, statusCode, err }) => {
   return <Error statusCode={statusCode} />;
 };
 
+MyError.propTypes = {
+  err: PropTypes.object,
+  hasGetInitialPropsRun: PropTypes.bool,
+  statusCode: PropTypes.number.isRequired,
+};
+
 MyError.getInitialProps = async ({ res, err, asPath }) => {
   const errorInitialProps = await Error.getInitialProps({ res, err });
   // Workaround for https://github.com/zeit/next.js/issues/8592, mark when