diff --git a/packages/uiweb/src/lib/components/space/SpaceFeed/SpaceFeed.tsx b/packages/uiweb/src/lib/components/space/SpaceFeed/SpaceFeed.tsx
index 485eff9b8..187b95df8 100644
--- a/packages/uiweb/src/lib/components/space/SpaceFeed/SpaceFeed.tsx
+++ b/packages/uiweb/src/lib/components/space/SpaceFeed/SpaceFeed.tsx
@@ -187,10 +187,10 @@ export const SpaceFeed: React.FC<ISpaceFeedProps> = ({
           padding: "10px",
         }}
       >
-      {orientation === OrientationEnums.Horizontal ? (
-        <Spaces orientation={orientation}>
-          {orientation === OrientationEnums.Horizontal
-            ? mySpaces &&
+        {orientation === OrientationEnums.Horizontal ? (
+          <Spaces orientation={orientation}>
+            {orientation === OrientationEnums.Horizontal
+              ? mySpaces &&
               mySpaces.apiData?.map((space: SpaceIFeeds) => {
                 return (
                   <SpaceBanner
@@ -202,7 +202,7 @@ export const SpaceFeed: React.FC<ISpaceFeedProps> = ({
                   />
                 );
               })
-            : mySpaces &&
+              : mySpaces &&
               mySpaces.apiData?.map((space: SpaceIFeeds) => {
                 return (
                   <SpaceBanner
@@ -214,23 +214,23 @@ export const SpaceFeed: React.FC<ISpaceFeedProps> = ({
                   />
                 );
               })}
-        </Spaces>
-      ) : (
-        <>
-          <Navigation showTabs={showTabs} width={width} showFilter={showFilter}>
-            <NavButtonWrapper>
-              {sortingOrder.map((tabName: TabsValues) => {
-                return (
-                  <NavButton
-                    active={selectedFeedTab === FeedTabs[tabName]}
-                    onClick={() => setSelectedFeedTab(FeedTabs[tabName])}
-                  >
-                    {FeedTabs[tabName]}
-                  </NavButton>
-                );
-              })}
-            </NavButtonWrapper>
-          </Navigation>
+          </Spaces>
+        ) : (
+          <>
+            <Navigation showTabs={showTabs} width={width} showFilter={showFilter}>
+              <NavButtonWrapper>
+                {sortingOrder.map((tabName: TabsValues) => {
+                  return (
+                    <NavButton
+                      active={selectedFeedTab === FeedTabs[tabName]}
+                      onClick={() => setSelectedFeedTab(FeedTabs[tabName])}
+                    >
+                      {FeedTabs[tabName]}
+                    </NavButton>
+                  );
+                })}
+              </NavButtonWrapper>
+            </Navigation>
             <Filter showFilter={showFilter}>
               <FilterButton
                 active={filterTab === FilterEnums.All}
@@ -339,6 +339,7 @@ export const SpaceFeed: React.FC<ISpaceFeedProps> = ({
                   </Spaces>
                 )}
                 {loading && <Spinner size="40" />}
+
               </Container>
             </ScrollContainer>
           </>
diff --git a/packages/uiweb/src/lib/components/space/SpaceWidget/LiveSpaceProfileContainer.tsx b/packages/uiweb/src/lib/components/space/SpaceWidget/LiveSpaceProfileContainer.tsx
index 0c5205658..206856d29 100644
--- a/packages/uiweb/src/lib/components/space/SpaceWidget/LiveSpaceProfileContainer.tsx
+++ b/packages/uiweb/src/lib/components/space/SpaceWidget/LiveSpaceProfileContainer.tsx
@@ -41,7 +41,7 @@ export const LiveSpaceProfileContainer = (
 
   const {
     spacesObjectRef,
-} = useSpaceData();
+  } = useSpaceData();
 
   const handleDDState = () => {
     setIsDDOpen(!isDDOpen);
@@ -49,21 +49,21 @@ export const LiveSpaceProfileContainer = (
 
   const inviteListener = async () => {
     await spacesObjectRef?.current?.inviteToPromote?.({ role: 'SPEAKER', inviteeAddress: pCAIP10ToWallet(wallet) })
-}
+  }
 
   useEffect(() => {
     const handleOutsideClick = (event: any) => {
-        if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-            setIsDDOpen(false);
-        }
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+        setIsDDOpen(false);
+      }
     };
 
     document.addEventListener('mousedown', handleOutsideClick);
 
     return () => {
-        document.removeEventListener('mousedown', handleOutsideClick);
+      document.removeEventListener('mousedown', handleOutsideClick);
     };
-}, []);
+  }, []);
 
   return (
     <ThemeProvider theme={theme}>
@@ -82,7 +82,7 @@ export const LiveSpaceProfileContainer = (
           cursor='pointer'
           onClick={handleDDState}
         />
-        <Text fontSize={'16px'} marginTop={'12px'} fontWeight={600}  color={`${theme.textColorPrimary}`}>
+        <Text fontSize={'16px'} marginTop={'12px'} fontWeight={600} color={`${theme.textColorPrimary}`}>
           {wallet.replace('eip155:', '').slice(0, -36) + '...'}
           {stream && <VideoPlayer videoCallData={stream} />}
         </Text>
@@ -127,13 +127,13 @@ export const LiveSpaceProfileContainer = (
         )}
       </Item>
 
-      {/* {isDDOpen ? (
+      {isDDOpen ? (
         <DropDown theme={theme} ref={dropdownRef} isDDOpen={isDDOpen}>
           <DDItem onClick={inviteListener}>Invite to Speak</DDItem>
-          <DDItem>Kick Listener</DDItem>
-          <DDItem>Mute</DDItem>
+          {/* <DDItem>Mute</DDItem>
+          <DDItem>Kick Listener</DDItem> */}
         </DropDown>
-      ) : null} */}
+      ) : null}
     </ThemeProvider>
   );
 };
