diff --git a/src/components/AddStorageItem/AddStorageItem.jsx b/src/components/AddStorageItem/AddStorageItem.jsx
deleted file mode 100644
index c8bfab8..0000000
--- a/src/components/AddStorageItem/AddStorageItem.jsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import React from "react";
-import bytes from "bytes";
-
-const AddStorageItem = (props) => (
-  <div
-    className={
-      !props.loaded
-        ? "elem__storage"
-        : props.userDetails.activeSubscription &&
-          props.userDetails.planID === props.plan.id
-        ? "elem__storage completed__storage"
-        : "elem__storage"
-    }
-  >
-    <div className="head__storage">
-      <div className="info__storage">
-        <p>
-          {bytes(+props.plan.metadata.amount)} - {props.plan.interval_count}{" "}
-          {props.plan.interval}(s)
-        </p>
-        <span className="status__text">
-          {"$" + parseInt(props.plan.amount, 10) / 100}
-        </span>
-      </div>
-      <div
-        style={
-          !props.loaded
-            ? { display: "none" }
-            : props.userDetails.activeSubscription &&
-              props.userDetails.planID === props.plan.id
-            ? { display: "block" }
-            : { display: "none" }
-        }
-        className="success__storage"
-      >
-        <img src="/assets/checked.svg" alt="checked" />
-      </div>
-      <div
-        style={
-          !props.loaded
-            ? {}
-            : props.userDetails.activeSubscription &&
-              props.userDetails.planID === props.plan.id
-            ? { display: "none" }
-            : {}
-        }
-        className="add__storage"
-      >
-        <a onClick={props.openDetails}>Details</a>
-      </div>
-    </div>
-    <div
-      className="storage__main"
-      style={props.state.open ? { display: "block" } : { display: "none" }}
-    >
-      <p>
-        Subscribe to myDrive, {bytes(+props.plan.metadata.amount)} of data for{" "}
-        {"$" + parseInt(props.plan.amount, 10) / 100}, reoccuring every{" "}
-        {props.plan.interval_count} {props.plan.interval}(s).
-      </p>
-      <div
-        style={{
-          display: "flex",
-          justifyContent: "center",
-          alignItems: "center",
-        }}
-      >
-        <button onClick={() => props.selectPlan(props.plan)}>Subscribe</button>
-      </div>
-    </div>
-  </div>
-);
-
-export default AddStorageItem;
diff --git a/src/components/AddStorageItem/index.jsx b/src/components/AddStorageItem/index.jsx
deleted file mode 100644
index a74a99a..0000000
--- a/src/components/AddStorageItem/index.jsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import React from "react";
-import AddStorageItem from "./AddStorageItem";
-
-class AddStorageItemContainer extends React.Component {
-
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            open: false,
-        }
-    }
-
-    openDetails = () => {
-
-        this.setState((e) => {
-            return {
-                ...this.state,
-                open: !this.state.open,
-            }
-        })
-    }
-
-    render() {
-        return <AddStorageItem state={this.state} {...this.props} openDetails={this.openDetails}/>
-    }
-}
-
-export default AddStorageItemContainer;
\ No newline at end of file
diff --git a/src/components/AddStoragePage/AddStoragePage.jsx b/src/components/AddStoragePage/AddStoragePage.jsx
deleted file mode 100644
index 41fd428..0000000
--- a/src/components/AddStoragePage/AddStoragePage.jsx
+++ /dev/null
@@ -1,132 +0,0 @@
-import React from "react";
-import SpinnerLogin from "../SpinnerLogin";
-import AddStorageItem from "../AddStorageItem";
-
-const AddStoragePage = (props) => (
-  <div>
-    <div className="storage__back">
-      <div className="storage__block">
-        <div className="inner__storage">
-          <div className="login__logo">
-            <img src="/images/icon.png" alt="logo" />
-          </div>
-          <div className="storage__main">
-            <h2>Select Storage Plan</h2>
-            <div className="wrap__storage--elements">
-              {props.state.storagePlans.map((currentPlan) => (
-                <AddStorageItem
-                  selectPlan={props.selectPlan}
-                  plan={currentPlan}
-                  loaded={props.state.loaded}
-                  userDetails={props.state.userDetails}
-                />
-              ))}
-            </div>
-          </div>
-          {!props.state.loaded ? undefined : props.state.userDetails
-              .activeSubscription ? (
-            <div className="add-storage-card__button-wrapper">
-              <button
-                className="storage-item__button"
-                onClick={props.removeSubscription}
-              >
-                Remove Subscription
-              </button>
-            </div>
-          ) : undefined}
-        </div>
-      </div>
-    </div>
-
-    <div
-      className="modal__wrap"
-      style={
-        props.state.showCreditCard ? { display: "block" } : { display: "none" }
-      }
-    >
-      <div className="inner__modal">
-        <div className="password__modal">
-          <div className="head__password">
-            <h2>
-              Subscribe -{" "}
-              {"$" + parseInt(props.state.selectedDetails.amount, 10) / 100} /{" "}
-              {props.state.selectedDetails.interval_count}{" "}
-              {props.state.selectedDetails.interval}(s)
-            </h2>
-            <div className="close__modal">
-              <a onClick={props.selectPlan}>
-                <img src="/assets/close.svg" alt="close" />
-              </a>
-            </div>
-          </div>
-          <div className="password__content">
-            <form onSubmit={props.pay}>
-              <div
-                className="group__password"
-                style={
-                  props.state.creditCardNumberError
-                    ? { border: "2px solid red" }
-                    : {}
-                }
-              >
-                <input
-                  value={props.state.creditCardNumber}
-                  onChange={props.onChangeCreditCardNumber}
-                  placeholder="Credit Card Number"
-                />
-              </div>
-              <div
-                className="group__password"
-                style={
-                  props.state.creditCardExpiryError
-                    ? { border: "2px solid red" }
-                    : {}
-                }
-              >
-                <input
-                  value={props.state.creditCardExpiry}
-                  onChange={props.onChangeCreditCardExpiry}
-                  placeholder="(MM/YY) Expiration Date"
-                />
-              </div>
-              <div
-                className="group__password"
-                style={
-                  props.state.creditCardCVCError
-                    ? { border: "2px solid red" }
-                    : {}
-                }
-              >
-                <input
-                  value={props.state.creditCardCVC}
-                  onChange={props.onChangeCreditCardCVC}
-                  placeholder="Credit Card CVC"
-                />
-              </div>
-              <div className="password__submit">
-                <input type="submit" value="Submit" />
-              </div>
-            </form>
-          </div>
-          <div
-            style={
-              props.state.paymentLoading
-                ? {
-                    display: "flex",
-                    justifyContent: "center",
-                    alignItems: "center",
-                    height: "61px",
-                    paddingBottom: "23px",
-                  }
-                : { display: "none" }
-            }
-          >
-            <SpinnerLogin />
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-);
-
-export default AddStoragePage;
diff --git a/src/components/AddStoragePage/index.jsx b/src/components/AddStoragePage/index.jsx
deleted file mode 100644
index ae2909c..0000000
--- a/src/components/AddStoragePage/index.jsx
+++ /dev/null
@@ -1,459 +0,0 @@
-import React from "react";
-import axios from "../../axiosInterceptor";
-import Swal from "sweetalert2";
-import env from "../../enviroment/envFrontEnd";
-import AddStoragePage from "./AddStoragePage";
-
-class AddStoragePageContainer extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      storagePlans: [],
-      loaded: false,
-      planSelected: false,
-      selectedDetails: {},
-      creditCardNumber: "",
-      creditCardCVC: "",
-      creditCardExpiry: "",
-      creditCardNumberError: false,
-      creditCardExpiryError: false,
-      creditCardCVCError: false,
-      userDetails: {},
-      loaded: false,
-      showCreditCard: false,
-      paymentLoading: false,
-    };
-  }
-
-  getUserDetails = () => {
-    axios
-      .get("/user-service/user-detailed")
-      .then((response) => {
-        this.setState(() => {
-          return {
-            ...this.state,
-            loaded: true,
-            userDetails: response.data,
-          };
-        });
-      })
-      .catch((err) => {
-        console.log("Loading user details error", err);
-      });
-  };
-
-  componentDidMount = () => {
-    this.getUserDetails();
-
-    axios
-      .get("/user-service/get-plans")
-      .then((response) => {
-        this.setState(() => {
-          return {
-            ...this.state,
-            storagePlans: response.data.data,
-            loaded: true,
-          };
-        });
-      })
-      .catch((err) => {
-        console.log("get plans error");
-      });
-  };
-
-  selectPlan = (plan) => {
-    if (this.state.planSelected) {
-      return this.setState(() => {
-        return {
-          ...this.state,
-          planSelected: false,
-          selectedDetails: {},
-          showCreditCard: false,
-        };
-      });
-    } else {
-      this.setState(() => {
-        return {
-          ...this.state,
-          planSelected: true,
-          selectedDetails: plan,
-          showCreditCard: true,
-        };
-      });
-    }
-  };
-
-  onChangeCreditCardNumber = (e) => {
-    let value = e.target.value;
-
-    if (value.length < this.state.creditCardNumber.length) {
-      return this.setState(() => {
-        return {
-          ...this.state,
-          creditCardNumber: value,
-          creditCardNumberError: false,
-        };
-      });
-    }
-
-    const numericalValue = value.replace(/[^0-9.]/g, "");
-
-    let reconstucted = "";
-
-    for (let currentChar of numericalValue) {
-      reconstucted += currentChar;
-
-      const numericalOnly = reconstucted.replace(/[^0-9.]/g, "");
-
-      if (numericalOnly.length !== 16 && numericalOnly.length % 4 === 0) {
-        reconstucted += "-";
-      } else if (numericalOnly.length >= 16) {
-        break;
-      }
-    }
-
-    this.setState(() => {
-      return {
-        ...this.state,
-        creditCardNumber: reconstucted,
-        creditCardNumberError: false,
-      };
-    });
-  };
-
-  onChangeCreditCardCVC = (e) => {
-    let value = e.target.value;
-
-    value = value.replace(/[^0-9.]/g, "");
-
-    if (value.length >= 4) {
-      return;
-    }
-
-    this.setState(() => {
-      return {
-        ...this.state,
-        creditCardCVC: value,
-        creditCardCVCError: false,
-      };
-    });
-  };
-
-  onChangeCreditCardExpiry = (e) => {
-    let value = e.target.value;
-
-    if (value.length < this.state.creditCardExpiry.length) {
-      return this.setState(() => {
-        return {
-          ...this.state,
-          creditCardExpiry: value,
-          creditCardExpiryError: false,
-        };
-      });
-    }
-
-    const numericalValue = value.replace(/[^0-9.]/g, "");
-
-    let reconstucted = "";
-
-    for (let currentChar of numericalValue) {
-      reconstucted += currentChar;
-
-      const numericalOnly = reconstucted.replace(/[^0-9.]/g, "");
-
-      if (numericalOnly.length === 2) {
-        reconstucted += "/";
-      } else if (numericalOnly.length >= 4) {
-        break;
-      }
-    }
-
-    this.setState(() => {
-      return {
-        ...this.state,
-        creditCardExpiry: reconstucted,
-        creditCardExpiryError: false,
-      };
-    });
-  };
-
-  pay = (e) => {
-    e.preventDefault();
-
-    if (this.state.paymentLoading) {
-      return;
-    }
-
-    const creditCardNumber = this.state.creditCardNumber;
-    const creditCardCVC = this.state.creditCardCVC;
-    const creditCardExpiry = this.state.creditCardExpiry;
-
-    let ccNumError = false;
-    let ccCVCError = false;
-    let ccExpiryError = false;
-
-    if (creditCardNumber.replace(/[^0-9.]/g, "").length !== 16) {
-      ccNumError = true;
-    }
-
-    if (creditCardCVC.replace(/[^0-9.]/g, "").length !== 3) {
-      ccCVCError = true;
-    }
-
-    if (creditCardExpiry.replace(/[^0-9.]/g, "").length !== 4) {
-      ccExpiryError = true;
-    }
-
-    if (ccNumError || ccCVCError || ccExpiryError) {
-      return this.setState(() => {
-        return {
-          ...this.state,
-          creditCardNumberError: ccNumError,
-          creditCardExpiryError: ccExpiryError,
-          creditCardCVCError: ccCVCError,
-        };
-      });
-    }
-
-    const data = {
-      card: {
-        number: creditCardNumber,
-        expiry: creditCardExpiry,
-        cvc: creditCardCVC,
-        id: this.state.selectedDetails.id,
-      },
-    };
-
-    Swal.fire({
-      title: "Confirm Payment",
-      text: `Confirm ${
-        "$" + parseInt(this.state.selectedDetails.amount, 10) / 100
-      } payment`,
-      icon: "info",
-      showCancelButton: true,
-      confirmButtonColor: "#3085d6",
-      cancelButtonColor: "#d33",
-      confirmButtonText: "Pay",
-    }).then((result) => {
-      if (result.value) {
-        this.setState(() => {
-          return {
-            ...this.state,
-            paymentLoading: true,
-          };
-        });
-
-        axios
-          .post("/user-service/create-subscription", data)
-          .then((response) => {
-            this.setState(() => {
-              return {
-                ...this.state,
-                paymentLoading: false,
-              };
-            });
-
-            Swal.fire(
-              "Payment Successful",
-              "Thank You! Payment Was Successful",
-              "success"
-            ).then(() => {
-              window.location.assign(env.url);
-            });
-          })
-          .catch((e) => {
-            console.log("create stripe token err", e);
-            this.setState(() => {
-              return {
-                ...this.state,
-                paymentLoading: false,
-              };
-            });
-            Swal.fire({
-              icon: "error",
-              title: "Payment Error",
-              text: "Could Not Process Payment",
-            });
-          });
-      }
-    });
-  };
-
-  removeSubscription = () => {
-    Swal.fire({
-      title: "Remove Subscription?",
-      text: "This will remove all myDrive files",
-      icon: "warning",
-      showCancelButton: true,
-      confirmButtonColor: "#3085d6",
-      cancelButtonColor: "#d33",
-      confirmButtonText: "Yes, cancel subscription",
-    }).then((result) => {
-      if (result.value) {
-        axios
-          .delete("/user-service/remove-subscription")
-          .then((response) => {
-            Swal.fire(
-              "Subscription Removed",
-              "Your subscription for myDrive has been canceled.",
-              "success"
-            ).then(() => {
-              window.location.assign(env.url);
-            });
-          })
-          .catch((err) => {
-            console.log("could not remove subscription", err);
-            Swal.fire({
-              icon: "error",
-              title: "Remove Subscription Error",
-              text: "Could Not Renive Subscription",
-            });
-          });
-      }
-    });
-  };
-
-  render() {
-    return (
-      <AddStoragePage
-        removeSubscription={this.removeSubscription}
-        pay={this.pay}
-        onChangeCreditCardExpiry={this.onChangeCreditCardExpiry}
-        onChangeCreditCardCVC={this.onChangeCreditCardCVC}
-        onChangeCreditCardNumber={this.onChangeCreditCardNumber}
-        selectPlan={this.selectPlan}
-        getUserDetails={this.getUserDetails}
-        state={this.state}
-        {...this.props}
-      />
-      // <div>
-
-      //     <div className="storage__back">
-
-      //     <div className="storage__block">
-      //             <div className="inner__storage">
-      //                 <div className="login__logo">
-      //                     <img src="/images/icon.png" alt="logo"/>
-      //                 </div>
-      //                 <div className="storage__main">
-      //                     <h2>Select Storage Plan</h2>
-      //                     <div className="wrap__storage--elements">
-      //                         {this.state.storagePlans.map((currentPlan) => <AddStorageItem selectPlan={this.selectPlan} plan={currentPlan} loaded={this.state.loaded} userDetails={this.state.userDetails}/>)}
-      //                     </div>
-      //                 </div>
-      //                 {!this.state.loaded ? undefined : this.state.userDetails.activeSubscription ?
-      //                 <div className="add-storage-card__button-wrapper">
-      //                     <button className="storage-item__button" onClick={this.removeSubscription}>Remove Subscription</button>
-      //                 </div> : undefined}
-      //             </div>
-      //         </div>
-      //     </div>
-
-      //     <div className="modal__wrap" style={this.state.showCreditCard ? {display:"block"} : {display:"none"}}>
-      //         <div className="inner__modal">
-      //             <div className="password__modal">
-      //                 <div className="head__password">
-      //                 <h2>Subscribe - {'$' + parseInt(this.state.selectedDetails.amount, 10) / 100} / {this.state.selectedDetails.interval_count} {this.state.selectedDetails.interval}(s)</h2>
-      //                     <div className="close__modal">
-      //                         <a onClick={this.selectPlan}><img src="/assets/close.svg" alt="close"/></a>
-      //                     </div>
-      //                 </div>
-      //                 <div className="password__content">
-      //                     <form onSubmit={this.pay}>
-      //                         <div className="group__password" style={this.state.creditCardNumberError ? {border:'2px solid red'} : {}}>
-      //                             <input value={this.state.creditCardNumber} onChange={this.onChangeCreditCardNumber} placeholder="Credit Card Number"/>
-      //                         </div>
-      //                         <div className="group__password" style={this.state.creditCardExpiryError ? {border:'2px solid red'} : {}}>
-      //                             <input value={this.state.creditCardExpiry} onChange={this.onChangeCreditCardExpiry} placeholder="(MM/YY) Expiration Date"/>
-      //                         </div>
-      //                         <div className="group__password" style={this.state.creditCardCVCError ? {border:'2px solid red'} : {}}>
-      //                             <input value={this.state.creditCardCVC} onChange={this.onChangeCreditCardCVC} placeholder="Credit Card CVC"/>
-      //                         </div>
-      //                         <div className="password__submit">
-      //                             <input type="submit" value="Submit"/>
-      //                         </div>
-      //                     </form>
-      //                 </div>
-      //                 <div style={this.state.paymentLoading ? {
-      //                     display: "flex",
-      //                     justifyContent: "center",
-      //                     alignItems: "center",
-      //                     height: "61px",
-      //                     paddingBottom: "23px"
-      //                 } : {display: "none"}}>
-      //                     <SpinnerLogin />
-      //                 </div>
-      //             </div>
-      //         </div>
-      //     </div>
-
-      //     {/* {!this.state.planSelected ?
-
-      //     // <div className="add-storage__box">
-
-      //     //     <p className="add-storage__title">Storage Plans</p>
-
-      //     //     <div className="add-storage__body">
-
-      //     //         {this.state.storagePlans.map((currentPlan) => <AddStorageItem selectPlan={this.selectPlan} plan={currentPlan}/>)}
-      //     //     </div>
-
-      //     //     {!this.state.loaded ? undefined : this.state.userDetails.activeSubscription ? <div className="add-storage-card__button-wrapper">
-      //     //         <button className="storage-item__button" onClick={this.removeSubscription}>Remove Subscription</button>
-      //     //     </div> : undefined}
-
-      //     // </div>
-      //     <div className="storage__back">
-
-      //         <div className="storage__block">
-      //                 <div className="inner__storage">
-      //                     <div className="login__logo">
-      //                         <img src="/images/icon.png" alt="logo"/>
-      //                     </div>
-      //                     <div className="storage__main">
-      //                         <h2>Select Storage Plan</h2>
-      //                         <div className="wrap__storage--elements">
-      //                             {this.state.storagePlans.map((currentPlan) => <AddStorageItem selectPlan={this.selectPlan} plan={currentPlan}/>)}
-      //                         </div>
-      //                     </div>
-      //                 </div>
-      //             </div>
-
-      //     </div>
-
-      //     :
-
-      //     <div className="add-storage-card__wrapper">
-
-      //         <div className="add-storage-card__close-wrapper">
-      //             <img onClick={this.selectPlan} className="add-storage-card__close" src="/images/close_icon.png"/>
-      //         </div>
-
-      //         <div className="add-storage-card__title-wrapper">
-      //             <p className="add-storage-card__title">{bytes(+this.state.selectedDetails.metadata.amount)} Plan / {this.state.selectedDetails.interval_count} {this.state.selectedDetails.interval}(s)</p>
-      //         </div>
-
-      //         <div className="add-storage-card__number-wrapper">
-      //             <input className="add-storage-card__number" onChange={this.onChangeCreditCardNumber} value={this.state.creditCardNumber} placeholder="Credit Card Number"/>
-      //         </div>
-
-      //         <div className="add-storage-card__expiry-wrapper">
-      //             <input className="add-storage-card__expiry" onChange={this.onChangeCreditCardExpiry} value={this.state.creditCardExpiry} placeholder="Expire Date (MM/YYYY)"/>
-      //             <input className="add-storage-card__cvc" onChange={this.onChangeCreditCardCVC} value={this.state.creditCardCVC} placeholder="CVC"/>
-      //         </div>
-
-      //         <div className="add-storage-card__button-wrapper">
-      //             <button className="storage-item__button" onClick={this.pay}>Pay {'$' + parseInt(this.state.selectedDetails.amount, 10) / 100}</button>
-      //         </div>
-
-      //     </div>
-
-      //     } */}
-
-      // </div>
-    );
-  }
-}
-
-export default AddStoragePageContainer;
diff --git a/src/components/FolderTree/FolderTree.jsx b/src/components/FolderTree/FolderTree.jsx
deleted file mode 100644
index 1d97329..0000000
--- a/src/components/FolderTree/FolderTree.jsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import React from "react";
-import env from "../../enviroment/envFrontEnd";
-import FolderTreeStorage from "../FolderTreeStorage";
-
-const FolderTree = (props) => (
-  <div className="folder-tree__main">
-    <div
-      className={
-        props.state.showFolderTreeScrollBars
-          ? "folder-tree__box"
-          : "folder-tree__box-hide-scroll-bars"
-      }
-    >
-      {env.activeSubscription || !env.commercialMode ? (
-        <FolderTreeStorage type={"mongo"} />
-      ) : undefined}
-      {env.s3Enabled ? <FolderTreeStorage type={"s3"} /> : undefined}
-      {env.googleDriveEnabled ? (
-        <FolderTreeStorage type={"drive"} />
-      ) : undefined}
-    </div>
-  </div>
-
-  // <div className="folder__structure" style={{overflow:"unset", maxHeight:"unset", maxWidth:"unset"}}>
-  //     {(env.activeSubscription || !env.commercialMode) ? <FolderTreeStorage type={"mongo"}/> : undefined}
-  //     {env.s3Enabled ? <FolderTreeStorage type={"s3"}/> : undefined}
-  //     {env.googleDriveEnabled ? <FolderTreeStorage type={"drive"}/> : undefined}
-  // </div>
-);
-
-export default FolderTree;
diff --git a/src/components/FolderTree/index.jsx b/src/components/FolderTree/index.jsx
deleted file mode 100644
index f6cf69c..0000000
--- a/src/components/FolderTree/index.jsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";;
-import FolderTree from "./FolderTree";
-
-class FolderTreeContrainer extends React.Component {
-
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            hideFolderTree: false,
-            showFolderTreeScrollBars: false
-        }
-    }
-
-    componentDidMount = () => {
-
-        //folder-tree__box-hide-scroll-bars
-
-        const hideFolderTree = localStorage.getItem("hide-folder-tree");
-        const showFolderTreeScrollBars = localStorage.getItem("show-folder-tree-scroll-bars")
-
-        //console.log("show folder tree scroll bars");
-
-        if (hideFolderTree) {
-
-            this.setState(() => ({
-                hideFolderTree,
-            }))
-
-        } else {
-
-            this.setState(() => ({
-                showFolderTreeScrollBars
-            }))
-        }
-    }
-
-    render() {
-        
-        if (this.state.hideFolderTree) return <div></div>
-
-        return <FolderTree state={this.state}/>
-    }
-}
-
-export default FolderTreeContrainer;
\ No newline at end of file
diff --git a/src/components/FolderTreeStorage/FolderTreeStorage.jsx b/src/components/FolderTreeStorage/FolderTreeStorage.jsx
deleted file mode 100644
index 4698e2c..0000000
--- a/src/components/FolderTreeStorage/FolderTreeStorage.jsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import React from "react";
-import FolderTreeStorageSub from "../FolderTreeStorageSub";
-
-const FolderTreeStorage = (props) => (
-  <div className="folder-tree__storage">
-    <div className="folder-tree__storage__box">
-      <div className="folder-tree__storage__image-div">
-        <img
-          onClick={props.arrowClick}
-          className="folder-tree__storage__image"
-          src={
-            props.state.open && props.state.folders.length !== 0
-              ? "/images/menu-down.svg"
-              : "/images/menu-right.svg"
-          }
-        />
-      </div>
-      <div className="folder-tree__storage__text-div">
-        <p className="folder-tree__storage__text">
-          {props.type === "drive"
-            ? "Google Drive"
-            : props.type === "mongo"
-            ? "myDrive"
-            : "Amazon S3"}
-        </p>
-      </div>
-    </div>
-
-    <div className="folder-tree__storage-subview">
-      <div className="folder-tree__storage-subview-box">
-        {props.state.open && props.state.folders.length !== 0
-          ? props.state.folders.map((folder) => {
-              return (
-                <FolderTreeStorageSub
-                  key={folder._id}
-                  folder={folder}
-                  type={props.type}
-                />
-              );
-            })
-          : undefined}
-      </div>
-    </div>
-  </div>
-  //return
-
-  // <div className="elem__structure root__element">
-  //     <div className={props.state.open ? "parent__structure active__parent" : "parent__structure"}>
-  //         <span onClick={props.arrowClick}><img src="/assets/arrowstructure.svg" alt="arrowstructure"/></span>
-  //         <div className="info__name">
-  //             <p>{props.type === "drive" ? "Google Drive" : props.type === "mongo" ? "myDrive" : "Amazon S3"}</p>
-  //         </div>
-  //     </div>
-  //     {(props.state.open && props.state.folders.length !== 0)  ? props.state.folders.map((folder) => {
-  //         return <FolderTreeStorageSub key={folder._id} folder={folder} type={props.type}/>
-  //     }) : undefined}
-  // </div>
-);
-
-export default FolderTreeStorage;
diff --git a/src/components/FolderTreeStorage/index.jsx b/src/components/FolderTreeStorage/index.jsx
deleted file mode 100644
index 01c35ee..0000000
--- a/src/components/FolderTreeStorage/index.jsx
+++ /dev/null
@@ -1,120 +0,0 @@
-import env from "../../enviroment/envFrontEnd";
-import axios from "../../axiosInterceptor/index"
-import React from "react";
-import {connect} from "react-redux";
-import {setInsertedFolderTreeID} from "../../actions/folderTree"
-import FolderTreeStorage from "./FolderTreeStorage";
-
-class FolderTreeStorageContainer extends React.Component {
-
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            folders: [],
-            open: true,
-        }
-
-        this.updated = false;
-        this.ignoreReset = false;
-    }
-
-    getFolders = () => {
-
-        const parent = this.props.type === "drive" ? "root" : "/"; 
-        
-        const url = this.props.type === "drive" ? `/folder-service-google/list?parent=${parent}` 
-        : `/folder-service/list?parent=${parent}&type=${this.props.type}`; 
-
-        axios.get(url).then((response) => {
-
-            this.setState(() => {
-                return {
-                    folders: response.data,
-                    open: true
-                }
-            }, () => {
-                this.ignoreReset = false;
-            })
-        })
-
-    }
-
-    arrowClick = () => {
-
-        if (this.state.open) {
-
-            this.setState(() => {
-                return {
-                    folders: this.state.folders,
-                    open: false,
-                }
-            })
-        } else {
-            this.getFolders()
-        }
-    }
-
-    componentDidMount = () => {
-
-        // const hideFolderTree = localStorage.getItem("hide-folder-tree");
-
-        // if (hideFolderTree) {
-
-        //     this.setState(() => ({
-        //         hideFolderTree
-        //     }))
-            
-        // } else {
-        //     this.getFolders();
-        // }
-
-        this.getFolders();
-    }
-
-    componentDidUpdate = () => {
-
-        if (this.props.firstLoadDetails.status === "RESET" && !this.ignoreReset) {
-            this.ignoreReset = true;
-            this.getFolders();
-            return;
-        }
-    
-        if (this.updated) return;
-
-        this.updated = true;
-
-        if (this.props.firstLoadDetails === "root" || this.props.firstLoadDetails === "/" || !this.props.firstLoadDetails._id) return;
-
-        if (this.props.firstLoadDetails.isGoogle) {
-            if (this.props.type !== "drive") return;
-        } else if (this.props.firstLoadDetails.isPersonal) {
-            if (this.props.type !== "s3") return;
-        } else {
-            if (this.props.type !== "mongo") return;
-        }
-
-        const id = this.props.firstLoadDetails._id;
-
-        const url = (this.props.type === "drive") 
-        ? `/folder-service-google/subfolder-list-full?id=${id}` : `/folder-service/subfolder-list-full?id=${id}`
-
-        axios.get(url).then((response) => {
-            if (response.data.length !== 0) {
-                const id = response.data[0]._id;
-                this.props.dispatch(setInsertedFolderTreeID(id, response.data))
-            }
-        })
-    }
-
-    render() {
-
-        return <FolderTreeStorage arrowClick={this.arrowClick} state={this.state} {...this.props}/>
-    }
-}
-
-const connectStoreToProp = (state) => ({
-    firstLoadDetails: state.folderTree.firstLoadDetails
-})
-
-export default connect(connectStoreToProp)(FolderTreeStorageContainer)
\ No newline at end of file
diff --git a/src/components/FolderTreeStorageSub/FolderTreeStorageSub.jsx b/src/components/FolderTreeStorageSub/FolderTreeStorageSub.jsx
deleted file mode 100644
index 7939e0b..0000000
--- a/src/components/FolderTreeStorageSub/FolderTreeStorageSub.jsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import React from "react";
-import { useNavigate } from "react-router-dom";
-
-const FolderTreeStorageSub = (props) => {
-  const navigate = useNavigate();
-
-  const folderOnClick = () => {
-    navigate(`/folder/${props.folder._id}`);
-  };
-
-  return (
-    <div className="folder-tree-sub__storage">
-      <div className="folder-tree-sub__storage__box">
-        <div className="folder-tree-sub__storage__image-div">
-          <img
-            onClick={(e) => {
-              props.skipUpdate = false;
-              props.clickEvent(e);
-            }}
-            className="folder-tree-sub__storage__image"
-            src="/assets/arrowstructure.svg"
-            style={props.state.open ? { transform: "rotate(90deg)" } : {}}
-          />
-        </div>
-        <div className="folder-tree-sub__icon-wrapper">
-          <img
-            className="folder-tree-sub__icon"
-            src={
-              props.selectedID === props.folder._id
-                ? "/images/folder-svg-purple.svg"
-                : "/images/folder-svg.svg"
-            }
-          />
-        </div>
-        <div className="folder-tree-sub__storage__text-div">
-          <p
-            style={
-              props.selectedID === props.folder._id ? { color: "#3c85ee" } : {}
-            }
-            onClick={folderOnClick}
-            className="folder-tree-sub__storage__text"
-          >
-            {props.folder.name}
-          </p>
-        </div>
-      </div>
-
-      <div className="folder-tree-sub__storage-subview">
-        <div className="folder-tree-sub__storage-subview-box">
-          {props.state.open ? props.renderFolders() : undefined}
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default FolderTreeStorageSub;
diff --git a/src/components/FolderTreeStorageSub/index.jsx b/src/components/FolderTreeStorageSub/index.jsx
deleted file mode 100644
index 85bdc3c..0000000
--- a/src/components/FolderTreeStorageSub/index.jsx
+++ /dev/null
@@ -1,312 +0,0 @@
-import env from "../../enviroment/envFrontEnd";
-import axios from "../../axiosInterceptor";
-import React from "react";
-import {
-  setFolderTreeID,
-  removeFolderTreeID,
-  removeNewFolderTreeID,
-  removeDeleteFolderTreeID,
-  removeMoveFolderTreeID,
-  addNewFolderTreeID,
-  removeRenameFolderTreeID,
-  setInsertedFolderTreeID,
-} from "../../actions/folderTree";
-// import { history } from "../../routers/AppRouter";
-import { connect } from "react-redux";
-import FolderTreeStorageSub2 from ".";
-import FolderTreeStorageSub from "./FolderTreeStorageSub";
-
-class FolderTreeStorageSubContainer extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      folders: [],
-      open: false,
-      loaded: false,
-      forceUpdate: "",
-    };
-
-    this.cachedFolders = {};
-
-    this.ignoreNewList = {};
-
-    this.ignoreDeleteList = {};
-
-    this.ignoreMoveList = {};
-
-    this.ignoreRenameList = {};
-
-    this.ignoreInsertList = {};
-
-    this.launchedByMain = false;
-    this.skipUpdate = false;
-  }
-
-  componentDidUpdate = () => {
-    if (
-      this.props.selectedIDs[this.props.folder._id] &&
-      !this.state.open &&
-      !this.state.loaded &&
-      this.props.folder._id === this.props.selectedID
-    ) {
-      this.skipUpdate = true;
-      this.getFolders();
-    } else if (
-      this.props.selectedIDs[this.props.folder._id] &&
-      !this.state.open &&
-      this.props.folder._id === this.props.selectedID
-    ) {
-      this.skipUpdate = true;
-      this.setState(() => {
-        return {
-          ...this.state,
-          open: true,
-        };
-      });
-    } else if (
-      this.props.selectedIDs[this.props.folder._id] === undefined &&
-      this.state.open
-    ) {
-      this.setState(() => {
-        return {
-          ...this.state,
-          open: false,
-        };
-      });
-    }
-
-    this.addNewFolders();
-    this.deleteRemovedFolders();
-    this.moveMovedFolders();
-    this.renameRenamedFolders();
-    this.insertInsertedFolders();
-  };
-
-  addNewFolders = () => {
-    for (let currentKey in this.props.newIDs) {
-      const currentObj = this.props.newIDs[currentKey];
-      if (
-        currentObj.parent === this.props.folder._id &&
-        !this.ignoreNewList[currentObj._id]
-      ) {
-        this.ignoreNewList[currentObj._id] = true;
-
-        this.props.dispatch(removeNewFolderTreeID(currentObj._id));
-
-        this.setState(() => {
-          return {
-            ...this.state,
-            folders: [...this.state.folders, currentObj],
-          };
-        });
-      }
-    }
-  };
-
-  insertInsertedFolders = () => {
-    for (let currentKey in this.props.insertedIDs) {
-      const currentObj = this.props.insertedIDs[currentKey];
-
-      if (
-        currentObj.parent === this.props.folder._id &&
-        !this.ignoreInsertList[currentObj._id]
-      ) {
-        this.ignoreInsertList[currentObj._id] = true;
-
-        let tempInsertIDsList = this.props.insertedIDs;
-        tempInsertIDsList = [
-          ...tempInsertIDsList.slice(0, currentKey),
-          ...tempInsertIDsList.splice(currentKey + 1, tempInsertIDsList.length),
-        ];
-
-        this.props.dispatch(setFolderTreeID(this.props.folder._id));
-
-        this.setState(
-          () => {
-            return {
-              ...this.state,
-              folders: currentObj.subFolders,
-              open: true,
-              loaded: true,
-            };
-          },
-          () => {
-            if (tempInsertIDsList.length !== 0) {
-              const newID = tempInsertIDsList[0];
-              this.props.dispatch(
-                setInsertedFolderTreeID(newID, tempInsertIDsList)
-              );
-            }
-          }
-        );
-        break;
-      }
-    }
-  };
-
-  deleteRemovedFolders = () => {
-    for (let currentKey in this.props.deleteIDs) {
-      const currentObj = this.props.deleteIDs[currentKey];
-
-      if (
-        this.cachedFolders[currentObj._id] &&
-        !this.ignoreDeleteList[currentObj._id]
-      ) {
-        this.ignoreDeleteList[currentObj._id] = true;
-
-        const tempFolderList = this.state.folders.filter((currentFolder) => {
-          return currentObj._id !== currentFolder._id;
-        });
-
-        this.props.dispatch(removeDeleteFolderTreeID(currentObj._id));
-
-        this.setState(() => {
-          return {
-            ...this.state,
-            folders: tempFolderList,
-          };
-        });
-      }
-    }
-  };
-
-  moveMovedFolders = () => {
-    for (let currentKey in this.props.moveIDs) {
-      const currentObj = this.props.moveIDs[currentKey];
-
-      if (
-        this.cachedFolders[currentObj._id] &&
-        !this.ignoreMoveList[currentObj._id]
-      ) {
-        this.ignoreMoveList[currentObj._id] = true;
-
-        let movedValue = {};
-        const tempFolderList = this.state.folders.filter((currentFolder) => {
-          if (currentObj._id === currentFolder._id) movedValue = currentFolder;
-          return currentObj._id !== currentFolder._id;
-        });
-
-        movedValue.parent = currentObj.parent;
-
-        this.props.dispatch(removeMoveFolderTreeID(currentObj._id));
-        this.props.dispatch(addNewFolderTreeID(currentObj._id, movedValue));
-
-        this.setState(() => {
-          return {
-            ...this.state,
-            folders: tempFolderList,
-          };
-        });
-      }
-    }
-  };
-
-  renameRenamedFolders = () => {
-    for (let currentKey in this.props.renameIDs) {
-      const currentObj = this.props.renameIDs[currentKey];
-
-      if (
-        this.cachedFolders[currentObj._id] &&
-        !this.ignoreRenameList[currentObj._id]
-      ) {
-        this.ignoreRenameList[currentObj._id] = true;
-
-        let tempList = [];
-
-        for (let currentValue of this.state.folders) {
-          if (currentValue._id === currentObj._id) {
-            currentValue.name = currentObj.name;
-          }
-          tempList.push(Object.assign({}, currentValue));
-        }
-
-        this.props.dispatch(removeRenameFolderTreeID(currentObj._id));
-
-        this.setState(() => {
-          return {
-            ...this.state,
-            folders: [...tempList],
-          };
-        });
-      }
-    }
-  };
-
-  getFolders = () => {
-    const parent = this.props.folder._id;
-
-    const url =
-      this.props.type === "drive"
-        ? `/folder-service-google/list?parent=${parent}`
-        : `/folder-service/list?parent=${parent}`;
-    axios.get(url).then((response) => {
-      this.setState(() => {
-        return {
-          folders: response.data,
-          open: true,
-          loaded: true,
-        };
-      });
-    });
-  };
-
-  clickEvent = () => {
-    if (!this.state.open) {
-      this.props.dispatch(setFolderTreeID(this.props.folder._id));
-    } else {
-      this.props.dispatch(removeFolderTreeID(this.props.folder._id));
-      this.setState(() => {
-        return {
-          ...this.state,
-          open: false,
-        };
-      });
-    }
-  };
-
-  renderFolders = () => {
-    this.cachedFolders = {};
-
-    return this.state.folders.map((folder) => {
-      this.cachedFolders[folder._id] = true;
-      return (
-        <FolderTreeStorageSub2
-          key={folder._id}
-          folder={folder}
-          type={this.props.type}
-        />
-      );
-    });
-  };
-
-  render() {
-    return (
-      <FolderTreeStorageSub
-        renderFolders={this.renderFolders}
-        skipUpdate={this.skipUpdate}
-        clickEvent={this.clickEvent}
-        folderClick={this.folderClick}
-        state={this.state}
-        {...this.props}
-      />
-    );
-  }
-}
-
-const connectStoreToProp = (state) => ({
-  selectedID: state.folderTree.id,
-  selectedIDs: state.folderTree.openIDs,
-  newIDs: state.folderTree.newIDs,
-  newID: state.folderTree.newID,
-  deleteIDs: state.folderTree.deleteIDs,
-  deleteID: state.folderTree.deleteID,
-  moveIDs: state.folderTree.moveIDs,
-  moveID: state.folderTree.moveID,
-  renameIDs: state.folderTree.renameIDs,
-  renameID: state.folderTree.renameID,
-  insertedIDs: state.folderTree.insertedIDs,
-  insertedID: state.folderTree.insertedID,
-});
-
-export default connect(connectStoreToProp)(FolderTreeStorageSubContainer);
diff --git a/src/components/GoogleAccountPage/GoogleAccountPage.jsx b/src/components/GoogleAccountPage/GoogleAccountPage.jsx
deleted file mode 100644
index 2e10eb3..0000000
--- a/src/components/GoogleAccountPage/GoogleAccountPage.jsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import React from "react";
-
-const GoogleAccountPage = (props) => (
-  <div
-    className="modal__wrap"
-    style={!props.state.accountDetailsLoaded ? { background: "unset" } : {}}
-  >
-    <div className="inner__modal">
-      {props.state.accountDetailsLoaded ? (
-        <div className="password__modal">
-          <div className="head__password">
-            <h2>Google Account</h2>
-            <div className="close__modal">
-              {/* <a onClick={props.changeShowAddName}><img src="/assets/close.svg" alt="close"/></a> */}
-            </div>
-          </div>
-          <div className="password__content">
-            <form onSubmit={props.addGoogleAccount}>
-              {/* <div className="group__password">
-                            <input value={props.state.name} onChange={props.onChangeAddName} placeholder="Name"/>
-                        </div> */}
-              <div className="password__submit">
-                <input
-                  type="submit"
-                  value={
-                    props.state.accountAdded ? "Go Back" : "Add Google Account"
-                  }
-                />
-              </div>
-            </form>
-          </div>
-        </div>
-      ) : (
-        <div>
-          <p>{props.state.info}</p>
-        </div>
-      )}
-    </div>
-  </div>
-);
-
-export default GoogleAccountPage;
diff --git a/src/components/GoogleAccountPage/index.jsx b/src/components/GoogleAccountPage/index.jsx
deleted file mode 100644
index 8c2a85e..0000000
--- a/src/components/GoogleAccountPage/index.jsx
+++ /dev/null
@@ -1,100 +0,0 @@
-import React from "react";
-import axios from "../../axiosInterceptor";
-import Swal from "sweetalert2";
-import env from "../../enviroment/envFrontEnd";
-import GoogleAccountPage from "./GoogleAccountPage";
-
-class GoogleAccountPageContainer extends React.Component {
-
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            accountDetailsLoaded: false,
-            accountEmail: "",
-            accountAdded: false,
-            info: 'Loading Account Details...'
-        }
-    }
-
-    componentDidMount = () => {
-
-        axios.get(`/user-service/user`).then((response) => {
-            
-            this.setState(() => {
-                return {
-                    ...this.state,
-                    accountDetailsLoaded: true,
-                    accountEmail: response.data.email
-                }
-            })
-            
-        }).catch((err) => {
-            console.log("google account page get user err", err);
-            Swal.fire({
-                icon: 'error',
-                title: 'Account Info Error',
-                text: 'Could Not Load Account Info',
-            })
-            this.setState(() => {
-                return {
-                    ...this.state,
-                    info: 'Could Not Load Account'
-                }
-            })
-        })
-    }
-
-    addGoogleAccount = (e) => {
-
-        e.preventDefault();
-
-        if (this.state.accountAdded) {
-
-            window.location.assign(env.url);
-            return;
-        }
-
-        const tokenCode = (new URLSearchParams(window.location.search)).get("code")
-
-        const data = {
-            code: tokenCode
-        }
-
-        axios.post('/user-service/add-google-storage', data).then((response) => {
-        
-            Swal.fire(
-                'Added Google Account',
-                'Google Account Has Been Successfully Linked',
-                'success'
-            )
-
-            this.setState(() => {
-                return {
-                    ...this.state,
-                    accountAdded: true
-                }
-            })
-
-        }).catch((err) => {
-            console.log("add google storage err", err)
-            Swal.fire({
-                icon: 'error',
-                title: 'Add Google Account Error',
-                text: 'Could Not Link Google Account',
-            })
-        });
-    }
-
-    render () {
-        return (
-
-            <GoogleAccountPage 
-                addGoogleAccount={this.addGoogleAccount}
-                state={this.state}
-                {...this.props}/>
-        )
-    }
-}
-
-export default GoogleAccountPageContainer;
\ No newline at end of file
diff --git a/src/components/InvoiceItem/InvoiceItem.jsx b/src/components/InvoiceItem/InvoiceItem.jsx
deleted file mode 100644
index 46400f1..0000000
--- a/src/components/InvoiceItem/InvoiceItem.jsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from "react";
-import moment from "moment";
-
-const InvoiceItem = (props) => (
-  <tr>
-    <td className="date__history">
-      {moment.unix(props.currentInvoice.created).format("L")}
-    </td>
-    <td className="plan__history">myDrive Standard Plan</td>
-    <td className="amount__history">
-      {"$" + parseInt(props.currentInvoice.amount_due, 10) / 100}
-    </td>
-    <td
-      className={
-        props.currentInvoice.paid ? "status__history" : "status__history unpaid"
-      }
-    >
-      {props.currentInvoice.paid ? "Paid" : "Unpaid"}
-    </td>
-    <td>
-      <a onClick={props.downloadInvoice}>Invoice</a>
-    </td>
-  </tr>
-);
-
-export default InvoiceItem;
diff --git a/src/components/InvoiceItem/index.jsx b/src/components/InvoiceItem/index.jsx
deleted file mode 100644
index 719e6cb..0000000
--- a/src/components/InvoiceItem/index.jsx
+++ /dev/null
@@ -1,62 +0,0 @@
-import React from "react";
-import Swal from "sweetalert2";
-import InvoiceItem from "./InvoiceItem";
-
-class InvoiceItemContainer extends React.Component {
-
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            disabled: false,
-        }
-    }
-
-    downloadInvoice = () => {
-
-        if (this.state.disabled) return;
-
-        if (this.props.currentInvoice.invoice_pdf) {
-
-            const finalUrl = this.props.currentInvoice.invoice_pdf;
-            
-            const link = document.createElement('a');
-            document.body.appendChild(link);
-            link.href = finalUrl;
-            link.setAttribute('type', 'hidden');
-            link.click();
-
-            this.setState(() => {
-                return {
-                    ...this.state,
-                    disabled: true
-                }
-            }, () => {
-
-                setTimeout(() => {
-                   this.setState(() => {
-                        return {
-                            ...this.state,
-                            disabled: false
-                        }
-                   })
-                }, 2000);
-            })
-        } else {
-            Swal.fire({
-                icon: 'error',
-                title: 'Error',
-                text: 'Error no invoice data, please contact admin',
-              })
-        }
-    }
-
-    render() {
-        return <InvoiceItem 
-                    downloadInvoice={this.downloadInvoice} 
-                    state={this.state}
-                    {...this.props}/>
-    }
-}
-
-export default InvoiceItemContainer;
\ No newline at end of file
diff --git a/src/components/MobileContextMenu/index.jsx b/src/components/MobileContextMenu/index.jsx
deleted file mode 100644
index 2f00da7..0000000
--- a/src/components/MobileContextMenu/index.jsx
+++ /dev/null
@@ -1,184 +0,0 @@
-import React from "react";
-import {connect} from "react-redux";
-import Swal from "sweetalert2";
-import { startRenameFolder, startRemoveFolder } from "../../actions/folders";
-import { startRenameFile, startRemoveFile } from "../../actions/files";
-import { setShareSelected, setLastSelected } from "../../actions/selectedItem";
-import { resetMobileContextMenu } from "../../actions/mobileContextMenu";
-import axios from "../../axiosInterceptor";
-import { setMoverID } from "../../actions/mover";
-
-class MobileContextMenuContainer extends React.Component {
-
-    constructor(props) {
-        super(props);
-
-        this.wrapperRef = React.createRef();
-    }
-
-    componentDidMount = () => {
-
-        document.addEventListener("mousedown", this.handleClickOutside)
-    }
-
-    componentWillUnmount = () => {
-
-        document.removeEventListener("mousedown", this.handleClickOutside)
-    }
-
-    handleClickOutside = () => {
-        if (this.props.mobileContextMenu.open && this.wrapperRef && !this.wrapperRef.current.contains(event.target)) {
-            this.props.dispatch(resetMobileContextMenu());
-        } 
-    }
-
-    renameOnClick = async() => {
-
-        let inputValue = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.filename : this.props.mobileContextMenu.data.name;
-    
-        const { value: folderName} = await Swal.fire({
-            title: 'Enter A File Name',
-            input: 'text',
-            inputValue: inputValue,
-            showCancelButton: true,
-            inputValidator: (value) => {
-              if (!value) {
-                return 'Please Enter a Name'
-              }
-            }
-          })
-
-        if (folderName === undefined || folderName === null) {
-
-            return;
-        }
-
-        this.props.mobileContextMenu.isFile ? 
-        this.props.dispatch(startRenameFile(this.props.mobileContextMenu.data._id, folderName, this.props.mobileContextMenu.data.metadata.drive)) :
-        this.props.dispatch(startRenameFolder(this.props.mobileContextMenu.data._id, folderName, this.props.mobileContextMenu.data.drive, this.props.mobileContextMenu.data.parent));
-        this.props.dispatch(resetMobileContextMenu());
-    }
-
-    shareFileOnClick = () => {
-    
-        this.props.dispatch(setShareSelected({...this.props.mobileContextMenu.data}));
-        this.props.dispatch(resetMobileContextMenu());
-    }
-
-    downloadFileOnClick = () => {
-
-        this.props.dispatch(resetMobileContextMenu());
-
-        const fileID = this.props.mobileContextMenu.data._id;
-        const isGoogle = this.props.mobileContextMenu.data.metadata.drive;
-        const isGoogleDoc = this.props.mobileContextMenu.data.metadata.googleDoc;
-        const isPersonal = this.props.mobileContextMenu.data.metadata.personalFile;  
-
-        this.props.dispatch(setLastSelected(0));
-
-        axios.post("/user-service/get-token").then((response) => {
-
-            const finalUrl = 
-            isGoogle ? !isGoogleDoc ? `/file-service-google/download/${fileID}` : `/file-service-google-doc/download/${fileID}`  
-            : !isPersonal ? `/file-service/download/${fileID}` : `/file-service-personal/download/${fileID}`
-
-            const link = document.createElement('a');
-            document.body.appendChild(link);
-            link.href = finalUrl;
-            link.setAttribute('type', 'hidden');
-            link.setAttribute("download", true);
-            link.click();
-
-        }).catch((e) => {
-            console.log("Download file get refresh token error", e);
-        })
-
-        // axios.get(currentURL +'/file-service/download/get-token')
-        // .then((response) => {
-
-        //     const tempToken = response.data.tempToken;
-
-        //     const finalUrl = 
-        //     isGoogle ? !isGoogleDoc ? currentURL + `/file-service-google/download/${fileID}/${tempToken}` : currentURL + `/file-service-google-doc/download/${fileID}/${tempToken}`  
-        //     : !isPersonal ? currentURL + `/file-service/download/${fileID}/${tempToken}` : currentURL + `/file-service-personal/download/${fileID}/${tempToken}`
-
-        //     const link = document.createElement('a');
-        //     document.body.appendChild(link);
-        //     link.href = finalUrl;
-        //     link.setAttribute('type', 'hidden');
-        //     link.setAttribute("download", true);
-        //     link.click();
-
-        // }).catch((err) => {
-        //     console.log(err)
-        // })
-    }
-
-    moveOnClick = () => {
-        
-        const id = this.props.mobileContextMenu.data._id;
-        const parent = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.metadata.parent : this.props.mobileContextMenu.data.parent;
-        const isFile = this.props.mobileContextMenu.isFile;
-        const drive = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.metadata.drive : this.props.mobileContextMenu.data.drive;
-        const personalItem = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.metadata.personalFile : this.props.mobileContextMenu.data.personalFolder;
-
-        this.props.dispatch(setMoverID(id, parent, isFile, drive, personalItem));
-        this.props.dispatch(resetMobileContextMenu());
-    }
-
-    deleteOnClick = () => {
-        Swal.fire({
-            title: 'Confirm Deletion',
-            text: "You cannot undo this action",
-            icon: 'warning',
-            showCancelButton: true,
-            confirmButtonColor: '#3085d6',
-            cancelButtonColor: '#d33',
-            confirmButtonText: 'Yes, delete'
-          }).then((result) => {
-            if (result.value) {
-            
-                const id = this.props.mobileContextMenu.data._id;
-                const drive = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.metadata.drive : this.props.mobileContextMenu.data.drive;
-                const personalItem = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.metadata.personalFile : this.props.mobileContextMenu.data.personalFolder;
-                const parent = this.props.mobileContextMenu.isFile ? this.props.mobileContextMenu.data.metadata.parent : this.props.mobileContextMenu.data.parent;
-                //this.props.dispatch(startRemoveFolder(this.props._id, [...this.props.parentList, this.props._id], this.props.drive, this.props.parent))
-
-                this.props.mobileContextMenu.isFile ? 
-                this.props.dispatch(startRemoveFile(id, drive, personalItem)) : 
-                this.props.dispatch(startRemoveFolder(id, [...this.props.mobileContextMenu.data.parentList, id], drive, parent, personalItem));
-                this.props.dispatch(resetMobileContextMenu());
-            }
-        })
-    }
-
-    render() {
-        return (
-            <div className="mobile__context-menu__wrapper" ref={this.wrapperRef} style={this.props.mobileContextMenu.open ? {} : {display: "none"}}>
-                <div onClick={this.renameOnClick} className="mobile__context-menu__item">
-                    <img className="mobile__context-menu__image" src="/assets/filesetting1.svg" alt="setting"/> <p className="mobile__context-menu__title">Rename</p>
-                </div>
-                {this.props.mobileContextMenu.isFile ? 
-                <div onClick={this.shareFileOnClick} className="mobile__context-menu__item">
-                    <img className="mobile__context-menu__image" src="/assets/filesetting2.svg" alt="setting"/> <p className="mobile__context-menu__title">Share</p>
-                </div> : undefined}
-                {this.props.mobileContextMenu.isFile ? 
-                <div onClick={this.downloadFileOnClick} className="mobile__context-menu__item">
-                    <img className="mobile__context-menu__image" src="/assets/filesetting3.svg" alt="setting"/> <p className="mobile__context-menu__title">Download</p>
-                </div> : undefined}
-                <div onClick={this.moveOnClick} className="mobile__context-menu__item">
-                    <img className="mobile__context-menu__image" src="/assets/filesetting4.svg" alt="setting"/> <p className="mobile__context-menu__title">Move</p>
-                </div>
-                <div onClick={this.deleteOnClick} className="mobile__context-menu__item">
-                    <img className="mobile__context-menu__image" src="/assets/filesetting5.svg" alt="setting"/> <p className="mobile__context-menu__title">Delete</p>
-                </div>
-            </div>
-        )
-    }
-}
-
-const connectPropToStore = (state) => ({
-    mobileContextMenu: state.mobileContextMenu,
-})
-
-export default connect(connectPropToStore)(MobileContextMenuContainer);
\ No newline at end of file
diff --git a/src/components/PopupWindow/PopupWindow.jsx b/src/components/PopupWindow/PopupWindow.jsx
deleted file mode 100644
index bf13296..0000000
--- a/src/components/PopupWindow/PopupWindow.jsx
+++ /dev/null
@@ -1,117 +0,0 @@
-import Spinner from "../Spinner";
-import capitalize from "../../utils/capitalize";
-import React from "react";
-import moment from "moment";
-import bytes from "bytes";
-
-class PopupWindow extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    return (
-      <div
-        className={
-          this.props.popupFile.metadata.isVideo
-            ? "popup-window popup-window-video"
-            : "popup-window"
-        }
-        ref={this.props.wrapperRef}
-      >
-        <p className="popup-window__title">
-          {capitalize(this.props.popupFile.filename)}
-        </p>
-
-        <div
-          className={
-            this.props.popupFile.metadata.isVideo
-              ? "popup-window-wrapper popup-window-wrapper-video"
-              : "popup-window-wrapper"
-          }
-        >
-          {!this.props.popupFile.metadata.isVideo ? (
-            <div className="popup-window__image__wrapper">
-              {!this.props.popupFile.metadata.hasThumbnail ? (
-                <h3 className="popup-window__subtitle">No Preview Available</h3>
-              ) : undefined}
-
-              {!this.props.popupFile.metadata.hasThumbnail ? (
-                <img
-                  className={this.props.state.imageClassname}
-                  src={this.props.state.image}
-                />
-              ) : (
-                <img
-                  className={this.props.state.imageClassname}
-                  onClick={this.props.setPhotoViewerWindow}
-                  src={this.props.state.image}
-                  onError={this.props.thumbnailOnError}
-                />
-              )}
-
-              <div className={this.props.state.spinnerClassname}>
-                {!this.props.popupFile.metadata.hasThumbnail ? undefined : (
-                  <Spinner />
-                )}
-              </div>
-            </div>
-          ) : (
-            <video
-              className="popup-window__video !max-h-[70vh]"
-              src={this.props.state.video}
-              ref={this.props.video}
-              type="video/mp4"
-              controls
-            >
-              Your browser does not support the video tag.
-            </video>
-          )}
-          <div>
-            <div>
-              <p className="popup-file-details-title">
-                Location:{" "}
-                {this.props.popupFile.metadata.drive
-                  ? "Google Drive"
-                  : this.props.popupFile.metadata.personalFile
-                  ? "Amazon S3"
-                  : "myDrive"}
-              </p>
-              <p className="popup-file-details-title">
-                File Size: {bytes(+this.props.popupFile.metadata.size)}
-              </p>
-              <p className="popup-file-details-title">
-                Created: {moment(this.props.popupFile.uploadDate).format("L")}
-              </p>
-              <div className="popup-window-button-wrapper">
-                <button
-                  className={
-                    this.props.popupFile.metadata.isVideo
-                      ? "button popup-window__button popup-window__button-video"
-                      : "button popup-window__button"
-                  }
-                  onClick={() =>
-                    this.props.downloadFile(
-                      this.props.popupFile._id,
-                      this.props.popupFile
-                    )
-                  }
-                >
-                  Download
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <img
-          className="popup-window__close-button"
-          onClick={this.props.hidePopupWindow}
-          src="/images/close_icon.png"
-        />
-      </div>
-    );
-  }
-}
-
-export default PopupWindow;
diff --git a/src/components/PopupWindow/index.jsx b/src/components/PopupWindow/index.jsx
deleted file mode 100644
index d34124a..0000000
--- a/src/components/PopupWindow/index.jsx
+++ /dev/null
@@ -1,243 +0,0 @@
-import PopupWindow from "./PopupWindow";
-import { hidePopup } from "../../actions/popupFile";
-import axios from "../../axiosInterceptor";
-import env from "../../enviroment/envFrontEnd";
-import { connect } from "react-redux";
-import React from "react";
-import { setPhotoID } from "../../actions/photoViewer";
-import axiosNonInterceptor from "axios";
-
-class PopupWindowContainer extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.wrapperRef = React.createRef();
-    this.video = React.createRef();
-    this.imageData = "";
-    this.tempToken = "";
-
-    this.state = {
-      image: "/images/cloud-svg.svg",
-      imageClassname: this.props.popupFile.metadata.hasThumbnail
-        ? "popup-window__image popup-window popup-window--gone"
-        : "popup-window__image",
-      video: "",
-      spinnerClassname: "popup-window__spinner__wrapper",
-    };
-  }
-
-  getFileExtension = (filename) => {
-    const filenameSplit = filename.split(".");
-
-    if (filenameSplit.length > 1) {
-      const extension = filenameSplit[filenameSplit.length - 1];
-
-      return extension.toUpperCase();
-    } else {
-      return "Unknown";
-    }
-  };
-
-  getThumbnail = () => {
-    if (
-      this.getFileExtension(this.props.popupFile.filename).toLowerCase() ===
-      "svg"
-    ) {
-      this.props.popupFile.metadata.hasThumbnail = false;
-      return this.setState(() => {
-        return {
-          ...this.state,
-          image: "/images/cloud-svg.svg",
-          imageClassname: "popup-window__image",
-        };
-      });
-    }
-
-    const thumbnailID = this.props.popupFile.metadata.drive
-      ? this.props.popupFile._id
-      : this.props.popupFile.metadata.thumbnailID;
-
-    const config = {
-      responseType: "arraybuffer",
-    };
-
-    const isDrive = this.props.popupFile.metadata.drive;
-    const isPersonal = this.props.popupFile.metadata.personalFile;
-
-    const url = isDrive
-      ? `/file-service-google/thumbnail/${thumbnailID}`
-      : !isPersonal
-      ? `/file-service/thumbnail/${thumbnailID}`
-      : `/file-service-personal/thumbnail/${thumbnailID}`;
-
-    axios
-      .get(url, config)
-      .then((results) => {
-        const imgFile = new Blob([results.data]);
-        const imgUrl = URL.createObjectURL(imgFile);
-
-        this.setState(() => ({
-          ...this.state,
-          image: imgUrl,
-          imageClassname: "popup-window__image popup-window__image--loaded",
-          spinnerClassname: "popup-window__spinner__wrapper popup-window--gone",
-        }));
-      })
-      .catch((err) => {
-        console.log(err);
-      });
-  };
-
-  thumbnailOnError = () => {
-    this.setState(() => ({
-      ...this.state,
-      imageClassname: "popup-window__image",
-      spinnerClassname: "popup-window__spinner__wrapper popup-window--gone",
-      image: "/images/cloud-svg.svg",
-    }));
-  };
-
-  handleClickOutside = (e) => {
-    if (this.wrapperRef && !this.wrapperRef.current.contains(event.target)) {
-      this.props.dispatch(hidePopup());
-    }
-  };
-
-  getVideo = () => {
-    // const config = {
-    //     headers: {
-    //     uuid: window.sessionStorage.getItem("uuid")
-    // }
-
-    // };
-
-    console.log("gettings stream video token");
-
-    axios
-      .get("/file-service/download/access-token-stream-video")
-      .then(() => {
-        console.log("stream video got token");
-
-        //  TODO: Fix this
-        const finalUrl = `http://localhost:5173/api/file-service/stream-video/${this.props.popupFile._id}`;
-
-        this.setState(() => ({
-          ...this.state,
-          video: finalUrl,
-        }));
-      })
-      .catch((e) => {
-        console.log("Stream Video Error", e.message);
-      });
-
-    // axios.get(currentURL +'/file-service/download/get-token-video',config)
-    // .then((response) => {
-
-    //     this.tempToken =  response.data.tempToken;
-
-    //     const uuidID = window.sessionStorage.getItem("uuid");
-
-    //     const isDrive = this.props.popupFile.metadata.drive;
-    //     const isPersonal = this.props.popupFile.metadata.personalFile;
-
-    //     const finalUrl = isDrive ?
-    //     currentURL + `/file-service-google/stream-video/${this.props.popupFile._id}/${this.tempToken}/${uuidID}`
-    //     : !isPersonal ? currentURL + `/file-service/stream-video/${this.props.popupFile._id}/${this.tempToken}/${uuidID}`
-    //     : currentURL + `/file-service-personal/stream-video/${this.props.popupFile._id}/${this.tempToken}/${uuidID}`
-
-    //     this.setState(() => ({
-    //         ...this.state,
-    //         video: finalUrl
-    //     }))
-
-    // }).catch((err) => {
-    //     console.log(err)
-    // })
-  };
-
-  componentWillUnmount = () => {
-    document.removeEventListener("mousedown", this.handleClickOutside);
-
-    if (this.props.popupFile.metadata.isVideo) {
-      axios
-        .delete(`/file-service/remove-stream-video-token`)
-        .then(() => {
-          console.log("removed video access token");
-        })
-        .catch((err) => {
-          console.log(err);
-        });
-
-      this.video.current.pause();
-
-      this.setState(() => ({
-        ...this.state,
-        video: "",
-      }));
-    }
-  };
-
-  componentDidMount = () => {
-    document.addEventListener("mousedown", this.handleClickOutside);
-
-    if (
-      this.props.popupFile.metadata.hasThumbnail &&
-      !this.props.popupFile.metadata.isVideo &&
-      !this.props.popupFile.metadata.drive
-    ) {
-      this.getThumbnail();
-    } else if (
-      this.props.popupFile.metadata.drive &&
-      this.props.popupFile.metadata.hasThumbnail &&
-      !this.props.popupFile.metadata.googleDoc &&
-      !this.props.popupFile.metadata.isVideo
-    ) {
-      this.getThumbnail();
-    } else if (
-      this.props.popupFile.metadata.drive &&
-      this.props.popupFile.metadata.hasThumbnail &&
-      !this.props.popupFile.metadata.isVideo
-    ) {
-      this.setState(() => ({
-        ...this.state,
-        imageClassname: "popup-window__image",
-        spinnerClassname: "popup-window__spinner__wrapper popup-window--gone",
-        image: "/images/cloud-svg.svg",
-      }));
-    } else if (this.props.popupFile.metadata.isVideo) {
-      this.getVideo();
-    }
-  };
-
-  hidePopupWindow = () => {
-    this.props.dispatch(hidePopup());
-  };
-
-  setPhotoViewerWindow = () => {
-    const isGoogle = this.props.popupFile.metadata.drive;
-    const isPersonal = this.props.popupFile.metadata.personalFile;
-    this.props.dispatch(
-      setPhotoID(this.props.popupFile._id, isGoogle, isPersonal)
-    );
-  };
-
-  render() {
-    return (
-      <PopupWindow
-        wrapperRef={this.wrapperRef}
-        video={this.video}
-        hidePopupWindow={this.hidePopupWindow}
-        state={this.state}
-        setPhotoViewerWindow={this.setPhotoViewerWindow}
-        thumbnailOnError={this.thumbnailOnError}
-        {...this.props}
-      />
-    );
-  }
-}
-
-const connectPropToState = (state) => ({
-  popupFile: state.popupFile,
-});
-
-export default connect(connectPropToState)(PopupWindowContainer);
diff --git a/src/components/RightSectionDetail/index.jsx b/src/components/RightSectionDetail/index.jsx
deleted file mode 100644
index fb187f8..0000000
--- a/src/components/RightSectionDetail/index.jsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from "react";
-
-export default ({title, body, first=true}) => (
-
-    <div className="section-detail__wrapper">
-        <h5 className={first ? "section-detail__title" : "section-detail__title section-detail__title--margin"}>{title}</h5>
-        <h5 className={first ? "section-detail__body" : "section-detail__body section-detail__body--margin"}>{body}</h5>
-    </div>
-    
-)
\ No newline at end of file
diff --git a/src/components/SettingsPage/index.jsx b/src/components/SettingsPage/index.jsx
index 1549186..a111549 100644
--- a/src/components/SettingsPage/index.jsx
+++ b/src/components/SettingsPage/index.jsx
@@ -15,7 +15,6 @@ import { setFiles, startResetCache } from "../../actions/files";
 import { connect } from "react-redux";
 import { setParent } from "../../actions/parent";
 import uuid from "uuid";
