diff --git a/src/components/Tutorials/subComps/ImageDrawer.jsx b/src/components/Tutorials/subComps/ImageDrawer.jsx
index 6de8e472..1e3f2056 100644
--- a/src/components/Tutorials/subComps/ImageDrawer.jsx
+++ b/src/components/Tutorials/subComps/ImageDrawer.jsx
@@ -50,54 +50,44 @@ const ImageDrawer = ({ onClose, visible, owner, tutorial_id, imageURLs }) => {
     }) => deleting_error
   );
 
+  const [uploadSnackbarOpen, setUploadSnackbarOpen] = React.useState(false);
+  const [uploadErrorSnackbarOpen, setUploadErrorSnackbarOpen] =
+    React.useState(false);
+  const [deleteSnackbarOpen, setDeleteSnackbarOpen] = React.useState(false);
+  const [deleteErrorSnackbarOpen, setDeleteErrorSnackbarOpen] =
+    React.useState(false);
+
   useEffect(() => {
     if (uploading === false && uploading_error === false) {
-      <Snackbar
-        anchorOrigin={{
-          vertical: "bottom",
-          horizontal: "left"
-        }}
-        open={true}
-        autoHideDuration={6000}
-        message="Image Uploaded successfully...."
-      />;
+      setUploadSnackbarOpen(true);
     } else if (uploading === false && uploading_error) {
-      <Snackbar
-        anchorOrigin={{
-          vertical: "bottom",
-          horizontal: "left"
-        }}
-        open={true}
-        autoHideDuration={6000}
-        message={uploading_error}
-      />;
+      setUploadErrorSnackbarOpen(true);
     }
   }, [uploading, uploading_error]);
 
   useEffect(() => {
     if (deleting === false && deleting_error === false) {
-      <Snackbar
-        anchorOrigin={{
-          vertical: "bottom",
-          horizontal: "left"
-        }}
-        open={true}
-        autoHideDuration={6000}
-        message="Deleted Succefully...."
-      />;
+      setDeleteSnackbarOpen(true);
     } else if (deleting === false && deleting_error) {
-      <Snackbar
-        anchorOrigin={{
-          vertical: "bottom",
-          horizontal: "left"
-        }}
-        open={true}
-        autoHideDuration={6000}
-        message={deleting_error}
-      />;
+      setDeleteErrorSnackbarOpen(true);
     }
   }, [deleting, deleting_error]);
 
