🚚 fixing cors issues on backend

src/App.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
 import { connect } from "react-redux";
-// import axios from "axios";
+import axios from "axios";
 import API from "./utils/axiosInstance";
 
 import "./App.css";
@@ -19,7 +19,8 @@ const App = ({ isAuth, setAuthState }) => {
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
-    API.get("/auth/state", { withCredentials: true })
+    axios
+      .get("http://localhost:5000/auth/state", { withCredentials: true })
       .then((res) => {
         setAuthState(res.data);
         setIsLoading(false);

src/components/Profile/EditInfo.jsx

@@ -59,9 +59,7 @@ class EditInfo extends React.Component {
 
   componentDidUpdate(prevProps) {
     if (prevProps.isLoading !== this.props.isLoading) {
-      const {
-        name, email, phone, bio, image
-      } = prevProps.user;
+      const { name, email, phone, bio, image } = prevProps.user;
 
       this.setState((state) => ({
         ...state,
@@ -123,9 +121,7 @@ class EditInfo extends React.Component {
   };
 
   render() {
-    const {
-      name, email, phone, bio, image
-    } = this.state.profile;
+    const { name, email, phone, bio, image } = this.state.profile;
     const error = this.props.errors;
 
     return (
@@ -180,9 +176,8 @@ class EditInfo extends React.Component {
                 name="email"
                 type="email"
                 placeholder="Enter your email..."
-                value={email || ""}
+                defaultValue={email || ""}
                 error={error.error}
-                onChange={this.inputChangeHandler}
                 required
               />
               <div style={{ marginTop: "23px" }}>

src/redux/actions/authActions.js

@@ -1,4 +1,4 @@
-import API from "../../utils/axiosInstance";
+import axios from "axios";
 
 import {
   SET_CURRENT_USER,
@@ -8,6 +8,11 @@ import {
   SET_AUTH_STATE,
 } from "./types";
 
+const backendURL =
+  process.env.NODE_ENV === "production"
+    ? process.env.REACT_APP_BACKEND_PROD_URL
+    : process.env.REACT_APP_BACKEND_DEV_URL;
+
 export const setCurrentUser = (newUser) => ({
   type: SET_CURRENT_USER,
   payload: newUser,
@@ -27,10 +32,11 @@ export const registerUser = (userData, history) => (dispatch) => {
   // Clear previous errors
   dispatch(clearErrors());
 
-  API.post("/auth/signup", userData)
+  axios
+    .post(`${backendURL}/auth/signup`, userData, {
+      withCredentials: true,
+    })
     .then((res) => {
-      // console.log(res);
-
       const {
         name,
         bio,
@@ -66,7 +72,10 @@ export const loginUser = (userData, history) => (dispatch) => {
   // Clear previous errors
   dispatch(clearErrors());
 
-  API.post("/auth/login", userData)
+  axios
+    .post(`${backendURL}/auth/login`, userData, {
+      withCredentials: true,
+    })
     .then((res) => {
       const {
         name,
@@ -91,7 +100,6 @@ export const loginUser = (userData, history) => (dispatch) => {
       };
 
       dispatch(setCurrentUser(user));
-
       history.push("/");
     })
     .catch((err) => {
@@ -101,7 +109,8 @@ export const loginUser = (userData, history) => (dispatch) => {
 
 // Get user profile
 export const fetchUserProfile = (callback) => (dispatch) => {
-  API.get("/profile", { withCredentials: true })
+  axios
+    .get(`${backendURL}/profile`, { withCredentials: true })
     .then((res) => {
       const {
         name,
@@ -138,7 +147,10 @@ export const editUserProfile = (userdata, history) => (dispatch) => {
   // Clear previous errors
   dispatch(clearErrors());
 
-  API.post("/profile/edit", userdata, { withCredentials: true })
+  axios
+    .post(`${backendURL}/profile/edit`, userdata, {
+      withCredentials: true,
+    })
     .then(() => history.push("/"))
     .catch((err) => {
       // console.dir(err);
@@ -149,7 +161,8 @@ export const editUserProfile = (userdata, history) => (dispatch) => {
 // Logout user
 
 export const logoutUser = (history) => (dispatch) => {
-  API.get("/auth/logout", { withCredentials: true })
+  axios
+    .get(`${backendURL}/auth/logout`, { withCredentials: true })
     .then(() => {
       dispatch({ type: CLEAR_CURRENT_USER });
       history.push("/login");

src/utils/axiosInstance.js

@@ -1,7 +1,12 @@
-import axios from "axios";
+// import axios from "axios";
 
-const API = axios.create({
-  baseURL: process.env.REACT_APP_BACKEND_URL,
-});
+// const backendURL =
+//   process.env.NODE_ENV === "production"
+//     ? process.env.REACT_APP_BACKEND_PROD_URL
+//     : process.env.REACT_APP_BACKEND_DEV_URL;
 
-export default API;
+// const API = axios.create({
+//   baseURL: backendURL,
+// });
+
+// export default API;