-import InvoiceItem from "../InvoiceItem";
 import { setUpdateSettingsID } from "../../utils/updateSettings";
 import HomepageSpinner from "../HomepageSpinner";
 import { setLoading } from "../../actions/main";
@@ -1493,13 +1492,6 @@ class SettingsPageContainer extends React.Component {
                           <th></th>
                         </tr>
 
-                        {!this.state.loaded || !this.state.invoicesLoaded
-                          ? undefined
-                          : this.state.invoices.map((currentInvoice) => {
-                              return (
-                                <InvoiceItem currentInvoice={currentInvoice} />
-                              );
-                            })}
                         {/* <tr>
                 <td className="date__history">May 1, 2020</td>
                 <td className="plan__history">myDrive Standard Plan</td>
diff --git a/src/routers/AppRouter.jsx b/src/routers/AppRouter.jsx
index 20c5867..e4d6377 100755
--- a/src/routers/AppRouter.jsx
+++ b/src/routers/AppRouter.jsx
@@ -14,8 +14,6 @@ import DownloadPage from "../components/DownloadPage";
 import VerifyEmailPage from "../components/VerifyEmailPage";
 import uuid from "uuid";
 import ResetPasswordPage from "../components/ResetPasswordPage";
-import GoogleAccountPage from "../components/GoogleAccountPage";
-import AddStoragePage from "../components/AddStoragePage";
 import SettingsPage from "../components/SettingsPage";
 import Homepage from "../components/Homepage";