+  const handleSnackbarClose = type => {
+    switch (type) {
+      case "upload":
+        setUploadSnackbarOpen(false);
+        setUploadErrorSnackbarOpen(false);
+        break;
+      case "delete":
+        setDeleteSnackbarOpen(false);
+        setDeleteErrorSnackbarOpen(false);
+        break;
+      default:
+        break;
+    }
+  };
+
   useEffect(() => {
     clearTutorialImagesReducer()(dispatch);
     return () => {
@@ -105,17 +95,15 @@ const ImageDrawer = ({ onClose, visible, owner, tutorial_id, imageURLs }) => {
     };
   }, [dispatch]);
 
-  const props = {
-    name: "file",
-    multiple: true,
-    beforeUpload(file, files) {
-      uploadTutorialImages(owner, tutorial_id, files)(
-        firebase,
-        firestore,
-        dispatch
-      );
-      return false;
-    }
+  const beforeUpload = async files => {
+    console.log("Image Upload Started!!!")
+    await uploadTutorialImages(owner, tutorial_id, files)(
+      firebase,
+      firestore,
+      dispatch
+    );
+    console.log("Uploaded the Images");
+    return false;
   };
 
   const deleteFile = (name, url) =>
@@ -127,85 +115,129 @@ const ImageDrawer = ({ onClose, visible, owner, tutorial_id, imageURLs }) => {
     )(firebase, firestore, dispatch);
 
   return (
-    <Drawer
-      title="Images"
-      data-testid="imageDrawer"
-      anchor="right"
-      closable={true}
-      onClose={onClose}
-      open={visible}
-      getContainer={true}
-      style={{ position: "absolute" }}
-      width="400px"
-      className="image-drawer"
-      destroyOnClose={true}
-      maskClosable={false}
-    >
-      <div className="col-pad-24" data-testId="tutorialImgUpload">
-        <Grid>
-          <input
-            id="file-upload"
-            fullWidth
-            accept="image/*"
-            type="file"
-            {...props}
-          />
-          {uploading ? (
-            <>
-              <LoadingOutlined /> Please wait...
-              <p className="ant-upload-hint mt-8">Uploading image(s)...</p>
-            </>
-          ) : (
-            <>
-              <p className="ant-upload-drag-icon">
-                <InboxOutlined />
-              </p>
-              <p className="ant-upload-text">
-                Click or drag images to here to upload
-              </p>
-            </>
-          )}
-        </Grid>
-        {imageURLs &&
-          imageURLs.length > 0 &&
-          imageURLs.map((image, i) => (
-            <Grid className="mb-24" key={i}>
-              <Grid xs={24} md={8}>
-                <img src={image.url} alt="" />
-              </Grid>
-              <Grid xs={24} md={16} className="pl-8" style={{}}>
-                <h4 className="pb-8">{image.name}</h4>
-
-                <CopyToClipboard
-                  text={`![alt=image; scale=1.0](${image.url})`}
-                  onCopy={() => (
-                    <Snackbar
-                      anchorOrigin={{
-                        vertical: "bottom",
-                        horizontal: "left"
-                      }}
-                      open={true}
-                      autoHideDuration={6000}
-                      message="Copied...."
-                    />
-                  )}
-                >
-                  <Button type="primary">Copy URL</Button>
-                </CopyToClipboard>
-
-                <Button
-                  loading={deleting}
-                  onClick={() => deleteFile(image.name, image.url)}
-                  type="ghost"
-                  danger
-                >
-                  Delete
-                </Button>
+    <>
+      <Drawer
+        title="Images"
+        data-testid="imageDrawer"
+        anchor="right"
+        closable={true}
+        onClose={onClose}
+        open={visible}
+        getContainer={true}
+        style={{ position: "absolute" }}
+        width="400px"
+        className="image-drawer"
+        destroyOnClose={true}
+        maskClosable={false}
+      >
+        <div className="col-pad-24" data-testId="tutorialImgUpload">
+          <Grid>
+            <input
+              id="file-upload"
+              fullWidth
+              accept="image/*"
+              type="file"
+              name="file"
+              multiple
+              onChange={event => beforeUpload(event.target.files)}
+            />
+            {uploading ? (
+              <>
+                <LoadingOutlined /> Please wait...
+                <p className="ant-upload-hint mt-8">Uploading image(s)...</p>
+              </>
+            ) : (
+              <>
+                <p className="ant-upload-drag-icon">
+                  <InboxOutlined />
+                </p>
+                <p className="ant-upload-text">
+                  Click or drag images to here to upload
+                </p>
+              </>
+            )}
+          </Grid>
+          {imageURLs &&
+            imageURLs.length > 0 &&
+            imageURLs.map((image, i) => (
+              <Grid className="mb-24" key={i}>
+                <Grid xs={24} md={8}>
+                  <img src={image.url} alt="" />
+                </Grid>
+                <Grid xs={24} md={16} className="pl-8" style={{}}>
+                  <h4 className="pb-8">{image.name}</h4>
+
+                  <CopyToClipboard
+                    text={`![alt=image; scale=1.0](${image.url})`}
+                    onCopy={() => (
+                      <Snackbar
+                        anchorOrigin={{
+                          vertical: "bottom",
+                          horizontal: "left"
+                        }}
+                        open={true}
+                        autoHideDuration={6000}
+                        message="Copied...."
+                      />
+                    )}
+                  >
+                    <Button type="primary">Copy URL</Button>
+                  </CopyToClipboard>
+
+                  <Button
+                    loading={deleting}
+                    onClick={() => deleteFile(image.name, image.url)}
+                    type="ghost"
+                    danger
+                  >
+                    Delete
+                  </Button>
+                </Grid>
               </Grid>
-            </Grid>
-          ))}
-      </div>
-    </Drawer>
+            ))}
+        </div>
+      </Drawer>
+      <Snackbar
+        anchorOrigin={{
+          vertical: "bottom",
+          horizontal: "left"
+        }}
+        open={uploadSnackbarOpen}
+        autoHideDuration={6000}
+        onClose={() => handleSnackbarClose("upload")}
+        message="Image Uploaded successfully...."
+      />
+      <Snackbar
+        anchorOrigin={{
+          vertical: "bottom",
+          horizontal: "left"
+        }}
+        open={uploadErrorSnackbarOpen}
+        autoHideDuration={6000}
+        onClose={() => handleSnackbarClose("upload")}
+        message={uploading_error}
+      />
+      <Snackbar
+        anchorOrigin={{
+          vertical: "bottom",
+          horizontal: "left"
+        }}
+        open={deleteSnackbarOpen}
+        autoHideDuration={6000}
+        onClose={() => handleSnackbarClose("delete")}
+        message="Deleted Successfully...."
+      />
+      <Snackbar
+        anchorOrigin={{
+          vertical: "bottom",
+          horizontal: "left"
+        }}
+        open={deleteErrorSnackbarOpen}
+        autoHideDuration={6000}
+        onClose={() => handleSnackbarClose("delete")}
+        message={deleting_error}
+      />
+    </>
   );
 };
 
diff --git a/src/store/actions/authActions.js b/src/store/actions/authActions.js
index 5b748dee..668be900 100644
--- a/src/store/actions/authActions.js
+++ b/src/store/actions/authActions.js
@@ -179,9 +179,12 @@ export const resendVerifyEmail = email => async dispatch => {
 export const checkUserHandleExists = userHandle => async firebase => {
   try {
     const handle = await firebase
-      .ref(`/cl_user_handle/${userHandle}`)
-      .once("value");
-    return handle.exists();
+    .firestore()
+    .collection("cl_user")
+    .doc(userHandle)
+    .get();
+    console.log("User Handle",handle)
+    return handle.exists;
   } catch (e) {
     throw e.message;
   }
@@ -195,7 +198,7 @@ export const checkOrgHandleExists = orgHandle => async firebase => {
       .doc(orgHandle)
       .get();
 
-    console.log(organizationHandle);
+    console.log("Organization Handle",organizationHandle);
     return organizationHandle.exists;
   } catch (e) {
     throw e.message;
diff --git a/src/store/actions/tutorialsActions.js b/src/store/actions/tutorialsActions.js
index 7d273c1d..6bd0b5c2 100644
--- a/src/store/actions/tutorialsActions.js
+++ b/src/store/actions/tutorialsActions.js
@@ -173,9 +173,9 @@ export const createTutorial =
     }
   };
 
-const checkUserOrOrgHandle = handle => async firestore => {
-  const userHandleExists = await checkUserHandleExists(handle)(firestore);
-  const orgHandleExists = await checkOrgHandleExists(handle)(firestore);
+const checkUserOrOrgHandle = handle => async firebase => {
+  const userHandleExists = await checkUserHandleExists(handle)(firebase);
+  const orgHandleExists = await checkOrgHandleExists(handle)(firebase);
 
   if (userHandleExists && !orgHandleExists) {
     return "user";
@@ -230,36 +230,36 @@ export const getCurrentTutorialData =
 
 export const addNewTutorialStep =
   ({ owner, tutorial_id, title, time, id }) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        dispatch({ type: actions.CREATE_TUTORIAL_STEP_START });
+  async (firebase, firestore, dispatch) => {
+    try {
+      dispatch({ type: actions.CREATE_TUTORIAL_STEP_START });
 
-        await firestore
-          .collection("tutorials")
-          .doc(tutorial_id)
-          .collection("steps")
-          .doc(id)
-          .set({
-            content: `Switch to editor mode to begin <b>${title}</b> step`,
-            id,
-            time,
-            title,
-            visibility: true,
-            deleted: false
-          });
+      await firestore
+        .collection("tutorials")
+        .doc(tutorial_id)
+        .collection("steps")
+        .doc(id)
+        .set({
+          content: `Switch to editor mode to begin <b>${title}</b> step`,
+          id,
+          time,
+          title,
+          visibility: true,
+          deleted: false
+        });
 
-        await getCurrentTutorialData(owner, tutorial_id)(
-          firebase,
-          firestore,
-          dispatch
-        );
+      await getCurrentTutorialData(owner, tutorial_id)(
+        firebase,
+        firestore,
+        dispatch
+      );
 
-        dispatch({ type: actions.CREATE_TUTORIAL_STEP_SUCCESS });
-      } catch (e) {
-        console.log("CREATE_TUTORIAL_STEP_FAIL", e.message);
-        dispatch({ type: actions.CREATE_TUTORIAL_STEP_FAIL, payload: e.message });
-      }
-    };
+      dispatch({ type: actions.CREATE_TUTORIAL_STEP_SUCCESS });
+    } catch (e) {
+      console.log("CREATE_TUTORIAL_STEP_FAIL", e.message);
+      dispatch({ type: actions.CREATE_TUTORIAL_STEP_FAIL, payload: e.message });
+    }
+  };
 
 export const clearCreateTutorials = () => dispatch =>
   dispatch({ type: actions.CLEAR_CREATE_TUTORIALS_STATE });
@@ -305,78 +305,78 @@ export const setCurrentStepContent =
 
 export const hideUnHideStep =
   (owner, tutorial_id, step_id, visibility) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        /* not being used */
-        // const type = await checkUserOrOrgHandle(owner)(firebase);
-        await firestore
-          .collection("tutorials")
-          .doc(tutorial_id)
-          .collection("steps")
-          .doc(step_id)
-          .update({
-            [`visibility`]: !visibility,
-            updatedAt: firestore.FieldValue.serverTimestamp()
-          });
+  async (firebase, firestore, dispatch) => {
+    try {
+      /* not being used */
+      // const type = await checkUserOrOrgHandle(owner)(firebase);
+      await firestore
+        .collection("tutorials")
+        .doc(tutorial_id)
+        .collection("steps")
+        .doc(step_id)
+        .update({
+          [`visibility`]: !visibility,
+          updatedAt: firestore.FieldValue.serverTimestamp()
+        });
 
-        await getCurrentTutorialData(owner, tutorial_id)(
-          firebase,
-          firestore,
-          dispatch
-        );
-      } catch (e) {
-        console.log(e.message);
-      }
-    };
+      await getCurrentTutorialData(owner, tutorial_id)(
+        firebase,
+        firestore,
+        dispatch
+      );
+    } catch (e) {
+      console.log(e.message);
+    }
+  };
 
 export const publishUnpublishTutorial =
   (owner, tutorial_id, isPublished) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        await firestore
-          .collection("tutorials")
-          .doc(tutorial_id)
-          .update({
-            ["isPublished"]: !isPublished
-          });
+  async (firebase, firestore, dispatch) => {
+    try {
+      await firestore
+        .collection("tutorials")
+        .doc(tutorial_id)
+        .update({
+          ["isPublished"]: !isPublished
+        });
 
-        getCurrentTutorialData(owner, tutorial_id)(firebase, firestore, dispatch);
-      } catch (e) {
-        console.log(e.message);
-      }
-    };
+      getCurrentTutorialData(owner, tutorial_id)(firebase, firestore, dispatch);
+    } catch (e) {
+      console.log(e.message);
+    }
+  };
 
 export const removeStep =
   (owner, tutorial_id, step_id, current_step_no) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        await firestore
