authReducer complete

hipstagram/src/Content/Profile/MyPosts/Post/post.css

@@ -1,9 +0,0 @@
-.avatar {
-    width: 80px;
-    height: 80px;
-    border-radius: 50%;
-}
-
-.likes {
-    color: rgb(119, 238, 73);
-}

hipstagram/src/Content/Profile/MyPosts/Post/post.js

@@ -1,19 +0,0 @@
-import React from 'react';
-import './post.css';
-
-
-
-function Post(props) {
-    return(
-        <div>
-            <img className="avatar" src="https://www.denofgeek.com/wp-content/uploads/2020/04/Avatar-The-Last-Airbender-Netflix.png?fit=2400%2C1350" />
-            {props.message}
-
-            <div className='likes'>
-                <span>like</span> {props.likesCount}
-            </div>
-        </div>
-    )
-}
-
-export default Post;

hipstagram/src/Content/Profile/MyPosts/myPosts.css

@@ -1,18 +0,0 @@
-.myposts-block {
-    padding: 10px;
-}
-
-.myposts-content__block {
-    display: grid;
-    margin: 10px;
-}
-
-.myposts-content__block button {
-    margin-top: 10px;
-    width: 120px;
-}
-
-.myposts-content__block textarea {
-    height: 100px;
-    width: 780px;
-}

hipstagram/src/Content/Profile/MyPosts/myPosts.js

@@ -1,25 +0,0 @@
-import React from 'react';
-import Post from './Post/post';
-import './myPosts.css';
-
-function MyPosts() {
-    return(
-        <div className="myposts-block">
-            My posts
-            <div>
-                <div className='myposts-content__block'>
-                    <textarea />
-                    <button>Add post</button>
-                </div>
-
-                New post
-
-                <Post />
-                <Post />
-                <Post />
-            </div>
-        </div>
-    )
-}
-
-export default MyPosts;

hipstagram/src/Content/Profile/ProfileInfo/profileInfo.css

@@ -1,3 +0,0 @@
-.profile-avatar {
-    padding: 10px;
-}

hipstagram/src/Content/Profile/ProfileInfo/profileInfo.js

@@ -1,15 +0,0 @@
-import './profileInfo.css';
-
-const ProfileInfo = () => {
-  return (
-    <div>
-      <div>
-        <img src="https://images.ctfassets.net/hrltx12pl8hq/6bi6wKIM5DDM5U1PtGVFcP/1c7fce6de33bb6575548a646ff9b03aa/nature-photography-pictures.jpg?fit=fill&w=800&h=300"></img>
-      </div>
-
-      <div className="profile-avatar">ava + description</div>
-    </div>
-  );
-};
-
-export default ProfileInfo;

hipstagram/src/Content/Profile/profile.js

@@ -1,13 +1,12 @@
 import React from 'react';
 import './profile.css';
-import ProfileInfo from './ProfileInfo/profileInfo';
 
 function Profile() {
     return(
         <div className='content-wrapper'>
 
             <div className='content'>
-                <ProfileInfo />
+                Profile
             </div>
         </div>
     );

hipstagram/src/Content/Users/users.js

@@ -4,7 +4,7 @@ import "./users.css";
 let Users = () => {
     return (
         <div className='users-wrapper'>
-            
+            Users
         </div>
     )
 }

hipstagram/src/Redux/promise_reducer.js

@@ -1,51 +1,66 @@
-import { createStore, combineReducers, applyMiddleware } from "redux";
+import { createStore, combineReducers, applyMiddleware } from 'redux';
 import thunk from 'redux-thunk';
+import jwt_decode from "jwt-decode";
 
 const authReducer = (state, action) => {
-    // if(action.type===)
+    if(!state) {
+        if(!localStorage.authToken) {
+            return {}
+        } else {
+            // return {
+            //     login: jwt_decode(localStorage.authToken).sub.login,
+            //     id: jwt_decode(localStorage.authToken).sub.id
+            // }
+            action.type = 'LOGIN';
+            action.jwt = localStorage.authToken
+        }
+    }
+    if(action.type === 'LOGIN') {
+        localStorage.authToken = action.jwt;
+        return {
+            id: jwt_decode(action.jwt).sub.id, 
+            login: jwt_decode(action.jwt).sub.login,
+            isLogin: true,
+            token: action.jwt
+        }
+    }
+    if(action.type === 'LOGOUT') {
+        localStorage.removeItem('authToken');
+        return {};
+    }
+    return state
 }
 const promiseReducer = (state, action) => {
     if (action.type === 'LOGIN' || action.type === 'LOGOUT') {
         return {}
     }
     if (action.type === 'PROMISE') {
-        return
+        return{
+            ...state,
+            [action.name]: {
+                status: action.status, 
+                payload: (action.status === "PENDING" && state[action.name] && state[action.name].payload) || action.payload, // зачем эта проверка?
+                error: action.error
+            }
+        }
     }
-    return state
+return state
 }
 const actionPromise = (name, promise) => {
-    const actionPending = () => ({
-        type: 'PROMISE',
-        name,
-        status: 'PENDING',
-        payload: null,
-        error: null
-    })
-    const actionResolved = (payload) => ({
-        type: 'PROMISE',
-        name,
-        status: 'RESOLVED',
-        payload,
-        error: null
-    })
-    const actionRejected = (error) => ({
-        type: 'PROMISE',
-        name,
-        status: 'REJECTED',
-        payload: null,
-        error
-    })
+    const actionPending = () => ({ type: 'PROMISE', name, status: 'PENDING', payload: null, error: null })
+    const actionResolved = (payload) => ({ type: 'PROMISE', name, status: 'RESOLVED', payload, error: null })
+    const actionRejected = (error) => ({ type: 'PROMISE', name, status: 'REJECTED', payload: null, error })
     return async (dispatch) => {
         dispatch(actionPending())
-        let payload;
+        let result;
         try {
-            payload = await promise
-            dispatch(actionResolved(payload))
+            result = await promise
+            dispatch(actionResolved(result))
         }
         catch (e) {
             dispatch(actionRejected(e))
         }
-        return payload
+        return result
     }
 }
 

hipstagram/src/index.js

@@ -7,13 +7,13 @@ import { BrowserRouter } from "react-router-dom";
 import { Provider } from "react-redux";
 
 ReactDOM.render(
-    <React.StrictMode>
+    // <React.StrictMode>
         <BrowserRouter>
-            <Provider>
+            {/* <Provider> */}
                 <App />
-            </Provider>
-        </BrowserRouter>
-    </React.StrictMode>,
+            {/* </Provider> */}
+        </BrowserRouter>,
+    // </React.StrictMode>,
     document.getElementById("root")
 );