removed shared cookie logic

src/providers/Comments/index.tsx

@@ -1,4 +1,4 @@
-import React, { useReducer, useCallback, useEffect } from 'react';
+import React, { useReducer, useCallback } from 'react';
 import { useRequest } from 'providers/Requests';
 
 export type IComment = {
@@ -111,7 +111,7 @@ type Props = {
 };
 
 export default function CommentsProvider(props: Props) {
-  const { instance, token } = useRequest();
+  const { instance } = useRequest();
 
   const [state, dispatch] = useReducer(reducer, {
     ...initialState
@@ -150,13 +150,6 @@ export default function CommentsProvider(props: Props) {
     dispatch({ type: 'REPLY_COMMENT', payload: comment });
   }, []);
 
-  useEffect(() => {
-    console.log('token ', token);
-    if (token) {
-      getComments();
-    }
-  }, [getComments, token]);
-
   return (
     <CommentsStateContext.Provider value={state}>
       <CommentsDispatchContext.Provider

src/providers/Requests/index.tsx

@@ -1,13 +1,13 @@
-import React, { useState, useMemo, useEffect } from 'react';
+import React, { useState, useMemo } from 'react';
 import axios, { AxiosInstance } from 'axios';
 import { ClientJS } from 'clientjs';
+import { getCookie } from 'react-use-cookie';
 import { ErrorMessage, Close } from '../Comments/style';
 import { FadeIn } from './style';
 
 const RequestContext = React.createContext<
   | {
       instance: AxiosInstance;
-      token: string;
     }
   | undefined
 >(undefined);
@@ -26,17 +26,18 @@ type Props = {
 
 export default function RequestProvider(props: Props) {
   const [error, setError] = useState('');
-  const [token, setToken] = useState('');
 
   const instance = useMemo(() => {
     const pageId = `${window.location.hostname}${window.location.pathname}`;
     const client = new ClientJS();
     const fingerprint = client.getFingerprint();
+    const token = getCookie('token');
 
     return axios.create({
       baseURL: process.env.REACT_APP_API_URL,
       headers: {
-        fingerprint
+        fingerprint,
+        token
       },
       transformRequest: [
         function (data) {
@@ -59,31 +60,13 @@ export default function RequestProvider(props: Props) {
     });
   }, [axios]);
 
-  useEffect(() => {
-    const messageListener = (e: any) => {
-      if (!e.data || e.data.sender !== 'zoomment' || !e.data.token) {
-        return;
-      }
-
-      instance.defaults.headers['token'] = e.data.token;
-      setToken(e.data.token);
-    };
-
-    window.addEventListener('message', messageListener, false);
-
-    return () => {
-      window.removeEventListener('message', messageListener);
-    };
-  }, []);
-
   return (
-    <RequestContext.Provider value={{ instance, token }}>
+    <RequestContext.Provider value={{ instance }}>
       {error && (
         <ErrorMessage>
           {error} <Close onClick={() => setError('')} />
         </ErrorMessage>
       )}
-      <iframe src="https://zoomment.com/token" style={{ display: 'none' }} />
       <FadeIn>{props.children}</FadeIn>
     </RequestContext.Provider>
   );