-          .collection("tutorials")
-          .doc(tutorial_id)
-          .collection("steps")
-          .doc(step_id)
-          .delete()
-
-        // const data = await firestore
-        //   .collection("tutorials")
-        //   .doc(tutorial_id)
-        //   .collection("steps")
-        //   .doc(step_id)
-        //   .get();
-
-        await setCurrentStepNo(
-          current_step_no > 0 ? current_step_no - 1 : current_step_no
-        )(dispatch);
-
-        await getCurrentTutorialData(owner, tutorial_id)(
-          firebase,
-          firestore,
-          dispatch
-        );
-      } catch (e) {
-        console.log(e.message);
-      }
-    };
+  async (firebase, firestore, dispatch) => {
+    try {
+      await firestore
+        .collection("tutorials")
+        .doc(tutorial_id)
+        .collection("steps")
+        .doc(step_id)
+        .delete();
+
+      // const data = await firestore
+      //   .collection("tutorials")
+      //   .doc(tutorial_id)
+      //   .collection("steps")
+      //   .doc(step_id)
+      //   .get();
+
+      await setCurrentStepNo(
+        current_step_no > 0 ? current_step_no - 1 : current_step_no
+      )(dispatch);
+
+      await getCurrentTutorialData(owner, tutorial_id)(
+        firebase,
+        firestore,
+        dispatch
+      );
+    } catch (e) {
+      console.log(e.message);
+    }
+  };
 
 export const setCurrentStep = data => async dispatch =>
   dispatch({ type: actions.SET_EDITOR_DATA, payload: data });
