Merge pull request # from firecamp-io/feat/platform

- Menu icon opacity change
- request will not get opened in the tab while dragging it within the tree, improvement.
- FcHttp icon component created
- collection tree drop condition logic set, in-progress

platform/firecamp-platform/src/components/activity-bar/explorer/Explorer.tsx

@@ -75,8 +75,12 @@ const Explorer: FC<any> = () => {
     )
   );
 
+  /** if mouse down then do not open the request in tab. example dragging item should not fire onSelect */
+  const isMouseDown = useRef(false);
   //effect: register and unregister treeDataProvider instance
   useEffect(() => {
+    document.body.onmousedown = () => isMouseDown.current = true;
+    document.body.onmouseup = () => isMouseDown.current = false
     registerTDP(dataProvider.current);
     return unRegisterTDP;
   }, []);
@@ -134,7 +138,9 @@ const Explorer: FC<any> = () => {
   const _onNodeSelect = (nodeIndexes: TreeItemIndex[]) => {
     // console.log({ nodeIndexes });
     // return
-
+    setTimeout(() => {
+      // if item is being dragging then do not open it in new tab
+      if (isMouseDown.current) return;
       let nodeIndex = nodeIndexes[0];
       let nodeItem = [...collections, ...folders, ...requests].find(
         (c) => c.__ref.id == nodeIndex
@@ -152,57 +158,62 @@ const Explorer: FC<any> = () => {
         // console.log({ nodeItem });
         _openReqInTab(nodeItem);
       }
+    }, 10)
   };
 
+  const shouldIDropTheCollection = useCallback((item: any, target: any): boolean => {
+
+    const { childIndex, targetType, depth, parentItem } = target;
+    const index = workspace.__meta.cOrders.indexOf(item.__ref.id);
+    console.log(workspace.__meta.cOrders, item.__ref, target, childIndex, index, [index - 1, index, index + 1].includes(childIndex));
+
+    /** collection can only reorder at depth 0 */
+    if (typeof childIndex != 'number') return false;
+    else if ([index - 1, index, index + 1].includes(childIndex)) return false;
+    else if (targetType == 'between-items' && depth == 0 && parentItem == 'root') return true;
+    else return false;
+  }, [workspace.__meta.cOrders, collections]);
+
+  const shouldIDropTheFolder = useCallback((target: any): boolean => {
+    const { targetType, depth, parentItem } = target;
+    /** folder can be dropped on collection */
+    if (targetType == 'item' && depth == 0 && parentItem == 'root') return true;
+
+    const parentCollection = collections.find((i) => i.__ref.id == parentItem);
+    const parentFolder = folders.find((i) => i.__ref.id == parentItem);
+
+    /**folders can be drop on collection and folder or reorder within the same depth/level */
+    if (parentCollection || parentFolder) return true;
+    return false;
+  }, [collections, folders]);
+
+  const shouldIDropTheRequest = useCallback((target: any): boolean => {
+    const { targetType, depth, parentItem } = target;
+    /** request can be dropped on collection */
+    if (targetType == 'item' && depth == 0 && parentItem == 'root') return true;
+
+    const parentCollection = collections.find((i) => i.__ref.id == parentItem);
+    const parentFolder = folders.find((i) => i.__ref.id == parentItem);
+
+    /** request can be drop on collection and folder or reorder within the same depth/level */
+    if (parentCollection || parentFolder) return true;
+
+    return false;
+  }, [collections, folders]);
+
   const canDropAt = useCallback(
     (item, target) => {
       const itemPayload = item.data;
       const isItemCollection = itemPayload.__ref.isCollection;
       const isItemFolder = itemPayload.__ref.isFolder;
       const isItemRequest = itemPayload.__ref.isRequest;
-      const { targetType, depth, parentItem } = target;
-
-      // return true
 
       // console.clear();
-      // console.log(itemPayload, isItemCollection, target, "can drop at ...");
 
-      /** collection can only reorder at depth 0 */
+      if (isItemCollection) return shouldIDropTheCollection(itemPayload, target);
-      if (
+      if (isItemFolder) return shouldIDropTheFolder(target);
-        isItemCollection &&
+      if (isItemRequest) return shouldIDropTheRequest(target);
-        targetType == 'between-items' &&
-        depth == 0 &&
-        parentItem == 'root'
-      ) {
-        return true;
-      }
-
-      /** folder and request can be dropped on collection */
-      if (
-        (isItemFolder || isItemRequest) &&
-        targetType == 'item' &&
-        depth == 0 &&
-        parentItem == 'root'
-      ) {
-        return true;
-      }
-
-      const parentCollection = collections.find(
-        (i) => i.__ref.id == parentItem
-      );
-      const parentFolder = folders.find((i) => i.__ref.id == parentItem);
-
-      /** request and folders can be drop on collection and folder or reorder within the same depth/level */
-      if (
-        (parentCollection || parentFolder) &&
-        (isItemFolder || isItemRequest)
-      ) {
-        return true;
-      }
-
-      // console.log(false, "you can not drag")
       return false;
-      // return target.targetType === 'between-items' ? target.parentItem.startsWith('A') : target.targetItem.startsWith('A')
     },
     [collections, folders]
   );

platform/firecamp-platform/src/components/activity-bar/explorer/menus/CollectionMenu.tsx

@@ -146,7 +146,7 @@ const CollectionMenu = ({
   return (
     <div>
       <DropdownMenu
-        handler={() => <MoreHorizontal className="cursor-pointer " size={14} />}
+        handler={() => <MoreHorizontal className="cursor-pointer " size={14} opacity={0.6}/>}
         options={menuType == EMenuType.Request ? requestMenu : commonMenu}
         width={144}
         onSelect={(value) => value.onClick()}

platform/firecamp-platform/src/components/modals/auth/SignIn.tsx

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { UserCircle2 } from 'lucide-react';
+import { Mail } from 'lucide-react';
 import { Drawer, IModal, Button, FcLogo } from '@firecamp/ui';
 
 import _auth from '../../../services/auth';
@@ -23,7 +23,7 @@ const SignIn: FC<IModal> = ({ opened, onClose }) => {
         <GithubGoogleAuth />
         <Button
           text="Sign In with Email"
-          leftIcon={<UserCircle2 size={18} />}
+          leftIcon={<Mail size={18} />}
           classNames={{ 
             root: 'mb-5',
             inner: 'ml-[30%]'