diff --git a/packages/uiweb/src/lib/components/space/SpaceWidget/LiveWidgetContent.tsx b/packages/uiweb/src/lib/components/space/SpaceWidget/LiveWidgetContent.tsx
index 33e1a00cb..a79538d64 100644
--- a/packages/uiweb/src/lib/components/space/SpaceWidget/LiveWidgetContent.tsx
+++ b/packages/uiweb/src/lib/components/space/SpaceWidget/LiveWidgetContent.tsx
@@ -16,6 +16,7 @@ import { Button, Image, Item, Text } from '../../../config';
 import MicOnIcon from '../../../icons/micon.svg';
 import MicEngagedIcon from '../../../icons/MicEngage.svg';
 import MuteIcon from '../../../icons/Muted.svg';
+import HandIcon from '../../../icons/hand.svg';
 import ShareIcon from '../../../icons/Share.svg';
 import MembersIcon from '../../../icons/Members.svg';
 import { useSpaceData } from '../../../hooks';
@@ -34,6 +35,7 @@ export const LiveWidgetContent: React.FC<LiveWidgetContentProps> = ({
   isHost,
   setSpaceStatusState,
 }) => {
+  console.log("🚀 ~ file: LiveWidgetContent.tsx:37 ~ spaceData:", spaceData)
   const [showMembersModal, setShowMembersModal] = useState<boolean>(false);
   const [playBackUrl, setPlayBackUrl] = useState<string>('');
   const [isLoading, setIsLoading] = useState<boolean>(false);
@@ -55,6 +57,7 @@ export const LiveWidgetContent: React.FC<LiveWidgetContentProps> = ({
     initSpaceObject,
     raisedHandInfo,
   } = useSpaceData();
+  console.log("🚀 ~ file: LiveWidgetContent.tsx:59 ~ spaceObjectData:", spaceObjectData)
 
   const isMicOn = spaceObjectData?.connectionData?.local?.audio;
 
@@ -210,95 +213,121 @@ export const LiveWidgetContent: React.FC<LiveWidgetContentProps> = ({
     <ThemeProvider theme={theme}>
       <Item
         flex={'1'}
-        display={'flex'}
+        display={'grid'}
+        gridTemplateColumns={'repeat(3, 1fr)'}
         padding={'16px 10px'}
         flexWrap={'wrap'}
         justifyContent={'flex-start'}
         gap={'24px 12px'}
         overflowY={'auto'}
+        overflowX={'hidden'}
         alignContent={'flex-start'}
       >
-        {/* local peer details if speaker or host */}
-        {(isSpeaker || isHost) && (
-          <LiveSpaceProfileContainer
-            isHost={isHost}
-            isSpeaker={isSpeaker}
-            wallet={spaceObjectData?.connectionData?.local?.address}
-            image={createBlockie?.(
-              spaceObjectData?.connectionData?.local?.address
-            )
-              ?.toDataURL()
-              ?.toString()}
-          />
-        )}
-
-        {/* details of peer connected via webRTC if speaker or host */}
-        {(isSpeaker || isHost) &&
-          spaceObjectData?.connectionData?.incoming
-            ?.slice(1)
-            .map((profile) => (
-              <LiveSpaceProfileContainer
-                isHost={
-                  profile?.address ===
-                  pCAIP10ToWallet(spaceObjectData?.spaceCreator)
-                }
-                isSpeaker={
-                  profile?.address !==
-                  pCAIP10ToWallet(spaceObjectData?.spaceCreator)
-                }
-                wallet={profile?.address}
-                image={createBlockie?.(profile?.address)
-                  ?.toDataURL()
-                  ?.toString()}
-                stream={profile?.stream}
-              />
-            ))}
-
-        {/* details of host in the space if listener */}
-        {isListener && !isHost && (
-          <div style={{ position: 'relative' }}>
-            <LiveSpaceProfileContainer
-              isHost={true}
-              isSpeaker={false}
-              wallet={spaceObjectData?.liveSpaceData.host?.address}
-              image={createBlockie?.(
-                spaceObjectData?.liveSpaceData?.host?.address
-              )
-                ?.toDataURL()
-                ?.toString()}
-            />
-          </div>
-        )}
 
-        {/* details of speakers in the space if listener */}
-        {isListener &&
-          !isHost &&
-          spaceObjectData?.liveSpaceData.speakers.map((profile) => (
-            <div style={{ position: 'relative' }}>
-              <LiveSpaceProfileContainer
-                isHost={false}
-                isSpeaker={true}
-                wallet={profile?.address}
-                image={createBlockie?.(profile?.address)
-                  ?.toDataURL()
-                  ?.toString()}
-              />
-            </div>
-          ))}
-
-        {/* details of listeners */}
-        {spaceObjectData?.liveSpaceData.listeners.map((profile) => (
-          <div style={{ position: 'relative' }}>
-            <LiveSpaceProfileContainer
-              isHost={false}
-              isSpeaker={false}
-              requested={profile.handRaised}
-              wallet={profile?.address}
-              image={createBlockie?.(profile?.address)?.toDataURL()?.toString()}
-            />
-          </div>
-        ))}
+        {
+          isJoined
+            ?
+            <>
+              {/* local peer details if speaker or host */}
+              {(isSpeaker || isHost) && (
+                <div style={{ position: 'relative' }}>
+                  <LiveSpaceProfileContainer
+                    isHost={isHost}
+                    isSpeaker={isSpeaker}
+                    wallet={spaceObjectData?.connectionData?.local?.address}
+                    image={createBlockie?.(
+                      spaceObjectData?.connectionData?.local?.address
+                    )
+                      ?.toDataURL()
+                      ?.toString()}
+                  />
+                </div>
+              )}
+
+              {/* details of peer connected via webRTC if speaker or host */}
+              {(isSpeaker || isHost) &&
+                spaceObjectData?.connectionData?.incoming
+                  ?.slice(1)
+                  .map((profile) => (
+                    <div style={{ position: 'relative' }}>
+                      <LiveSpaceProfileContainer
+                        isHost={
+                          profile?.address ===
+                          pCAIP10ToWallet(spaceObjectData?.spaceCreator)
+                        }
+                        isSpeaker={
+                          profile?.address !==
+                          pCAIP10ToWallet(spaceObjectData?.spaceCreator)
+                        }
+                        wallet={profile?.address}
+                        image={createBlockie?.(profile?.address)
+                          ?.toDataURL()
+                          ?.toString()}
+                        stream={profile?.stream}
+                      />
+                    </div>
+                  ))}
+
+              {/* details of host in the space if listener */}
+              {isListener && !isHost && (
+                <div style={{ position: 'relative' }}>
+                  <LiveSpaceProfileContainer
+                    isHost={true}
+                    isSpeaker={false}
+                    wallet={spaceObjectData?.liveSpaceData.host?.address}
+                    image={createBlockie?.(
+                      spaceObjectData?.liveSpaceData?.host?.address
+                    )
+                      ?.toDataURL()
+                      ?.toString()}
+                  />
+                </div>
+              )}
+
+              {/* details of speakers in the space if listener */}
+              {isListener &&
+                !isHost &&
+                spaceObjectData?.liveSpaceData.speakers.map((profile) => (
+                  <div style={{ position: 'relative' }}>
+                    <LiveSpaceProfileContainer
+                      isHost={false}
+                      isSpeaker={true}
+                      wallet={profile?.address}
+                      image={createBlockie?.(profile?.address)
+                        ?.toDataURL()
+                        ?.toString()}
+                    />
+                  </div>
+                ))}
+
+              {/* details of listeners */}
+              {spaceObjectData?.liveSpaceData.listeners.map((profile) => (
+                <div style={{ position: 'relative' }}>
+                  <LiveSpaceProfileContainer
+                    isHost={false}
+                    isSpeaker={false}
+                    requested={profile.handRaised}
+                    wallet={profile?.address}
+                    image={createBlockie?.(profile?.address)?.toDataURL()?.toString()}
+                  />
+                </div>
+              ))}
+            </>
+            :
+            spaceData?.members
+              .map((profile) => (
+                <div style={{ position: 'relative' }}>
+                  <LiveSpaceProfileContainer
+                    wallet={profile?.wallet}
+                    image={createBlockie?.(profile?.wallet)
+                      ?.toDataURL()
+                      ?.toString()}
+                  />
+                </div>
+              ))
+        }
       </Item>
+
       <Item padding={'28px 10px'} width={'90%'}>
         {isJoined ? (
           <Item
@@ -326,7 +355,9 @@ export const LiveWidgetContent: React.FC<LiveWidgetContentProps> = ({
                     ? isMicOn
                       ? MicEngagedIcon
                       : MuteIcon
-                    : MicOnIcon
+                    : isRequestedForMic
+                      ? HandIcon
+                      : MicOnIcon
                 }
                 alt="Mic Icon"
               />
@@ -339,17 +370,20 @@ export const LiveWidgetContent: React.FC<LiveWidgetContentProps> = ({
                   ? isMicOn
                     ? 'Speaking'
                     : 'Muted'
-                  : 'Request'}
+                  : isRequestedForMic
+                    ? 'Requested'
+                    : 'Request'
+                }
               </Text>
             </Item>
             <Item display={'flex'} alignItems={'center'} gap={'16px'}>
               <MembersContainer>
                 {
                   isHost && numberOfRequests ?
-                  <RequestsCount>
-                    { numberOfRequests }
-                  </RequestsCount>
-                  : null
+                    <RequestsCount>
+                      {numberOfRequests}
+                    </RequestsCount>
+                    : null
                 }
                 <Image
                   width={'21px'}
@@ -445,4 +479,4 @@ const RequestsCount = styled.div`
   padding: 2px 4px;
   border-radius: 4px;
   font-size: 12px;
-`;
\ No newline at end of file
+`;
diff --git a/packages/uiweb/src/lib/components/space/SpaceWidget/SpacesInfo.tsx b/packages/uiweb/src/lib/components/space/SpaceWidget/SpacesInfo.tsx
index d01efdaec..75c8cc934 100644
--- a/packages/uiweb/src/lib/components/space/SpaceWidget/SpacesInfo.tsx
+++ b/packages/uiweb/src/lib/components/space/SpaceWidget/SpacesInfo.tsx
@@ -73,7 +73,7 @@ export const SpacesInfo: React.FC<ISpacesInfoProps> = (props) => {
             const response = await PushAPI.space.update(spaceUpdate);
 
             console.log(response);
-        } catch (e:any) {
+        } catch (e: any) {
             console.error(e.message);
         } finally {
             setLoading(false);
@@ -86,78 +86,84 @@ export const SpacesInfo: React.FC<ISpacesInfoProps> = (props) => {
             width='400px'
         >
             <SpacesInfoContainer theme={theme}>
-            <ModalHeader
-                heading='Spaces Info'
-                closeCallback={props.closeSpacesInfo}
-            />
-
-            <ProfileContainer
-                imageUrl={spaceData?.members[0]?.image}
-                name={spaceData?.members[0]?.wallet?.substring(7)}
-                handle={spaceData?.members[0]?.wallet?.substring(7)}
-                imageHeight='48px'
-                tag='Host'
-            />
-
-            <SpacesDetailsContainer>
-                <Title>{spaceData?.spaceName}</Title>
-                <Description theme={theme}>{spaceData?.spaceDescription}</Description>
-            </SpacesDetailsContainer>
-
-            <Button
-                customStyle={customStyle}
-                onClick={showExplicitInvite}
-            >
-                Invite Members
-            </Button>
-
-            <Accordion title='Pending Invites' items={spaceData?.pendingMembers?.length}>
-                {spaceData?.pendingMembers &&
-                    spaceData.pendingMembers.map((item: any) => {
-                        return <ProfileContainer
-                            tag={item?.isSpeaker ? 'Co-Host' : undefined}
-                            imageHeight='48px'
-                            handle={item?.wallet?.substring(7)}
-                            name={item?.wallet?.substring(7)}
-                            imageUrl={item?.image}
+                <ModalHeader
+                    heading='Spaces Info'
+                    closeCallback={props.closeSpacesInfo}
+                />
+
+                <ProfileContainer
+                    imageUrl={spaceData?.members[0]?.image}
+                    name={spaceData?.members[0]?.wallet?.substring(7)}
+                    handle={spaceData?.members[0]?.wallet?.substring(7)}
+                    imageHeight='48px'
+                    tag='Host'
+                />
+
+                <SpacesDetailsContainer>
+                    <Title>{spaceData?.spaceName}</Title>
+                    <Description theme={theme}>{spaceData?.spaceDescription}</Description>
+                </SpacesDetailsContainer>
+
+                <Button
+                    customStyle={customStyle}
+                    onClick={showExplicitInvite}
+                >
+                    Invite Members
+                </Button>
+
+                {
+                    spaceData?.pendingMembers?.length ?
+                        <Accordion title='Pending Invites' items={spaceData?.pendingMembers?.length}>
+                            {spaceData?.pendingMembers &&
+                                spaceData.pendingMembers.map((item: any) => {
+                                    return <ProfileContainer
+                                        tag={item?.isSpeaker ? 'Co-Host' : undefined}
+                                        imageHeight='48px'
+                                        handle={item?.wallet?.substring(7)}
+                                        name={item?.wallet?.substring(7)}
+                                        imageUrl={item?.image}
+                                    />
+                                })
+                            }
+                        </Accordion>
+                        : null
+                }
+
+                <AdminsList>
+                    {adminsArray &&
+                        adminsArray.slice(1).map((item: any) => {
+                            return <ProfileContainer
+                                border
+                                tag="Co-Host"
+                                imageHeight='48px'
+                                handle={item?.wallet?.substring(7)}
+                                name={item?.wallet?.substring(7)}
+                                imageUrl={item?.image}
+                            />
+                        })
+                    }
+                </AdminsList>
+
+                {
+                    isInviteVisible ?
+                        <SCWInviteModal
+                            closeInviteModal={showExplicitInvite}
+                            makeScheduleVisible={showExplicitInvite}
+                            createSpace={updateSpace}
+                            isLoading={isLoading}
+                            invitedMembersList={invitedMembersList}
+                            setInvitedMembersList={setInvitedMembersList}
+                            invitedAddressList={invitedAddressList}
+                            setInvitedAddressList={setInvitedAddressList}
+                            adminsList={adminsList}
+                            setAdminsList={setAdminsList}
+                            adminsAddressList={adminsAddressList}
+                            setAdminsAddressList={setAdminsAddressList}
+                            onClose={showExplicitInvite}
+                            btnString='Update Space'
                         />
-                    })
+                        : null
                 }
-            </Accordion>
-
-            {adminsArray &&
-                adminsArray.slice(1).map((item: any) => {
-                    return <ProfileContainer
-                        border
-                        tag="Co-Host"
-                        imageHeight='48px'
-                        handle={item?.wallet?.substring(7)}
-                        name={item?.wallet?.substring(7)}
-                        imageUrl={item?.image}
-                    />
-                })
-            }
-
-            {
-                isInviteVisible ?
-                <SCWInviteModal
-                    closeInviteModal={showExplicitInvite}
-                    makeScheduleVisible={showExplicitInvite}
-                    createSpace={updateSpace}
-                    isLoading={isLoading}
-                    invitedMembersList={invitedMembersList}
-                    setInvitedMembersList={setInvitedMembersList}
-                    invitedAddressList={invitedAddressList}
-                    setInvitedAddressList={setInvitedAddressList}
-                    adminsList={adminsList}
-                    setAdminsList={setAdminsList}
-                    adminsAddressList={adminsAddressList}
-                    setAdminsAddressList={setAdminsAddressList}
-                    onClose={showExplicitInvite}
-                    btnString='Update Space'
-                />
-                : null
-            }
             </SpacesInfoContainer>
         </Modal>
     )
@@ -182,3 +188,10 @@ const Title = styled.div`
 const Description = styled.div`
     color: ${(props => props.theme?.textColorSecondary)};
 `;
+
+const AdminsList = styled.div`
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    margin-top: 8px;
+`;
diff --git a/packages/uiweb/src/lib/components/space/SpaceWidget/WidgetHeader.tsx b/packages/uiweb/src/lib/components/space/SpaceWidget/WidgetHeader.tsx
index 49f354ef7..8be99aca9 100644
--- a/packages/uiweb/src/lib/components/space/SpaceWidget/WidgetHeader.tsx
+++ b/packages/uiweb/src/lib/components/space/SpaceWidget/WidgetHeader.tsx
@@ -88,55 +88,55 @@ export const WidgetHeader: React.FC<IWidgetHeaderProps> = ({
       <Container theme={theme}>
         {(isSpaceLive === SpaceStatus.Scheduled ||
           isSpaceLive === SpaceStatus.Ended) && (
-          <Section>
-            <Item marginBottom={'12px'}>
-              <HostPfpContainer
-                statusTheme="Live"
-                imageUrl={spaceData?.members[0]?.image || tempImageUrl}
-                name={
-                  `${spaceData?.spaceCreator?.slice(
-                    7,
-                    12
-                  )}...${spaceData?.spaceCreator?.slice(-6, -1)}` || 'Host'
-                }
-                handle={
-                  `${spaceData?.spaceCreator?.slice(
-                    7,
-                    12
-                  )}...${spaceData?.spaceCreator?.slice(-6, -1)}` || 'Host'
-                }
-              />
-            </Item>
-            <Item
-              display={'flex'}
-              alignSelf={'flex-start'}
-              alignItems={'center'}
-            >
-              {/* {isHost && <Button padding="6.5px 16.5px" color="#fff">Edit space</Button>} */}
-              <Item
-                marginLeft={'8px'}
-                display={'flex'}
-                onClick={showSpacesInfo}
-              >
-                <Image alt="Settings icon" src={SettingsIcon} />
-              </Item>
-              <Item marginLeft={'8px'} display={'flex'}>
-                <Image
-                  onClick={() => setIsMinimized(!isMinimized)}
-                  src={isMinimized ? CaretUpIcon : CaretDownIcon}
-                  alt="Maximize/Minimize icon"
+            <Section>
+              <Item marginBottom={'12px'}>
+                <HostPfpContainer
+                  statusTheme="Live"
+                  imageUrl={spaceData?.members[0]?.image || tempImageUrl}
+                  name={
+                    `${spaceData?.spaceCreator?.slice(
+                      7,
+                      12
+                    )}...${spaceData?.spaceCreator?.slice(-6, -1)}` || 'Host'
+                  }
+                  handle={
+                    `${spaceData?.spaceCreator?.slice(
+                      7,
+                      12
+                    )}...${spaceData?.spaceCreator?.slice(-6, -1)}` || 'Host'
+                  }
                 />
               </Item>
               <Item
-                marginLeft={'8px'}
                 display={'flex'}
-                onClick={handleCloseWidget}
+                alignSelf={'flex-start'}
+                alignItems={'center'}
               >
-                <CloseSvg stroke="white" height="15" width="15" />
+                {/* {isHost && <Button padding="6.5px 16.5px" color="#fff">Edit space</Button>} */}
+                <Item
+                  marginLeft={'8px'}
+                  display={'flex'}
+                  onClick={showSpacesInfo}
+                >
+                  <Image alt="Settings icon" src={SettingsIcon} />
+                </Item>
+                <Item marginLeft={'8px'} display={'flex'}>
+                  <Image
+                    onClick={() => setIsMinimized(!isMinimized)}
+                    src={isMinimized ? CaretUpIcon : CaretDownIcon}
+                    alt="Maximize/Minimize icon"
+                  />
+                </Item>
+                <Item
+                  marginLeft={'8px'}
+                  display={'flex'}
+                  onClick={handleCloseWidget}
+                >
+                  <CloseSvg stroke="white" height="15" width="15" />
+                </Item>
               </Item>
-            </Item>
-          </Section>
-        )}
+            </Section>
+          )}
         <Section>
           <Text fontSize={'16px'} fontWeight={700}>
             {spaceData?.spaceName || 'Test Space'}
@@ -234,16 +234,3 @@ const Section = styled.div<{ marginTop?: string }>`
   justify-content: space-between;
   margin-top: ${(props) => props.marginTop};
 `;
-
-const Button = styled.button<{
-  padding?: string;
-  color?: string;
-}>`
-  padding: ${(props) => props.padding ?? '0px'};
-  color: ${(props) => props.color ?? 'inherit'};
-  margin-left: 10px;
-  background: ${(props) => props.theme.btnColorPrimary}};
-  border-radius: 6px;
-  border: none;
-  cursor: pointer;
-`;
diff --git a/packages/uiweb/src/lib/config/styles.tsx b/packages/uiweb/src/lib/config/styles.tsx
index 7bbce9aa6..81d0ffb0e 100644
--- a/packages/uiweb/src/lib/config/styles.tsx
+++ b/packages/uiweb/src/lib/config/styles.tsx
@@ -16,6 +16,8 @@ const commonStyle = css<CommonStyles>`
   flex-direction: ${(props) => props.flexDirection};
   flex-wrap: ${(props) => props.flexWrap};
   gap: ${(props) => props.gap};
+  grid-template-columns: ${(props) => props.gridTemplateColumns};
+  grid-template-rows: ${(props) => props.gridTemplateRows};
   align-self: ${(props) => props.alignSelf};
   align-items: ${(props) => props.alignItems};
   align-content: ${(props) => props.alignContent};
@@ -29,6 +31,7 @@ const commonStyle = css<CommonStyles>`
   min-width: ${(props) => props.minWidth};
   max-width: ${(props) => props.maxWidth};
   overflow-y: ${(props) => props.overflowY};
+  overflow-x: ${(props) => props.overflowX};
   font-size: ${(props) => props.fontSize};
   font-weight: ${(props) => props.fontWeight};
   text-align: ${(props) => props.textAlign};