@@ -388,7 +388,7 @@ export const uploadTutorialImages =
   (owner, tutorial_id, files) => async (firebase, firestore, dispatch) => {
     try {
       dispatch({ type: actions.TUTORIAL_IMAGE_UPLOAD_START });
-      const type = await checkUserOrOrgHandle(owner)(firestore);
+      const type = await checkUserOrOrgHandle(owner)(firebase);
 
       const storagePath = `tutorials/${type}/${owner}/${tutorial_id}`;
       const dbPath = `tutorials`;
@@ -430,7 +430,7 @@ export const remoteTutorialImages =
       dispatch({
         type: actions.TUTORIAL_IMAGE_DELETE_START
       });
-      const type = await checkUserOrOrgHandle(owner)(firestore);
+      const type = await checkUserOrOrgHandle(owner)(firebase);
 
       const storagePath = `tutorials/${type}/${owner}/${tutorial_id}/${name}`;
       const dbPath = `tutorials`;
@@ -465,69 +465,69 @@ export const remoteTutorialImages =
 
 export const updateStepTitle =
   (owner, tutorial_id, step_id, step_title) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        const dbPath = `tutorials/${tutorial_id}/steps`;
-        await firestore
-          .collection(dbPath)
-          .doc(step_id)
-          .update({
-            [`title`]: step_title,
-            updatedAt: firestore.FieldValue.serverTimestamp()
-          });
+  async (firebase, firestore, dispatch) => {
+    try {
+      const dbPath = `tutorials/${tutorial_id}/steps`;
+      await firestore
+        .collection(dbPath)
+        .doc(step_id)
+        .update({
+          [`title`]: step_title,
+          updatedAt: firestore.FieldValue.serverTimestamp()
+        });
 
-        await getCurrentTutorialData(owner, tutorial_id)(
-          firebase,
-          firestore,
-          dispatch
-        );
-      } catch (e) {
-        console.log(e);
-      }
-    };
+      await getCurrentTutorialData(owner, tutorial_id)(
+        firebase,
+        firestore,
+        dispatch
+      );
+    } catch (e) {
+      console.log(e);
+    }
+  };
 
 export const updateStepTime =
   (owner, tutorial_id, step_id, step_time) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        const dbPath = `tutorials/${tutorial_id}/steps`;
