diff --git a/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewComponent.tsx b/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewComponent.tsx
index 14b169e64..387f902bb 100644
--- a/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewComponent.tsx
+++ b/packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewComponent.tsx
@@ -1,8 +1,8 @@
 import styled from 'styled-components';
 
 import { Section } from '../components/StyledComponents';
-import { CreateGroupModal, MODAL_BACKGROUND_TYPE } from "@pushprotocol/uiweb";
-import { ChatViewComponent } from '@pushprotocol/uiweb';
+import { CreateGroupModal, MODAL_BACKGROUND_TYPE, MODAL_POSITION_TYPE } from "@pushprotocol/uiweb";
+import { ChatView } from '@pushprotocol/uiweb';
 
 const ChatViewComponentTest = () => {
   const chatFilterList = [
@@ -13,14 +13,17 @@ const ChatViewComponentTest = () => {
   return (
     <div>
       <h2>Chat UI Test page</h2>
-      {/* <CreateGroupModal onClose={()=>{console.log('in close')}}  modalBackground={MODAL_BACKGROUND_TYPE.OVERLAY}/> */}
       <ChatViewComponentCard>
-        <ChatViewComponent 
+      <CreateGroupModal onClose={()=>{console.log('in close')}}  modalBackground={MODAL_BACKGROUND_TYPE.OVERLAY} modalPositionType={MODAL_POSITION_TYPE.RELATIVE}/>
+
+        <ChatView 
         onVerificationFail={() => console.log("BOIIII RETURNNNSSSSS")} 
         chatId='4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68' 
         limit={10}
          isConnected={true} 
          groupInfoModalBackground={MODAL_BACKGROUND_TYPE.OVERLAY}
+         groupInfoModalPositionType={MODAL_POSITION_TYPE.RELATIVE}
+         verificationFailModalPosition={MODAL_POSITION_TYPE.RELATIVE}
          />
       </ChatViewComponentCard>
     </div>
@@ -30,7 +33,8 @@ const ChatViewComponentTest = () => {
 export default ChatViewComponentTest;
 
 const ChatViewComponentCard = styled(Section)`
-  height: 60vh;
+  height: 80vh;
+  position:relative;
 `;
 //c2d544ad9d1efd5c5a593b143bf8232875c926cf28015564e70ad078b95f807e
 //4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68
diff --git a/packages/examples/sdk-frontend-react/src/app/app.tsx b/packages/examples/sdk-frontend-react/src/app/app.tsx
index e77d430d0..e118af2ca 100644
--- a/packages/examples/sdk-frontend-react/src/app/app.tsx
+++ b/packages/examples/sdk-frontend-react/src/app/app.tsx
@@ -314,7 +314,7 @@ export function App() {
           <Web3Context.Provider value={{ account, active, library, chainId }}>
             <SocketContext.Provider value={socketData}>
               <AccountContext.Provider value={{ pgpPrivateKey, setSpaceId }}>
-                <ChatUIProvider  env={env} theme={lightChatTheme} account={account} pgpPrivateKey={pgpPrivateKey} signer={signer}>
+                <ChatUIProvider  env={env} theme={lightChatTheme} >
                   <SpacesUIProvider spaceUI={spaceUI} theme={customDarkTheme}>
                     <Routes>
                       <Route
diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx
index b6366291b..4cb80bc97 100644
--- a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx
+++ b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx
@@ -24,7 +24,9 @@ import {
   IChatProfile,
   IChatTheme,
   MODAL_BACKGROUND_TYPE,
+  MODAL_POSITION_TYPE,
   ModalBackgroundType,
+  ModalPositionType,
 } from '../exportedTypes';
 import { InfuraAPIKey, allowedNetworks, device } from '../../../config';
 import { resolveNewEns, shortenText } from '../../../helpers';
@@ -67,42 +69,40 @@ const Options = ({
 
   if (groupInfo && isGroup) {
     return (
+      <ImageItem onClick={() => setOptions(true)}>
+        <Image
+          src={VerticalEllipsisIcon}
+          height="21px"
+          maxHeight="32px"
+          width={'auto'}
+          cursor="pointer"
+        />
 
-        <ImageItem onClick={() => setOptions(true)}>
-          <Image
-            src={VerticalEllipsisIcon}
-            height="21px"
-            maxHeight="32px"
-            width={'auto'}
-            cursor="pointer"
-          />
-
-          {options && (
-            <DropDownBar theme={theme} ref={DropdownRef}>
-              <DropDownItem cursor="pointer" onClick={ShowModal}>
-                <Image
-                  src={InfoIcon}
-                  height="21px"
-                  maxHeight="21px"
-                  width={'auto'}
-                  cursor="pointer"
-                />
-
-                <TextItem cursor="pointer">Group Info</TextItem>
-              </DropDownItem>
-            </DropDownBar>
-          )}
-          {modal && (
-            <GroupInfoModal
-              theme={theme}
-              setModal={setModal}
-              groupInfo={groupInfo}
-              setGroupInfo={setGroupInfo}
-              groupInfoModalBackground={groupInfoModalBackground}
-            />
-          )}
-        </ImageItem>
+        {options && (
+          <DropDownBar theme={theme} ref={DropdownRef}>
+            <DropDownItem cursor="pointer" onClick={ShowModal}>
+              <Image
+                src={InfoIcon}
+                height="21px"
+                maxHeight="21px"
+                width={'auto'}
+                cursor="pointer"
+              />
 
+              <TextItem cursor="pointer">Group Info</TextItem>
+            </DropDownItem>
+          </DropDownBar>
+        )}
+        {modal && (
+          <GroupInfoModal
+            theme={theme}
+            setModal={setModal}
+            groupInfo={groupInfo}
+            setGroupInfo={setGroupInfo}
+            groupInfoModalBackground={groupInfoModalBackground}
+          />
+        )}
+      </ImageItem>
     );
   } else {
     return null;
@@ -113,6 +113,7 @@ export const ChatProfile: React.FC<IChatProfile> = ({
   chatId,
   style,
   groupInfoModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
+  groupInfoModalPositionType = MODAL_POSITION_TYPE.GLOBAL,
 }) => {
   const theme = useContext(ThemeContext);
   const { account, env } = useChatData();
@@ -127,6 +128,16 @@ export const ChatProfile: React.FC<IChatProfile> = ({
   const isMobile = useMediaQuery(device.tablet);
   const l1ChainId = allowedNetworks[env].includes(1) ? 1 : 5;
   const provider = new ethers.providers.InfuraProvider(l1ChainId, InfuraAPIKey);
+  const DropdownRef = useRef(null);
+  const [modal, setModal] = useState(false);
+
+  useClickAway(DropdownRef, () => {
+    setOptions(false);
+  });
+
+  const ShowModal = () => {
+    setModal(true);
+  };
 
   const fetchProfileData = async () => {
     if (isValidETHAddress(chatId)) {
@@ -176,19 +187,18 @@ export const ChatProfile: React.FC<IChatProfile> = ({
 
   if (chatId && style === 'Info') {
     return (
-      <Container theme={theme}  >
+      <Container theme={theme}>
         <ProfileContainer
           theme={theme}
           member={{ wallet: getProfileName() as string, image: getImage() }}
           customStyle={{ fontSize: '17px' }}
         />
         <Section
-          zIndex="300"
+          zIndex="unset"
           flexDirection="row"
           gap="10px"
           margin="0 20px 0 auto"
           alignSelf="center"
-      
         >
           {(groupInfo?.rules?.chat?.conditions ||
             groupInfo?.rules?.entry?.conditions) && <TokenGatedSvg />}
@@ -201,7 +211,35 @@ export const ChatProfile: React.FC<IChatProfile> = ({
             />
           )}
 
-          <Options
+          {!!groupInfo && isGroup && (
+            <ImageItem onClick={() => setOptions(true)}>
+              <Image
+                src={VerticalEllipsisIcon}
+                height="21px"
+                maxHeight="32px"
+                width={'auto'}
+                cursor="pointer"
+              />
+
+              {options && (
+                <DropDownBar theme={theme} ref={DropdownRef}>
+                  <DropDownItem cursor="pointer" onClick={ShowModal}>
+                    <Image
+                      src={InfoIcon}
+                      height="21px"
+                      maxHeight="21px"
+                      width={'auto'}
+                      cursor="pointer"
+                    />
+
+                    <TextItem cursor="pointer">Group Info</TextItem>
+                  </DropDownItem>
+                </DropDownBar>
+              )}
+            </ImageItem>
+          )}
+         
+          {/* <Options
             options={options}
             setOptions={setOptions}
             isGroup={isGroup}
@@ -209,8 +247,18 @@ export const ChatProfile: React.FC<IChatProfile> = ({
             setGroupInfo={setGroupInfo}
             theme={theme}
             groupInfoModalBackground={groupInfoModalBackground}
-          />
+          /> */}
         </Section>
+        {modal && (
+            <GroupInfoModal
+              theme={theme}
+              setModal={setModal}
+              groupInfo={groupInfo!}
+              setGroupInfo={setGroupInfo}
+              groupInfoModalBackground={groupInfoModalBackground}
+              groupInfoModalPositionType={groupInfoModalPositionType}
+            />
+          )}
         {/* {!isGroup && 
                     <VideoChatSection>
                         <Image src={VideoChatIcon} height="18px" maxHeight="18px" width={'auto'} />
diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/GroupInfoModal.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/GroupInfoModal.tsx
index af4db3ba1..855e1e70b 100644
--- a/packages/uiweb/src/lib/components/chat/ChatProfile/GroupInfoModal.tsx
+++ b/packages/uiweb/src/lib/components/chat/ChatProfile/GroupInfoModal.tsx
@@ -35,7 +35,7 @@ import { copyToClipboard, shortenText } from '../../../helpers';
 import ConditionsComponent from '../CreateGroup/ConditionsComponent';
 import { ACCESS_TYPE_TITLE, OPERATOR_OPTIONS_INFO } from '../constants';
 import { getRuleInfo } from '../helpers/getRulesToCondtionArray';
-import { MODAL_BACKGROUND_TYPE, ModalBackgroundType } from '../exportedTypes';
+import { MODAL_BACKGROUND_TYPE, MODAL_POSITION_TYPE, ModalBackgroundType, ModalPositionType } from '../exportedTypes';
 import { TokenGatedSvg } from '../../../icons/TokenGatedSvg';
 
 const UPDATE_KEYS = {
@@ -315,6 +315,7 @@ type GroupInfoModalProps = {
   groupInfo: IGroup;
   setGroupInfo: React.Dispatch<React.SetStateAction<IGroup | null | undefined>>;
   groupInfoModalBackground?: ModalBackgroundType;
+  groupInfoModalPositionType?: ModalPositionType;
 };
 
 export const GROUPINFO_STEPS = {
@@ -578,6 +579,7 @@ export const GroupInfoModal = ({
   groupInfo,
   setGroupInfo,
   groupInfoModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
+  groupInfoModalPositionType = MODAL_POSITION_TYPE.GLOBAL,
 }: GroupInfoModalProps) => {
   const [activeComponent, setActiveComponent] = useState<GROUP_INFO_TYPE>(
     GROUPINFO_STEPS.GROUP_INFO
@@ -738,6 +740,7 @@ export const GroupInfoModal = ({
       <Modal
         clickawayClose={onClose}
         modalBackground={groupInfoModalBackground}
+        modalPositionType={groupInfoModalPositionType}
       >
         {!showAddMoreWalletModal && (
           <Section
diff --git a/packages/uiweb/src/lib/components/chat/ChatViewComponent/ChatViewComponent.tsx b/packages/uiweb/src/lib/components/chat/ChatViewComponent/ChatViewComponent.tsx
index 2b624439e..09cf1366f 100644
--- a/packages/uiweb/src/lib/components/chat/ChatViewComponent/ChatViewComponent.tsx
+++ b/packages/uiweb/src/lib/components/chat/ChatViewComponent/ChatViewComponent.tsx
@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { IChatTheme, IChatViewComponentProps, MODAL_BACKGROUND_TYPE } from '../exportedTypes';
+import { IChatTheme, IChatViewComponentProps, MODAL_BACKGROUND_TYPE, MODAL_POSITION_TYPE } from '../exportedTypes';
 
 import { Section, Span } from '../../reusables';
 import { ChatViewList } from '../ChatViewList';
@@ -36,7 +36,10 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (
     isConnected = true,
     autoConnect = false,
     onVerificationFail,
-    groupInfoModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY
+    groupInfoModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
+    groupInfoModalPositionType =  MODAL_POSITION_TYPE.GLOBAL,
+    verificationFailModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
+    verificationFailModalPosition = MODAL_POSITION_TYPE.GLOBAL,
   } = options || {};
 
   const { env, signer, account, pgpPrivateKey } = useChatData();
@@ -59,7 +62,7 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (
       padding="13px"
       theme={theme}
     >
-      {chatProfile && <ChatProfile chatId={chatId} style="Info" groupInfoModalBackground={groupInfoModalBackground} />}
+      {chatProfile && <ChatProfile chatId={chatId} style="Info" groupInfoModalBackground={groupInfoModalBackground} groupInfoModalPositionType={groupInfoModalPositionType}/>}
       <Section
         flex="1 1 auto"
         overflow="hidden"
@@ -86,7 +89,7 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (
         </Section>
       )}
       {(messageInput && (!!signer || (!!account && !!pgpPrivateKey) || isConnected )) && (
-        <Section flex="0 1 auto">
+        <Section flex="0 1 auto" position='static'>
           <MessageInput
             onVerificationFail={onVerificationFail}
             chatId={chatId}
@@ -94,6 +97,8 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (
             emoji={emoji}
             gif={gif}
             isConnected={isConnected}
+            verificationFailModalBackground={verificationFailModalBackground}
+            verificationFailModalPosition={verificationFailModalPosition}
             autoConnect = {autoConnect}
           />
         </Section>
diff --git a/packages/uiweb/src/lib/components/chat/ChatViewComponent/index.ts b/packages/uiweb/src/lib/components/chat/ChatViewComponent/index.ts
index 25a649344..7d3f2796f 100644
--- a/packages/uiweb/src/lib/components/chat/ChatViewComponent/index.ts
+++ b/packages/uiweb/src/lib/components/chat/ChatViewComponent/index.ts
@@ -1 +1,2 @@
-export {ChatViewComponent} from './ChatViewComponent';
\ No newline at end of file
+export {ChatViewComponent} from './ChatViewComponent';
+export {ChatViewComponent as ChatView} from './ChatViewComponent';
\ No newline at end of file
diff --git a/packages/uiweb/src/lib/components/chat/ConnectButton/ConnectButton.tsx b/packages/uiweb/src/lib/components/chat/ConnectButton/ConnectButton.tsx
index d10d3c27e..05e415351 100644
--- a/packages/uiweb/src/lib/components/chat/ConnectButton/ConnectButton.tsx
+++ b/packages/uiweb/src/lib/components/chat/ConnectButton/ConnectButton.tsx
@@ -37,9 +37,6 @@ export const ConnectButtonSub = ({autoConnect = false})  => {
     setSigner,
   } = useChatData();
   const theme = useContext(ThemeContext);
-  const {fetchChatProfile} = useGetChatProfile();
-  const {creteChatProfile} = useCreateChatProfile();
-  const {decryptPGPKey} = useDecryptPGPKey();
 
 
   const setUserData = () => {
@@ -54,7 +51,6 @@ export const ConnectButtonSub = ({autoConnect = false})  => {
     } else if (!wallet) {
       setAccount('')
       setSigner(undefined)
-      setPgpPrivateKey(null)
     }
   }
   useEffect(() => {
@@ -63,37 +59,7 @@ export const ConnectButtonSub = ({autoConnect = false})  => {
     setUserData()
   }, [wallet])
 
-  useEffect(() => {
-    (async () => {
-      if (account && signer) {
-        if (!pgpPrivateKey) await handleUserCreation();
-      }
-    })();
-  }, [account, signer]);
-
 
-  const handleUserCreation = async () => {
-    if (!account && !env) return;
-    try {
-      let user  = await fetchChatProfile({ profileId: account! ,env});
-      if (!user) {
-        if (!signer) return;
-        user = await creteChatProfile({ signer: signer ,env});
-      }
-      if (user?.encryptedPrivateKey && !pgpPrivateKey) {
-        const decryptPgpKey = await decryptPGPKey({
-          encryptedPrivateKey: user.encryptedPrivateKey,
-          account: account!,
-          signer: signer,
-          env: env,
-        });
-        if(decryptPgpKey)
-        setPgpPrivateKey(decryptPgpKey);
-      }
-    } catch (e: any) {
-      console.log(e);
-    }
-  };
   return !signer ? (
     <ConnectButtonDiv theme={theme}>
       <button onClick={() => (wallet ? disconnect(wallet) : connect())}>{connecting ? 'connecting' : wallet ? 'disconnect' : 'Connect Wallet'}</button>
diff --git a/packages/uiweb/src/lib/components/chat/CreateGroup/AddCriteria.tsx b/packages/uiweb/src/lib/components/chat/CreateGroup/AddCriteria.tsx
index 7174567f8..354e0dfce 100644
--- a/packages/uiweb/src/lib/components/chat/CreateGroup/AddCriteria.tsx
+++ b/packages/uiweb/src/lib/components/chat/CreateGroup/AddCriteria.tsx
@@ -22,6 +22,7 @@ import OptionButtons from '../reusables/OptionButtons';
 
 import EthereumSvg from '../../../icons/ethereum.svg';
 import PolygonSvg from '../../../icons/polygon.svg';
+import ArbitrumSvg from '../../../icons/arbitrum.svg';
 import BSCSvg from '../../../icons/bsc.svg';
 import OptimismSvg from '../../../icons/optimisim.svg';
 import { BLOCKCHAIN_NETWORK, device } from '../../../config';
@@ -233,6 +234,13 @@ const AddCriteria = ({
       icon: OptimismSvg,
       function: () => setSelectedChainValue(3),
     },
+    {
+      id: 4,
+      value: BLOCKCHAIN_NETWORK[env].ARBITRUM,
+      title: 'Arbitrim',
+      icon: ArbitrumSvg,
+      function: () => setSelectedChainValue(4),
+    },
   ];
 
   const onQuantityChange = (e: any) => {
diff --git a/packages/uiweb/src/lib/components/chat/CreateGroup/ConditionsComponent.tsx b/packages/uiweb/src/lib/components/chat/CreateGroup/ConditionsComponent.tsx
index 2a180aa5f..6b960d7ae 100644
--- a/packages/uiweb/src/lib/components/chat/CreateGroup/ConditionsComponent.tsx
+++ b/packages/uiweb/src/lib/components/chat/CreateGroup/ConditionsComponent.tsx
@@ -8,12 +8,18 @@ import { ThemeContext } from '../theme/ThemeProvider';
 import Dropdown, { DropdownValueType } from '../reusables/DropDown';
 import { ConditionArray, ConditionData, IChatTheme } from '../exportedTypes';
 import { useClickAway, useTokenSymbolLoader } from '../../../hooks';
-import { CATEGORY, CRITERIA_TYPE, CriteriaType, PushData, TOKEN_NFT_COMPARISION, TokenNftComparision } from '../types';
+import {
+  CATEGORY,
+  CRITERIA_TYPE,
+  CriteriaType,
+  TOKEN_NFT_COMPARISION,
+  TokenNftComparision,
+} from '../types';
 
 import EditSvg from '../../../icons/EditSvg.svg';
 import RemoveSvg from '../../../icons/RemoveSvg.svg';
 import { shortenText } from '../../../helpers';
-import { GUILD_COMPARISON_OPTIONS } from '../constants';
+import { GUILD_COMPARISON_OPTIONS, NETWORK_ICON_DETAILS } from '../constants';
 
 export type CriteraValueType = {
   invertedIcon?: any;
@@ -54,8 +60,12 @@ const MoreOptionsContainer = ({
 
   useClickAway(dropdownRef, () => setSelectedIndex(null));
   return (
-    <Section onClick={() => handleMoreOptionsClick(row, col)}  position='static'>
-      <MoreDarkIcon color={theme.iconColor?.groupSettings} width='24' height='24'/>
+    <Section onClick={() => handleMoreOptionsClick(row, col)} position="static">
+      <MoreDarkIcon
+        color={theme.iconColor?.groupSettings}
+        width="24"
+        height="24"
+      />
       {selectedIndex?.length && selectedIndex[0] === row && (
         <DropdownContainer ref={dropdownRef} theme={theme}>
           <Dropdown
@@ -85,19 +95,18 @@ const CriteriaSection = ({ criteria }: { criteria: ConditionData }) => {
     return false;
   };
 
-  const getGuildRole  = () =>{
-    if(!criteria?.data?.['comparison'])
-    {
+  const getGuildRole = () => {
+    if (!criteria?.data?.['comparison']) {
       return 'SPECIFIC';
     }
-    return (GUILD_COMPARISON_OPTIONS.find(option => option.value === criteria?.data?.['comparison']))?.heading;
- 
-  }
-
-  const [tokenSymbol,] = useTokenSymbolLoader(criteria)
+    return GUILD_COMPARISON_OPTIONS.find(
+      (option) => option.value === criteria?.data?.['comparison']
+    )?.heading;
+  };
 
+  const [tokenSymbol] = useTokenSymbolLoader(criteria);
   return (
-    <Section gap="8px">
+    <Section gap="8px" width="100%">
       <Span
         alignSelf="center"
         background={theme.backgroundColor?.criteriaLabelBackground}
@@ -109,13 +118,27 @@ const CriteriaSection = ({ criteria }: { criteria: ConditionData }) => {
         {CRITERIA_TYPE[criteria.category as CriteriaType]}
       </Span>
       {checkIfNftToken() && (
-        <Span fontWeight="700" color={theme.textColor?.modalHeadingText}>
-          <Span fontWeight="500" color={theme.textColor?.modalSubHeadingText}>
-            {getTokenNftComparisionLabel()}{' '}
+        <Section
+          width="100%"
+          justifyContent="space-between"
+          alignItems="center"
+        >
+          <Span fontWeight="700" color={theme.textColor?.modalHeadingText}>
+            <Span fontWeight="500" color={theme.textColor?.modalSubHeadingText}>
+              {getTokenNftComparisionLabel()}{' '}
+            </Span>
+            {criteria?.data?.['amount']} {tokenSymbol}
           </Span>
-          {/* need to fetch token symbol */}
-          {criteria?.data?.['amount']} {tokenSymbol}
-        </Span>
+          <ChainIconSVG padding="0 6px 0 0" >
+            {
+              NETWORK_ICON_DETAILS[
+                criteria?.data?.['contract'].split(
+                  ':'
+                )[1] as keyof typeof NETWORK_ICON_DETAILS
+              ].icon
+            }
+          </ChainIconSVG>
+        </Section>
       )}
       {criteria.category === CATEGORY.INVITE && (
         <Span fontWeight="500" color={theme.textColor?.modalSubHeadingText}>
@@ -128,17 +151,17 @@ const CriteriaSection = ({ criteria }: { criteria: ConditionData }) => {
           fontSize="14px"
           color={theme.textColor?.modalSubHeadingText}
         >
-          {shortenText(criteria.data?.['url'],30)}
+          {shortenText(criteria.data?.['url'], 30)}
         </Span>
       )}
-         {criteria.category === CATEGORY.ROLES && (
-        <Span fontWeight="700" color={theme.textColor?.modalHeadingText}> 
-        {criteria?.data?.['id']} {' '}
-        <Span fontWeight="500" color={theme.textColor?.modalSubHeadingText}>
-         with {' '}
+      {criteria.category === CATEGORY.ROLES && (
+        <Span fontWeight="700" color={theme.textColor?.modalHeadingText}>
+          {criteria?.data?.['id']}{' '}
+          <Span fontWeight="500" color={theme.textColor?.modalSubHeadingText}>
+            with{' '}
+          </Span>
+          {getGuildRole()} role
         </Span>
-        {getGuildRole()} role
-      </Span>
       )}
     </Section>
   );
@@ -198,7 +221,7 @@ const ConditionsComponent = ({
     <Section flexDirection="column" width="100%" height="100%">
       {conditionData &&
         conditionData.slice(1).map((criteria, row) => (
-          <Section flexDirection="column"  >
+          <Section flexDirection="column">
             {criteria.length <= 2 &&
               criteria.length >= 1 &&
               criteria.map((singleCriteria, col) => (
@@ -259,8 +282,7 @@ const ConditionsComponent = ({
                     </>
                   ))}
                 </Section>
-                <Section 
-                >
+                <Section>
                   {criteria.map((singleCriteria) => (
                     <>
                       {criteria.length > 2 &&
@@ -326,3 +348,15 @@ const OperatorSpan = styled(Span)<{ theme: IChatTheme }>`
 const CriteriaGroup = styled(Section)<{ theme: IChatTheme }>`
   border: ${(props) => props.theme.border?.modalInnerComponents};
 `;
+
+const ChainIconSVG = styled(Section)`
+  width: 20px;
+  height: 20px;
+
+  svg,
+  svg image,
+  img {
+    width: 100%;
+    height: 100%;
+  }
+`;
diff --git a/packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx b/packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx
index 023358f93..5c7252688 100644
--- a/packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx
+++ b/packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx
@@ -13,7 +13,7 @@ import { Section, Span } from '../../reusables';
 import { Button } from '../reusables';
 import { CreateGroupType } from './CreateGroupType';
 import useToast from '../reusables/NewToast';
-import { CreateGroupModalProps, IChatTheme, MODAL_BACKGROUND_TYPE } from '../exportedTypes';
+import { CreateGroupModalProps, IChatTheme, MODAL_BACKGROUND_TYPE, MODAL_POSITION_TYPE } from '../exportedTypes';
 import useMediaQuery from '../../../hooks/useMediaQuery';
 import { DefineCondtion } from './DefineCondition';
 import AddCriteria from './AddCriteria';
@@ -47,7 +47,8 @@ interface GroupInputDetailsType {
 
 export const CreateGroupModal: React.FC<CreateGroupModalProps> = ({
   onClose,
-  modalBackground = MODAL_BACKGROUND_TYPE.OVERLAY
+  modalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
+  modalPositionType = MODAL_POSITION_TYPE.GLOBAL
 }) => {
   const [activeComponent, setActiveComponent] = useState<CreateGroupStepKeys>(
     // replace it with info one
@@ -135,7 +136,7 @@ export const CreateGroupModal: React.FC<CreateGroupModalProps> = ({
   };
 
   return (
-    <Modal clickawayClose={onClose} modalBackground={modalBackground}>
+    <Modal clickawayClose={onClose} modalBackground={modalBackground} modalPositionType={modalPositionType}>
       {renderComponent()} <ToastContainer />
     </Modal>
   );
diff --git a/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx b/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx
index 285ca16c7..7cde4ab9d 100644
--- a/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx
+++ b/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx
@@ -39,7 +39,7 @@ import {
 } from '../../../hooks';
 
 import type { FileMessageContent, IGroup } from '../../../types';
-import { GIFType, IChatTheme, MessageInputProps } from '../exportedTypes';
+import { GIFType, IChatTheme, MODAL_BACKGROUND_TYPE, MODAL_POSITION_TYPE, MessageInputProps } from '../exportedTypes';
 import { PUBLIC_GOOGLE_TOKEN, device } from '../../../config';
 import { checkIfAccessVerifiedGroup, checkIfMember } from '../helpers';
 import { InfoContainer } from '../reusables';
@@ -84,6 +84,8 @@ export const MessageInput: React.FC<MessageInputProps> = ({
   file = true,
   isConnected = true,
   autoConnect = false,
+  verificationFailModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
+  verificationFailModalPosition = MODAL_POSITION_TYPE.GLOBAL,
   onVerificationFail,
 }) => {
   const [typedMessage, setTypedMessage] = useState<string>('');
@@ -375,23 +377,19 @@ export const MessageInput: React.FC<MessageInputProps> = ({
     }
   };
 
-  return !Object.keys(chatFeed || {}).length ? (
-    <>
-      {!pgpPrivateKey && (isConnected || !!signer) && (
-        <TypebarSection
-          width="100%"
-          overflow="hidden"
-          borderRadius="13px"
-          position="static"
-          padding={` ${pgpPrivateKey ? '13px 16px' : ''}`}
-          background={`${theme.backgroundColor?.messageInputBackground}`}
-          alignItems="center"
-          justifyContent="space-between"
-        >
-          <ConnectButtonSection autoConnect={autoConnect} />
-        </TypebarSection>
-      )}
-    </>
+  return !(pgpPrivateKey && account) && isConnected ? (
+    <TypebarSection
+      width="100%"
+      overflow="hidden"
+      borderRadius="13px"
+      position="static"
+      padding={` ${pgpPrivateKey ? '13px 16px' : ''}`}
+      background={`${theme.backgroundColor?.messageInputBackground}`}
+      alignItems="center"
+      justifyContent="space-between"
+    >
+      <ConnectButtonSection autoConnect={autoConnect} />
+    </TypebarSection>
   ) : !checkIfIntent({ chat: chatFeed, account: account! }) &&
     Object.keys(chatFeed || {}).length ? (
     <TypebarSection
@@ -471,7 +469,7 @@ export const MessageInput: React.FC<MessageInputProps> = ({
             </Section>
           )}
           {!!pgpPrivateKey && !verificationSuccessfull && (
-            <Modal width="550px">
+            <Modal width="550px" modalBackground={verificationFailModalBackground} modalPositionType={verificationFailModalPosition}>
               <Section
                 margin="5px 0px 0px 0px"
                 gap="16px"
@@ -484,7 +482,7 @@ export const MessageInput: React.FC<MessageInputProps> = ({
                   groupInfo={chatFeed?.groupInformation}
                   subheader="Please make sure the following conditions
                    are met to pariticpate and send messages."
-                   alert={true}
+                  alert={true}
                 />
                 <ConnectWrapperClose
                   onClick={() => {
@@ -496,7 +494,10 @@ export const MessageInput: React.FC<MessageInputProps> = ({
                 >
                   <ConnectClose>Cancel</ConnectClose>
                 </ConnectWrapperClose>
-                <InfoContainer cta='https://push.org/docs/chat/build/conditional-rules-for-group/' label="Learn more about access gating rules" />
+                <InfoContainer
+                  cta="https://push.org/docs/chat/build/conditional-rules-for-group/"
+                  label="Learn more about access gating rules"
+                />
               </Section>
               {/* </Section> */}
             </Modal>
diff --git a/packages/uiweb/src/lib/components/chat/constants/chainDetails.tsx b/packages/uiweb/src/lib/components/chat/constants/chainDetails.tsx
new file mode 100644
index 000000000..fb9d4c21a
--- /dev/null
+++ b/packages/uiweb/src/lib/components/chat/constants/chainDetails.tsx
@@ -0,0 +1,70 @@
+
+import Tooltip from "../../tooltip";
+
+import { EthereumSvg } from '../../../icons/EthereumSvg';
+import { PolygonSvg } from "../../../icons/PolygonSvg";
+import { BSCSvg } from "../../../icons/BSCSvg";
+import { OptimismSvg } from "../../../icons/OptimismSvg";
+import { PolygonzkevmSvg } from "../../../icons/PolygonzkevmSvg";
+import { ArbitrumSvg } from "../../../icons/ArbitrumSvg"
+import React from "react";
+
+const createSVGIcon = (element:any, chainName: string) => {
+  return (
+    <Tooltip tooltipContent={`${chainName}`}>
+      {element}
+    </Tooltip>
+  );
+};
+
+export const NETWORK_ICON_DETAILS =  {
+  5: {
+    label: 'ETHEREUM GOERLI',
+    icon: createSVGIcon(<EthereumSvg/>, 'Ethereum Goerli'),
+  },
+  1: {
+    label: 'ETHEREUM MAINNET',
+    icon: createSVGIcon(<EthereumSvg/>, 'Ethereum Mainnet'),
+  },
+  80001: {
+    label: 'POLYGON MUMBAI',
+    icon: createSVGIcon(<PolygonSvg/>, 'Polygon Mumbai'),
+  },
+  137: {
+    label: 'POLYGON MAINNET',
+    icon: createSVGIcon(<PolygonSvg/>, 'Polygon Mainnet'),
+  },
+  97: {
+    label: 'BSC TESTNET',
+    icon: createSVGIcon(<BSCSvg/>, 'Bsc Testnet'),
+  },
+  56: {
+    label: 'BSC MAINNET',
+    icon: createSVGIcon(<BSCSvg/>, 'Bsc Mainnet'),
+  },
+  420: {
+    label: 'OPTIMISM TESTNET',
+    icon: createSVGIcon(<OptimismSvg/>, 'Optimism Testnet'),
+  },
+  10: {
+    label: 'OPTIMISM MAINNET',
+    icon: createSVGIcon(<OptimismSvg/>, 'Optimism Mainnet'),
+  },
+  1442: {
+    label: 'POLYGON ZK EVM TESTNET',
+    icon: createSVGIcon(<PolygonzkevmSvg/>, 'Polygon ZK EVM Testnet'),
+  },
+  1101: {
+    label: 'POLYGON ZK EVM MAINNET',
+    icon: createSVGIcon(<PolygonzkevmSvg/>, 'Polygon ZK EVM Mainnet'),
+  },
+
+  42161: {
+    label: 'ARBITRUMONE MAINNET',
+    icon: createSVGIcon(<ArbitrumSvg/>, 'Arbitrum Mainnet'),
+  },
+  421613: {
+    label: 'ARBITRUM TESTNET',
+    icon: createSVGIcon(<ArbitrumSvg/>, 'Arbitrum Testnet'),
+  },
+};
diff --git a/packages/uiweb/src/lib/components/chat/constants/index.ts b/packages/uiweb/src/lib/components/chat/constants/index.ts
index 4224f93ab..085844f58 100644
--- a/packages/uiweb/src/lib/components/chat/constants/index.ts
+++ b/packages/uiweb/src/lib/components/chat/constants/index.ts
@@ -53,4 +53,6 @@ export const ACCESS_TYPE_TITLE = {
     heading: 'Conditions to Chat',
     subHeading: 'Add a condition to join or leave it open for everyone',
   },
-};
\ No newline at end of file
+};
+
+export * from './chainDetails';
\ No newline at end of file
diff --git a/packages/uiweb/src/lib/components/chat/exportedTypes.ts b/packages/uiweb/src/lib/components/chat/exportedTypes.ts
index 6619e4ad4..dd4e7f7dc 100644
--- a/packages/uiweb/src/lib/components/chat/exportedTypes.ts
+++ b/packages/uiweb/src/lib/components/chat/exportedTypes.ts
@@ -21,6 +21,9 @@ export interface IChatViewComponentProps {
   isConnected?: boolean;
   autoConnect?:boolean;
   groupInfoModalBackground?: ModalBackgroundType;
+  groupInfoModalPositionType?: ModalPositionType;
+  verificationFailModalBackground?: ModalBackgroundType;
+  verificationFailModalPosition?: ModalPositionType;
   onVerificationFail?: () => void;
 }
 
@@ -28,6 +31,7 @@ export interface IChatProfile {
   chatId: string;
   style: "Info" | "Preview";
   groupInfoModalBackground?: ModalBackgroundType;
+  groupInfoModalPositionType?: ModalPositionType;
 }
 
 export interface TwitterFeedReturnType {
@@ -60,6 +64,8 @@ export interface MessageInputProps {
   file?: boolean;
   isConnected?: boolean;
   autoConnect?:boolean;
+  verificationFailModalBackground?: ModalBackgroundType;
+  verificationFailModalPosition?: ModalPositionType;
   onVerificationFail?: () => void;
 }
 
@@ -123,9 +129,17 @@ export const MODAL_BACKGROUND_TYPE = {
   } as const;
   
   export type ModalBackgroundType = keyof typeof MODAL_BACKGROUND_TYPE;
+
+  export const MODAL_POSITION_TYPE = {
+    RELATIVE:'RELATIVE',
+    GLOBAL: 'GLOBAL',
+    } as const;
+    
+  export type ModalPositionType = keyof typeof MODAL_POSITION_TYPE;
 export interface CreateGroupModalProps {
   onClose: ()=>void;
   modalBackground?: ModalBackgroundType;
+  modalPositionType?: ModalPositionType;
 };
 
 
diff --git a/packages/uiweb/src/lib/components/chat/reusables/Modal.tsx b/packages/uiweb/src/lib/components/chat/reusables/Modal.tsx
index c34d738ca..06cfecce2 100644
--- a/packages/uiweb/src/lib/components/chat/reusables/Modal.tsx
+++ b/packages/uiweb/src/lib/components/chat/reusables/Modal.tsx
@@ -13,7 +13,7 @@ import { IChatTheme } from '../theme';
 import { Section, Span, Image } from '../../reusables';
 import { BackIcon } from '../../../icons/Back';
 import CloseIcon from '../../../icons/close.svg';
-import { MODAL_BACKGROUND_TYPE, ModalBackgroundType } from '../exportedTypes';
+import { MODAL_BACKGROUND_TYPE, MODAL_POSITION_TYPE, ModalBackgroundType, ModalPositionType } from '../exportedTypes';
 import { device } from '../../../config';
 
 interface IModalProps {
@@ -22,6 +22,7 @@ interface IModalProps {
   children: any;
   theme?: IChatTheme;
   modalBackground?: ModalBackgroundType;
+  modalPositionType?: ModalPositionType;
 }
 
 interface IModalHeader {
@@ -51,10 +52,10 @@ const ClickawayCloseModal = ({
   );
 };
 
-export const Modal = ({ clickawayClose, children, width,modalBackground = MODAL_BACKGROUND_TYPE.OVERLAY }: IModalProps) => {
+export const Modal = ({ clickawayClose, children, width,modalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,modalPositionType = MODAL_POSITION_TYPE.GLOBAL }: IModalProps) => {
   const theme = useContext(ThemeContext);
   return (
-    <ModalOverlay theme={theme} modalBackground={modalBackground}>
+    <ModalOverlay theme={theme} modalBackground={modalBackground} modalPositionType={modalPositionType}>
       {clickawayClose ? (
         <ClickawayCloseModal clickawayClose={clickawayClose} width={width}>
           {children}
@@ -102,11 +103,11 @@ export const ModalHeader = ({
 };
 /* styling */
 
-const ModalOverlay = styled.div<IModalProps & {modalBackground:ModalBackgroundType}>`
-  position: fixed;
+const ModalOverlay = styled.div<IModalProps>`
+  position:${(props) =>  props.modalPositionType === MODAL_POSITION_TYPE.GLOBAL? 'fixed':'absolute'};
   top: 0;
   left: 0;
-  right: 0;
+  right: 0;  
   bottom: 0;
   width: 100%;
   height: 100%;
diff --git a/packages/uiweb/src/lib/config/constants.ts b/packages/uiweb/src/lib/config/constants.ts
index 6e92322db..b30e87737 100644
--- a/packages/uiweb/src/lib/config/constants.ts
+++ b/packages/uiweb/src/lib/config/constants.ts
@@ -42,12 +42,15 @@ export const CoreContractChainId = {
   local: 5,
 };
 
+
+
 const TESTNET_NETWORK = {
   ETHEREUM: 'eip155:5',
   POLYGON: 'eip155:80001',
   BSC: 'eip155:97',
   OPTIMISM: 'eip155:420',
   POLYGON_ZK_EVM: 'eip155:1442',
+  ARBITRUM:'eip155:421613'
 };
 const MAINET_NETWORK = {
   ETHEREUM: 'eip155:1',
@@ -55,6 +58,7 @@ const MAINET_NETWORK = {
   BSC: 'eip155:56',
   OPTIMISM: 'eip155:10',
   POLYGON_ZK_EVM: 'eip155:1101',
+  ARBITRUM:'eip155:42161'
 };
 
 export const BLOCKCHAIN_NETWORK = {
diff --git a/packages/uiweb/src/lib/dataProviders/ChatDataProvider.tsx b/packages/uiweb/src/lib/dataProviders/ChatDataProvider.tsx
index b5aa3d246..a6f969222 100644
--- a/packages/uiweb/src/lib/dataProviders/ChatDataProvider.tsx
+++ b/packages/uiweb/src/lib/dataProviders/ChatDataProvider.tsx
@@ -9,6 +9,8 @@ import useGetChatProfile from '../hooks/useGetChatProfile';
 import { IUser, SignerType } from '@pushprotocol/restapi';
 import { IChatTheme, lightChatTheme } from '../components/chat/theme';
 import { getAddressFromSigner, pCAIP10ToWallet } from '../helpers';
+import useCreateChatProfile from '../hooks/useCreateChatProfile';
+import useDecryptPGPKey from '../hooks/useDecryptPGPKey';
 
 
 export interface IChatUIProviderProps {
@@ -40,6 +42,8 @@ export const ChatUIProvider = ({
 
   const [isPushChatSocketConnected, setIsPushChatSocketConnected] =
   useState<boolean>(false);
+  const {createChatProfile} = useCreateChatProfile();
+  const {decryptPGPKey} = useDecryptPGPKey();
 
   useEffect(() => {
     (async()=>{
@@ -59,9 +63,40 @@ export const ChatUIProvider = ({
       setPgpPrivateKeyVal(pgpPrivateKey);
     })()
     
-  }, [env,account,pgpPrivateKey,signer])
+  }, [env,account,signer,pgpPrivateKey])
 
 
+  useEffect(() => {
+    (async () => {
+      if (accountVal && signerVal) {
+        if (!pgpPrivateKeyVal) await handleUserCreation();
+      }
+    })();
+  }, [accountVal, signerVal]);
+
+
+  const handleUserCreation = async () => {
+    if (!accountVal && !envVal) return;
+    try {
+      let user  = await fetchChatProfile({ profileId: accountVal! ,env:envVal});
+      if (!user) {
+        if (!signerVal) return;
+        user = await createChatProfile({ signer: signerVal ,env:envVal});
+      }
+      if (user?.encryptedPrivateKey && !pgpPrivateKey) {
+        const decryptedPgpKey = await decryptPGPKey({
+          encryptedPrivateKey: user.encryptedPrivateKey,
+          account: accountVal!,
+          signer: signerVal,
+          env: envVal,
+        });
+        if(decryptedPgpKey)
+        setPgpPrivateKeyVal(decryptedPgpKey);
+      }
+    } catch (e: any) {
+      console.log(e);
+    }
+  };
 
 
 
diff --git a/packages/uiweb/src/lib/hooks/useCreateChatProfile.ts b/packages/uiweb/src/lib/hooks/useCreateChatProfile.ts
index fea956c0e..15aa3d4fc 100644
--- a/packages/uiweb/src/lib/hooks/useCreateChatProfile.ts
+++ b/packages/uiweb/src/lib/hooks/useCreateChatProfile.ts
@@ -8,7 +8,7 @@ export interface CreateChatProfileParams {
 }
 
 const useCreateChatProfile = () => {
-  const creteChatProfile = useCallback(
+  const createChatProfile = useCallback(
     async ({
       signer,
       env
@@ -27,7 +27,7 @@ const useCreateChatProfile = () => {
     []
   );
 
-  return { creteChatProfile };
+  return { createChatProfile };
 };
 
 export default useCreateChatProfile;
diff --git a/packages/uiweb/src/lib/icons/arbitrum.svg b/packages/uiweb/src/lib/icons/arbitrum.svg
new file mode 100644
index 000000000..0fa71d8eb
--- /dev/null
+++ b/packages/uiweb/src/lib/icons/arbitrum.svg
@@ -0,0 +1,16 @@
+<svg
+    id="Layer_1"
+    xmlns="http://www.w3.org/2000/svg"
+  
+    viewBox="0 0 1080 1218.5"
+    xmlSpace="preserve"
+  >
+    <path
+      className="st0"
+      d="M541.8 76.4c2.9 0 5.8.8 8.4 2.3l446.1 259.5c5.2 3 8.4 8.6 8.3 14.5l-1.7 516.1c0 6-3.2 11.5-8.4 14.5l-447.8 256.6c-2.5 1.5-5.5 2.2-8.4 2.2-2.9 0-5.8-.8-8.4-2.3L83.8 880.3c-5.2-3-8.4-8.6-8.3-14.5l1.7-516.1c0-6 3.2-11.5 8.4-14.5L533.4 78.6c2.5-1.5 5.4-2.2 8.4-2.2M542 1c-15.9-.1-31.8 4-46.1 12.2L48.1 269.7c-28.6 16.4-46.2 46.7-46.4 79.7L0 865.5c-.1 32.9 17.4 63.4 45.8 80L491.9 1205c14.2 8.3 30.1 12.4 46.1 12.5 15.9.1 31.8-4 46.1-12.2l447.8-256.6c28.6-16.4 46.2-46.7 46.4-79.7l1.7-516c.1-32.9-17.4-63.4-45.8-80L588.1 13.5C573.8 5.2 557.9 1 542 1z"
+    />
+    <path
+      className="st0"
+      d="M632.4 282.3H567c-4.9 0-9.3 3.1-11 7.7L345.8 866.4c-1.4 3.8 1.4 7.8 5.5 7.8h65.4c4.9 0 9.3-3.1 11-7.7L638 290c1.2-3.7-1.6-7.7-5.6-7.7zm-114.4 0h-65.4c-4.9 0-9.3 3.1-11 7.7L231.4 866.4c-1.4 3.8 1.4 7.8 5.5 7.8h65.4c4.9 0 9.3-3.1 11-7.7L523.6 290c1.3-3.7-1.5-7.7-5.6-7.7zm84.7 223.5c-1.9-5.1-9.1-5.1-11 0l-34 93.2c-.9 2.6-.9 5.4 0 8l94.7 259.6c1.7 4.6 6.1 7.7 11 7.7h65.4c4.1 0 6.9-4 5.5-7.8L602.7 505.8zm245.9 360.6L659.9 349.1c-1.9-5.1-9.1-5.1-11 0l-34 93.2c-.9 2.6-.9 5.4 0 8l151.9 416.3c1.7 4.6 6.1 7.7 11 7.7h65.4c3.9-.1 6.8-4.1 5.4-7.9z"
+    />
+  </svg>
\ No newline at end of file