Refactor Fix

src/components/Settings/index.js → src/Settings/index.js

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from "react"
 import gql from "graphql-tag"
-import { client } from "../../apollo/client"
-import Loader from "../Layout/loader"
+import { client } from "../apollo/client"
+import Loader from "../Stateless/Layout/loader"
 import Settings from "./settings"
 
 export default function() {

src/components/Settings/settings.js → src/Settings/settings.js

@@ -10,7 +10,7 @@ import "firebase/storage"
 
 import styles from "./styles.module.css"
 
-import { client } from "../../apollo/client"
+import { client } from "../apollo/client"
 
 export default class Settings extends Component {
   state = {

src/components/Settings/styles.module.css → src/Settings/styles.module.css

@@ -55,7 +55,7 @@ textarea:focus {
 .add_image_btn:hover {
   cursor: pointer;
   transform: scale(1.1);
-  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 }
 
 .add_image_btn {
@@ -85,14 +85,14 @@ textarea:focus {
   font-family: "Montserrat", sans-serif;
   font-weight: 700;
   color: white;
-  margin: 20px 50px 50px 50px;
+  margin: 20px 50px 50px;
   transition: transform 0.2s;
 }
 
 .update_btn:hover {
   cursor: pointer;
   transform: scale(1.1);
-  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 }
 
 .error {

src/components/Create/addFootstep.js → src/Statefull/Create/addFootstep.js

@@ -4,7 +4,7 @@ import FileUploader from "react-firebase-file-uploader"
 import firebase from "firebase/app"
 import "firebase/storage"
 
-import styles from "../../styles/add.module.css"
+import addStyles from "../../styles/add.module.css"
 
 const { Option } = Select
 
@@ -96,16 +96,16 @@ export class addFootstep extends Component {
 
   render() {
     return (
-      <div className={styles.footstep_container}>
+      <div className={addStyles.footstep_container}>
         <Row>
           <Col span={12}>
-            <div className={styles.footstep_counter}>{this.props.index}</div>
+            <div className={addStyles.footstep_counter}>{this.props.index}</div>
           </Col>
 
           <Col span={12}>
             <div
               onClick={() => this.props.remove(this.props.data.id)}
-              className={styles.footstep_remove_btn}
+              className={addStyles.footstep_remove_btn}
             >
               X
             </div>
@@ -114,28 +114,28 @@ export class addFootstep extends Component {
 
         <Row>
           <Col xs={24} lg={12}>
-            <div className={styles.input_label}>Title</div>
+            <div className={addStyles.input_label}>Title</div>
             <input
-              className={styles.input}
+              className={addStyles.input}
               name="title"
               value={this.state.title}
               onChange={this.handleInputChange}
               placeholder="Footsteps Title"
             />
 
-            <div className={styles.input_label}>Description</div>
+            <div className={addStyles.input_label}>Description</div>
             <textarea
-              className={styles.input}
+              className={addStyles.input}
               name="description"
               value={this.state.description}
               onChange={this.handleInputChange}
               maxLength="80"
               placeholder="Short description of the footstep (max 80 chars) -- Optional"
             />
 
-            <div className={styles.input_label}>Resource URL</div>
+            <div className={addStyles.input_label}>Resource URL</div>
             <input
-              className={styles.input}
+              className={addStyles.input}
               name="url"
               value={this.state.url}
               onChange={this.handleInputChange}
@@ -144,20 +144,23 @@ export class addFootstep extends Component {
           </Col>
 
           <Col xs={24} lg={12}>
-            <div className={styles.icon_container}>
+            <div className={addStyles.icon_container}>
               {this.state.icon_url && (
                 <img src={this.state.icon_url} alt="Icon URL" />
               )}
             </div>
 
             <Row>
               <Col span={20}>
-                <div className={styles.input_label} style={{ marginTop: "0" }}>
+                <div
+                  className={addStyles.input_label}
+                  style={{ marginTop: "0" }}
+                >
                   Icon URL
                 </div>
                 <input
                   style={{ width: "100%" }}
-                  className={styles.input}
+                  className={addStyles.input}
                   name="icon_url"
                   value={this.state.icon_url}
                   onChange={this.handleInputChange}
@@ -166,7 +169,7 @@ export class addFootstep extends Component {
               </Col>
 
               <Col span={4}>
-                <label className={styles.add_image_btn}>
+                <label className={addStyles.add_image_btn}>
                   <Icon type="cloud-upload" style={{ fontSize: "25px" }}></Icon>
                   <FileUploader
                     hidden
@@ -184,7 +187,7 @@ export class addFootstep extends Component {
             </Row>
             <Row>
               <Col span={12}>
-                <div className={styles.input_label}>Resource Type</div>
+                <div className={addStyles.input_label}>Resource Type</div>
                 <Select
                   defaultValue="Course"
                   style={{
@@ -209,7 +212,7 @@ export class addFootstep extends Component {
                 </Select>
               </Col>
               <Col span={12}>
-                <div className={styles.input_label}>Resource Level</div>
+                <div className={addStyles.input_label}>Resource Level</div>
                 <Select
                   defaultValue={0}
                   style={{