-
-        await firestore
-          .collection(dbPath)
-          .doc(step_id)
-          .update({
-            [`time`]: step_time,
-            updatedAt: firestore.FieldValue.serverTimestamp()
-          });
+  async (firebase, firestore, dispatch) => {
+    try {
+      const dbPath = `tutorials/${tutorial_id}/steps`;
 
-        await getCurrentTutorialData(owner, tutorial_id)(
-          firebase,
-          firestore,
-          dispatch
-        );
-      } catch (e) {
-        console.log(e.message);
-      }
-    };
+      await firestore
+        .collection(dbPath)
+        .doc(step_id)
+        .update({
+          [`time`]: step_time,
+          updatedAt: firestore.FieldValue.serverTimestamp()
+        });
+
+      await getCurrentTutorialData(owner, tutorial_id)(
+        firebase,
+        firestore,
+        dispatch
+      );
+    } catch (e) {
+      console.log(e.message);
+    }
+  };
 
 export const setTutorialTheme =
   ({ tutorial_id, owner, bgColor, textColor }) =>
-    async (firebase, firestore, dispatch) => {
-      try {
-        const dbPath = `tutorials`;
+  async (firebase, firestore, dispatch) => {
+    try {
+      const dbPath = `tutorials`;
 
-        await firestore.collection(dbPath).doc(tutorial_id).update({
-          text_color: textColor,
-          background_color: bgColor,
-          updatedAt: firestore.FieldValue.serverTimestamp()
-        });
+      await firestore.collection(dbPath).doc(tutorial_id).update({
+        text_color: textColor,
+        background_color: bgColor,
+        updatedAt: firestore.FieldValue.serverTimestamp()
+      });
 
-        await getCurrentTutorialData(owner, tutorial_id)(
-          firebase,
-          firestore,
-          dispatch
-        );
-      } catch (e) {
-        console.log(e.message);
-      }
-    };
+      await getCurrentTutorialData(owner, tutorial_id)(
+        firebase,
+        firestore,
+        dispatch
+      );
+    } catch (e) {
+      console.log(e.message);
+    }
+  };