fix: merge main

packages/examples/sdk-frontend-react/src/app/ChatTest/ChatTest.tsx

@@ -68,6 +68,9 @@ const ChatTest = () => {
           <Link to="/getGroup" className="nav-button">
             CHAT.GETGROUP
           </Link>
+          <Link to="/getGroupAccess" className="nav-button">
+            CHAT.GETGROUPACCESS
+          </Link>
           <Link to="/addMembersToGroup" className="nav-button">
             CHAT.ADDMEMBERSTOGROUP
           </Link>

packages/examples/sdk-frontend-react/src/app/ChatTest/CreateGroupTest.tsx

@@ -10,6 +10,7 @@ import { Web3Context, EnvContext } from '../context';
 import * as PushAPI from '@pushprotocol/restapi';
 import { walletToPCAIP10 } from '../helpers';
 import ChatTest from './ChatTest';
+import { Rules } from '@pushprotocol/restapi';
 
 const CreateGroupTest = () => {
   const { account: acc, library } = useContext<any>(Web3Context);
@@ -26,6 +27,8 @@ const CreateGroupTest = () => {
   const [contractAddressERC20, setContractAddressERC20] = useState<string>();
   const [numberOfERC20, setNumberOfERC20] = useState<string>();
   const [meta, setMeta] = useState<string>();
+  const [rules, setRules] = useState<string>();
+
   const [account, setAccount] = useState<string>(acc);
 
   const [sendResponse, setSendResponse] = useState<any>('');
@@ -74,6 +77,10 @@ const CreateGroupTest = () => {
     setMeta((e.target as HTMLInputElement).value);
   };
 
+  const updateRules = (e: React.SyntheticEvent<HTMLElement>) => {
+    setRules((e.target as HTMLInputElement).value);
+  };
+
   const updateAccount = (e: React.SyntheticEvent<HTMLElement>) => {
     setAccount((e.target as HTMLInputElement).value);
   };
@@ -99,6 +106,7 @@ const CreateGroupTest = () => {
         signer: librarySigner,
         env,
         meta: meta,
+        rules: rules ? JSON.parse(rules) as Rules : undefined
       });
 
       setSendResponse(response);
@@ -238,6 +246,17 @@ const CreateGroupTest = () => {
               />
             </SectionItem>
 
+
+            <SectionItem style={{ marginTop: 20 }}>
+              <label>rules</label>
+              <input
+                type="text"
+                onChange={updateRules}
+                value={rules}
+                style={{ width: 400, height: 30 }}
+              />
+            </SectionItem>
+
             <SectionItem style={{ marginTop: 20 }}>
               <SectionButton onClick={testCreateGroup}>
                 create group

packages/examples/sdk-frontend-react/src/app/ChatTest/GetGroupAccessTest.tsx

@@ -0,0 +1,86 @@
+import { useState, useContext } from 'react';
+import {
+  Section,
+  SectionItem,
+  CodeFormatter,
+  SectionButton,
+} from '../components/StyledComponents';
+import Loader from '../components/Loader';
+import { EnvContext } from '../context';
+import * as PushAPI from '@pushprotocol/restapi';
+
+const GetGroupAccessTest = () => {
+  const { env } = useContext<any>(EnvContext);
+  const [isLoading, setLoading] = useState(false);
+  const [chatId, setChatId] = useState<string>('');
+  const [did, setDid] = useState<string>('');
+  const [sendResponse, setSendResponse] = useState<any>('');
+
+  const updateChatId = (e: React.SyntheticEvent<HTMLElement>) => {
+    setChatId((e.target as HTMLInputElement).value);
+  };
+
+  const updateDid = (e: React.SyntheticEvent<HTMLElement>) => {
+    setDid((e.target as HTMLInputElement).value);
+  };
+
+  const testGetGroupAccess = async () => {
+    try {
+      setLoading(true);
+
+      const response = await PushAPI.chat.getGroupAccess({
+        chatId: chatId,
+        did: did,
+        env,
+      });
+      setSendResponse(response);
+    } catch (e) {
+      console.error(e);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div>
+      <h2>Get Group Access Test Page</h2>
+
+      <Loader show={isLoading} />
+
+      <Section>
+        <SectionItem>
+          <SectionButton onClick={testGetGroupAccess}>get group access</SectionButton>
+        </SectionItem>
+        <SectionItem>
+          <label>chatId</label>
+          <input
+            type="text"
+            onChange={updateChatId}
+            value={chatId}
+            style={{ width: 400, height: 30 }}
+          />
+        </SectionItem>
+        <SectionItem>
+          <label>did</label>
+          <input
+            type="text"
+            onChange={updateDid}
+            value={did}
+            style={{ width: 400, height: 30 }}
+          />
+        </SectionItem>
+        <SectionItem>
+          <div>
+            {sendResponse ? (
+              <CodeFormatter>
+                {JSON.stringify(sendResponse, null, 4)}
+              </CodeFormatter>
+            ) : null}
+          </div>
+        </SectionItem>
+      </Section>
+    </div>
+  );
+};
+
+export default GetGroupAccessTest;

packages/examples/sdk-frontend-react/src/app/ChatTest/UpdateGroupTest.tsx

@@ -10,6 +10,7 @@ import { Web3Context, EnvContext } from '../context';
 import * as PushAPI from '@pushprotocol/restapi';
 import { walletToPCAIP10 } from '../helpers';
 import ChatTest from './ChatTest';
+import { Rules } from '@pushprotocol/restapi';
 
 const UpdateGroupTest = () => {
   const { account: acc, library } = useContext<any>(Web3Context);
@@ -23,6 +24,7 @@ const UpdateGroupTest = () => {
   const [admins, setAdmins] = useState<string>('');
   const [account, setAccount] = useState<string>(acc);
   const [sendResponse, setSendResponse] = useState<any>('');
+  const [rules, setRules] = useState<string>();
 
   const updateChatId = (e: React.SyntheticEvent<HTMLElement>) => {
     setChatId((e.target as HTMLInputElement).value);
@@ -47,6 +49,10 @@ const UpdateGroupTest = () => {
     setAdmins((e.target as HTMLInputElement).value);
   };
 
+  const updateRules = (e: React.SyntheticEvent<HTMLElement>) => {
+    setRules((e.target as HTMLInputElement).value);
+  };
+
   const updateAccount = (e: React.SyntheticEvent<HTMLElement>) => {
     setAccount((e.target as HTMLInputElement).value);
   };
@@ -64,6 +70,7 @@ const UpdateGroupTest = () => {
         account: isCAIP ? walletToPCAIP10(account) : account,
         signer: librarySigner,
         env,
+        rules: rules ? JSON.parse(rules) as Rules : undefined
       });
 
       setSendResponse(response);
@@ -143,6 +150,17 @@ const UpdateGroupTest = () => {
                 style={{ width: 400, height: 30 }}
               />
             </SectionItem>
+
+            <SectionItem style={{ marginTop: 20 }}>
+              <label>rules</label>
+              <input
+                type="text"
+                onChange={updateRules}
+                value={rules}
+                style={{ width: 400, height: 30 }}
+              />
+            </SectionItem>
+
             <SectionItem style={{ marginTop: 20 }}>
               <label>Group Creator ( Waller Addr or NFT DID )</label>
               <input

packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatProfile.tsx

@@ -0,0 +1,15 @@
+import { ChatProfile } from "@pushprotocol/uiweb";
+
+export const ChatProfileTest = () => {
+
+    return (
+        <div>
+            <ChatProfile 
+                // chatId='0x455E5AA18469bC6ccEF49594645666C587A3a71B'
+            chatId='24b029b8e07e60291bf9d8c0c48ff993fa1e0a99105459f7404c425c92e91bac'
+                // chatId='36baf37e441fdd94e23406c6c716fc4e91a93a9ee68e070cd5b054534dbe09a6'
+                style="Info"
+             />
+        </div>
+    )
+}

packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatUITest.tsx

@@ -0,0 +1,47 @@
+import { useState } from 'react';
+import styled from 'styled-components';
+import { Link } from 'react-router-dom';
+import { Section } from '../components/StyledComponents';
+import Loader from '../components/Loader';
+
+const ChatUITest = () => {
+  const [isLoading, setIsLoading] = useState(false);
+
+  const NavMenu = styled.div`
+    display: flex;
+    flex-wrap: wrap;
+    gap: 30px;
+    justify-content: center;
+
+    @media only screen and (max-width: 900px) {
+      flex-direction: column;
+    }
+  `;
+
+  return (
+    <div>
+      <h2>Chat UI Test page</h2>
+
+      <Loader show={isLoading} />
+
+      <Section>
+        <NavMenu>
+        <Link to="/ChatProfile" className="nav-button">
+            CHAT PROFILE
+          </Link>
+          <Link to="/messageBubble" className="nav-button">
+            CHAT BUBBLE
+          </Link>
+          <Link to="/messageList" className="nav-button">
+           CHAT VIEW LIST
+          </Link>
+          <Link to="/messageContainer" className="nav-button">
+            CHAT VIEW COMPONENT
+          </Link>
+        </NavMenu>
+      </Section>
+    </div>
+  );
+};
+
+export default ChatUITest;

packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewBubble.tsx

@@ -0,0 +1,58 @@
+import { ChatViewBubble } from "@pushprotocol/uiweb";
+import { useEffect, useContext, useState } from "react";
+import { EnvContext, Web3Context } from "../context";
+import * as PUSHAPI from "@pushprotocol/restapi"
+import { ENV } from "@pushprotocol/uiweb";
+import { IMessagePayload } from "@pushprotocol/uiweb";
+
+export const ChatViewBubbles = () => {
+    const { env } = useContext<any>(EnvContext);
+
+    const { library, account } = useContext<any>(Web3Context)
+    const [message, setMessage] = useState<IMessagePayload[]>([])
+    const [conversationHash, setConversationHash] = useState<string>('');
+
+    const librarySigner = library.getSigner()
+
+    const fetchMessage = async () => {
+        const user = await PUSHAPI.user.get({
+            account: account
+        })
+        const pgpPrivateKey = await PUSHAPI.chat.decryptPGPKey({
+            encryptedPGPPrivateKey: user.encryptedPrivateKey,
+            signer: librarySigner,
+            env: env
+        })
+
+        const ConversationHash = await PUSHAPI.chat.conversationHash({
+            account: `eip155:${account}`,
+            conversationId: '831b1d93f36fa2fce6c3d8c7c41c53335c82ad13cbe05478579af235f10716dc',
+            env: env
+        });
+        setConversationHash(ConversationHash.threadHash);
+        if (ConversationHash?.threadHash) {
+            const chatHistory = await PUSHAPI.chat.history({
+                threadhash: conversationHash,
+                account: account,
+                limit: 10,
+                toDecrypt: true,
+                pgpPrivateKey: pgpPrivateKey ? pgpPrivateKey : undefined,
+                env: env
+            })
+            setMessage(chatHistory)
+            console.log(chatHistory)
+        }
+    }
+
+    useEffect(() => {
+        fetchMessage()
+    }, [])
+
+    return (
+        <div style={{ height: "350px", width: "500px" }}>
+            {message.map((msg) => (
+                <ChatViewBubble chat={msg} />
+            ))}
+        </div>
+    )
+}

packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewComponent.tsx

@@ -0,0 +1,30 @@
+import styled from 'styled-components';
+
+import { Section } from '../components/StyledComponents';
+
+import { ChatViewComponent } from '@pushprotocol/uiweb';
+
+
+const ChatViewComponentTest = () => {
+
+
+
+  return (
+    <div>
+      <h2>Chat UI Test page</h2>
+
+      {/* <Loader show={isLoading} /> */}
+    <ChatViewComponentCard>
+
+      <ChatViewComponent chatId='0xCD0DAdAb45bAF9a06ce1279D1342EcC3F44845af' limit={10}/>
+      </ChatViewComponentCard>
+    </div>
+  );
+};
+
+export default ChatViewComponentTest;
+
+
+const ChatViewComponentCard = styled(Section)`
+height:60vh;
+`;

packages/examples/sdk-frontend-react/src/app/ChatUITest/ChatViewListTest.tsx

@@ -0,0 +1,39 @@
+import { useContext, useEffect, useState } from 'react';
+import styled from 'styled-components';
+import * as PUSHAPI from '@pushprotocol/restapi';
+import { Link } from 'react-router-dom';
+import { Section } from '../components/StyledComponents';
+import { ChatViewList } from '@pushprotocol/uiweb';
+import { EnvContext, Web3Context } from '../context';
+import { usePushChatSocket } from '@pushprotocol/uiweb';
+import { MessageInput } from '@pushprotocol/uiweb';
+
+const ChatViewListTest = () => {
+  const { account, pgpPrivateKey } = useContext<any>(Web3Context)
+
+  const { env } = useContext<any>(EnvContext);
+
+
+  usePushChatSocket();
+  return (
+    <div>
+      <h2>Chat UI Test page</h2>
+
+      {/* <Loader show={isLoading} /> */}
+
+      <ChatViewListCard    >
+        <ChatViewList chatId='0xe19c4b204a76db09697ea54c9182eba2195542aD' limit={10} />
+
+      </ChatViewListCard>
+      <MessageInput chatId='0xe19c4b204a76db09697ea54c9182eba2195542aD' isConnected={true} />
+    </div>
+  );
+};
+
+export default ChatViewListTest;
+
+
+const ChatViewListCard = styled(Section)`
+height:40vh;
+background:black;
+`;