Web:Components:Selector: disable braed crumbs click while body is loading

packages/components/selector/sub-components/Body/index.tsx

@@ -123,6 +123,7 @@ const Body = ({
           <BreadCrumbs
             breadCrumbs={breadCrumbs}
             onSelectBreadCrumb={onSelectBreadCrumb}
+            isLoading={isLoading}
           />
         )
       ) : null}

packages/components/selector/sub-components/BreadCrumbs/BreadCrumbs.types.ts

@@ -19,4 +19,5 @@ export type DisplayedItem = {
 export type BreadCrumbsProps = {
   breadCrumbs?: BreadCrumb[];
   onSelectBreadCrumb?: (item: BreadCrumb) => void;
+  isLoading?: boolean;
 };

packages/components/selector/sub-components/BreadCrumbs/StyledBreadCrumbs.ts

@@ -29,13 +29,13 @@ const StyledBreadCrumbs = styled.div<{
   }
 `;
 
-const StyledItemText = styled(Text)<{ isCurrent: boolean }>`
+const StyledItemText = styled(Text)<{ isCurrent: boolean; isLoading: boolean }>`
   ${(props) =>
     !props.isCurrent &&
     css`
       color: ${props.theme.selector.breadCrumbs.prevItemColor};
 
-      cursor: pointer;
+      ${!props.isLoading && `cursor: pointer`};
     `}
 `;
 

packages/components/selector/sub-components/BreadCrumbs/index.tsx

@@ -14,16 +14,21 @@ import {
   StyledArrowRightSvg,
 } from "./StyledBreadCrumbs";
 
-const BreadCrumbs = ({ breadCrumbs, onSelectBreadCrumb }: BreadCrumbsProps) => {
+const BreadCrumbs = ({
+  breadCrumbs,
+  onSelectBreadCrumb,
+  isLoading,
+}: BreadCrumbsProps) => {
   const [displayedItems, setDisplayedItems] = React.useState<DisplayedItem[]>(
     []
   );
 
   const onClickItem = React.useCallback(
     (e, open, item: BreadCrumb) => {
+      if (isLoading) return;
       onSelectBreadCrumb && onSelectBreadCrumb(item);
     },
-    [breadCrumbs]
+    [breadCrumbs, isLoading]
   );
 
   const calculateDisplayedItems = React.useCallback(
@@ -173,8 +178,9 @@ const BreadCrumbs = ({ breadCrumbs, onSelectBreadCrumb }: BreadCrumbsProps) => {
             noSelect
             truncate
             isCurrent={index === displayedItems.length - 1}
+            isLoading={isLoading}
             onClick={() => {
-              if (index === displayedItems.length - 1) return;
+              if (index === displayedItems.length - 1 || isLoading) return;
 
               onSelectBreadCrumb &&
                 onSelectBreadCrumb({