create,change, test

package.json

@@ -3,9 +3,11 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "antd": "^3.13.2",
     "axios": "^0.18.0",
     "bootstrap": "^4.2.1",
     "jquery": "^3.3.1",
+    "jwt-decode": "^2.2.0",
     "node-sass": "^4.11.0",
     "popper.js": "^1.14.6",
     "react": "^16.6.3",

src/actions/admin/category/createCategory.js

@@ -1,9 +1,10 @@
 import * as actionTypes from '../../../constants/admin';
 
-export const createCategoryRequest = payload => ({
-    type: actionTypes.CREATE_CATEGORY_REQUEST,
+export const createCategoryRequest = payload => {
+    console.log(payload,"jjjjjjjjj")
+  return{  type: actionTypes.CREATE_CATEGORY_REQUEST,
     payload
-});
+}};
 export const createCategorySuccess = payload => ({
     type: actionTypes.CREATE_CATEGORY_REQUEST_SUCCESS,
     payload

src/actions/admin/changeTest/changeTest.js

@@ -0,0 +1,25 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const changeTestRequest = payload => {
+    console.log(payload)
+    return{
+    type: actionTypes.CHANGE_TEST_REQUEST,
+    payload
+};
+}
+export const changeTopicSuccess = payload => ({
+    type: actionTypes.CHANGE_TOPIC_REQUEST_SUCCESS,
+    payload
+});
+export const changeQuestionSuccess = payload => ({
+    type: actionTypes.CHANGE_QUESTIONS_REQUEST_SUCCESS,
+    payload
+});
+export const createAnswersSuccess = payload => ({
+    type: actionTypes.CHANGE_ANSVERS_REQUEST_SUCCESS,
+    payload
+});
+export const createTopicsFailure = error => ({
+    type: actionTypes.CHANGE_TEST_REQUEST_FAILURE,
+    error
+});

src/actions/admin/changeTest/deleteQuestion.js

@@ -0,0 +1,18 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const deleteQuestionRequest = payload => {
+    console.log(payload)
+    return{
+    type: actionTypes.DELETE_QUESTION_REQUEST,
+    payload
+};
+}
+export const deleteQuestionSuccess = payload => ({
+    type: actionTypes.DELETE_QUESTION_REQUEST_SUCCESS,
+    payload
+});
+
+export const deleteQuestionFailure = error => ({
+    type: actionTypes.DELETE_QUESTION_REQUEST_FAILURE,
+    error
+});

src/actions/admin/changeTest/deleteTopic.js

@@ -0,0 +1,18 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const deleteTopicRequest = payload => {
+    console.log(payload)
+    return{
+    type: actionTypes.DELETE_TOPIC_REQUEST,
+    payload
+};
+}
+export const deleteTopicSuccess = payload => ({
+    type: actionTypes.DELETE_TOPIC_REQUEST_SUCCESS,
+    payload
+});
+
+export const deleteTopicFailure = error => ({
+    type: actionTypes.DELETE_TOPIC_REQUEST_FAILURE,
+    error
+});

src/actions/admin/changeTest/getAnswers.js

@@ -0,0 +1,18 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const getAnswersRequest = payload => {
+    console.log(payload)
+    return{
+    type: actionTypes.GET_ANSWERS_REQUEST,
+    payload
+};
+}
+export const getAnswersSuccess = payload => ({
+    type: actionTypes.GET_ANSWERS_REQUEST_SUCCESS,
+    payload
+});
+
+export const getAnswersFailure = error => ({
+    type: actionTypes.GET_ANSWERS_REQUEST_FAILURE,
+    error
+});

src/actions/admin/changeTest/getQuestions.js

@@ -0,0 +1,18 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const getQuestionsRequest = payload => {
+    console.log(payload)
+    return{
+    type: actionTypes.GET_QUESTIONS_REQUEST,
+    payload
+};
+}
+export const getQuestionsSuccess = payload => ({
+    type: actionTypes.GET_QUESTIONS_REQUEST_SUCCESS,
+    payload
+});
+
+export const getQuestionsFailure = error => ({
+    type: actionTypes.GET_QUESTIONS_REQUEST_FAILURE,
+    error
+});

src/actions/admin/changeTest/getTopic.js

@@ -0,0 +1,17 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const getTopicRequest = payload => {
+    console.log(payload)
+    return{
+    type: actionTypes.GET_TOPIC_REQUEST,
+    payload
+};
+}
+export const getTopicSuccess = payload => ({
+    type: actionTypes.GET_TOPIC_REQUEST_SUCCESS,
+    payload
+});
+export const getTopicFailure = error => ({
+    type: actionTypes.GET_TOPIC_REQUEST_FAILURE,
+    error
+});

src/actions/admin/meUser.js

@@ -0,0 +1,13 @@
+import * as actionTypes from '../../constants/admin';
+
+export const myUserRequest = payload => ({
+    type: actionTypes.MY_USER_REQUEST,
+});
+export const myUserSuccess = payload => ({
+    type: actionTypes.MY_USER_REQUEST_SUCCESS,
+    payload
+});
+export const myUserFailure = error => ({
+    type: actionTypes.MY_USER_REQUEST_FAILURE,
+    error
+});

src/actions/admin/user/changeUser.js

@@ -0,0 +1,19 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const changeUserRequest = payload => {
+    console.log(payload)
+    return{
+
+        type: actionTypes.CHANGE_USERS_REQUEST,
+        payload
+    }
+    
+}
+export const changeUserSuccess = payload => ({
+    type: actionTypes.CHANGE_USERS_REQUEST_SUCCESS,
+    payload
+});
+export const changeUserFailure = error => ({
+    type: actionTypes.CHANGE_USERS_REQUEST_FAILURE,
+    error
+});

src/actions/admin/user/getUser.js

@@ -0,0 +1,17 @@
+import * as actionTypes from '../../../constants/admin';
+
+export const getUserRequest = payload => {
+    console.log('Inside the getUser action', payload);
+    return {
+        type: actionTypes.GET_USERS_REQUEST,
+        payload
+    };
+}
+export const getUserSuccess = payload => ({
+    type: actionTypes.GET_USERS_REQUEST_SUCCESS,
+    payload
+});
+export const getUserFailure = error => ({
+    type: actionTypes.GET_USERS_REQUEST_FAILURE,
+    error
+});

src/actions/auth/logOut.js

@@ -1,3 +1,17 @@
-export const logOut = () => ({
-    
-})
+import * as actionTypes from './../../constants/auth';
+
+const logOut = () => ({
+    type: actionTypes.LOG_OUT_REQUEST
+})
+
+export const logOutSuccess = payload => ({
+    type: actionTypes.LOG_OUT_REQUEST_SUCCESS,
+    payload
+})
+
+export const logOutFailure = ({ message: error }) => ({
+    type: actionTypes.LOG_OUT_REQUEST_FAILURE,
+    error
+})
+
+export default logOut;

src/actions/auth/signIn.js

@@ -1,6 +1,6 @@
 import * as actionTypes from './../../constants/auth';
 
-export const signIn = payload => ({
+const signIn = payload => ({
     type: actionTypes.SIGN_IN_REQUEST,
     payload
 });
@@ -12,3 +12,5 @@ export const signInFailure = error => ({
     type: actionTypes.SIGN_IN_REQUEST_FAILURE,
     error
 });
+
+export default signIn;

src/actions/auth/signUp.js

@@ -1,6 +1,6 @@
 import * as actionTypes from './../../constants/auth';
 
-export const signUp = payload => ({
+const signUp = payload => ({
     type: actionTypes.SIGN_UP_REQUEST,
     payload
 });
@@ -12,3 +12,5 @@ export const signUpFailure = error => ({
     type: actionTypes.SIGN_UP_REQUEST_FAILURE,
     error
 });
+
+export default signUp;

src/components/admin/CardsCreator/index.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { Field, reduxForm } from 'redux-form';
+import { connect } from 'react-redux';
+
+class CardCreator extends React.Component {
+    state = {
+        type: null
+    }
+
+    render() {
+        const { formProps } = this.props;
+        console.log('------------ PROPS --------------');
+        console.log(formProps);
+
+        return (
+            <div>
+                <h1>Create Test</h1>
+                <Field name='some' component='select'>
+                    <option value="some value 1">Optional</option>
+                    <option value="some value 2">Multioptional</option>
+                    <option value="some value 3">Open Answer</option>
+                    <option value="some value 4">Conformity</option>
+                </Field>
+            </div>
+        )
+    }
+}
+
+const mapStateToProps = state => ({
+    formProps: state.form
+})
+
+export default connect(mapStateToProps, null)(reduxForm({
+    form: "CardCreator"
+})(CardCreator))

src/components/admin/CreateTest/CreateQestions.js

@@ -1,105 +0,0 @@
-import React from 'react';
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
-import { Field, reduxForm } from 'redux-form';
-import formInput from '../../common/formInput';
-
-
-
-class CreateQuestions extends React.Component {
-
-    state ={
-        click:false,
-        klick:true,
-        array:[],
-        simple:false,
-        
-    }
-
-    submit=({name, description, questions })=>{
-        const {simple, array} = this.state;
-        console.log(this.state)
-        const {actions:{createTopicsRequest}, token, categoryId} = this.props;
-        console.log("name", name, "description", description, "question", questions, "categoryId", categoryId   )
-        console.log(this.props)
-        createTopicsRequest({
-            name,
-            description, 
-            questions,
-            array,
-            simple,
-            categoryId,
-            token
-
-        })
-    }
-    handelChange=(event)=>{
-            const target = event.target;
-        const value = target.type === 'checkbox' ? target.checked : target.value;
-        const name = target.name;
-    
-        this.setState({
-          [name]: value
-        });
-    }
-
-    onClick =() =>{        
-        this.setState((prevState) => ({ click: !prevState.click }));
-    }
-    
-
-    formSubmitinput =({answer})=>{    
-
-        const {ansversInput:{value},correctAnsversInput,checkAnsversInput} =this.refs
-        console.log(value,checkAnsversInput.value,correctAnsversInput.value);
-        const values ={
-            answer:answer,
-                       price:+correctAnsversInput.value,
-                       correct:checkAnsversInput.value
-        }
-        
-        this.setState((prevState) =>({array:prevState.array.push(values)},console.log(prevState.array) ))
-        console.log(this.state, answer.target)
-        
-    }
-    answersClick =()=>{
-        this.setState((prevState) => ({ click: !prevState.click }));
-    }
-    
-    
-
-    render() {
-        const {  handleSubmit} =this.props;
-        const {simple, price, correct, click,arrey} =this.state;
-        const {handelChange, submit, onClick, handelClick, formSubmitinput, answersClick} = this;
-
-
-       
-        return (
-            <div>
-            <form onSubmit = {handleSubmit(submit)}>
-                <h4 className ="text-white font-ci"> Enter question and set the difficulty level</h4>
-                <div className ="d-flex w-100 ">
-                <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 "  name ="questions" type = "questions" placeholder = "Create Qestions" component = {formInput} />
-                <Field className="bg-mist bg-mist-op text-white mt-4 pb-1  border rounded w-25 flex-row align-items-end check" name ="correct" type = "checkbox" checked ={correct} onChange ={handelChange} component = {formInput} />
-                </div>
-                <div>
-                <Field className = "bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="answer" type = "name" placeholder ="Add anwer" ref ='ansversInput'  component = {formInput} />
-                <Field className = "bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="price" type = "number" value ={price} ref ='correctAnsversInput'  component = {formInput} />
-                <Field className ="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="simple" type = "checkbox" checked ={simple}  ref ='checkAnsversInput'  component = {formInput} />
-                </div>
-    
-            </form >
-            </div>
-            
-            
-        )
-    }
-
-}
-
-
-
-export default reduxForm({
-    form: "createQuestionsForm",
-})(CreateQuestions);

src/components/admin/CreateTest/CreateTopic.js

@@ -1,145 +1,160 @@
 import React from 'react';
-import { Field, reduxForm } from 'redux-form';
+import { Field, reduxForm, formValueSelector } from 'redux-form';
 import formInput from '../../common/formInput';
-
-
+import { connect } from 'react-redux';
 
 class CreateTopic extends React.Component {
 
-    state ={
-        click:false,
-        klick:["1"],
-        array:[],
-        simple:false
-        
+    state = {
+        click: false,
+        arrayAnswers: [],
+        array: [],
+        simple: false,
+        click_2: false,
+        click_3: false
+
     }
 
-    submit=({name, description })=>{
-        const {actions:{createTopicsRequest}, token, categoryId} = this.props;
+    submit = () => {
+        const { actions: { createTopicsRequest }, categoryId, formValues: { name, description } } = this.props;
+        console.log(name, description)
         createTopicsRequest({
             name,
-            description, 
+            description,
             categoryId,
-            token
 
         })
     }
-    qestionAnswerSubmit = ({questions, correct }) =>{
-        const {simple, array} = this.state
-console.log(this.state)
-        const {topic:{data:{topic:{_id}}}, actions:{createTestRequest}, token} =this.props;
-        console.log("topicId",_id,questions, correct)
+    qestionAnswerSubmit = () => {
+        const { simple, array } = this.state
+        const {  topic: { _id }  , actions: { createTestRequest }, formValues: { questions } } = this.props;
+        console.log(questions)
         createTestRequest({
             questions,
             simple,
             _id,
-            array,
-            token
-
+            array
         })
-        this.setState({array: []})
-        const {ansversInput} =this.refs
-        // ansversInput.value = " "
- 
-        console.log(this.state, ansversInput.value)
+        this.setState({ arrayAnswers:[] })
+        this.setState({ array:[] })
+
+
+
 
     }
-    handelClick =()=>{
-        this.setState((prevState) => ({klick:prevState.klick.push("1")}))
-    }
-    handelChange=(event)=>{
-            const target = event.target;
-        const value = target.type === 'checkbox' ? target.checked : target.value;
-        const name = target.name;
-    
-        this.setState({
-          [name]: value
-        });
+
+    handelChange = () => { this.setState((prevState) => ({ simple: !prevState.simple })) }
+
+    handelClick = () => { this.setState((prevState) => ({ click: !prevState.click })) }
+
+    handleClick_3 = () => {
+        this.setState((prevState) => ({ click_2: !prevState.click_2 }))
+        this.setState({ click_3:true })
+        this.setState((prevState) => ({ arrayAnswers: prevState.arrayAnswers.concat(prevState.arrayAnswers.length + 1) }))
+
     }
+    handelClick_2 =()=>{
+        this.setState((prevState) => ({ click_3: !prevState.click_3 }))
 
-    onClick =() =>{        
-        this.setState((prevState) => ({ click: !prevState.click }));
     }
-    
-
-    formSubmitinput =({answer, price,correct})=>{    
-        console.log(answer, correct, price);
-        const values ={
-            answer:answer,
-                       price:+price,
-                       correct:correct
+    formSubmitinput = (event) => {
+        const currentId = this.state.arrayAnswers.length;
+
+        const values = {
+            answer: event[`answers${currentId}`],
+            price: Number(event[`price${currentId}`]),
+            correct: event[`correct${currentId}`] || false
         }
-        
-        this.setState((prevState) =>({array:prevState.array.push(values), klick:prevState.klick.push("1")},console.log(prevState.array) ))
-        console.log(this.state)
-        
+        console.log(values)
+        this.setState((prevState) => ({ array: prevState.array.push(values) }, console.log(prevState.array)))
+        this.setState((prevState) => ({ click_2: !prevState.click_2 }))
+
     }
 
-    
-    
 
     render() {
-        const {  handleSubmit} =this.props;
-        const {simple, price, correct, click, array, klick} =this.state;
-        const {handelChange, submit, onClick, handelClick, formSubmitinput,qestionAnswerSubmit} = this;
-
-
-       
+        const { handleSubmit} = this.props;
+        const { simple, price, correct, click, array, arrayAnswers, click_2, click_3 } = this.state;
+        const { handelChange, submit, handelClick, formSubmitinput, qestionAnswerSubmit, handelClick_2, handleClick_3 } = this;
+console.log(this.state)
         return (
             <div>
-            <form>
-                <h4 className ="text-white font-ci"> Enter topic </h4>
-                <Field className ="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 " name="name"  type="name" placeholder="Create Name Topic" component={formInput} />
-                <h4 className ="text-white font-ci"> Enter description </h4>
-                <Field className ="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 " name ="description" type = "textarea" placeholder = "Create Descriptions" component = {formInput} />
-                {
-                    !click
-                    ?
-                    <button onClick = {()=>{
-                        onClick()
-                        handleSubmit(submit)()
-                        }}> Create questions</button>
-                        :
-                        <div>
-                            <h4 className ="text-white font-ci"> Enter question and set the difficulty level</h4>
-                            <div className ="d-flex w-100 ">
-                                <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 "  name ="questions" type = "questions" placeholder = "Create Qestions" component = {formInput} />
-                                <Field className="bg-mist bg-mist-op text-white mt-4 pb-1  border rounded w-25 flex-row align-items-end check" name ="simple" type = "checkbox" checked ={simple} onChange ={handelChange} component = {formInput} />
-                            </div>
-                                    <div>
-                                        <Field className = "bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="answer"  type = "name" placeholder ="Add anwer"  ref ='ansversInput'  component = {formInput} />
-                                        <Field className = "bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="price" type = "number" value ={price}   component = {formInput} />
-                                        <Field className ="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="correct" type = "checkbox" checked ={correct}  component = {formInput} />
-                                    </div>)
+                <form onSubmit={handleSubmit(qestionAnswerSubmit)}>
+                    <h4 className="text-white font-ci"> Enter topic </h4>
+                    <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 " name="name" type="name" placeholder="Create Name Topic" component={formInput} />
+                    <h4 className="text-white font-ci"> Enter description </h4>
+                    <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 " name="description" type="textarea" placeholder="Create Descriptions" component={formInput} />
+                    {
+                        !click
+                            ?
+                            <button
+                                onClick={() => {
+                                    handelClick()
+                                    submit()
+                                }}>
+                                Create questions
+                            </button>
+                            :
+                            <div>
+                                <h4 className="text-white font-ci"> Enter question and set the difficulty level</h4>
+                                <div className="d-flex w-100 ">
+                                    <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded w-100 " name="questions" type="questions" placeholder="Create Qestions" component={formInput} />
+                                    <Field className="bg-mist bg-mist-op text-white mt-4 pb-1  border rounded w-25 flex-row align-items-end check" name="simple" type="checkbox" checked={simple} onChange={handelChange} component={formInput} />
+                                </div>
+                                {
+                                    click_3
+                                        ?
+
+                                        arrayAnswers.map(el =>
+                                            <div key={el} id={el}>
+                                                <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name={`answers${el}`} type="name" placeholder="Add anwer" ref='ansversInput' component={formInput} />
+                                                <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name={`price${el}`} type="number" value={price} component={formInput} />
+                                                <Field className="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name={`correct${el}`} type="checkbox" checked={correct} component={formInput} />
+                                            </div>
+                                        )
+                                        :
+                                null
+
+                                }
+
+                                <React.Fragment>
                                     {
-                                        array.map(el=>
-                                            <div>
-                                        <Field className = "bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="answer"  type = "name" placeholder ="Add anwer"  ref ='ansversInput'  component = {formInput} />
-                                        <Field className = "bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="price" type = "number" value ={price}   component = {formInput} />
-                                        <Field className ="bg-mist bg-mist-op text-white mt-3 mb-3 border rounded" name ="correct" type = "checkbox" checked ={correct}  component = {formInput} />
-                                    </div>)
-                                        }
-                                    
-                                         <button onClick={
-                                handleSubmit(formSubmitinput)}></button>
-                            <button className="form__submit-button form__submit-button--reset" onClick = {()=>
-                                {                                    
-                                handleSubmit(qestionAnswerSubmit)()}}></button>
-                            
-                       
-                        </div>
-                }
-   
-            </form>
+                                        click_2
+                                            ?
+                                            <button type="button" onClick={handleSubmit(formSubmitinput)}>Add answer</button>
+                                            :
+                                            <React.Fragment>
+                                                <button type="button " onClick={handleClick_3}>Create answers</button>
+                                                <button className="form__submit-button form__submit-button--reset" onClick ={handelClick_2} >Create Questions</button>
+
+                                            </React.Fragment>
+                                    }
+
+
+
+                                </React.Fragment>
+
+
+                                }
+
+                            </div>
+                    }
+
+                </form>
             </div>
-            )
-            
-}
+        )
+
+    }
 
 }
 
+const selector = formValueSelector('createTopicForm');
+
+const mapStateToProps = state => ({
 
+    formValues: selector(state, 'name', 'description', 'questions', 'simple', 'answer', 'price', 'correct')
+})
 
-export default reduxForm({
-    form: "createTopicForm"
-})(CreateTopic);
+export default connect(mapStateToProps, null)(reduxForm({
+    form: "createTopicForm",
+})(CreateTopic));

src/components/admin/CreateTest/index.js

@@ -1,61 +1,58 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
-import {getCategoryRequest} from '../../../actions/admin/category/getCategory';
+import { getCategoryRequest } from '../../../actions/admin/category/getCategory';
 import CreateTopic from './CreateTopic';
-import {createTopicsRequest} from '../../../actions/admin/test/createTopics';
-import {createTestRequest} from '../../../actions/admin/test/createTest';
+import { createTopicsRequest } from '../../../actions/admin/test/createTopics';
+import { createTestRequest } from '../../../actions/admin/test/createTest';
+import { myUserRequest } from '../../../actions/admin/meUser'
 
 
 
 
 class CreateTest extends React.Component {
     state = {
-        categoryId:null
+        categoryId: null
     }
 
     componentDidMount() {
-        const {getCategoryRequest, signIn:{token}} = this.props;
-        console.log("token", token)
-        getCategoryRequest(
-            token
-            )
-            
-        }
+        const { getCategoryRequest, myUserRequest } = this.props;
+        getCategoryRequest()
+    }
+
+    onClick = (event) => {
+        this.setState({ categoryId: event.target.value })
+    }
 
-        onClick =(event)=>{
-            this.setState({ categoryId: event.target.value })
-        }
 
 
-    
 
     render() {
-        const {category:{data}, signIn:{token}, createTopicsRequest,createTestRequest, topicId:{topic}} = this.props;
-        const {categoryId} = this.state
-        const {onClick} = this;
-       
+        const { category: { data }, createTopicsRequest, createTestRequest, topicId:{ topic } } = this.props;
+        const { categoryId } = this.state
+        const { onClick } = this;
+
+
+        console.log(topic)
 
-        console.log(this.state)
-       
         return (
             <div className=" profile-page p-4 d-flex flex-row font-ci">
-                <div className ='w-50 p-3 bg-gradient border rounded'  > 
-                    <h3 className ="text-white font-ci">Нou are taking category for creating tests</h3>
-            <select class="custom-select bg-mist bg-mist-op text-white mt-3 mb-3" onChange ={onClick} value ={categoryId}>
-                    <option selected>Open this Category menu</option>
-                    {
-                        data&&data.map(mass => <option key = {mass._id} value ={mass._id}>{mass.name}</option>)
-                        
-                    }
-                </select>
-                <CreateTopic categoryId ={categoryId} topic ={topic} actions ={{createTopicsRequest,createTestRequest}} token ={token}></CreateTopic>
-            </div>
-            <div>
-                ffff
+                <div className='w-50 p-3 bg-gradient border rounded'  >
+                    <h3 className="text-white font-ci">Select category for creating tests</h3>
+                    <select class="custom-select bg-mist bg-mist-op text-white mt-3 mb-3" onChange={onClick} value={categoryId}>
+                        <option selected>Open this Category menu</option>
+                        {
+                            data && data.map(mass => <option key={mass._id} value={mass._id}>{mass.name}</option>)
+
+                        }
+                    </select>
+                    <CreateTopic categoryId={categoryId} topic={topic} actions={{ createTopicsRequest, createTestRequest }} ></CreateTopic>
+                </div>
+                <div>
+                    ffff
             </div>
             </div>
-            
+
         )
     }
 
@@ -63,11 +60,11 @@ class CreateTest extends React.Component {
 
 const
     mapStateToProps = state => ({
-        signIn: state.signIn,
-        category:state.category,
-        topicId:state.topicId
-        });
+        myUser: state.myUser,
+        category: state.category,
+        topicId: state.topicId
+    });
 
-const mapDispatchToProps = dispatch => bindActionCreators({getCategoryRequest, createTopicsRequest, createTestRequest}, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ getCategoryRequest, createTopicsRequest, createTestRequest, myUserRequest }, dispatch);
 
 export default connect(mapStateToProps, mapDispatchToProps)(CreateTest);

src/components/admin/addDeleteCategory/ChangeCategory.js

@@ -1,6 +1,4 @@
 import React from 'react';
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
 import { Field, reduxForm } from 'redux-form';
 import formInput from '../../common/formInput'
 
@@ -8,41 +6,34 @@ import formInput from '../../common/formInput'
 
 class ChangeCategory extends React.Component {
 
-    submit=({name})=>{
-        const {actions:{changeCategoryRequest}, token, category:{id}} = this.props;
-        console.log(name)
+    submit = ({ name }) => {
+        const { actions: { changeCategoryRequest }, categorys: { id } } = this.props;
+        console.log(
         changeCategoryRequest({
             name,
-            id,
-            token
-
-        })
+            id
+        }).payload)
     }
 
-    
-    
-
     render() {
-        const {  handleSubmit, changeCategoryRequest, token, category:{id, name} } = this.props;
-        const {submit} = this;
-        console.log("token", token, "name", name, "id", id)
-
+        const { handleSubmit, handlers:{changeCategoryClick}} = this.props;
+        const { submit } = this;
 
-       
         return (
-            
+
             <form onSubmin={handleSubmit(submit)}>
                 <Field name="name" type="name" placeholder="Change Category" component={formInput} />
-                <button type="button" className="link link--btn right"  onClick ={
-                        function(){
+                <button type="button" className="link link--btn right" onClick={
+                    function () {
+                        
                         handleSubmit(submit)();
-                        }                        
-                    }     
-                    >
+                    }
+                }
+                >
                     Search
                 </button>
             </form >
-            
+
         )
     }
 

src/components/admin/addDeleteCategory/CreateCategoryForm/index.js

@@ -1,37 +1,28 @@
 import React from 'react';
-import { connect } from 'react-redux';
 import { Field, reduxForm } from 'redux-form';
 
 import formInput from '../../..//common/formInput';
 
 class CreateCategoryForm extends React.Component {
-submit =({name})=>{
-    const {actions:{createCategoryRequest}, token}= this.props;
-    createCategoryRequest({
-        name,
-        token
-    })
-}
+    submit = async ({ name }) => {
+        const { actions: { createCategoryRequest } } = this.props;
+        console.log('---- EXPRECTED PROMISE------', await createCategoryRequest({
+            name
+        }))
+    }
     render() {
-        const {  handleSubmit, actions:{createCategoryRequest}, handlers:{onClick}, token } = this.props;
-        const { submit}=this;
-        console.log(token)
+        const { handleSubmit, handlers: { handelClick } } = this.props;
+        const { submit } = this;
         return (
             <form onSubmin={handleSubmit(submit)}>
-                <Field name="name" type="name" placeholder="Add new Category" component={formInput} />
+                <Field required name="name" type="name" placeholder="Add new Category" component={formInput} />
                 <button
-                    type="button" className="link link--btn right"  onClick ={
-                        function(){
-
-                        onClick()
+                    type="button" className="link link--btn right" onClick={() => {
                         handleSubmit(submit)();
-
-                        }
-
-                        
-                    }     
-                    >
-                    Search
+                        handelClick()
+                    }
+                    }>
+                    Add
                 </button>
             </form >
         )
@@ -39,5 +30,5 @@ submit =({name})=>{
 }
 
 export default reduxForm({
-    form: "createCategoryForm",
+    form: "createCategoryForm"
 })(CreateCategoryForm);

src/components/admin/addDeleteCategory/DeleteCategory.js

@@ -1,33 +1,41 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux'
-import {deleteCategoryRequest} from  '../../../actions/admin/category/deleteCategory';
+import { deleteCategoryRequest } from '../../../actions/admin/category/deleteCategory';
 
 
 
 class DeleteCategory extends React.Component {
-    state = {
-        ckick:false
+    state ={
+        click:true
     }
-    onClick = ()=>{
-        const {deleteCategoryRequest,category:{id}, token}=this.props;
-        console.log(id,token)
+
+    onClick = () => {
+        const { deleteCategoryRequest, categorys: { id },click } = this.props;
+        console.log(
         deleteCategoryRequest({
-            id,
-            token
-        })
+            id
+        }))
+        this.setState(prevState=>console.log(prevState))
     }
-    
-    
+
+
 
     render() {
-const {onClick} = this;
-       
+        const { onClick } = this;
+        const {handlers:{deleteClick} } = this.props;
+        console.log(deleteClick)
+
         return (
-            <div> 
-                <button type="button" className="link link--btn right" onClick={onClick}>Delete</button>
+            <div>
+                <button type="button" className="link link--btn right" onClick={()=>{
+                    deleteClick()
+                    onClick()
+                }
+                }
+                >Delete</button>
             </div>
-            
+
         )
     }
 
@@ -35,6 +43,6 @@ const {onClick} = this;
 
 
 
-const mapDispatchToProps = dispatch => bindActionCreators({deleteCategoryRequest}, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ deleteCategoryRequest }, dispatch);
 
-export default connect( null, mapDispatchToProps)(DeleteCategory);
+export default connect(null, mapDispatchToProps)(DeleteCategory);

src/components/admin/addDeleteCategory/GetCategory.js

@@ -6,89 +6,145 @@ import CreateCategoryForm from "./CreateCategoryForm";
 import ChangeCategory from "./ChangeCategory";
 import DeleteCategory from './DeleteCategory';
 
+import store from './../../../state';
+
 
 class GetCategory extends React.Component {
 
-    state ={
-        click:false,
-        category:{
-            id:null,
-            names:null
-        }
+    state = {
+        click: false,
+        clicked: false,
+        categorys: { // categorIEs
+            id: null,
+            names: null
+        },
+        chpic: false,
+        massCategory: null,
     }
-    
-    
     componentDidMount() {
-        const {actions:{getCategoryRequest}, token} = this.props;
-        console.log("token", token)
-        getCategoryRequest(
-            token
-            )
-            
-        }
-        
-        onClick = ()=>{
-            this.setState((prevState) => ({ click: !prevState.click }));
+        const { category } = this.props;
+        this.setState({ massCategory: category.data })
+    }
+
+    handelClick = () => {
+        const { data, isFlag } = this.props
+        //!this.state.click || !isFlag ? console.log(isFlag) : this.setState({ massCategory: this.state.massCategory.concat(data) })
+        //this.setState((prevState) => ({ click: !prevState.click }));
+        // data && this.setState(prevState => {
+        //     console.log('----- Prev State', prevState);
+        //     this.setState({ massCategory: this.state.massCategory.concat(data) })
+        // })
+    }
+    cclics = () => { //cliCKS
+        this.setState((prevState) => ({ click: !prevState.click }));
+
+    }
+    deleteClick = () => {
+        const { massCategory, categorys: { id } } = this.state;
+        for (let key in massCategory) {
+            if (massCategory[key]._id == id) {
+                delete massCategory[key]
+                // console.log('NET' )
             }
+            else {
+                // console.log("null")
+            }
+        }
+        this.setState((prevState) => ({ clicked: !prevState.clicked }))
+    }
+
+    componentWillReceiveProps(nextProps) {
+        console.log(nextProps)
+        const { data, isFlag, actions: { changeCategoryRequest }, changeCategory } = nextProps;
+        const { massCategory } = this.state;
+        console.log(data)
+
+        if (data) {
+            this.setState(prevState => {
+                console.log('----- SET STATE INTO DID UPDATE', prevState);
+                this.setState({ massCategory: this.state.massCategory.concat(data) });
+                store.dispatch({
+                    type: 'wtfCreate'
+                })
+            })
+        }
+        if (changeCategory.data) {
+            for (const key in massCategory) {
+                if (massCategory[key]._id === changeCategory.data._id) {
+                    this.setState(prevState => {
+                        const categoriesArray = prevState.massCategory.slice();
+                        categoriesArray.splice(key, 1, changeCategory.data);
 
-        onClicked = ({mass:{_id, name}})=>{
-                this.setState({category:{id:_id,name:name}} )
+                        return {
+                            massCategory: categoriesArray
+                        }
+                    })
+                    break;
+                }
             }
+            store.dispatch({
+                type: 'wtfUpdate'
+            })
+        }
+
+        return true
+    }
 
+    onClicked = ({ mass: { _id, name } }) => {
+        this.setState({ categorys: { id: _id, name: name } })
+        this.setState((prevState) => ({ clicked: !prevState.clicked }))
+    }
 
     render() {
-        const {actions:{ createCategoryRequest, changeCategoryRequest}, token, name} = this.props;
-        const {category:{data, isFetching}} =this.props;
-        console.log(data)
-        const {onClick, onClicked} =this;
-        const {click, category} =this.state;
-       
+        const { actions: { createCategoryRequest, changeCategoryRequest }, data } = this.props;
+        const { category } = this.props;
+        const { handelClick, onClicked, deleteClick, changeCategoryClick } = this;
+        const { click, categorys, newCategory, massCategory, clicked } = this.state;
+        console.log(this.state)
+
         return (
             <div>
-                <div className ="container w-100 h-auto  bg-stone  bg-mist-border">
+                <div className="container w-100 h-auto  bg-stone  bg-mist-border">
                     {
-                        !isFetching
+                        massCategory !== null
+                            ?
+                            massCategory.map(mass =>
+                                <div className="btn " key={mass.id}>
+                                    <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick={onClicked.bind(null, { mass })} type="button" id={mass.id} key={mass.id} >
+                                        {mass.name}
+                                    </button>
+                                </div>
+
+                            )
+                            :
+                            <PropagateLoader />
+                    }
+                    <div>
+                        {
+                            click
+                                ?
+                                <CreateCategoryForm newCategory={newCategory} actions={{ createCategoryRequest }} handlers={{ handelClick }}></CreateCategoryForm>
+                                :
+                                <button type='button' onClick={this.cclics}>Create Category</button>
+                        }
+                    </div>
+
+                </div>
+                {
+                    clicked
                         ?
-                        data&&data.map(mass =>
-                            <div className ="btn ">
-                                <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick = {onClicked.bind(null,{mass})} type="button" id={mass.id} key ={mass.id} >
-                                    {mass.name}
-                                </button>
-                            </div>
-                        )
+                        <React.Fragment>
+                            <ChangeCategory actions={{ changeCategoryRequest }} categorys={categorys} handlers={{ changeCategoryClick }}></ChangeCategory>
+                            <DeleteCategory categorys={categorys} handlers={{ deleteClick }} ></DeleteCategory>
+                        </React.Fragment>
                         :
-                    <PropagateLoader/>
-                }
-                <div>
-                {
-                    click
-                    ?
-                    <CreateCategoryForm actions ={{createCategoryRequest}} handlers ={{onClick}} token={token}></CreateCategoryForm>
-                    :
-                    name==null
-                    ?
-                    <button onClick = {onClick}>Create Category</button>
-                    :
-                    <React.Fragment>
-                        <p>New Category</p>
-                        <button class="btn btn-secondary font-ci font-ci-bold text-light mx-auto " onClick = {onClick} type="button"  >
-                            {name}
-                        </button>
-                        <button onClick = {onClick}>Create Category</button>
-                    </React.Fragment>
+                        null
                 }
-                </div>
-
             </div>
-            <ChangeCategory actions ={{changeCategoryRequest}} token={token} category ={category}></ChangeCategory>
-            <DeleteCategory token={token} category ={category} ></DeleteCategory>
-        </div>
         )
     }
 
 }
 
 
-
-
 export default GetCategory;

src/components/admin/addDeleteCategory/index.js

@@ -1,34 +1,45 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux'
-import {createCategoryRequest} from  '../../../actions/admin/category/createCategory';
-import {changeCategoryRequest} from  '../../../actions/admin/category/changeCategory';
-import {getCategoryRequest} from '../../../actions/admin/category/getCategory';
+import { createCategoryRequest } from '../../../actions/admin/category/createCategory';
+import { changeCategoryRequest } from '../../../actions/admin/category/changeCategory';
+import { getCategoryRequest } from '../../../actions/admin/category/getCategory';
+import PropagateLoader from 'react-spinners/PropagateLoader';
 import GetCategory from './GetCategory'
 
 
 
 class AddDeleteCategory extends React.Component {
     state = {
-        ckick:false
+        ckick: false
     }
-    onClick = ()=>{
+    componentDidMount() {
+        const { getCategoryRequest } = this.props
+        getCategoryRequest()
+    }
+    onClick = () => {
         this.setState((prevState) => ({ click: !prevState.click }));
     }
-    
-    
+
+
 
     render() {
-        const {signIn:{token}, category, createCategoryRequest, getCategoryRequest, changeCategoryRequest, newCategory:{name}}= this.props
-        const {onClick} = this;
-        console.log("jjjjjjjj", token)
+        const { category, createCategoryRequest, getCategoryRequest, changeCategoryRequest, newCategory: { data, isFlag }, changeCategory } = this.props
+        console.log('---- PARENT RENDER CHECKOUT -----', data);
+        const { onClick } = this;
+        console.log(category)
 
-       
         return (
-            <div> 
-                <GetCategory actions ={{getCategoryRequest,createCategoryRequest, changeCategoryRequest}} token ={token} category = {category} name ={name}></GetCategory>
+            <div>
+                {
+                    !category.isFlag
+                        ?
+                        <PropagateLoader />
+                        :
+                        <GetCategory actions={{ getCategoryRequest, createCategoryRequest, changeCategoryRequest }} category={category} data={data} isFlag={isFlag} changeCategory={changeCategory}></GetCategory>
+                }
             </div>
-            
+
         )
     }
 
@@ -37,11 +48,11 @@ class AddDeleteCategory extends React.Component {
 const
     mapStateToProps = state => ({
         signIn: state.signIn,
-        category:state.category,
-        newCategory:state.newCategory       
-
+        category: state.category,
+        newCategory: state.newCategory,
+        changeCategory: state.changeCategory
     });
 
-const mapDispatchToProps = dispatch => bindActionCreators({createCategoryRequest, getCategoryRequest, changeCategoryRequest}, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ createCategoryRequest, getCategoryRequest, changeCategoryRequest }, dispatch);
 
 export default connect(mapStateToProps, mapDispatchToProps)(AddDeleteCategory);

src/components/admin/deleteUser/DeleteUserForm/index.js

@@ -11,8 +11,8 @@ class DeleteUserForm extends React.Component {
             <form>
                 <Field name="name" type="name" placeholder="Enter login" component={formInput} />
                 <button
-                    type="button" className="link link--btn right"        
-                    >
+                    type="button" className="link link--btn right"
+                >
                     Search
                 </button>
             </form >

src/components/admin/deleteUser/changeUsers.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux'
+import { changeUserRequest } from '../../../actions/admin/user/changeUser';
+import formInput from '../../common/formInput';
+import { Field, reduxForm } from 'redux-form';
+
+
+class ChangeUsers extends React.Component {
+
+
+    submit = ({ name, email, newPassword, confirmPassword }) => {
+        const { action: { changeUserRequest }, initialValues: { _id } } = this.props
+        console.log(name, email, newPassword, confirmPassword);
+        changeUserRequest({
+            name,
+            email,
+            newPassword,
+            confirmPassword,
+            _id
+        })
+    }
+
+
+
+    render() {
+        const { initialValues, handleSubmit } = this.props;
+        const { submit } = this
+        console.log(initialValues)
+
+        return (
+            <div>
+
+                <form onSubmit={handleSubmit(submit)}>
+                    <Field name="name" type="name" component={formInput} />
+                    <Field name="email" type="email" component={formInput} />
+                    <Field name="newPassword" type="password" placeholder="Enter login" component={formInput} />
+                    <Field name="confirmPassword" type="password" placeholder="Enter login" component={formInput} />
+                    <button>Change</button>
+                </form >
+            </div>
+
+        )
+    }
+
+}
+
+
+
+export default reduxForm({
+    form: "ChangeUserForm",
+    enableReinitialize: true
+})(ChangeUsers)

src/components/admin/deleteUser/index.js

@@ -1,21 +1,55 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux'
+import { getUserRequest } from '../../../actions/admin/user/getUser';
+import { changeUserRequest } from '../../../actions/admin/user/changeUser';
+import ChangeUser from './changeUsers';
 import DeleteUserForm from './DeleteUserForm/index'
 
 
 
 class DeleteUser extends React.Component {
-    
+    state = {
+        initialValues: null,
+        flag: false
+    }
+    componentDidMount() {
+        const { getUserRequest } = this.props;
+        getUserRequest()
+
+    }
+    handelClick = ({ el }) => {
+        this.setState({ initialValues: el });
+        this.setState((prevState) => ({ flag: !prevState.flag }))
+    }
 
     render() {
-       
+        const { handelClick } = this
+        const { users: { user }, changeUserRequest } = this.props;
+        const { initialValues, flag } = this.state;
+        console.log(initialValues, console.log(user))
+
+
         return (
-            <div> 
-                <input type="file"/>
-                <DeleteUserForm></DeleteUserForm>
+            <div className=" profile-page d-flex flex-row font-ci padding ">
+                <div className='w-50 p-3 bg-rgba border rounded'  >
+                    <div class="list-group">
+
+                        {user && user.map(el =>
+                            <button type="button" class=" list-group-item-action mb-4 borber bg-rgba1 border-0 text-white font-ci font-ci-bold " id={el._id} onClick={handelClick.bind(null, { el })}>{el.email}</button>
+                        )}
+                    </div>
+                </div>
+                <div className='w-50 p-3 bg-rgba ml-3 border rounded'  >
+                    <DeleteUserForm></DeleteUserForm>
+                    {
+                        flag
+                            ?
+                            <ChangeUser initialValues={initialValues} action={{ changeUserRequest }} ></ChangeUser>
+                            : null
+                    }
+                </div>
             </div>
-            
         )
     }
 
@@ -23,9 +57,9 @@ class DeleteUser extends React.Component {
 
 const
     mapStateToProps = state => ({
-
+        users: state.users,
     });
 
-const mapDispatchToProps = dispatch => bindActionCreators({}, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ getUserRequest, changeUserRequest }, dispatch);
 
 export default connect(mapStateToProps, mapDispatchToProps)(DeleteUser);

src/components/admin/getChangeDeleteTest/ChangeQestion.js

@@ -0,0 +1,21 @@
+// {
+//     arrayTopic.map(el =>
+//         <ul class="list-group d-flex flex-row">
+
+//             <li class="list-group-item col-sm" id={el._id} key={el._id}>{el.name}</li>
+//             <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick={()=>{
+//                 handleClick.bind(null, { el })()
+//                 questionsClick.bind(null, { el })()}
+//                 } type="button"  >
+//                 P
+//             </button>
+//             <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick={deleteClick.bind(null, { el })} type="button"  >
+//                 X
+//             </button>
+//         </ul>
+
+
+//     )
+//                             <GetTest actions={{ getQuestionsRequest, deleteTopicRequest }} data ={data} topicElement={topicElement} handlers={{handleClick}} topic={topic} deleteTopic={deleteTopic} ></GetTest>
+
+// }

src/components/admin/getChangeDeleteTest/GetQuestions.js

@@ -0,0 +1,113 @@
+import React from 'react';
+import { Field, reduxForm } from 'redux-form';
+// import {ChangeQuestion} from './changeQuestions'
+import formInput from '../../common/formInput'
+
+
+
+
+class GetQuestions extends React.Component {
+    state = {
+        id: null,
+        arrayQuestion: [],
+        questionS:{question:null}
+    }
+
+    componentWillMount = () => {
+        const { questions } = this.props;
+        console.log(questions)
+        this.setState({ arrayQuestion: questions })
+    }
+    changeQuestion = (event) => {
+        this.setState({questionS:{question:event.target.value}})
+    }
+    // handleClick =({el:{_id}})=>{
+    //     const {actions:{getQestionsRequest}} =this.props
+    //     console.log(_id)
+    //     getQestionsRequest({_id})
+
+    // }
+    submit =(payload)=>{
+console.log(payload)
+    }
+
+    deleteClick = ({ el: { _id } }) => {
+        this.setState({ id: _id })
+        const { actions: { deleteQuestionRequest } } = this.props;
+        deleteQuestionRequest({ _id })
+    }
+
+    componentWillUpdate(nextState, nextProps) {
+        const { deleteQuestion: { isFetching } } = nextState;
+        const { arrayQuestion, id } = nextProps;
+        console.log(isFetching, "nextState---------", nextState, "nextProps_________", nextProps)
+        if (!isFetching) {
+            for (let key in arrayQuestion) {
+                if (arrayQuestion[key]._id == id) {
+                    this.setState(prevState => {
+                        console.log("-------TRUE--------")
+                        const array = prevState.arrayQuestion.slice()
+                        array.splice(key, 1)
+                        return {
+                            arrayQuestion: array
+                        }
+                    })
+                    break;
+                }
+            }
+
+        }
+    }
+
+    render() {
+        const { handleClick, deleteClick, changeQuestion } = this;
+        const{handleSubmit} =this.props
+        const { questionS:{question}, arrayQuestion } = this.state;
+        console.log(this.state)
+
+        return (
+            <div className=" profile-page p-4 d-flex flex-row font-ci">
+                <div className="container w-100 h-auto  bg-stone  bg-mist-border">
+                    <form onSubmit ={handleSubmit(this.submit)}>
+                        <Field name="name" type="name" component={formInput} />
+
+                        <select class="custom-select bg-mist bg-mist-op text-white mt-3 mb-3" onChange={changeQuestion} value={question} >
+                            <option selected>Open this Category menu</option>
+                            {
+                                arrayQuestion && arrayQuestion.map(el =>
+                                    <React.Fragment>
+                                        <option key={el._id} value={el.question}>{el.question}</option>
+                                        <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " type="button"  >
+                                            P
+                                    </button>
+                                        <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick={deleteClick.bind(null, { el })} type="button"  >
+                                            X
+                                    </button>
+                                    </React.Fragment>
+                                )
+                            }
+                        </select>
+                        {
+                            question == null
+                                ?
+                                null
+                                :
+
+                        <Field name="question" type="question" component={formInput} />
+
+                        }
+
+                        <button>ssss</button>
+                    </form>
+                </div>
+            </div >
+        )
+    }
+
+}
+
+
+export default reduxForm({
+    form: "changeTestForm",
+    enableReinitialize: true
+})(GetQuestions)

src/components/admin/getChangeDeleteTest/GetTest.js

@@ -0,0 +1,78 @@
+import React from 'react';
+
+
+
+class GetTest extends React.Component {
+    state = {
+        arrayTopic: [],
+        arrayCategory: []
+    }
+    componentWillMount() {
+        const { data } = this.props;
+        this.setState({ arrayCategory: data })
+    }
+
+
+    // questionsClick = ({ el: { _id, name } }) => {
+    //     const { actions: { getQuestionsRequest } } = this.props
+    //     console.log(_id)
+    //     getQuestionsRequest({ _id })
+
+    // }
+    // deleteClick = ({ el: { _id } }) => {
+    //     const { actions: { deleteTopicRequest }, deleteTopic } = this.props;
+    //     deleteTopicRequest({ _id })
+    //     console.log(deleteTopic)
+
+    // }
+    // componentWillUpdate(nextState, nextProps) {
+    //     const { deleteTopic: { isFetching }, topicElement: { id } } = nextState;
+    //     const { arrayTopic } = nextProps;
+    //     console.log(isFetching, "nextState---------", nextState, "nextProps_________", nextProps)
+    //     if (!isFetching) {
+    //         for (let key in arrayTopic) {
+    //             if (arrayTopic[key]._id == id) {
+    //                 this.setState(prevState => {
+    //                     console.log("-------TRUE--------")
+    //                     const array = prevState.arrayTopic.slice()
+    //                     array.splice(key, 1)
+    //                     return {
+    //                         arrayTopic: array
+    //                     }
+    //                 })
+    //                 break;
+    //             }
+    //         }
+
+    //     }
+    // }
+
+
+    render() {
+        // const { deleteClick, questionsClick } = this
+        const { handlers:{getQuestionClick} } = this.props;
+        const { arrayTopic, topicElement, arrayCategory } = this.state
+        console.log(this.state)
+
+        return (
+            <div className=" profile-page w-50 p-4 d-flex flex-row font-ci">
+                <div className="container  h-auto  bg-stone  bg-mist-border">
+                    {
+                        arrayCategory.map(el =>
+
+                            <div className="btn ">
+                                <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick={getQuestionClick.bind(null, { el })} type="button" id={el._id} key={el._id} >
+                                    {el.name}
+                                </button>
+                            </div>
+                        )
+                    }
+                </div>
+            </div>
+        )
+    }
+
+}
+
+
+export default GetTest;

src/components/admin/getChangeDeleteTest/GetTopic.js

@@ -0,0 +1,79 @@
+import React from 'react';
+
+
+
+class GetTest extends React.Component {
+    state = {
+        arrayTopic: {
+            categotyId: null,
+            topic: null
+        }
+    }
+    componentWillMount() {
+        const { topic: { payload, topics } } = this.props;
+        this.setState({ arrayTopic: { categogyId: payload, topic: topics } })
+    }
+
+
+    // questionsClick = ({ el: { _id, name } }) => {
+    //     const { actions: { getQuestionsRequest } } = this.props
+    //     console.log(_id)
+    //     getQuestionsRequest({ _id })
+
+    // }
+    // deleteClick = ({ el: { _id } }) => {
+    //     const { actions: { deleteTopicRequest }, deleteTopic } = this.props;
+    //     deleteTopicRequest({ _id })
+    //     console.log(deleteTopic)
+
+    // }
+    // componentWillUpdate(nextState, nextProps) {
+    //     const { deleteTopic: { isFetching }, topicElement: { id } } = nextState;
+    //     const { arrayTopic } = nextProps;
+    //     console.log(isFetching, "nextState---------", nextState, "nextProps_________", nextProps)
+    //     if (!isFetching) {
+    //         for (let key in arrayTopic) {
+    //             if (arrayTopic[key]._id == id) {
+    //                 this.setState(prevState => {
+    //                     console.log("-------TRUE--------")
+    //                     const array = prevState.arrayTopic.slice()
+    //                     array.splice(key, 1)
+    //                     return {
+    //                         arrayTopic: array
+    //                     }
+    //                 })
+    //                 break;
+    //             }
+    //         }
+
+    //     }
+    // }
+
+
+    render() {
+        // const { deleteClick, questionsClick } = this
+        const { handlers:{openEditModal} } = this.props;
+        // const { arrayTopic, topicElement, arrayCategory } = this.state
+        const { arrayTopic:{topic} } = this.state
+        console.log(this.state)
+
+        return (
+            <div className=" profile-page w-50 p-4 d-flex flex-row font-ci">
+                <div className="container  h-auto  bg-stone  bg-mist-border">
+                    {
+                        topic&&topic.map(el =>
+                            <div className="btn ">
+                                <button class="btn btn-secondary font-ci font-ci-bold text-light bg-mist " onClick ={openEditModal.bind(null,{el})} type="button" id={el._id} key={el._id} >
+                                    {el.name}
+                                </button>
+                            </div>)
+                    }
+                </div>
+            </div>
+        )
+    }
+
+}
+
+
+export default GetTest;

src/components/admin/getChangeDeleteTest/OpenModal.js

@@ -0,0 +1,92 @@
+import React, { Component } from "react";
+import { Modal } from "antd";
+import { Field, reduxForm } from 'redux-form';
+import formInput from '../../common/formInput'
+
+class EditModal extends React.Component {
+    state = {
+        clicked: false
+    }
+    submit = (payload) => {
+        const { actions: { changeTestRequest } } = this.props;
+        changeTestRequest({ payload })
+        console.log(payload)
+    }
+    changeQuestion = (event) => {
+        const { value, name} = event.target
+        // const { actions: { getAnswersRequest } } = this.props;
+        console.log(event.target.valus, value)
+        // getAnswersRequest({ value })
+        this.setState((prevState) => ({ clicked: !prevState.clicked }))
+    }
+    render() {
+        const { visible, handleClose: { closeModal }, inputData, editLoads, initialValues, arrayQuestions: { questions, _id }, answers, handlers: { handelClick }, click, handleSubmit } = this.props;
+        const { submit } = this
+        const { clicked } = this.state
+        console.log(initialValues)
+        return (
+            <Modal footer={false} title="Basic Modal" visible={visible} onCancel={closeModal} >
+                <form onSubmit={handleSubmit(submit)}>
+                    <Field name="name" type="name" component={formInput} />
+                    <Field name="description" type="description" component={formInput} />
+
+
+                    <select class="custom-select bg-mist bg-mist-op text-white mt-3 mb-3" onChange={this.changeQuestion} >
+                        <option selected>Question</option>
+                        {questions !== null
+                            ?
+                            questions.map(el =>
+                                <option key={el._id} name={el._id} value={el.question}>{el.question}</option>
+
+
+                            )
+                            : null
+                        }
+                    </select>
+                    {
+                        clicked
+                        ?
+                        <React.Fragment>
+                        <Field name ="question" type ="question" component ={formInput}/>
+                        <Field name ="simple" type ="checkbox" component ={formInput}/>
+                        </React.Fragment>
+                        :null
+                    }
+                    <ul class="list-group list-group-flush">
+
+                        {
+                            answers !== null
+                                ?
+                                answers.map(el =>
+
+                                    !click
+                                        ?
+                                        <React.Fragment>
+                                            <li class="list-group-item" key={el._id} id={el._id}>{el.answer}</li>
+                                            <button type="button" onClick={handelClick.bind(null, { el })}>Change</button>
+                                            <button type="button">Delete</button>
+                                        </React.Fragment>
+                                        :
+                                        <React.Fragment>
+                                            <Field name="answer" type="answer" component={formInput} />
+                                            <Field name="corrent" type="checkbox" component={formInput} />
+                                            <Field name="price" type="price" component={formInput} />
+                                            {/* <button onClick={handelClick.bind(null, { el })}>Change</button>
+                                    <button>Delete</button> */}
+                                        </React.Fragment>
+                                )
+                                :
+                                null
+                        }
+                        <button>create</button>
+                    </ul>
+                </form>
+            </Modal>
+        );
+    }
+}
+
+export default reduxForm({
+    form: "editModal",
+    enableReinitialize: true
+})(EditModal)

src/components/admin/getChangeDeleteTest/index.js

@@ -0,0 +1,136 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+import { getTopicRequest } from '../../../actions/admin/changeTest/getTopic';
+import { getQuestionsRequest } from '../../../actions/admin/changeTest/getQuestions';
+import { deleteTopicRequest } from '../../../actions/admin/changeTest/deleteTopic';
+import { deleteQuestionRequest } from '../../../actions/admin/changeTest/deleteQuestion';
+import { getCategoryRequest } from '../../../actions/admin/category/getCategory';
+import { getAnswersRequest } from '../../../actions/admin/changeTest/getAnswers';
+import { changeTestRequest } from '../../../actions/admin/changeTest/changeTest';
+
+import PropagateLoader from 'react-spinners/PropagateLoader';
+
+
+import GetTest from './GetTest';
+import GetTopic from './GetTopic';
+import EditModal from './OpenModal';
+import GetQuestions from './GetQuestions';
+
+
+
+
+class ChangeTest extends React.Component {
+    state = {
+
+        categoryId: null,
+        name: null,
+        topicId: null,
+        description: null,
+        answers: [],
+        answer: null,
+        correct: null,
+        price: null,
+        simple: null,
+        openModal: false,
+        toggleModal: false,
+        click: false
+
+    }
+
+    openEditModal = ({ el: { _id, description, name } }) => {
+        const { getQuestionsRequest } = this.props
+        getQuestionsRequest({ _id })
+        this.setState(({ openModal: true, toggleModal: false, topicId: _id, description: description, name: name }))
+    }
+
+    closeModal = () => { this.setState((prevState) => ({ openModal: !prevState.openModal })) }
+
+    getQuestionClick = ({ el: { _id } }) => {
+        const { getTopicRequest } = this.props
+        getTopicRequest({ _id })
+        this.setState({ categoryId: _id })
+    }
+
+    handelClick = ({ el: { answer, correct, price, _id } }) => {
+        // const answers =`answer${_id}`
+        // const corrents =`corrent${_id}`
+        // const prices =`price${_id}`
+        // console.log(answer)
+        this.setState({ answer: answer, corrent: correct, price: price });
+        this.setState((prevState) => ({ click: !prevState.click }))
+
+    }
+
+    componentWillMount = () => {
+        const { getCategoryRequest } = this.props
+        getCategoryRequest()
+    }
+    componentWillReceiveProps(nextProps) {
+        console.log(nextProps)
+        const { arrayAnswers: { answers } } = nextProps;
+        if (answers !== null) {
+            this.setState({ answers: answers })
+        }
+    }
+    // componentWillUpdate(nextState, nextProps) {
+    //     console.log("-------NEXT STATE---------", nextState, "---------NEXT PROPS---------", nextProps)
+
+    // }
+
+    render() {
+        const { getQuestionClick, openEditModal, closeModal, handelClick, state } = this;
+        const { openModal, questionId, name, topicId, description, answers, click } = this.state
+        // const { topic, deleteQuestionRequest, getQuestionsRequest, arrayQuestions: { questions, isFlag }, deleteTopicRequest, deleteTopic, deleteQuestion } = this.props;
+        // console.log(topic)
+        const initialValues = {
+            ...state
+        }
+        const { category: { data, isFlag }, topic, arrayQuestions, getAnswersRequest, arrayAnswers, changeTestRequest } = this.props
+        console.log(this.state)
+
+        return (
+            <div className=" p-5 d-flex flex-row font-ci">
+
+                {
+                    !isFlag
+                        ?
+                        <PropagateLoader />
+                        :
+                        <React.Fragment>
+                            <GetTest data={data} handlers={{ getQuestionClick }}></GetTest>
+                            {
+                                topic.isFlag
+                                    ?
+                                    <React.Fragment>
+                                        <GetTopic handlers={{ openEditModal }} topic={topic}></GetTopic>
+                                        <EditModal visible={openModal} handlers={{ handelClick }} click={click} answers={answers} actions={{ getAnswersRequest, changeTestRequest }} arrayQuestions={arrayQuestions} initialValues={initialValues}
+                                            handleClose={{ closeModal }}></EditModal>
+                                    </React.Fragment>
+                                    :
+                                    null
+
+                            }
+
+                        </React.Fragment>
+                }
+            </div>
+        )
+    }
+
+}
+
+const
+    mapStateToProps = state => ({
+        topic: state.topic,
+        arrayQuestions: state.arrayQuestions,
+        deleteTopic: state.deleteTopic,
+        deleteQuestion: state.deleteQuestion,
+        category: state.category,
+        arrayAnswers: state.arrayAnswers
+
+    });
+
+const mapDispatchToProps = dispatch => bindActionCreators({ getCategoryRequest, getTopicRequest, changeTestRequest, getQuestionsRequest, deleteTopicRequest, deleteQuestionRequest, getAnswersRequest }, dispatch);
+
+export default connect(mapStateToProps, mapDispatchToProps)(ChangeTest);

src/components/common/formInput.js

@@ -1,8 +1,9 @@
 import React, { Fragment } from 'react';
 
-export default ({ input, className, placeholder, type, meta: { touched, error } }) => (
+export default ({ input, className, placeholder, required, type, meta: { touched, error } }) => (
     <Fragment>
-        <input className={className} placeholder={placeholder} type={type} {...input} />
+        <input className={className} placeholder={placeholder} type={type} {...input} required/>
         {touched && (error && <p className="text-af pt-2 text-uppercase">⚠ {error}</p>)}
+        {/* {required ? <p className="text-af pt-2 text-uppercase">⚠ Reqired</p> : null} */}
     </Fragment>
 )

src/components/common/protectedRoute.js

@@ -1,47 +1,43 @@
 import React from 'react';
 import { Route, Redirect } from 'react-router-dom';
+import decode from 'jwt-decode';
+
 import * as routes from './../../constants/routes';
+import storageKey from './../../utils/storageKey';
 
-export default ({ component: Component, user, tokenAuth, access, ...rest }) => (
+export default ({ component: Component, tokenAuth, access, ...rest }) => (
     <Route
         {...rest}
         render={props => {
-            {/* let checkedData;
+            // test
+            try {
+                const storagedData = localStorage.getItem(storageKey);
 
-            if (data) {
-                checkedData = data;
-            }
-            else {
-                const storagedUser = JSON.parse(localStorage.getItem(token));
-                if (storagedUser) {
-                    checkedData = storagedUser;
-                    tokenAuth(storagedUser);
+                if (access === 'public') {
+                    return <Component {...props} />
                 }
-                else {
-                    checkedData = null;
+                
+                if (!storagedData || storagedData.exp < Date.now()) {
+                    throw new Error(1);
                 }
-            } */}
-            const checkedData = user && user.data ? user.data : null;
-
-            console.log('\n\nHere goes the route:', '\nUser', user, '\n\n\n')
 
-            if (access === 'public') {
-                return <Component {...props} />
-            }
+                const user = decode(storagedData);
+                const { role } = user; 
 
-            if ((access === 'user-only' || access === 'admin-only') && !checkedData) {
-                return <Redirect to={routes.SIGN_IN} />
-            }
+                if (access === 'admin-only' && !role) {
+                    throw new Error(2)                   
+                }
 
-            if (access === 'user-only' && checkedData) {
                 return <Component {...props} />
             }
-
-            if (access === 'admin-only' && checkedData.role) {
-                return <Component {...props} />
+            catch ({ message: errorCode }) {
+                if (errorCode === '1') {
+                    return <Redirect to={routes.SIGN_IN} />
+                }
+                if (errorCode === '2') {
+                    return <div>Permission denied</div>
+                }
             }
-
-            return null // permission denied
         }}
     />
 )

src/components/public/Header.js

@@ -1,14 +1,24 @@
 import React from 'react';
 import { Link } from "react-router-dom";
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+
 import * as routes from '../../constants/routes'
+import logOut from './../../actions/auth/logOut';
+
+class Header extends React.Component {
+    handleLogOut = () => {
+        const { logOut } = this.props;
+        logOut()
+        //TODO: REDIRECT
+    }
 
-export default class Header extends React.Component {
     render() {
         return (
-            <nav class="navbar navbar-expand-lg bg-mist p-3">
-                <a class="navbar-brand font-po font-po-bold text-shadow " href="#">Test.io</a>
+            <nav class="navbar navbar-expand-lg navbar-expand-lg bg-gradient1 p-4 position-absolute w-100 ">
+                <Link to={routes.LANDING} class="navbar-brand font-label text-af" href="#">Test.io</Link>
                 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
-                    <span class="navbar-toggler-icon"></span>
+                    <span class="navbar-toggler-icon" />
                 </button>
 
                 <div class="collapse navbar-collapse" id="navbarSupportedContent">
@@ -24,36 +34,48 @@ export default class Header extends React.Component {
                         </li>
                         <li class="nav-item">
                             <Link onClick={this.handleClick} class="nav-link text-shadow font-ci font-ci-bold " to={routes.CATEGORIES}>Catigories</Link>
+
                         </li>
                         
                         <li class="nav-item dropdown">
-                            <a class="nav-link dropdown-toggle text-shadow font-ci font-ci-bold" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                                Menu Admina
-                                    </a>
+
+                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                Dropdown
+                                </a>
                             <div class="dropdown-menu" aria-labelledby="navbarDropdown">
-                                <Link onClick={this.handleClick} class="nav-link font-ci font-ci-bold " to={routes.DELETE_USER}>Delete User</Link>
-                                <Link onClick={this.handleClick} class="nav-link font-ci font-ci-bold " to={routes.CREATE_CATEGORY}><a class="dropdown-item">Create Category</a></Link>
-                                <Link onClick={this.handleClick} class="nav-link font-ci font-ci-bold " to={routes.CREATE_TEST}><a class="dropdown-item">Create Test</a></Link>
+                            <Link to={routes.DELETE_USER} className="nav-link text-secondary">Delete User</Link>
+                                <Link to={routes.CREATE_TEST} className="nav-link text-secondary">Create Test</Link>
+                                <Link to={routes.CHANGE_TEST} className="nav-link text-secondary">Change Test</Link>
+                                
+                                <Link to={routes.CREATE_CATEGORY} className="nav-link text-secondary">Create Category</Link>
 
-                                <a class="dropdown-item" href="#">Action</a>
-                                <a class="dropdown-item" href="#">Another action</a>
                                 <div class="dropdown-divider"></div>
-                                <a class="dropdown-item" href="#">Something else here</a>
+                                <a class="nav-link text-secondary" href="#">Something else here</a>
                             </div>
                         </li>
 
                     </ul>
 
-                    <div className="pl-2">
+                    <div className="">
                         <Link to={routes.SIGN_IN}>
                             <button className="btn  btn-outline-light bg-stone">Sign In</button>
                         </Link>
                         <Link to={routes.SIGN_UP}>
                             <button className="btn  btn-outline-light ml-2 bg-stone">Sign Up</button>
+
                         </Link>
+                        <button onClick={this.handleLogOut} className="btn btn-outline-primary">Log Out</button>
                     </div>
                 </div>
+            
             </nav>
         )
     }
 }
+
+const mapStateToProps = state => ({
+    state: state.logOut
+});
+const mapDispatchToProps = dispatch => bindActionCreators({ logOut }, dispatch)
+
+export default connect(mapStateToProps, mapDispatchToProps)(Header);

src/components/public/landing.js

@@ -0,0 +1,32 @@
+import React from 'react';
+
+const landing = () => (
+    <div id="carouselExampleIndicators" className="carousel slide" data-ride="carousel">
+        <ol className="carousel-indicators">
+            <li data-target="#carouselExampleIndicators" data-slide-to="0" className="active"></li>
+            <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
+            <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
+        </ol>
+        <div className="carousel-inner">
+            <div className="carousel-item active">
+                <img src="https://images.theconversation.com/files/17962/original/jt558trs-1353642967.jpg?ixlib=rb-1.1.0&rect=23%2C5%2C3831%2C2573&q=45&auto=format&w=926&fit=clip" className="d-block w-100 slider-image" alt="..." />
+            </div>
+            <div className="carousel-item">
+                <img src="http://dyslexiahelp.umich.edu/sites/default/files/upload/testing%20instuments%20dreamstimesmall_5908127.jpg" className="d-block w-100 slider-image" alt="..." />
+            </div>
+            <div className="carousel-item">
+                <img src="https://amp.businessinsider.com/images/55a7e74f2acae716008b7469-750-562.jpg" className="d-block w-100 slider-image" alt="..." />
+            </div>
+        </div>
+        <a className="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
+            <span className="carousel-control-prev-icon" aria-hidden="true"></span>
+            <span className="sr-only">Previous</span>
+        </a>
+        <a className="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
+            <span className="carousel-control-next-icon" aria-hidden="true"></span>
+            <span className="sr-only">Next</span>
+        </a>
+    </div>
+)
+
+export default landing;

src/components/public/SignIn/Form/index.js

@@ -18,7 +18,7 @@ class Form extends React.Component {
 
 
         return (
-            <div className="container mt-5 ">
+            <div className="container p-5">
                 <div className="row">
                     <div className="col-md-8 col-4 col-lg-5 m-auto p-4  border rounded">
                         <h1 className = "position-absolute pl-5 pr-5 sinein bg-white text-stone">SignIn</h1>

src/components/public/SignIn/index.js

@@ -7,7 +7,7 @@ import { Redirect } from 'react-router-dom'
 import PropagateLoader from 'react-spinners/PropagateLoader';
 
 import Spinner from './../../common/spinner';
-import { signIn } from './../../../actions/auth/signIn';
+import signIn from './../../../actions/auth/signIn';
 
 const SignIn = ({ signIn, user }) => {
     const someShit = user.isFetching

src/components/public/SignUp/index.js

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 import { Redirect } from 'react-router-dom';
 
 import Spinner from './../../common/spinner';
-import { signUp } from './../../../actions/auth/signUp';
+import signUp from './../../../actions/auth/signUp';
 
 const SignUp = ({ status, signUp }) => (
     status.isFetching

src/components/user/ProfilePage/ChangeEmailForm/index.js

@@ -23,9 +23,9 @@ class ChangeEmailForm extends React.Component {
         const { submit}=this
         return (
             <form onSubmit={handleSubmit(submit)} >
-                <Field name="email" type="email" placeholder="Enter new login" component={formInput} />
+                <Field name="email" type="email" placeholder="Enter new login" component={formInput} className="bg-rgba1 border" />
                 <button
-                    type="button" className="link link--btn right"  onClick={
+                    type="button" className="link link--btn right flex-fill bg-shadow btn text-white font-ci font-ci-bold col-3"  onClick={
                         function() {
                         handleClicks();
                             handleSubmit(submit)();
@@ -41,4 +41,6 @@ class ChangeEmailForm extends React.Component {
 
 export default reduxForm({
     form: "changeEmailForm",
+    enableReinitialize: true
+
 })(ChangeEmailForm);

src/components/user/ProfilePage/ChangeLoginForm/index.js

@@ -24,9 +24,9 @@ class ChangeLoginForm extends React.Component {
         console.log( data)
         return (
             <form onSubmit={handleSubmit(submit)} >
-                <Field name="name" type="email" placeholder="Enter new login" component={formInput} />
+                <Field name="name" type="email" placeholder="Enter new login" component={formInput} className="bg-rgba1 border" />
                 <button
-                    type="button" className="link link--btn right"  onClick={
+                    type="button" className="link link--btn right flex-fill bg-shadow btn text-white font-ci font-ci-bold col-3"  onClick={
                         function() {
                         handleClick();
                             handleSubmit(submit)();

src/components/user/ProfilePage/changePassword/index.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Field, reduxForm } from 'redux-form';
+import validate from '../../../../configs/validate'
 
 import formInput from '../../../common/formInput';
 
@@ -24,11 +25,11 @@ class ChangePasswordForm extends React.Component {
         console.log( data)
         return (
             <form onSubmit={handleSubmit(submit)} >
-                <Field name="password" type="password" placeholder="Password" component={formInput} />
-                <Field name="confirmPassword" type="password" placeholder="new Password" component={formInput} />
+                <Field name="password" type="password" placeholder="Password" className ='' component={formInput} className="bg-rgba1 border" />
+                <Field name="confirmPassword" type="password" placeholder="new Password" component={formInput} className="bg-rgba1 border"/>
 
                 <button
-                    type="button" className="link link--btn right"  onClick={
+                    type="button" className="link link--btn flex-fill bg-shadow btn text-white font-ci font-ci-bold col-3 "  onClick={
                         function() {
                         handleClicked();
                             handleSubmit(submit)();
@@ -44,4 +45,5 @@ class ChangePasswordForm extends React.Component {
 
 export default reduxForm({
     form: "changePasswordForm",
+    validate
 })(ChangePasswordForm);

src/components/user/ProfilePage/index.js

@@ -6,8 +6,9 @@ import ChangeEmailForm from './ChangeEmailForm/index';
 import ChangePasswordForm from './changePassword/index'
 import {changeLoginRequest} from '../../../actions/user/changelogin';
 import {changeEmailRequest} from '../../../actions/user/changeEmail';
-import {changePasswordRequest } from '../../../actions/user/changePassword'
-
+import {changePasswordRequest } from '../../../actions/user/changePassword';
+import {myUserRequest} from '../../../actions/admin/meUser'
+import store from '../../../state'
 
 class ProfilePage extends React.Component {
     
@@ -16,6 +17,10 @@ class ProfilePage extends React.Component {
         klick: false,
         click: false
     }
+    componentDidMount(){
+        const {myUserRequest} =this.props
+        myUserRequest()
+    }
 
     handleClick = () => {
         this.setState((prevState) => ({ clicked: !prevState.clicked }));
@@ -28,47 +33,38 @@ class ProfilePage extends React.Component {
     }
 
     render() {
-        const { signIn:{data, token}, changeLoginRequest, chageLoginReducer, changeEmailRequest, changeEmailReducer, changePasswordRequest} = this.props;
-      console.log(changeEmailReducer)
+        console.log(store.getState(), data)
+        const { myUser:{data, token}, changeLoginRequest, chageLoginReducer, changeEmailRequest, changeEmailReducer, changePasswordRequest} = this.props;
         const {clicked, klick, click} =this.state;
         const {handleClick, handleClicks, handleClicked} = this;
 
         return (
-            <div className="page page--bottom-only profile-page ">
-                <div className="border bg-autumn-foliage m-5 rounded d-flex flex-wrap">
+            <div className="page page--bottom-only profile-page bg-img d-block w-100 slider-image padding" >
+                <div className="border bg-rgba rounded d-flex  ">
                     <div>
-                {/* <h5 className="p-2 font-po-bold flex-fill bd-highlight align-self-end">{data.name}</h5> */}
-                {/* <div className="d-flex"  >
-                <p className="p-2 flex-fill font-po-bold bd-highlight align-self-end">Email</p><p className="p-2 flex-fill font-po-bold bd-highlight align-self-end">{data.email}</p>
-                </div> */}
-                {/* <div className="d-flex"  >
-                <p className="p-2 flex-fill font-po-bold bd-highlight align-self-end">Role</p><p className="p-2 flex-fill font-po-bold bd-highlight align-self-end">{data.role}</p>
-                </div> */}
-                
                     <div>
-                        <img className="m-4 " src=" https://cdn.iconscout.com/icon/free/png-256/avatar-373-456325.png" ></img>
+                        <img className="m-4 " src=" https://ru.opensuse.org/images/0/0b/Icon-user.png" ></img>
                     </div>
                     </div>
-                    <div className="border-left bg-autumn-foliage m-5 rounded w-75 ">
+                    <div className="border-left bg-autumn-foliage m-5 rounded w-75 text-white font-ci font-ci-bold">
                             {!clicked
                             ?
                         <div  className ="d-flex mb-3" >
-                            <h3 className = " p-2 flex-fill bd-highlight">Name</h3>
+                            <h3 className = " p-2 flex-fill bd-highlight ">Name</h3>
                             <h5 className="p-2 font-po-bold flex-fill bd-highlight align-self-end">{
                                 chageLoginReducer.data == null
                                 ?
-                                data.name 
+                                data&&data.name 
                                 :
                                 chageLoginReducer.data
 
-                                }</h5>
-                            <button type="button" onClick ={handleClick}  className=" flex-fill bg-shadow btn btn-outline-primary col-3">Change</button>
+                                }</h5> 
+                             <button type="button" onClick ={handleClick}  className=" flex-fill bg-shadow btn text-white font-ci font-ci-bold col-3">Change</button>
                         </div>
                         :
-                        <div>
+                        <div className ="d-flex mb-3">
                         <h3 className = " p-2 flex-fill bd-highlight">Name</h3>
-                        <h5 className="p-2 font-po-bold flex-fill bd-highlight align-self-end">{data.name}</h5>
-                        <ChangeLoginForm data ={data} token={token} actions ={{changeLoginRequest}} handlers={{ handleClick}}> </ChangeLoginForm>
+                        <ChangeLoginForm className="p-2 font-po-bold flex-fill bd-highlight align-self-end" data ={data} initialValues={data} token={token} actions ={{changeLoginRequest}} handlers={{ handleClick}}> </ChangeLoginForm>
                         </div>
                             }
                             {!klick
@@ -79,18 +75,17 @@ class ProfilePage extends React.Component {
                                 {
                                     changeEmailReducer.data ===null
                                     ?
-                                    data.email
+                                    data&&data.email
                                     :
                                     changeEmailReducer.data
-                                }
-                            </h5>
-                            <button type="button" name ="name"  onClick ={handleClicks} className=" flex-fill bg-shadow btn btn-outline-primary col-3">Change</button>
+                                } 
+                             </h5>
+                            <button type="button" name ="name"  onClick ={handleClicks} className=" flex-fill bg-shadow btn text-white font-ci font-ci-bold col-3">Change</button>
                         </div>
                         :
                         <div  className ="d-flex mb-3" >
                             <h3 className = "p-2 flex-fill bd-highlight">Email</h3>
-                            <h5 className="p-2 flex-fill font-po-bold bd-highlight align-self-end">{data.email}</h5>
-                            <ChangeEmailForm  data ={data} token={token} actions ={{changeEmailRequest}} handlers={{ handleClicks}}></ChangeEmailForm>
+                            <ChangeEmailForm  data ={data} token={token} initialValues={data} actions ={{changeEmailRequest}} handlers={{ handleClicks}}></ChangeEmailForm>
                         </div>
                             }
                             {
@@ -98,9 +93,9 @@ class ProfilePage extends React.Component {
                                 ?
                         <div  className ="d-flex mb-3" >
                             <h3 className = "p-2 flex-fill bd-highlight">Password</h3>
-                            <button type="button" onClick ={handleClicked} className=" flex-fill bg-shadow btn btn-outline-primary col-3">Change</button>
-                        </div>
-                        :
+                            <button type="button" onClick ={handleClicked} className=" flex-fill bg-shadow btn text-white font-ci font-ci-bold col-3">Change</button>
+                        </div> 
+                         :
                         <div  className ="d-flex mb-3" >
                             <h3 className = "p-2 flex-fill bd-highlight">Password</h3>
                            <ChangePasswordForm data ={data} token={token} actions ={{changePasswordRequest}} handlers={{ handleClicked}}></ChangePasswordForm>
@@ -109,8 +104,10 @@ class ProfilePage extends React.Component {
                  
                     </div>
                 </div>
-                
                 </div>
+                
+                
+                
             
         )
     }
@@ -119,11 +116,11 @@ class ProfilePage extends React.Component {
 
 const
     mapStateToProps = state => ({
-        signIn: state.signIn,
+        myUser:state.myUser,
         chageLoginReducer: state.chageLoginReducer,
         changeEmailReducer:state.changeEmailReducer
     });
 
-const mapDispatchToProps = dispatch => bindActionCreators({changeLoginRequest, changeEmailRequest, changePasswordRequest}, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({changeLoginRequest, changeEmailRequest, changePasswordRequest, myUserRequest}, dispatch);
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProfilePage);

src/configs/requestsConfigs/index.js

@@ -0,0 +1,12 @@
+export const defaultConfig = {
+    headers: {
+        "Content-Type": "application/json"
+    }
+}
+
+export const makeConfigWithJWT = jwt => ({
+    headers: {
+        "Content-Type": "application/json",
+        "Authorization": `Bearer ${jwt}`
+    }
+})

src/configs/routerConfig.js

@@ -1,20 +1,25 @@
 import React, { lazy } from 'react';
+
+import Landing from './../components/public/landing';
 import * as routes from './../constants/routes';
 
 const ProfilePage = lazy(() => import('../components/user/ProfilePage'));
 const DeleteUser = lazy(()=>import('../components/admin/deleteUser/index'));
 const AddDeleteCategory = lazy(()=> import('../components/admin/addDeleteCategory'));
 const CreateTest = lazy(()=> import('../components/admin/CreateTest'));
+const ChangeTest = lazy(()=>import('../components/admin/getChangeDeleteTest/index'))
+
+const SignIn = lazy(() => import('../components/public/SignIn/index'));
+const SignUp = lazy(() => import('../components/public/SignUp/index'));
 
-// import SignIn from '../components/public/SignIn';
-const SignIn = lazy(() => import('./../components/public/SignIn'));
-const SignUp = lazy(() => import('./../components/public/SignUp'));
+
+const CardsCreator = lazy(() => import('./../components/admin/CardsCreator'))
 
 export default [
     {
         path: routes.LANDING,
         access: 'public',
-        component: () => <div>landing</div>
+        component: Landing
     },
     {
         path: routes.SIGN_IN,
@@ -46,6 +51,11 @@ export default [
         access: 'user-only',
         component: () => <div>test</div>
     },
+    {
+        path: '/admin',
+        access: 'admin-only',
+        component: () => <div>Some admin-only component</div>
+    },
     {
         path: routes.DELETE_USER,
         access: 'admin-only',
@@ -61,6 +71,16 @@ export default [
         access: 'admin-only',
         component: CreateTest
     },
+    {
+        path: routes.CREATE_TEST,
+        access: 'public',
+        component: CardsCreator
+    },
+    {
+        path: routes.CHANGE_TEST,
+        access: 'public',
+        component: ChangeTest
+    },
     {
         access: 'public',
         component: () => <div>404</div>

src/configs/validate.js

@@ -0,0 +1,25 @@
+export default function validate(values) {
+    const {  password, passwordConfirmation } = values;
+    console.log(values)
+    const errors = {};
+
+if (!password) {
+    errors.password = "Required"
+}
+else if (/[,]/.test(password)) {
+    errors.password = "Invalid symbol: \",\" is not allowed!";
+}
+else if (password.length < 8 || password.length > 20) {
+    errors.password = "Invalid password length: password should be from 8 to 20 symbols";
+}
+else if (!/^[a-z0-9_-]{8,20}$/i.test(password)) {
+    errors.password = "Invalid password, try another one";
+}
+
+if (!passwordConfirmation) {
+    errors.passwordConfirmation = "Required";
+}
+else if (password !== passwordConfirmation) {
+    errors.passwordConfirmation = "Passwords don't match each other!";
+}
+    }

src/constants/admin.js

@@ -28,5 +28,48 @@ export const CREATE_QUESTIONS_REQUEST_SUCCESS = 'CREATE_QUESTIONS_REQUEST_SUCCES
 export const CREATE_ANSVERS_REQUEST_SUCCESS = 'CREATE_ANSVERS_REQUEST_SUCCESS';
 export const CREATE_TEST_REQUEST_FAILURE = 'CREATE_TEST_REQUEST_FAILURE';
 
+export const MY_USER = "https://test-app-a-level.herokuapp.com/me";
+export const MY_USER_REQUEST = 'MY_USER_REQUEST';
+export const MY_USER_REQUEST_SUCCESS = 'MY_USER_REQUEST_SUCCESS';
+export const MY_USER_REQUEST_FAILURE = 'MY_USER_REQUEST_FAILURE';
 
+export const GET_USERS = "https://test-app-a-level.herokuapp.com/users/list";
+export const GET_USERS_REQUEST = 'GET_USERS_REQUEST';
+export const GET_USERS_REQUEST_SUCCESS = 'GET_USERS_REQUEST_SUCCESS';
+export const GET_USERS_REQUEST_FAILURE = 'GET_USERS_REQUEST_FAILURE';
 
+
+export const CHANGE_USER = "https://test-app-a-level.herokuapp.com/users/";
+export const CHANGE_USER_ROLE = "https://test-app-a-level.herokuapp.com/users/changeRole/";
+
+export const CHANGE_USERS_REQUEST = 'CHANGE_USERS_REQUEST';
+export const CHANGE_USERS_REQUEST_SUCCESS = 'CHANGE_USERS_REQUEST_SUCCESS';
+export const CHANGE_USERS_REQUEST_FAILURE = 'CHANGE_USERS_REQUEST_FAILURE';
+
+
+export const GET_TOPIC_REQUEST = 'GET_TOPIC_REQUEST';
+export const GET_TOPIC_REQUEST_SUCCESS = 'GET_TOPIC_REQUEST_SUCCESS';
+export const GET_TOPIC_REQUEST_FAILURE = 'GET_TOPIC_REQUEST_FAILURE';
+
+
+export const GET_QUESTIONS_REQUEST = 'GET_QUESTIONS_REQUEST';
+export const GET_QUESTIONS_REQUEST_SUCCESS = 'GET_QUESTIONS_REQUEST_SUCCESS';
+export const GET_QUESTIONS_REQUEST_FAILURE = 'GET_QUESTIONS_REQUEST_FAILURE';
+
+export const DELETE_TOPIC_REQUEST = 'DELETE_TOPIC_REQUEST';
+export const DELETE_TOPIC_REQUEST_SUCCESS = 'DELETE_TOPIC_REQUEST_SUCCESS';
+export const DELETE_TOPIC_REQUEST_FAILURE = 'DELETE_TOPIC_REQUEST_FAILURE';
+
+export const DELETE_QUESTION_REQUEST = 'DELETE_QUESTION_REQUEST';
+export const DELETE_QUESTION_REQUEST_SUCCESS = 'DELETE_QUESTION_REQUEST_SUCCESS';
+export const DELETE_QUESTION_REQUEST_FAILURE = 'DELETE_QUESTION_REQUEST_FAILURE';
+
+export const GET_ANSWERS_REQUEST = 'GET_ANSWERS_REQUEST';
+export const GET_ANSWERS_REQUEST_SUCCESS = 'GET_ANSWERS_REQUEST_SUCCESS';
+export const GET_ANSWERS_REQUEST_FAILURE = 'GET_ANSWERS_REQUEST_FAILURE';
+
+export const CHANGE_TEST_REQUEST = 'CHANGE_TEST_REQUEST';
+export const CHANGE_TOPIC_REQUEST_SUCCESS = 'CHANGE_TOPIC_REQUEST_SUCCESS';
+export const CHANGE_QUESTIONS_REQUEST_SUCCESS = 'CHANGE_QUESTIONS_REQUEST_SUCCESS';
+export const CHANGE_ANSVERS_REQUEST_SUCCESS = 'CHANGE_ANSVERS_REQUEST_SUCCESS';
+export const CHANGE_TEST_REQUEST_FAILURE = 'CHANGE_TEST_REQUEST_FAILURE';

src/constants/auth.js

@@ -6,4 +6,9 @@ export const SIGN_IN_REQUEST_FAILURE = 'SIGN_IN_REQUEST_FAILURE';
 export const SIGN_UP_URL = 'https://test-app-a-level.herokuapp.com/auth/register';
 export const SIGN_UP_REQUEST = 'SIGN_UP_REQUEST';
 export const SIGN_UP_REQUEST_SUCCESS = 'SIGN_UP_REQUEST_SUCCESS';
-export const SIGN_UP_REQUEST_FAILURE = 'SIGN_UP_REQUEST_FAILURE';
+export const SIGN_UP_REQUEST_FAILURE = 'SIGN_UP_REQUEST_FAILURE';
+
+export const LOG_OUT_URL = 'https://test-app-a-level.herokuapp.com/auth/logout';
+export const LOG_OUT_REQUEST = 'LOG_OUT_REQUEST';
+export const LOG_OUT_REQUEST_SUCCESS = 'LOG_OUT_REQUEST_SUCCESS';
+export const LOG_OUT_REQUEST_FAILURE = 'LOG_OUT_REQUEST_FAILURE';

src/constants/routes.js

@@ -9,6 +9,7 @@ export const CREATE_CATEGORY = '/create-category';
 export const CATEGORIES = '/categories';
 export const PROFILE = '/profile';
 export const CREATE_TEST = '/create-test';
+export const CHANGE_TEST = '/change-test';
 export const DELETE_USER = '/delete-user'
 export const TESTS = '/test';
 export const PASSWORD_FORGET = '/pw-forget';

src/reducers/admin/changeCategory.js

@@ -1,30 +1,38 @@
 import * as actionTypes from '../../constants/admin';
-import initialState from './../initialState';
+import initialState from '../initialState';
 
-export default function changeCategory(state = initialState.newCategory, {payload, type, error}) {
+export default function changeCategory(state = initialState.changeCategory, {payload, type, error}) {
 
     switch (type) { // payload.type -> type
-        case actionTypes.CREATE_CATEGORY_REQUEST: {
+        case 'wtfUpdate': {
+            return initialState.changeCategory
+        }
+        case actionTypes.CHANGE_CATEGORY_REQUEST: {
             return {
                 ...state,
                 isFetching: true,
-                payload
+                isFlag:false,
+                data:null,
+                error: null
             }
         }
-        case actionTypes.CREATE_CATEGORY_REQUEST_SUCCESS: {
-            const { name } = payload;
+        case actionTypes.CHANGE_CATEGORY_REQUEST_SUCCESS: {
+            const { data } = payload;
 
             return {
                 ...state,
                 isFetching: false,
-                name: name,
+                isFlag:true,
+                data: data,
+                error: null,
             }
         }
-        case actionTypes.GET_CATEGORY_REQUEST_FAILURE: {
+        case actionTypes.CHANGE_CATEGORY_REQUEST_FAILURE: {
 
             return {
                 ...state,
                 isFetching: false,
+                data: null,
                 error
             }
         }

src/reducers/admin/createCategory.js

@@ -0,0 +1,42 @@
+import * as actionTypes from '../../constants/admin';
+import initialState from '../initialState';
+
+export default function newCategory(state = initialState.newCategory, {payload, type, error}) {
+
+    switch (type) { // payload.type -> type
+        case 'wtfCreate': { // CREATE_CATEGORY_NULIFY
+            return initialState.newCategory
+        }
+
+        case actionTypes.CREATE_CATEGORY_REQUEST: {
+            
+            return {
+                ...state,
+                isFetching: false,
+                isFlag:false,
+                data:null
+            }
+        }
+        case actionTypes.CREATE_CATEGORY_REQUEST_SUCCESS: {
+            const { data } = payload;
+
+            return {
+                ...state,
+                isFetching: false,
+                isFlag:true,
+                data: data,
+            }
+        }
+        case actionTypes.GET_CATEGORY_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/getCategory.js

@@ -11,11 +11,12 @@ export default function getCategory(state = initialState.category, {payload, typ
             }
         }
         case actionTypes.GET_CATEGORY_REQUEST_SUCCESS: {
-            const { category } = payload;
+            const { data:{category} } = payload;
 
             return {
                 ...state,
                 isFetching: false,
+                isFlag:true,
                 data: category,
             }
         }

src/reducers/admin/getUsers.js

@@ -0,0 +1,33 @@
+import * as actionTypes from '../../constants/admin';
+import initialState from './../initialState';
+
+export default function getUsers(state = initialState.users, { payload, type, error }) {
+
+    switch (type) { // payload.type -> type
+        case actionTypes.GET_USERS_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case actionTypes.GET_USERS_REQUEST_SUCCESS: {
+            const {data:{users}}=payload
+            return {
+                ...state,
+                isFetching: false,
+                user:users
+            }
+        }
+        case actionTypes.GET_USERS_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/initialValues.js

@@ -0,0 +1,31 @@
+import * as actionTypes from '../../constants/admin';
+import initialState from './../initialState';
+
+export default function getCategory(state = initialState.initialValues, {payload, type, error}) {
+
+    switch (type) { // payload.type -> type
+        case actionTypes.GET_CATEGORY_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                categoryId:payload
+            }
+        }
+        case actionTypes.GET_TOPIC_REQUEST_SUCCESS: {
+
+            return {
+                ...state,
+                name:payload,
+            }
+        }
+        case actionTypes.GET_QUESTIONS_REQUEST_SUCCESS: {
+
+            return {
+                ...state,
+                question:payload
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/test/createTopics.js

@@ -8,19 +8,18 @@ export default function topic(state = initialState.topicId, {payload, type, erro
             return {
                 ...state,
                 isFetching: true,
-                payload
+                // payload
             }
         }
         case actionTypes.CREATE_TOPICS_REQUEST_SUCCESS: {
-            const { data } = payload;
-
+const {data:{topic}}=payload
             return {
                 ...state,
                 isFetching: false,
-                topic:payload
+                topic
             }
         }
-        case actionTypes.DELETE_CATEGORY_REQUEST_FAILURE: {
+        case actionTypes.CREATE_TOPICS_REQUEST_FAILURE: {
 
             return {
                 ...state,

src/reducers/admin/test/deleteQuestion.js

@@ -0,0 +1,34 @@
+import * as actionTypes from '../../../constants/admin';
+import initialState from '../../initialState';
+
+export default function deleteQuestion(state = initialState.deleteQuestion, {payload, type, error}) {
+
+    switch (type) { 
+        case actionTypes.DELETE_QUESTION_REQUEST: {
+            return {
+                ...state,
+                isFetching: false,
+                payload
+            }
+        }
+        case actionTypes.DELETE_QUESTION_REQUEST_SUCCESS: {
+
+            return {
+                ...state,
+                isFetching: true,
+                payload
+            }
+        }
+        case actionTypes.DELETE_QUESTION_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/test/deleteTopic.js

@@ -0,0 +1,34 @@
+import * as actionTypes from '../../../constants/admin';
+import initialState from '../../initialState';
+
+export default function deleteTopic(state = initialState.deleteTopic, {payload, type, error}) {
+
+    switch (type) { 
+        case actionTypes.DELETE_TOPIC_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+                payload
+            }
+        }
+        case actionTypes.DELETE_TOPIC_REQUEST_SUCCESS: {
+
+            return {
+                ...state,
+                isFetching: false,
+                payload
+            }
+        }
+        case actionTypes.DELETE_TOPIC_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: true,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/test/getAnswers.js

@@ -0,0 +1,36 @@
+import * as actionTypes from '../../../constants/admin';
+import initialState from '../../initialState';
+
+export default function getAnswers(state = initialState.arrayAnswers, { payload, type, error }) {
+
+    switch (type) {
+        case actionTypes.GET_ANSWERS_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+                isFlag: false,
+                payload
+            }
+        }
+        case actionTypes.GET_ANSWERS_REQUEST_SUCCESS: {
+            const {data:{answers}}=payload
+            return {
+                ...state,
+                isFetching: false,
+                isFlag: true,
+                answers:answers
+            }
+        }
+        case actionTypes.GET_ANSWERS_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/test/getQuestions.js

@@ -0,0 +1,36 @@
+import * as actionTypes from '../../../constants/admin';
+import initialState from '../../initialState';
+
+export default function getQuestions(state = initialState.arrayQuestions, { payload, type, error }) {
+
+    switch (type) {
+        case actionTypes.GET_QUESTIONS_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+                isFlag: false,
+                payload
+            }
+        }
+        case actionTypes.GET_QUESTIONS_REQUEST_SUCCESS: {
+            const { data: { questions } } = payload
+            return {
+                ...state,
+                isFetching: false,
+                isFlag: true,
+                questions: questions
+            }
+        }
+        case actionTypes.GET_QUESTIONS_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/admin/test/getTopic.js

@@ -0,0 +1,37 @@
+import * as actionTypes from '../../../constants/admin';
+import initialState from '../../initialState';
+
+export default function getTopic(state = initialState.topic, {payload, type, error}) {
+
+    switch (type) { 
+        case actionTypes.GET_TOPIC_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+                isFlag:false,
+                payload
+            }
+        }
+        case actionTypes.GET_TOPIC_REQUEST_SUCCESS: {
+const {data:{topics}} =payload
+            return {
+                ...state,
+                isFetching: false,
+                isFlag:true,
+                topics
+            }
+        }
+        case actionTypes.GET_TOPIC_REQUEST_FAILURE: {
+
+            return {
+                ...state,
+                isFetching: false,
+                isFlag:false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/auth/logOut.js

@@ -0,0 +1,31 @@
+import * as actionTypes from './../../constants/auth';
+import initialState from './../initialState';
+
+export default function signInReducer(state = initialState.signIn, {type, error}) {
+
+    switch (type) {
+        case actionTypes.LOG_OUT_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case actionTypes.LOG_OUT_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                isFetching: false,
+                isSuccessful: true
+            }
+        }
+        case actionTypes.LOG_OUT_REQUEST_FAILURE: {
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/reducers/index.js

@@ -5,20 +5,36 @@ import signIn from './auth/signIn';
 import signUp from './auth/signUp';
 
 import category from './admin/getCategory';
-import newCategory from './admin/changeCategory';
+import newCategory from './admin/createCategory';
 import topicId from './admin/test/createTopics';
+import topic from './admin/test/getTopic';
+import deleteTopic from './admin/test/deleteTopic';
+import deleteQuestion from './admin/test/deleteQuestion';
+import  initialValues from './admin/initialValues';
+import arrayAnswers from './admin/test/getAnswers'
 
+import changeCategory from './admin/changeCategory';
+import arrayQuestions from './admin/test/getQuestions'
 import chageLoginReducer from './user/chageLogin';
 import changeEmailReducer from './user/changeEmail';
+import myUser from './user/myUser'
+import users from './admin/getUsers'
 
 export default combineReducers({
-
     signIn,
-    signUp,
     chageLoginReducer,
     changeEmailReducer,
     form,
     category,
+    changeCategory,
     newCategory,
-    topicId
+    topicId,
+    myUser,
+    users,
+    topic,
+    arrayQuestions,
+    deleteTopic,
+    deleteQuestion,
+    initialValues, 
+    arrayAnswers
 })

src/reducers/initialState.js

@@ -1,39 +1,88 @@
 export default {
+
+    users: {
+        isFetching: false,
+        user: null,
+        error: null
+    },
+    changeLogin: {
+        isFetching: false,
+        data: null,
+        error: null
+    },
+    changeEmail: {
+        isFetching: false,
+        data: null,
+        error: null
+    },
     signIn: {
         isFetching: false,
         data: null,
+        error: null
+    },
+    category: {
+        data: null,
+        isFetching: false,
+        error: null,
+        isFlag: false
+    },
+    newCategory: {
+        data: null,
+        isFetching: false,
         error: null,
-        token: null
+        isFlag: false
     },
-    signUp: {
+    topicId: {
         isFetching: false,
-        isSuccessful: null,
         error: null
     },
-    changeLogin:{
+    topic: {
+        // topic:null,
+        isFetching: true,
+        error: null
+    }
+    ,
+    initialValues:{
+        categoryId:null,
+        name:null,
+        description:null,
+        topicId:null,
+        question:null,
+        simple:null
+    },
+    deleteTopic:{
+        isFetching:true,
+    },
+    deleteQuestion:{
+        isFetching:false,
+    },
+    logOut: {
         isFetching: false,
+        isSuccessful: null,
+        error: null
+    },
+    myUser: {
         data: null,
+        isFetching: false,
         error: null
     },
-    changeEmail:{
+    changeCategory: {
         isFetching: false,
+        isFlag: false,
         data: null,
         error: null
+    }
+    ,
+    arrayQuestions: {
+        isFetching: false,
+        isFlag: false,
+        questions: null,
+        error: null
     },
-    category:{
-    data:null,
-    isFetching:false,
-    error:null
-},
-newCategory:{
-    name:null,
-    isFetching:false,
-    error:null
-},
- topicId:{
-    topicId:null,
-    isFetching:false,
-    error:null
- }
-
+    arrayAnswers: {
+        isFetching: false,
+        isFlag: false,
+        answers: null,
+        error: null
+    }
 }

src/reducers/user/myUser.js

@@ -0,0 +1,34 @@
+import * as actionTypes from './../../constants/admin';
+import initialState from './../initialState';
+
+export default function myUser(state = initialState.myUser, {  type, payload }) {
+    switch (type) {
+        case actionTypes.MY_USER_REQUEST: {
+            console.log(payload)
+            return {
+                ...state,
+                isFetching: true,
+                payload
+            }
+        }
+        case actionTypes.MY_USER_REQUEST_SUCCESS: {
+            const {data} =payload
+            return {
+                ...state,
+                isFetching: false,
+                data:data
+            }
+        }
+        case actionTypes.MY_USER_REQUEST_FAILURE: {
+            const { error } = payload;
+            return {
+                ...state,
+                isFetching: false,
+                error
+            }
+        }
+        default: {
+            return state;
+        }
+    }
+}

src/router.js

@@ -15,7 +15,7 @@ class Router extends React.Component {
         const { user, tokenAuth } = this.props;
         // TODO: add footer
         return (
-            <div className="app">
+            <div className="app w-100 img slider-image ">
                 <Header />
                 <Suspense fallback={<Spinner />}>
                     <Switch>

src/sagas/admin/category/changeCategory.js

@@ -2,15 +2,17 @@ import { put, call } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { CREATE_CATEGORY } from '../../../constants/admin';
-import { changeCategorySuccess, changeCategoryFailure } from '../../../actions/admin/category/changeCategory'
+import { changeCategorySuccess, changeCategoryFailure } from '../../../actions/admin/category/changeCategory';
+import storageKey from '../../../utils/storageKey';
 
-export default function* ({payload:{id,name ,token}}) {
-    console.log('User inside the worker-saga', name, "token", token, 'id', id );
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{id,name}}) {
     try {
         const config = {
             headers: {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 

src/sagas/admin/category/createCategory.js

@@ -2,15 +2,18 @@ import { put, call } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { CREATE_CATEGORY } from '../../../constants/admin';
-import { createCategorySuccess, createCategoryFailure } from '../../../actions/admin/category/createCategory'
+import { createCategorySuccess, createCategoryFailure } from '../../../actions/admin/category/createCategory';
+import storageKey from '../../../utils/storageKey';
 
-export default function* ({payload:{name,token}}) {
-    console.log('User inside the worker-saga', name, token);
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{name}}) {
+    console.log(name)
     try {
         const config = {
             headers: {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 

src/sagas/admin/category/deleteCategory.js

@@ -3,13 +3,16 @@ import axios from 'axios';
 
 import { CREATE_CATEGORY } from '../../../constants/admin';
 import { deleteCategorySuccess, deleteCategoryFailure } from '../../../actions/admin/category/deleteCategory';
+import storageKey from '../../../utils/storageKey';
 
-export default function* ({payload:{id,token}}) {
-    console.log('User inside the worker-saga', "token", token, 'id', id );
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{id}}) {
+    console.log(id, getItem)
     try {
         const config = {
             headers: {
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 

src/sagas/admin/category/getCategory.js

@@ -1,22 +1,23 @@
 import { put, call } from 'redux-saga/effects';
 import axios from 'axios';
-
+import storageKey from './../../../utils/storageKey';
 import { CREATE_CATEGORY } from '../../../constants/admin';
 import { getCategorySuccess, getCategoryFailure } from '../../../actions/admin/category/getCategory'
 
-export default function* ({payload}) {
-    console.log('User inside the worker-saga', payload);
+const getItem = localStorage.getItem(storageKey);
+
+export default function* () {
+
     try {
         const config = {
             headers: {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${payload}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 
         const category = yield call(() =>
-            axios.get(CREATE_CATEGORY, config)
-            .then(({ data }) => data)
+            axios.get(`${CREATE_CATEGORY}?size=${50}`, config)
         )
 
         yield put(getCategorySuccess(category));

src/sagas/admin/test/changeTest.js

@@ -0,0 +1,67 @@
+import { put, call, all } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CREATE_QUESTIONS, CREATE_ANSVERS, CREATE_TOPICS } from '../../../constants/admin';
+import { createQuestionSuccess, createAnswersSuccess, createTestFailure } from '../../../actions/admin/test/createTest';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ( payload) {
+    console.log(payload)
+    // try {
+    //     console.log(questions, array, simple, _id)
+
+    //     const headers = {
+    //         "Content-Type": "application/json",
+    //         "Authorization": `Bearer ${getItem}`
+    //     }
+
+
+
+        // const topic = yield call(
+        //     axios, {
+        //         url: `https://test-app-a-level.herokuapp.com/questions`,
+        //         method: 'POST',
+        //         headers,
+        //         data: {
+        //             topicId: _id,
+        //             question: questions,
+        //             simple: simple
+        //         }
+
+        //     }
+        // )
+
+
+        // const { data: { question } } = questionses;
+        // console.log(typeof( question._id))
+
+        // yield put(createQuestionSuccess(questionses));
+
+        // const responses = yield all(array.map(el => {
+        //     console.log(el. price, el.correct, el.answer)
+        //     return call(axios, {
+        //         url: CREATE_ANSVERS,
+        //         method: 'POST',
+        //         headers,
+        //         data: {
+        //             answer: el.answer,
+        //             price: el.price,
+        //             correct: el.correct,
+        //             questionId: question._id
+                     
+        //         }
+
+
+        //     })
+        // }))
+
+
+        // yield put(createAnswersSuccess(responses));
+
+    // }
+    // catch ({ message }) {
+    //     yield put(createTestFailure(message));
+    // }
+}

src/sagas/admin/test/createTest.js

@@ -2,58 +2,65 @@ import { put, call, all } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { CREATE_QUESTIONS, CREATE_ANSVERS } from '../../../constants/admin';
-import {  createQuestionSuccess, createAnswersSuccess, createTestFailure } from '../../../actions/admin/test/createTest'
+import { createQuestionSuccess, createAnswersSuccess, createTestFailure } from '../../../actions/admin/test/createTest';
+import storageKey from '../../../utils/storageKey';
 
-export default function* ({ payload: {  questions, array, simple,_id,  token } }) {
-    console.log('User inside the worker-saga', "name", _id, "discription", simple, "question", questions, array);
-    console.log(token)
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({ payload: { questions, array, simple, _id } }) {
     try {
-         
-        const   headers = {
-                "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
-            }
-        
+        console.log(questions, array, simple, _id)
+
+        const headers = {
+            "Content-Type": "application/json",
+            "Authorization": `Bearer ${getItem}`
+        }
+
 
 
         const questionses = yield call(
             axios, {
-                url:`https://test-app-a-level.herokuapp.com/questions`,
-                method:'POST',
+                url: `https://test-app-a-level.herokuapp.com/questions`,
+                method: 'POST',
                 headers,
-                data:{
-                topicId:_id,
-                question:questions,
-                simple:simple
+                data: {
+                    topicId: _id,
+                    question: questions,
+                    simple: simple
                 }
-                
+
             }
         )
 
-        
+
         const { data: { question } } = questionses;
-        console.log(question._id)
+        console.log(typeof( question._id))
 
-        const responses = yield all(array.map(el =>{ return call(axios,{
-                    url:`https://test-app-a-level.herokuapp.com/answers`,
-                    method:'POST',
-                    headers,
-                    data:{
+        yield put(createQuestionSuccess(questionses));
+
+        const responses = yield all(array.map(el => {
+            console.log(el. price, el.correct, el.answer)
+            return call(axios, {
+                url: CREATE_ANSVERS,
+                method: 'POST',
+                headers,
+                data: {
                     answer: el.answer,
                     price: el.price,
                     correct: el.correct,
-                    questionId:question._id
-                    }
-                  
-        
-                })}))
+                    questionId: question._id
+                     
+                }
+
+
+            })
+        }))
+
 
-    // yield put(createTopicsSuccess(topic));
-    yield put(createAnswersSuccess(responses));
-    yield put(createQuestionSuccess(questionses));
+        yield put(createAnswersSuccess(responses));
 
-}
+    }
     catch ({ message }) {
-    yield put(createTestFailure(message));
-}
+        yield put(createTestFailure(message));
+    }
 }

src/sagas/admin/test/createTopic.js

@@ -2,14 +2,17 @@ import { put, call, all } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { CREATE_TOPICS } from '../../../constants/admin';
-import { createTopicsSuccess, createTopicsFailure} from '../../../actions/admin/test/createTopics'
+import { createTopicsSuccess, createTopicsFailure} from '../../../actions/admin/test/createTopics';
+import storageKey from '../../../utils/storageKey';
 
-export default function* ({ payload: { name, description, categoryId, token } }) {
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({ payload: { name, description, categoryId} }) {
     try {
          
         const   headers = {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         
         const topic = yield call(

src/sagas/admin/test/deleteQuestion.js

@@ -0,0 +1,28 @@
+import { put, call } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CREATE_QUESTIONS } from '../../../constants/admin';
+import { deleteQuestionSuccess, deleteQuestionFailure } from '../../../actions/admin/changeTest/deleteQuestion';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({ payload: { _id } }) {
+    try {
+        const config = {
+            headers: {
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+
+        const question = yield call(() =>
+            axios.delete(`${CREATE_QUESTIONS}${'/'}${_id}`, config)
+
+        )
+
+        yield put(deleteQuestionSuccess(question));
+    }
+    catch ({ message }) {
+        yield put(deleteQuestionFailure(message));
+    }
+}

src/sagas/admin/test/deleteTopic.js

@@ -0,0 +1,28 @@
+import { put, call } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CREATE_TOPICS } from '../../../constants/admin';
+import { deleteTopicSuccess, deleteTopicFailure } from '../../../actions/admin/changeTest/deleteTopic';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{_id}}) {
+    try {
+        const config = {
+            headers: {
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+
+        const category = yield call(() =>
+            axios.delete(`${CREATE_TOPICS}${'/'}${_id}`, config)
+                
+        )
+
+        yield put(deleteTopicSuccess(category));
+    }
+    catch ({ message }) {
+        yield put(deleteTopicFailure(message));
+    }
+}

src/sagas/admin/test/getAnswers.js

@@ -0,0 +1,30 @@
+import { put, call, all } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CREATE_ANSVERS } from '../../../constants/admin';
+import { getAnswersSuccess, getAnswersFailure} from '../../../actions/admin/changeTest/getAnswers';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{value}}) {
+    console.log(value)
+    try {
+         
+        const config ={
+           headers: {
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+        
+        const answers = yield call(() =>
+            axios.get(`${CREATE_ANSVERS}?question=${value}` ,config)
+        )
+
+    yield put(getAnswersSuccess(answers));
+
+}
+    catch ({ message }) {
+    yield put(getAnswersFailure(message));
+}
+}

src/sagas/admin/test/getQuestions.js

@@ -0,0 +1,29 @@
+import { put, call, all } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CREATE_QUESTIONS } from '../../../constants/admin';
+import { getQuestionsSuccess, getQuestionsFailure} from '../../../actions/admin/changeTest/getQuestions';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{_id}}) {
+    try {
+         
+        const config ={
+           headers: {
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+        
+        const questions = yield call(() =>
+            axios.get(`${CREATE_QUESTIONS}?topic=${_id}` ,config)
+        )
+
+    yield put(getQuestionsSuccess(questions));
+
+}
+    catch ({ message }) {
+    yield put(getQuestionsFailure(message));
+}
+}

src/sagas/admin/test/getTopic.js

@@ -0,0 +1,29 @@
+import { put, call, all } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CREATE_TOPICS } from '../../../constants/admin';
+import { getTopicSuccess, getTopicFailure} from '../../../actions/admin/changeTest/getTopic';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{_id}}) {
+    try {
+         
+        const config ={
+           headers: {
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+        
+        const topic = yield call(() =>
+            axios.get(`${CREATE_TOPICS}?category=${_id}` ,config)
+        )
+
+    yield put(getTopicSuccess(topic));
+
+}
+    catch ({ message }) {
+    yield put(getTopicFailure(message));
+}
+}

src/sagas/admin/test/index.js

@@ -4,13 +4,22 @@ import * as actionTypes from '../../../constants/admin';
 import { takeEvery } from 'redux-saga/effects';
 import createTest from './createTest'
 import createTopic from './createTopic';
+import getTopic from './getTopic';
+import getQuestions from './getQuestions';
+import deleteTopic from './deleteTopic';
+import deleteQuestion from './deleteQuestion'
+import getAnswers from './getAnswers';
+import changeTest from './changeTest';
 
 export default function* () {
     yield takeEvery(actionTypes.CREATE_TOPICS_REQUEST, createTopic);
     yield takeEvery(actionTypes.CREATE_TEST_REQUEST, createTest);
-
-    
-
+    yield takeEvery(actionTypes.GET_TOPIC_REQUEST,getTopic);
+    yield takeEvery(actionTypes.GET_QUESTIONS_REQUEST,getQuestions);
+    yield takeEvery(actionTypes.DELETE_TOPIC_REQUEST,deleteTopic);
+    yield takeEvery(actionTypes.DELETE_QUESTION_REQUEST,deleteQuestion);
+    yield takeEvery(actionTypes.GET_ANSWERS_REQUEST,getAnswers);
+    yield takeEvery(actionTypes.CHANGE_TEST_REQUEST,changeTest);
 
 
 

src/sagas/admin/users/changeUser.js

@@ -0,0 +1,29 @@
+import { put, call } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { CHANGE_USER } from './../../../constants/admin';
+import { changeUserSuccess, changeUserFailure } from './../../../actions/admin/user/changeUser';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{name, email, newPassword, _id, confirmPassword}}) {
+    console.log(name, newPassword,email, _id)
+    try {
+        const config = {
+            headers: {
+                "Content-Type": "application/json",
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+
+        const user = yield call(() =>
+            axios.put(`${CHANGE_USER}${_id}` ,{name:name, emeil:email, password:newPassword, confirmPassword:confirmPassword}, config)
+        )
+
+        yield put(changeUserSuccess(user));
+    }
+    catch ({ message }) {
+        yield put(changeUserFailure(message));
+    }
+}

src/sagas/admin/users/getUser.js

@@ -0,0 +1,29 @@
+import { put, call } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { GET_USERS  } from './../../../constants/admin';
+import { getUserSuccess, getUserFailure } from './../../../actions/admin/user/getUser';
+import storageKey from '../../../utils/storageKey';
+
+const getItem = localStorage.getItem(storageKey);
+
+export default function* (payload) {
+    console.log(payload)
+    try {
+        const config = {
+            headers: {
+                "Content-Type": "application/json",
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+
+        const user = yield call(() =>
+            axios.get(GET_USERS , config)
+        )
+
+        yield put(getUserSuccess(user));
+    }
+    catch ({ message }) {
+        yield put(getUserFailure(message));
+    }
+}

src/sagas/admin/users/index.js

@@ -0,0 +1,10 @@
+import * as actionTypes from '../../../constants/admin';
+
+import { takeEvery } from 'redux-saga/effects';
+import changeUser from './changeUser';
+import getUser from './getUser';
+
+export default function* () {
+    yield takeEvery(actionTypes.GET_USERS_REQUEST, getUser);
+    yield takeEvery(actionTypes.CHANGE_USERS_REQUEST,changeUser);
+}

src/sagas/auth/index.js

@@ -1,10 +1,12 @@
+import { takeEvery } from 'redux-saga/effects';
+
+import * as actionTypes from './../../constants/auth'
 import signIn from './signIn';
 import signUp from './signUp';
-import * as actionTypes from './../../constants/auth'
-
-import { takeEvery } from 'redux-saga/effects';
+import logOut from './logOut';
 
 export default function* () {
     yield takeEvery(actionTypes.SIGN_IN_REQUEST, signIn)
     yield takeEvery(actionTypes.SIGN_UP_REQUEST, signUp)
+    yield takeEvery(actionTypes.LOG_OUT_REQUEST, logOut)
 }

src/sagas/auth/logOut.js

@@ -0,0 +1,25 @@
+import { put, call } from 'redux-saga/effects';
+import axios from 'axios';
+
+import { LOG_OUT_URL } from './../../constants/auth';
+import storageKey from './../../utils/storageKey';
+import { logOutFailure, logOutSuccess } from './../../actions/auth/logOut';
+
+const removeItem = () => {
+    localStorage.removeItem(storageKey);
+}
+
+export default function* ({ payload }) {
+    try {
+        const user = yield call(() =>
+            axios.get(LOG_OUT_URL, payload)
+                .then(({ data }) => data)
+        )
+
+        yield call(removeItem);
+        yield put(logOutSuccess(user));
+    }
+    catch ({ message }) {
+        yield put(logOutFailure(message));
+    }
+}

src/sagas/auth/signIn.js

@@ -3,24 +3,22 @@ import axios from 'axios';
 
 import { SIGN_IN_URL } from './../../constants/auth';
 import storageKey from './../../utils/storageKey';
-import { signInSuccess, signInFailure } from './../../actions/auth/signIn'
+import { signInSuccess, signInFailure } from './../../actions/auth/signIn';
+import { defaultConfig as config } from '../../configs/requestsConfigs';
+
+const setItem = (value) => {
+    localStorage.setItem(storageKey, value);
+}
 
 export default function* ({ payload }) {
     try {
-        const config = {
-            headers: {
-                "Content-Type": "application/json"
-            }
-        }
-
         const user = yield call(() =>
             axios.post(SIGN_IN_URL, payload, config)
             .then(({ data }) => data)
             
         )
 
-        // TODO: TOKEN
-        // yield call(localStorage.setItem, storageKey, user.token);
+        yield call(setItem, user.token);
         yield put(signInSuccess(user));
     }
     catch ({ message }) {

src/sagas/index.js

@@ -2,6 +2,8 @@ import { fork } from "redux-saga/effects";
 import auth from './auth'
 import user from './user/index'
 import admin from './admin/category/index';
+import usersAdmin from './admin/users/index';
+
 import adminTest from './admin/test/index'
 
 export default function*() {
@@ -9,5 +11,5 @@ export default function*() {
     yield fork(auth);
     yield fork(admin);
     yield fork(adminTest);
-
+    yield fork(usersAdmin);
 }

src/sagas/user/changeEmail.js

@@ -2,15 +2,17 @@ import { put, call } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { USER_URL } from './../../constants/user';
-import { changeEmailSuccess, changeEmailFailure } from './../../actions/user/changeEmail'
+import { changeEmailSuccess, changeEmailFailure } from './../../actions/user/changeEmail';
+import storageKey from '../../utils/storageKey';
 
-export default function* ({payload:{_id,email,token}}) {
-    console.log('User inside the worker-saga', _id,email,token);
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{_id,email}}) {
     try {
         const config = {
             headers: {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 

src/sagas/user/changeLogin.js

@@ -2,15 +2,17 @@ import { put, call } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { USER_URL } from './../../constants/user';
-import { changeLoginSuccess, changeLoginFailure } from './../../actions/user/changelogin'
+import { changeLoginSuccess, changeLoginFailure } from './../../actions/user/changelogin';
+import storageKey from '../../utils/storageKey';
 
-export default function* ({payload:{_id,name,token}}) {
-    console.log('User inside the worker-saga', _id,name,token);
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{_id,name}}) {
     try {
         const config = {
             headers: {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 

src/sagas/user/changePassword.js

@@ -2,15 +2,17 @@ import { put, call } from 'redux-saga/effects';
 import axios from 'axios';
 
 import { USER_URL } from './../../constants/user';
-import { changePasswordSuccess, changePasswordFailure } from './../../actions/user/changePassword'
+import { changePasswordSuccess, changePasswordFailure } from './../../actions/user/changePassword';
+import storageKey from '../../utils/storageKey';
 
-export default function* ({payload:{_id, password, confirmPassword,token}}) {
-    console.log('User inside the worker-saga', _id, password, confirmPassword, token);
+const getItem = localStorage.getItem(storageKey);
+
+export default function* ({payload:{_id, password, confirmPassword}}) {
     try {
         const config = {
             headers: {
                 "Content-Type": "application/json",
-                "Authorization": `Bearer ${token}`
+                "Authorization": `Bearer ${getItem}`
             }
         }
 

src/sagas/user/index.js

@@ -1,7 +1,10 @@
 import changeLogin from './changeLogin';
 import changeEmail from './changeEmail';
-import changePassword from './changePassword'
-import * as actionTypes from './../../constants/user'
+import changePassword from './changePassword';
+import myUser from './myUser';
+
+import * as actionTypes from './../../constants/user';
+import * as types from './../../constants/admin'
 
 import { takeEvery } from 'redux-saga/effects';
 
@@ -9,6 +12,8 @@ export default function* () {
     yield takeEvery(actionTypes.CHANGE_LOGIN_REQUEST, changeLogin);
     yield takeEvery(actionTypes.CHANGE_EMAIL_REQUEST, changeEmail);
     yield takeEvery(actionTypes.CHANGE_PASSWORD_REQUEST, changePassword);
+    yield takeEvery(types.MY_USER_REQUEST, myUser);
+
 
 
 

src/sagas/user/myUser.js

@@ -0,0 +1,31 @@
+import { put, call } from 'redux-saga/effects';
+import axios from 'axios';
+import storageKey from './../../utils/storageKey';
+
+import { MY_USER} from './../../constants/admin';
+import { myUserSuccess, myUserFailure } from './../../actions/admin/meUser';
+
+const getItem = localStorage.getItem(storageKey);
+
+
+export default function* (payload) {
+    console.log('User inside the worker-saga',getItem);
+    try {
+        const config = {
+            headers: {
+                "Authorization": `Bearer ${getItem}`
+            }
+        }
+        
+
+        const user = yield call(() =>
+        axios.get(MY_USER, config)
+        // .then(({ data }) => data)
+    )
+
+        yield put(myUserSuccess(user));
+    }
+    catch ({ message }) {
+        yield put(myUserFailure(message));
+    }
+}

src/styles/_index.scss

@@ -5,3 +5,5 @@
 @import './style/styles';
 
 @import 'base/typography';
+
+@import 'components/landing';

src/styles/abstracts/_theme.scss

@@ -24,11 +24,27 @@
             border-color: $color-autumn-foliage
             
         }
-        
     }
+    &-rgba{
+        background: rgba(42, 49, 50, 0.7);
+    }
+    &-rgba1{
+        background: rgba(118, 54, 38, 0.7);
+    }    
+        
     &-gradient{
         background:linear-gradient(to top, $color-shadow, $color-stone );
     }
+    &-gradient1{
+        background:linear-gradient(to bottom, $color-stone, transparent 100% );
+        z-index: 999;
+    }
+    &-img{
+        // background-image: url(http://inntt.ru/wp-content/uploads/2017/10/bg01.jpg);
+        background-size: cover;
+        height: 100vh;
+
+    }
 
 
 }
@@ -51,4 +67,7 @@
     &-opacity{
         opacity:0.3
     }
+}
+.padding{
+    padding: 15vh
 }

src/styles/base/_typography.scss

@@ -20,4 +20,9 @@
             font-weight: 700 !important;
         }
     }
+}
+.font{
+    &-label{
+        font-size: 30px
+    }
 }

src/styles/components/_landing.scss

@@ -0,0 +1,15 @@
+.slider-image {
+    height: calc(100vh - 72px);
+    @media screen and (max-width: 1200px) {
+        // border: 10px solid red;
+        height: 100vh;
+    }    
+    @media screen and (max-width: 600px) {
+        // border: 10px solid green;
+        height: 400px;
+    }
+    @media screen and (max-width: 450px) {
+        // border: 10px solid yellow;        
+        height: 300px;
+    }
+}