From 00ebe510b4473b6ca596fdadca49133e2dbbe354 Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Fri, 23 Feb 2024 14:28:09 +0530 Subject: [PATCH 01/23] Recommended chats feature --- package.json | 4 +- src/components/Dropdown.tsx | 8 +++- src/components/ProfileModal.tsx | 6 ++- src/primaries/Profile.tsx | 5 ++- src/sections/chat/ChatSidebarSection.tsx | 57 +++++++++++++++++++++++- yarn.lock | 21 ++++----- 6 files changed, 82 insertions(+), 19 deletions(-) diff --git a/package.json b/package.json index dfab0eecc7..e859986c91 100644 --- a/package.json +++ b/package.json @@ -33,9 +33,9 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "0.0.1-alpha.64", + "@pushprotocol/restapi": " 0.0.1-alpha.70", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "0.0.1-alpha.41", + "@pushprotocol/uiweb": "1.3.1-alpha.3", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/src/components/Dropdown.tsx b/src/components/Dropdown.tsx index 2b17d78a78..ab1063310f 100644 --- a/src/components/Dropdown.tsx +++ b/src/components/Dropdown.tsx @@ -26,11 +26,12 @@ type DropdownProps = { textColor?: string; iconFilter?: string; hoverBGColor?: string; + setShowDropdown?:any; }; // Create Dropdown -function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: DropdownProps) { +function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor,setShowDropdown }: DropdownProps) { const theme = useTheme(); const {mode} = useContext(GlobalContext); @@ -52,6 +53,7 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd document.body.removeChild(el); } }; + return ( <> {dropdownValues.map((dropdownValue) => @@ -64,7 +66,9 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd margin="0px 0 8px 0" width="max-content" style={{cursor: "pointer"}} - onClick={() => dropdownValue?.function()} + onClick={() => { + dropdownValue?.function() + }} > { size="16px" cursor="pointer" width="max-content" - onClick={() => dropdownValue?.function()} + onClick={() => { + setShowDropdown(false); + dropdownValue?.function() + + }} > {dropdownValue.title} diff --git a/src/primaries/Profile.tsx b/src/primaries/Profile.tsx index a33eff33d2..01e98e5cd8 100644 --- a/src/primaries/Profile.tsx +++ b/src/primaries/Profile.tsx @@ -43,7 +43,7 @@ const Profile = ({ isDarkMode }) => { // Get theme const theme = useTheme(); - const [showDropdown, setShowDropdown] = React.useState(false); + const [showDropdown, setShowDropdown] = React.useState(false); useClickAway(modalRef, dropdownRef, () => showDropdown && setShowDropdown(false)); const dropdownValues = [ @@ -77,6 +77,7 @@ const Profile = ({ isDarkMode }) => { await disconnect(wallet); setMode(ReadOnlyWalletMode.GUEST_MODE); setReadOnlyWallet('0x0000000000000000000000000000000000000000'); + setShowDropdown(false); }, title: 'Logout', invertedIcon: './logout.svg', @@ -144,7 +145,7 @@ const Profile = ({ isDarkMode }) => { align="flex-start" ref={dropdownRef} > - + { // theme context const theme = useTheme(); + const {wallet} = useAccount(); const { setSelectedChatId } = useContext(Context); const { setMode } = useContext(GlobalContext); @@ -127,6 +128,42 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { } } + const RecommendedChatData = [ + { + "chatId": "4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68", + "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAxElEQVR4AcXBsU1DUQyG0S/WW4EGMQETMIRX8BxpXFpCLMACXuGOlC5DhNZKcaUnBP85l8+P7wcntBc7sZIzDDFDzBA7eNJeTLGSKVZyRnsxxUomQ8wQM8SO9uI/tReTIWaIGWJHrGRqL6b2Yrq/fbHzcruyEyuZDDFDzBA7eBIr2Wm/shMrOcMQM8QMsaO9mGIlf6m9mAwxQ8wQO2IlU3vxG+3FTqxkMsQMMUPs8l6vDzZiJVN7sRMrmdqLHUPMEDPEfgBK0S/MKDp40gAAAABJRU5ErkJggg==", + "chatParticipant": "eip155:0xf8250D363BD1F25f52F10C21188fe82c68C049c4", + "chatGroup": false, + "chatTimestamp": 1705100044656, + "chatMsg": { + "messageType": "Text", + "messageContent": "Hi! Stay tuned, while BRB IRL dev tour has wrapped up, We still have BRB Online with challenges from global projects that still needs to be solved: https://push.org/brb" + } + }, + { + "chatId": "4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68", + "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAxElEQVR4AcXBsU1DUQyG0S/WW4EGMQETMIRX8BxpXFpCLMACXuGOlC5DhNZKcaUnBP85l8+P7wcntBc7sZIzDDFDzBA7eNJeTLGSKVZyRnsxxUomQ8wQM8SO9uI/tReTIWaIGWJHrGRqL6b2Yrq/fbHzcruyEyuZDDFDzBA7eBIr2Wm/shMrOcMQM8QMsaO9mGIlf6m9mAwxQ8wQO2IlU3vxG+3FTqxkMsQMMUPs8l6vDzZiJVN7sRMrmdqLHUPMEDPEfgBK0S/MKDp40gAAAABJRU5ErkJggg==", + "chatParticipant": "eip155:0xf8250D363BD1F25f52F10C21188fe82c68C049c4", + "chatGroup": false, + "chatTimestamp": 1705100044656, + "chatMsg": { + "messageType": "Text", + "messageContent": "Hi! Stay tuned, while BRB IRL dev tour has wrapped up, We still have BRB Online with challenges from global projects that still needs to be solved: https://push.org/brb" + } + }, + { + "chatId": "4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68", + "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAxElEQVR4AcXBsU1DUQyG0S/WW4EGMQETMIRX8BxpXFpCLMACXuGOlC5DhNZKcaUnBP85l8+P7wcntBc7sZIzDDFDzBA7eNJeTLGSKVZyRnsxxUomQ8wQM8SO9uI/tReTIWaIGWJHrGRqL6b2Yrq/fbHzcruyEyuZDDFDzBA7eBIr2Wm/shMrOcMQM8QMsaO9mGIlf6m9mAwxQ8wQO2IlU3vxG+3FTqxkMsQMMUPs8l6vDzZiJVN7sRMrmdqLHUPMEDPEfgBK0S/MKDp40gAAAABJRU5ErkJggg==", + "chatParticipant": "eip155:0xf8250D363BD1F25f52F10C21188fe82c68C049c4", + "chatGroup": false, + "chatTimestamp": 1705100044656, + "chatMsg": { + "messageType": "Text", + "messageContent": "Hi! Stay tuned, while BRB IRL dev tour has wrapped up, We still have BRB Online with challenges from global projects that still needs to be solved: https://push.org/brb" + } + } + ] + // RENDER return ( @@ -268,9 +305,25 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { style={{ display: activeTab == 0 ? 'flex' : 'none' }} overflow="scroll" > + + {!(wallet?.accounts?.length > 0) && RecommendedChatData.map((recommendedChat) => ( + + ))} + + + + setSelectedChatId(await formatChatParticipant(chatParticipant, chatid))} + onChatSelected={async (chatid, chatParticipant) => { console.log(chatParticipant, chatid); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} onUnreadCountChange={(count) => { // console.log('Count is: ', count); diff --git a/yarn.lock b/yarn.lock index e39c26d170..5f20236926 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5432,9 +5432,9 @@ __metadata: "@mui/icons-material": ^5.8.4 "@mui/lab": ^5.0.0-alpha.72 "@mui/material": ^5.5.0 - "@pushprotocol/restapi": 0.0.1-alpha.64 + "@pushprotocol/restapi": " 0.0.1-alpha.70" "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 0.0.1-alpha.41 + "@pushprotocol/uiweb": 1.3.1-alpha.3 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5621,9 +5621,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/restapi@npm:0.0.1-alpha.64": - version: 0.0.1-alpha.64 - resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.64" +"@pushprotocol/restapi@npm: 0.0.1-alpha.70": + version: 0.0.1-alpha.70 + resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.70" dependencies: "@ambire/signature-validator": ^1.3.1 "@metamask/eth-sig-util": ^5.0.2 @@ -5644,7 +5644,7 @@ __metadata: viem: ^1.20.3 peerDependencies: ethers: ^5.0.0 || ^6.0.0 - checksum: 6c62724de1522572de2dfc62212f7a461f8b92b4c8f32097d8a1cea527bda4e3d00b65ada8b2adb2a466d7615af7eb8092b28defed7dc06293a25ea3b9713503 + checksum: f301a4e26297435e8151332f98047e889f4a19df443a437b19b34ffaf1e74cca6f9d50a89413c95b689db720b5835496e85a7672c5a07736941fedbbc9508b12 languageName: node linkType: hard @@ -5672,9 +5672,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:0.0.1-alpha.41": - version: 0.0.1-alpha.41 - resolution: "@pushprotocol/uiweb@npm:0.0.1-alpha.41" +"@pushprotocol/uiweb@npm:1.3.1-alpha.3": + version: 1.3.1-alpha.3 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.3" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5706,7 +5706,8 @@ __metadata: axios: ^0.27.2 react: ">=16.8.0" styled-components: ^6.0.8 - checksum: bbd07715409e0d22b17f825124202772f65169bbeec4c4b05cc4e5b9020e129957f78b3031549ec5c638046247375fecd8b3653c1dbc039363293763b4d7ba51 + viem: ^1.3.0 + checksum: 4a9647f2f513b182f762672becd5f6476ac16f592adfed5ac1c6604bb012d41fc277b16cfee0cbbbd8ca29ce991b99ba262829887f2f5b51a1081645802f3f75 languageName: node linkType: hard From 324dfc875adfe3d31c0942596e84ccd380f0bd3a Mon Sep 17 00:00:00 2001 From: Harsh Rajat Date: Sun, 25 Feb 2024 15:19:52 +0530 Subject: [PATCH 02/23] Added Recommended Chat feature --- .../chat/recommended/Recommended.tsx | 74 +++++++++++++++++++ .../chat/w2wChat/chatBox/ChatBox.tsx | 34 ++++----- src/config/RecommendedChatsList.js | 46 ++++++++++++ src/sections/chat/ChatSidebarSection.tsx | 62 ++++++++-------- 4 files changed, 168 insertions(+), 48 deletions(-) create mode 100644 src/components/chat/recommended/Recommended.tsx create mode 100644 src/config/RecommendedChatsList.js diff --git a/src/components/chat/recommended/Recommended.tsx b/src/components/chat/recommended/Recommended.tsx new file mode 100644 index 0000000000..83bfc53b50 --- /dev/null +++ b/src/components/chat/recommended/Recommended.tsx @@ -0,0 +1,74 @@ +// React + Web3 Essentials +import React, { useState } from "react"; + +// External Packages +import { ChatPreview } from '@pushprotocol/uiweb'; +import styled, { css, useTheme } from 'styled-components'; + +// Internal Compoonents +import { ItemVV2 } from 'components/reusables/SharedStylingV2'; + +// Internal Configs +import recommendedChatsList from 'config/RecommendedChatsList'; + +// Interface + +// Constants + +// Create Module +const Recommended = ({ bg, onChatSelected }) => { + // States + const [chatId, setChatId] = useState(''); + + const getChatParticipant = (chatParticipant) => { + let chatParticipantAlias; + + for (let i = 0; i < recommendedChatsList.length; i++) { + if (recommendedChatsList[i].payload.chatParticipant === chatParticipant) { + chatParticipantAlias = recommendedChatsList[i].chatParticipantAlias; + } + } + + return chatParticipantAlias; + } + + // RENDER + return ( + + {recommendedChatsList.map((item, index) => { + return ( + {const chatParticipantRemapped = getChatParticipant(chatParticipant); setChatId(chatId); onChatSelected(chatId, chatParticipantRemapped)}} + /> + ) + })} + + ); +} +export default Recommended; + +// css styles +const Container = styled(ItemVV2)` + flex: initial; + flex-wrap: nowrap; + background: ${props => props.bg || 'transparent'}; + border-radius: 24px; + padding: 10px; + + &:before { + content: "RECOMMENDED"; + font-size: 12px; + font-weight: 600; + margin-bottom: 10px; + letter-spacing: 0.05em; + color: #657795; + display: flex; + align-self: flex-start; + padding: 5px 10px 0px 10px; + } +` \ No newline at end of file diff --git a/src/components/chat/w2wChat/chatBox/ChatBox.tsx b/src/components/chat/w2wChat/chatBox/ChatBox.tsx index c9e0c6a061..39b2928a33 100644 --- a/src/components/chat/w2wChat/chatBox/ChatBox.tsx +++ b/src/components/chat/w2wChat/chatBox/ChatBox.tsx @@ -7,25 +7,27 @@ import { useLocation, useNavigate } from 'react-router-dom'; import MuiAlert, { AlertProps } from '@mui/material/Alert'; import Snackbar from '@mui/material/Snackbar'; import * as PushAPI from '@pushprotocol/restapi'; +import { ChatProfile, ChatViewList, MessageInput, UserProfile } from '@pushprotocol/uiweb'; import 'font-awesome/css/font-awesome.min.css'; +import { produce } from 'immer'; import { CID } from 'ipfs-http-client'; import { BsDashLg } from 'react-icons/bs'; import { MdOutlineArrowBackIos } from 'react-icons/md'; import ScrollToBottom from 'react-scroll-to-bottom'; import { useClickAway } from 'react-use'; import styled, { useTheme } from 'styled-components'; -import { produce } from 'immer'; -import { ChatProfile, ChatViewList, MessageInput, UserProfile } from '@pushprotocol/uiweb'; + // Internal Components import { ReactComponent as Info } from 'assets/chat/group-chat/info.svg'; import { ReactComponent as InfoDark } from 'assets/chat/group-chat/infodark.svg'; import { ReactComponent as More } from 'assets/chat/group-chat/more.svg'; import { ReactComponent as MoreDark } from 'assets/chat/group-chat/moredark.svg'; import videoCallIcon from 'assets/icons/videoCallIcon.svg'; -import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; +import { Content } from 'components/SharedStyling'; +import Recommended from 'components/chat/recommended/Recommended'; import { ButtonV2, ImageV2, ItemHV2, ItemVV2, SpanV2 } from 'components/reusables/SharedStylingV2'; +import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; import Tooltip from 'components/reusables/tooltip/Tooltip'; -import { Content } from 'components/SharedStyling'; import { checkIfChatExist } from 'helpers/w2w/user'; import { useAccount, useDeviceWidthCheck } from 'hooks'; import { useResolveWeb3Name } from 'hooks/useResolveWeb3Name'; @@ -155,20 +157,10 @@ const ChatBox = ({ showGroupInfoModal }): JSX.Element => { }; const InfoMessages = [ - { id: 1, content: 'You can send up to 10 group requests in alpha' }, - // { id: 2, content: 'You can send a chat request to anyone including non-whitelisted users' }, - // { id: 3, content: 'You can chat with non-whitelisted users but they cannot send a chat request to anyone.' }, - { - id: 4, - content: 'You will have access to 1000 latest messages. Encryption is enabled after a chat request is accepted', - }, - { id: 5, content: 'Messages will only be encrypted if the receiver has encryption keys' }, - // { - // id: 6, - // content: - // 'Due to certain limitations Push Chat does not support Ledger Wallet yet. We are working on adding support.', - // }, - { id: 7, content: 'Access to more chat requests and messages will be added in the near future' }, + { id: 1, content: 'Say Hi to your wallet friends!' }, + { id: 2, content: 'Or join groups of your favorite projects and chat with other members.' }, + { id: 3, content: 'Or create your own gated groups based on your requirements' }, + { id: 4, content: 'And experience the future of Web3 communication!' }, ]; return ( @@ -214,6 +206,7 @@ const ChatBox = ({ showGroupInfoModal }): JSX.Element => { + setChat(chatId, chatParticipant)} /> {InfoMessages.map((item) => ( @@ -410,7 +403,8 @@ const Container = styled(Content)` `; const WelcomeItem = styled(ItemVV2)` - width: 369px; + width: 420px; + min-width: 300px; display: flex; justify-content: center; margin: auto auto; @@ -438,6 +432,8 @@ const WelcomeContent = styled.div` `; const ItemBody = styled.div` + padding: 0px 20px; + @media (min-width: 768px) and (max-height: 1080px) { overflow-y: scroll; height: 300px; diff --git a/src/config/RecommendedChatsList.js b/src/config/RecommendedChatsList.js new file mode 100644 index 0000000000..35a392dd02 --- /dev/null +++ b/src/config/RecommendedChatsList.js @@ -0,0 +1,46 @@ +const RecommendedChatLists = [ + { + "chatParticipantAlias": "eip155:0x99A08ac6254dcf7ccc37CeC662aeba8eFA666666", + "payload": { + "chatId": "0x99A08ac6254dcf7ccc37CeC662aeba8eFA666666", + "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAMVJREFUSEtjvOC34D8DFNzaWghjMqh598PZyOJwQTwMXHqRxRlHnsWrmAXhQY0r9PJ4HOFSk77sx6qMGDXIGhlHnsW4EhcxqZdUNUSlalINJUb94LMY2dW4Cg1kV1OiHqUAocQgUh06cBYTk49xBS+uBEVM2U5UATIyLCbVl6QGO86gHr4Wk1pWk1qAIEcBRUXm0Ld4tADBlh9JzVpEFZnIqdrj4CaCjTpSExdyI3CHvR/cfJTaaeRZPNqFwdaZI7U1iSsUAZha8UXyHURfAAAAAElFTkSuQmCC", + "chatParticipant": "Push AI Bot", + "chatGroup": true, + "chatTimestamp": null, + "chatMsg": { + "messageType": "Text", + "messageContent": "Interact for Humor, Sassyness gauranteed!" + } + } + }, + { + "chatParticipantAlias": "eip155:0x71Ffa5771E8019787190D098586EFe02026a3c8C", + "payload": { + "chatId": "0x71Ffa5771E8019787190D098586EFe02026a3c8C", + "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAANNJREFUSEtjTPF78p8BC1gYvw2bMMli8Qu9sOphHNkWX3aqJhiU52StsaoxenyUoF7dfa1wNShBPTIsZl07C2uqRk6NyCkcVyrFpQZX7mAceRbjysfISZSSoMaV1HEWIMPXYuTEhSslI/uemFSNSz1ylKGk6pFhMam1EyVBjRwFJFeLI8NiXL7EVTgQU+AQFdTDy2LzCfHwahG5hYCryCTYzGBgYMAVQsgNDcaRZzGpBQgxQU1M2U5UqibVssFtMXK1iNw2xtV+JtX3uMxEqRZHhMUA5oH9q+BaxVUAAAAASUVORK5CYII=", + "chatParticipant": "Push Developer", + "chatGroup": true, + "chatTimestamp": null, + "chatMsg": { + "messageType": "Text", + "messageContent": "Ask any coding related questions here!" + } + } + }, + { + "chatParticipantAlias": "eip155:0x99A08ac6254dcf7ccc37CeC662aeba8eFA666666", + "payload": { + "chatId": "4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68", + "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAxElEQVR4AcXBsU1DUQyG0S/WW4EGMQETMIRX8BxpXFpCLMACXuGOlC5DhNZKcaUnBP85l8+P7wcntBc7sZIzDDFDzBA7eNJeTLGSKVZyRnsxxUomQ8wQM8SO9uI/tReTIWaIGWJHrGRqL6b2Yrq/fbHzcruyEyuZDDFDzBA7eBIr2Wm/shMrOcMQM8QMsaO9mGIlf6m9mAwxQ8wQO2IlU3vxG+3FTqxkMsQMMUPs8l6vDzZiJVN7sRMrmdqLHUPMEDPEfgBK0S/MKDp40gAAAABJRU5ErkJggg==", + "chatParticipant": "eip155:0xf8250D363BD1F25f52F10C21188fe82c68C049c4", + "chatGroup": true, + "chatTimestamp": null, + "chatMsg": { + "messageType": "Text", + "messageContent": "Hi! Stay tuned, while BRB IRL dev tour has wrapped up, We still have BRB Online with challenges from global projects that still needs to be solved: https://push.org/brb" + } + } + } +] + +export default RecommendedChatLists; \ No newline at end of file diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx index a480524ffa..f66a3ff079 100644 --- a/src/sections/chat/ChatSidebarSection.tsx +++ b/src/sections/chat/ChatSidebarSection.tsx @@ -3,34 +3,35 @@ import { Web3Provider } from '@ethersproject/providers'; import React, { useContext, useEffect, useState } from 'react'; // External Packages +import { ethers } from 'ethers'; import { AiOutlineQrcode } from 'react-icons/ai'; +import { useSelector } from 'react-redux'; import { useClickAway } from 'react-use'; import styled, { useTheme } from 'styled-components'; -import { useSelector } from 'react-redux'; -import { ethers } from 'ethers'; // Internal Compoonents import { ChatPreview, ChatPreviewList, UserProfile } from '@pushprotocol/uiweb'; import { ReactComponent as CreateGroupIcon } from 'assets/chat/group-chat/creategroup.svg'; import { ReactComponent as CreateGroupFillIcon } from 'assets/chat/group-chat/creategroupfill.svg'; +import NewTag from 'components/NewTag'; +import Recommended from 'components/chat/recommended/Recommended'; import ProfileHeader from 'components/chat/w2wChat/profile'; import SearchBar from 'components/chat/w2wChat/searchBar/SearchBar'; import { ButtonV2, ItemHV2, ItemVV2, SpanV2 } from 'components/reusables/SharedStylingV2'; +import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; +import { AppContext } from 'contexts/AppContext'; import StyleHelper from 'helpers/StyleHelper'; import { getIsNewTagVisible } from 'helpers/TimerHelper'; +import { caip10ToWallet } from 'helpers/w2w'; import { fetchIntent } from 'helpers/w2w/user'; import { Context } from 'modules/chat/ChatModule'; import { Feeds } from 'types/chat'; -import { caip10ToWallet } from 'helpers/w2w'; -import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; -import { AppContext } from 'contexts/AppContext'; -import NewTag from 'components/NewTag'; // Internal Configs import GLOBALS from 'config/Globals'; -import { appConfig } from '../../config'; -import { useAccount } from 'hooks'; import { GlobalContext } from 'contexts/GlobalContext'; +import { useAccount } from 'hooks'; +import { appConfig } from '../../config'; const createGroupOnMouseEnter = [ @@ -84,6 +85,9 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { const [showQR, setShowQR] = useState(false); const containerRef = React.useRef(null); + // set recommended chats + const [showRecommended, setShowRecommended] = useState(false); + const { userPushSDKInstance } = useSelector((state: any) => { return state.user; }); @@ -305,30 +309,30 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { style={{ display: activeTab == 0 ? 'flex' : 'none' }} overflow="scroll" > - - {!(wallet?.accounts?.length > 0) && RecommendedChatData.map((recommendedChat) => ( - { console.log(chatParticipant); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} /> - ))} - - + } + {/* Only show recommended chats if there are no chats */} + {!showRecommended && + { console.log(chatParticipant, chatid); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} - { console.log(chatParticipant, chatid); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} - - onUnreadCountChange={(count) => { - // console.log('Count is: ', count); - }} - /> + onUnreadCountChange={(count) => { + // console.log('Count is: ', count); + }} + onPreload={(chats) => { + if (chats.length == 0) { + setShowRecommended(true); + } + }} + /> + } {/* Set Requests */} From 0bbe270cd9967a61a7bf525f8035540bd74277ae Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Mon, 26 Feb 2024 14:41:37 +0530 Subject: [PATCH 03/23] Fixed issues in the Opt In flow --- src/AppLogin.tsx | 2 +- .../dropdowns/ManageNotifSettingDropdown.tsx | 17 +++- .../dropdowns/OptinNotifSettingDropdown.tsx | 95 ++++++++++--------- .../dropdowns/UpdateNotifSettingDropdown.tsx | 17 +++- src/contexts/AppContext.tsx | 24 +++-- src/contexts/GlobalContext.tsx | 2 +- src/primaries/Profile.tsx | 12 ++- src/sections/chat/ChatSidebarSection.tsx | 4 +- src/segments/Feedbox.tsx | 8 +- src/segments/ViewChannels.tsx | 3 +- src/types/context.ts | 2 +- 11 files changed, 118 insertions(+), 68 deletions(-) diff --git a/src/AppLogin.tsx b/src/AppLogin.tsx index e32da8f003..610081e1b6 100644 --- a/src/AppLogin.tsx +++ b/src/AppLogin.tsx @@ -121,7 +121,7 @@ const AppLogin = ({ toggleDarkMode }) => { } const initiateGuestModa = () => { - const guestModeAddress = '0x0000000000000000000000000000000000000000'; + const guestModeAddress = '0x0000000000000000000000000000000000000001'; setMode(ReadOnlyWalletMode.GUEST_MODE); setReadOnlyWallet(guestModeAddress); hideOnboardModal(); diff --git a/src/components/dropdowns/ManageNotifSettingDropdown.tsx b/src/components/dropdowns/ManageNotifSettingDropdown.tsx index dadef23168..1fded52153 100644 --- a/src/components/dropdowns/ManageNotifSettingDropdown.tsx +++ b/src/components/dropdowns/ManageNotifSettingDropdown.tsx @@ -134,11 +134,20 @@ const ManageNotifSettingDropdown: React.FC = (o const optOutHandler = async ({ setLoading }: { setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (() => {}); - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + let userPushInstance = userPushSDKInstance; + + console.log("User Push Instance >>>>>",userPushInstance); + + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + console.log("Res >>>>>>> ",userPushInstance); + if (!userPushInstance) { + return; + } } + console.log("User Push",userPushInstance); + setLoadingFunc(true); try { @@ -149,7 +158,7 @@ const ManageNotifSettingDropdown: React.FC = (o unsubscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushSDKInstance.notification.unsubscribe(convertAddressToAddrCaip(channelAddress, chainId), { + await userPushInstance.notification.unsubscribe(convertAddressToAddrCaip(channelAddress, chainId), { onSuccess: () => { onSuccessOptout(); dispatch(updateSubscriptionStatus({ channelAddress: channelAddress, status: false })); diff --git a/src/components/dropdowns/OptinNotifSettingDropdown.tsx b/src/components/dropdowns/OptinNotifSettingDropdown.tsx index a6c879f8a8..61f12518fa 100644 --- a/src/components/dropdowns/OptinNotifSettingDropdown.tsx +++ b/src/components/dropdowns/OptinNotifSettingDropdown.tsx @@ -71,48 +71,48 @@ const OptinNotifSettingDropdownContainer: React.FC - - {setting.description} - handleSwitchChange(index)} checked={setting.type === 1 ? setting.default : setting.enabled} - checkedIcon={false} - uncheckedIcon={false} - onColor="#D53A94" - offColor="#A0A3B1" - height={16} - width={32} - handleDiameter={12} - /> - - {setting.type === 2 && setting.enabled === true && ( - - - {setting.default} - - handleSliderChange(index, x)} - /> - - )} + + {setting.description} + handleSwitchChange(index)} checked={setting.type === 1 ? setting.default : setting.enabled} + checkedIcon={false} + uncheckedIcon={false} + onColor="#D53A94" + offColor="#A0A3B1" + height={16} + width={32} + handleDiameter={12} + /> + + {setting.type === 2 && setting.enabled === true && ( + + + {setting.default} + + handleSliderChange(index, x)} + /> + + )} {setting.type === 3 && setting.enabled === true && ( - {setting.default.lower} - {setting.default.upper} + {setting.default.lower} - {setting.default.upper} handleSliderChange(index, {lower: startVal, upper: endVal})} + startVal={setting.default.lower} + endVal={setting.default.upper} + max={setting.upperLimit} + min={setting.lowerLimit} + step={setting.ticker || 1} + defaultStartVal={setting.default.lower} + defaultEndVal={setting.default.upper} + onChange={({ startVal, endVal }) => handleSliderChange(index, { lower: startVal, upper: endVal })} /> )} @@ -171,12 +171,21 @@ const OptinNotifSettingDropdown: React.FC = (opt const optInHandler = async ({ channelSettings, setLoading }: { channelSettings?: ChannelSetting[], setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (options && options.setLoading) || (() => { }); - - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + + let userPushInstance = userPushSDKInstance; + + console.log("User Push Instance >>>>>",userPushInstance); + + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + console.log("Res >>>>>>> ",userPushInstance); + if (!userPushInstance) { + return; + } } - + + console.log("User Push",userPushInstance); + setLoadingFunc(true); try { @@ -187,7 +196,7 @@ const OptinNotifSettingDropdown: React.FC = (opt subscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushSDKInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { + await userPushInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { settings: notifChannelSettingFormatString({ settings: channelSettings }), // settings: [], onSuccess: () => { diff --git a/src/components/dropdowns/UpdateNotifSettingDropdown.tsx b/src/components/dropdowns/UpdateNotifSettingDropdown.tsx index 055ea4c2fa..e47c709109 100644 --- a/src/components/dropdowns/UpdateNotifSettingDropdown.tsx +++ b/src/components/dropdowns/UpdateNotifSettingDropdown.tsx @@ -178,10 +178,19 @@ const UpdateNotifSettingDropdown: React.FC = ({ const setLoadingFunc = setLoading || (() => {}); const saveOnSuccessSettingFunc = onSuccessSave || (() => {}); - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + let userPushInstance = userPushSDKInstance; + + console.log("User Push Instance >>>>>",userPushInstance); + + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + console.log("Res >>>>>>> ",userPushInstance); + if (!userPushInstance) { + return; + } } + + console.log("User Push",userPushInstance); setLoadingFunc(true); @@ -193,7 +202,7 @@ const UpdateNotifSettingDropdown: React.FC = ({ subscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushSDKInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { + await userPushInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { settings: notifUserSettingFormatString({ settings: userSettings }), // settings: [], onSuccess: () => { diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index b0bfebe771..d9145c072c 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -67,9 +67,14 @@ const AppContextProvider = ({ children }) => { if (wallet?.accounts?.length > 0) { - await initializePushSDK(); + console.log('Wallet connected',wallet); + const userPushInstance = await initializePushSDK(); + return userPushInstance; } else { - connect(); + const walletConnected = await connect(); + console.log("Wallet connected",walletConnected); + return null; + } } @@ -80,20 +85,21 @@ const AppContextProvider = ({ children }) => { console.log("Initialising Push SDK Guest Mode"); let userInstance; userInstance = await PushAPI.initialize({ - account: '0x0000000000000000000000000000000000000000', + account: '0x0000000000000000000000000000000000000001', env: appConfig.appEnv, }); dispatch(setUserPushSDKInstance(userInstance)); } const initialisePushSdkReadMode = async () => { - console.log("Initialising Push SDK Read Mode"); let userInstance; userInstance = await PushAPI.initialize({ env: appConfig.appEnv, account: account, }); + console.log("User Instance in read Mode",userInstance); dispatch(setUserPushSDKInstance(userInstance)); + return userInstance; } @@ -206,16 +212,20 @@ const AppContextProvider = ({ children }) => { }; - const initializePushSDK = async () => { + const initializePushSDK = async (address?:string) => { let userInstance; try { + console.log("Addresss >>>>>>",address,account); const librarySigner = provider?.getSigner(account); userInstance = await PushAPI.initialize(librarySigner!, { env: appConfig.appEnv, - account: account, + account: address ? address : account, progressHook: onboardingProgressReformatter, }); + console.log("User Push SDK instance in App Context >>",userInstance); + + if (userInstance) { setBlockedLoading({ enabled: false, @@ -227,9 +237,11 @@ const AppContextProvider = ({ children }) => { } dispatch(setUserPushSDKInstance(userInstance)); + return userInstance; } catch (error) { // Handle initialization error console.log("Errror !!!!!", error); + return null; } }; diff --git a/src/contexts/GlobalContext.tsx b/src/contexts/GlobalContext.tsx index 02c8528ffa..e14ea3bdf4 100644 --- a/src/contexts/GlobalContext.tsx +++ b/src/contexts/GlobalContext.tsx @@ -17,7 +17,7 @@ export type GlobalContextType = { export const GlobalContext = createContext(null); const GlobalContextProvider = ({ children }) => { - const [readOnlyWallet, setReadOnlyWallet] = useState('0x0000000000000000000000000000000000000000'); + const [readOnlyWallet, setReadOnlyWallet] = useState('0x0000000000000000000000000000000000000001'); const [mode, setMode] = useState(ReadOnlyWalletMode.GUEST_MODE); const [sidebarCollapsed, setSidebarCollapsed] = useState(false); diff --git a/src/primaries/Profile.tsx b/src/primaries/Profile.tsx index a33eff33d2..509120cbcc 100644 --- a/src/primaries/Profile.tsx +++ b/src/primaries/Profile.tsx @@ -25,7 +25,7 @@ import { SpanV2 } from 'components/reusables/SharedStylingV2.js'; // Create Header const Profile = ({ isDarkMode }) => { - const { web3NameList,initialisePushSdkReadMode,handleConnectWallet }: AppContextType = useContext(AppContext); + const { web3NameList,initialisePushSdkReadMode }: AppContextType = useContext(AppContext); const { setReadOnlyWallet, readOnlyWallet, mode, setMode }: GlobalContextType = useContext(GlobalContext); const { authError } = useContext(ErrorContext); const toggleArrowRef = useRef(null); @@ -76,7 +76,7 @@ const Profile = ({ isDarkMode }) => { function: async () => { await disconnect(wallet); setMode(ReadOnlyWalletMode.GUEST_MODE); - setReadOnlyWallet('0x0000000000000000000000000000000000000000'); + setReadOnlyWallet('0x0000000000000000000000000000000000000001'); }, title: 'Logout', invertedIcon: './logout.svg', @@ -87,6 +87,10 @@ const Profile = ({ isDarkMode }) => { setShowDropdown(false); }); + const ConnectWallet = ()=>{ + connect(); + } + // to create blockies return ( @@ -100,7 +104,7 @@ const Profile = ({ isDarkMode }) => { bg="linear-gradient(87.17deg, #B6A0F5 0%, #F46EF7 57.29%, #FF95D5 100%)" color='#FFF' isDarkMode={isDarkMode} - onClick={()=>handleConnectWallet()} + onClick={()=>ConnectWallet()} > Connect Wallet @@ -163,7 +167,7 @@ const Profile = ({ isDarkMode }) => { bg="linear-gradient(87.17deg, #B6A0F5 0%, #F46EF7 57.29%, #FF95D5 100%)" color='#FFF' isDarkMode={isDarkMode} - onClick={()=>handleConnectWallet()} + onClick={()=>ConnectWallet()} > Connect Wallet diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx index 7d0ba3863d..adee178ae9 100644 --- a/src/sections/chat/ChatSidebarSection.tsx +++ b/src/sections/chat/ChatSidebarSection.tsx @@ -103,7 +103,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { } return formattedChatParticipant; } else { - if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000000') { + if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000001') { handleConnectWallet(); } else if (userPushSDKInstance.signer === undefined || userPushSDKInstance.decryptedPgpPvtKey === undefined) { await initializePushSDK(); @@ -116,7 +116,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { if (userPushSDKInstance.decryptedPgpPvtKey) { showCreateGroupModal(); } else { - if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000000') { + if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000001') { handleConnectWallet(); } else { if (userPushSDKInstance.signer === undefined) { diff --git a/src/segments/Feedbox.tsx b/src/segments/Feedbox.tsx index f352e36153..189faa29c5 100644 --- a/src/segments/Feedbox.tsx +++ b/src/segments/Feedbox.tsx @@ -19,6 +19,7 @@ import { Item } from "primaries/SharedStyling"; import { addPaginatedNotifications, incrementPage, + resetNotificationsSlice, setFinishedFetching, updateTopNotifications } from "redux/slices/notificationSlice"; @@ -29,6 +30,7 @@ import { useAccount, useDeviceWidthCheck } from "hooks"; import { ReactComponent as MetamaskLogo } from 'assets/PushSnaps/metamasksnap.svg'; import { ReactComponent as Close } from 'assets/chat/group-chat/close.svg'; import { ReactComponent as OpenLink } from 'assets/PushSnaps/GoToImage.svg' +import { GlobalContext } from "contexts/GlobalContext"; // Internal Configs import { appConfig } from "config"; @@ -71,6 +73,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { const [loadFilter, setLoadFilter] = React.useState(false); const [bgUpdateLoading, setBgUpdateLoading] = React.useState(false); const [loading, setLoading] = React.useState(false); + const {readOnlyWallet } = useContext(GlobalContext); const [showSnapInfo, setShowSnapInfo] = React.useState(true); @@ -173,11 +176,13 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { setBgUpdateLoading(true); setLoading(true); try { + console.log("User Push sdk instance in fetch latest notifications",userPushSDKInstance); const results = await await userPushSDKInstance.notification.list('INBOX', { raw: true, page: 1, limit: NOTIFICATIONS_PER_PAGE }); + console.log("REsults >>>>",results); if (!notifications.length) { dispatch(incrementPage()); } @@ -242,7 +247,8 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { }; React.useEffect(() => { - if (!userPushSDKInstance) return; + console.log("User Push sdk instance",userPushSDKInstance,readOnlyWallet); + if (userPushSDKInstance?.account == readOnlyWallet) return; fetchLatestNotifications(); fetchAllNotif(); }, [toggle, userPushSDKInstance]); diff --git a/src/segments/ViewChannels.tsx b/src/segments/ViewChannels.tsx index 95ad74ff7c..d2dcf15416 100644 --- a/src/segments/ViewChannels.tsx +++ b/src/segments/ViewChannels.tsx @@ -191,7 +191,8 @@ function ViewChannels({ loadTeaser, playTeaser }) { return () => { clearTimeout(timeout); }; - }, [search, userPushSDKInstance]); + // userPushSDKInstance should not be used as dependency here. + }, [search]); useEffect(() => { if (!account || !userPushSDKInstance) return; diff --git a/src/types/context.ts b/src/types/context.ts index 933238ca01..2d2cc96fcc 100644 --- a/src/types/context.ts +++ b/src/types/context.ts @@ -45,7 +45,7 @@ export interface AppContextType { initializePushSDK: () => Promise; snapInstalled: boolean; setSnapInstalled: (snapInstalled: boolean) => void; - handleConnectWallet: (showToast?: boolean, toastMessage?: string) => void; + handleConnectWallet: (showToast?: boolean, toastMessage?: string) => any; setBlockedLoading: (blockedLoading: BlockedLoadingI) => void; blockedLoading: BlockedLoadingI; getUser: () => Promise; From c18f32fd2cacf3dfada8446eb94eacbdcba4abd6 Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Mon, 26 Feb 2024 16:31:32 +0530 Subject: [PATCH 04/23] Removed consoles and fixed the send Notification case --- src/components/SendNotifications.tsx | 11 +++++++---- .../dropdowns/ManageNotifSettingDropdown.tsx | 10 ++-------- .../dropdowns/OptinNotifSettingDropdown.tsx | 10 ++-------- .../dropdowns/UpdateNotifSettingDropdown.tsx | 11 +++-------- src/contexts/AppContext.tsx | 9 ++------- 5 files changed, 16 insertions(+), 35 deletions(-) diff --git a/src/components/SendNotifications.tsx b/src/components/SendNotifications.tsx index 0467c61790..94e2d3a871 100644 --- a/src/components/SendNotifications.tsx +++ b/src/components/SendNotifications.tsx @@ -303,9 +303,12 @@ const {handleConnectWallet} = useContext(AppContext); // Check everything in order e.preventDefault(); - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + let userPushInstance = userPushSDKInstance; + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + if (!userPushInstance) { + return; + } } notificationToast.showLoaderToast({ @@ -407,7 +410,7 @@ const {handleConnectWallet} = useContext(AppContext); const channelAddressInCaip = convertAddressToAddrCaip(channelAddress, chainId); - await userPushSDKInstance.channel.send(notifRecipients, { + await userPushInstance.channel.send(notifRecipients, { notification: { title: asub, body: amsg, diff --git a/src/components/dropdowns/ManageNotifSettingDropdown.tsx b/src/components/dropdowns/ManageNotifSettingDropdown.tsx index 1fded52153..ae7a548eb0 100644 --- a/src/components/dropdowns/ManageNotifSettingDropdown.tsx +++ b/src/components/dropdowns/ManageNotifSettingDropdown.tsx @@ -133,23 +133,17 @@ const ManageNotifSettingDropdown: React.FC = (o const unsubscribeToast = useToast(); const optOutHandler = async ({ setLoading }: { setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (() => {}); - + setLoadingFunc(true); let userPushInstance = userPushSDKInstance; - console.log("User Push Instance >>>>>",userPushInstance); - if (!userPushInstance.signer) { userPushInstance = await handleConnectWallet(); - console.log("Res >>>>>>> ",userPushInstance); if (!userPushInstance) { + setLoadingFunc(false); return; } } - console.log("User Push",userPushInstance); - - setLoadingFunc(true); - try { let channelAddress = channelDetail.channel; if (!onCoreNetwork) { diff --git a/src/components/dropdowns/OptinNotifSettingDropdown.tsx b/src/components/dropdowns/OptinNotifSettingDropdown.tsx index 61f12518fa..b786963854 100644 --- a/src/components/dropdowns/OptinNotifSettingDropdown.tsx +++ b/src/components/dropdowns/OptinNotifSettingDropdown.tsx @@ -171,23 +171,17 @@ const OptinNotifSettingDropdown: React.FC = (opt const optInHandler = async ({ channelSettings, setLoading }: { channelSettings?: ChannelSetting[], setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (options && options.setLoading) || (() => { }); + setLoadingFunc(true); let userPushInstance = userPushSDKInstance; - - console.log("User Push Instance >>>>>",userPushInstance); - if (!userPushInstance.signer) { userPushInstance = await handleConnectWallet(); - console.log("Res >>>>>>> ",userPushInstance); if (!userPushInstance) { + setLoadingFunc(false); return; } } - console.log("User Push",userPushInstance); - - setLoadingFunc(true); - try { let channelAddress = channelDetail.channel; if (!onCoreNetwork) { diff --git a/src/components/dropdowns/UpdateNotifSettingDropdown.tsx b/src/components/dropdowns/UpdateNotifSettingDropdown.tsx index e47c709109..a7cc027a01 100644 --- a/src/components/dropdowns/UpdateNotifSettingDropdown.tsx +++ b/src/components/dropdowns/UpdateNotifSettingDropdown.tsx @@ -177,23 +177,18 @@ const UpdateNotifSettingDropdown: React.FC = ({ const saveUserSettingHandler = async ({ userSettings, setLoading }: { userSettings?: UserSetting[], setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (() => {}); const saveOnSuccessSettingFunc = onSuccessSave || (() => {}); - - let userPushInstance = userPushSDKInstance; + setLoadingFunc(true); - console.log("User Push Instance >>>>>",userPushInstance); + let userPushInstance = userPushSDKInstance; if (!userPushInstance.signer) { userPushInstance = await handleConnectWallet(); - console.log("Res >>>>>>> ",userPushInstance); if (!userPushInstance) { + setLoadingFunc(false); return; } } - console.log("User Push",userPushInstance); - - setLoadingFunc(true); - try { let channelAddress = channelDetail.channel; if (!onCoreNetwork) { diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index d9145c072c..23adaf292b 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -65,7 +65,6 @@ const AppContextProvider = ({ children }) => { }); } - if (wallet?.accounts?.length > 0) { console.log('Wallet connected',wallet); const userPushInstance = await initializePushSDK(); @@ -212,20 +211,16 @@ const AppContextProvider = ({ children }) => { }; - const initializePushSDK = async (address?:string) => { + const initializePushSDK = async () => { let userInstance; try { - console.log("Addresss >>>>>>",address,account); const librarySigner = provider?.getSigner(account); userInstance = await PushAPI.initialize(librarySigner!, { env: appConfig.appEnv, - account: address ? address : account, + account: account, progressHook: onboardingProgressReformatter, }); - console.log("User Push SDK instance in App Context >>",userInstance); - - if (userInstance) { setBlockedLoading({ enabled: false, From aee39cad8f5bc8f64e7d47e278019165783d70db Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Tue, 27 Feb 2024 12:55:06 +0530 Subject: [PATCH 05/23] Issues Fixed for diff Channel Features like edit channel or add delegate --- src/components/ChannelDetails.js | 25 +++++----- src/components/ChannelSettingsDropdown.tsx | 8 +-- .../channel/NotificationSettings.tsx | 49 ++++++++++--------- .../ChannelOwnerDashboard.tsx | 8 +-- 4 files changed, 48 insertions(+), 42 deletions(-) diff --git a/src/components/ChannelDetails.js b/src/components/ChannelDetails.js index 35c8f25a1b..046219fdc4 100644 --- a/src/components/ChannelDetails.js +++ b/src/components/ChannelDetails.js @@ -49,7 +49,7 @@ export default function ChannelDetails({ isChannelExpired, setIsChannelExpired, const { userPushSDKInstance } = useSelector((state) => { return state.user; }); - const {handleConnectWallet} = useContext(AppContext); + const { handleConnectWallet } = useContext(AppContext); const { CHANNEL_ACTIVE_STATE, CHANNNEL_DEACTIVATED_STATE } = useSelector((state) => state.channels); const { processingState } = useSelector((state) => state.channelCreation); const [verifyingChannel, setVerifyingChannel] = React.useState([]); @@ -77,10 +77,9 @@ export default function ChannelDetails({ isChannelExpired, setIsChannelExpired, const addDelegateToast = useToast(); - const handleDelegateModal = () => { + const handleDelegateModal = async () => { if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + await handleConnectWallet(); } showAddDelegateModal(); } @@ -156,17 +155,19 @@ export default function ChannelDetails({ isChannelExpired, setIsChannelExpired, } }, [account]); - const removeDelegate = (walletAddress) => { - return userPushSDKInstance.channel.delegate.remove(convertAddressToAddrCaip(walletAddress, chainId)); + const removeDelegate = async (walletAddress) => { + let userPushInstance = userPushSDKInstance; + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + if (!userPushInstance) { + return; + } + } + + return userPushInstance.channel.delegate.remove(convertAddressToAddrCaip(walletAddress, chainId)); }; const navigateToNotifSettings = () => { - - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } - navigate(APP_PATHS.ChannelSettings); }; diff --git a/src/components/ChannelSettingsDropdown.tsx b/src/components/ChannelSettingsDropdown.tsx index 6e501c4ca1..7649e66aae 100644 --- a/src/components/ChannelSettingsDropdown.tsx +++ b/src/components/ChannelSettingsDropdown.tsx @@ -128,10 +128,10 @@ function ChannelSettings({ DropdownRef, isDropdownOpen, closeDropdown }: Channel const userSignerToast = useToast(); const toggleChannelActivationState = () => { if (isChannelBlocked) return; - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } + // if (!userPushSDKInstance.signer) { + // handleConnectWallet(); + // return; + // } if (isChannelDeactivated) { showReactivateChannelModal(); } else { diff --git a/src/components/channel/NotificationSettings.tsx b/src/components/channel/NotificationSettings.tsx index e4ba15d8a8..c5d95b8ef7 100644 --- a/src/components/channel/NotificationSettings.tsx +++ b/src/components/channel/NotificationSettings.tsx @@ -47,7 +47,7 @@ function NotificationSettings() { const [settingToEdit, setSettingToEdit] = React.useState(undefined); const [isLoading, setIsLoading] = React.useState(false); const [isLoadingSettings, setIsLoadingSettings] = React.useState(true); - const {handleConnectWallet} = useContext(AppContext); + const { handleConnectWallet } = useContext(AppContext); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; @@ -133,12 +133,17 @@ function NotificationSettings() { const saveSettings = async () => { try { - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + setIsLoading(true); + + let userPushInstance = userPushSDKInstance; + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + if (!userPushInstance) { + setIsLoading(false); + return; + } } - setIsLoading(true); notificationToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); const settingData: NotificationSetting[] = settings.map((setting) => { @@ -153,14 +158,14 @@ function NotificationSettings() { console.info( { type: setting.type, - description: setting.description, - default: setting.default, - data: { - lower: setting.lowerLimit, - upper: setting.upperLimit, - ticker: setting.ticker, - enabled: setting.enabled, - }, + description: setting.description, + default: setting.default, + data: { + lower: setting.lowerLimit, + upper: setting.upperLimit, + ticker: setting.ticker, + enabled: setting.enabled, + }, } ) return { @@ -178,14 +183,14 @@ function NotificationSettings() { console.info( { type: setting.type, - description: setting.description, - default: setting.default, - data: { - lower: setting.lowerLimit, - upper: setting.upperLimit, - ticker: setting.ticker, - enabled: setting.enabled, - }, + description: setting.description, + default: setting.default, + data: { + lower: setting.lowerLimit, + upper: setting.upperLimit, + ticker: setting.ticker, + enabled: setting.enabled, + }, } ) return { @@ -202,7 +207,7 @@ function NotificationSettings() { } }); console.info(settingData); - await userPushSDKInstance.channel.setting(settingData); + await userPushInstance.channel.setting(settingData); dispatch(updateChannelSetting({ channelAddress, settings })); setIsLoading(false); diff --git a/src/modules/channelDashboard/ChannelOwnerDashboard.tsx b/src/modules/channelDashboard/ChannelOwnerDashboard.tsx index 76a5d93406..350b41ddf8 100644 --- a/src/modules/channelDashboard/ChannelOwnerDashboard.tsx +++ b/src/modules/channelDashboard/ChannelOwnerDashboard.tsx @@ -149,10 +149,10 @@ const ChannelOwnerDashboard = () => { } const showEditChannel = () => { - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } + // if (!userPushSDKInstance.signer) { + // handleConnectWallet(); + // return; + // } setEditChannel(true); } From 7e1b0946d174461857f5d9d4c12aa48feddb2b4d Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Tue, 27 Feb 2024 13:01:50 +0530 Subject: [PATCH 06/23] Removed consoles --- src/contexts/AppContext.tsx | 5 ----- src/segments/Feedbox.tsx | 3 --- 2 files changed, 8 deletions(-) diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index 23adaf292b..4bf45e1410 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -66,12 +66,10 @@ const AppContextProvider = ({ children }) => { } if (wallet?.accounts?.length > 0) { - console.log('Wallet connected',wallet); const userPushInstance = await initializePushSDK(); return userPushInstance; } else { const walletConnected = await connect(); - console.log("Wallet connected",walletConnected); return null; } @@ -81,7 +79,6 @@ const AppContextProvider = ({ children }) => { const initialisePushSdkGuestMode = async () => { - console.log("Initialising Push SDK Guest Mode"); let userInstance; userInstance = await PushAPI.initialize({ account: '0x0000000000000000000000000000000000000001', @@ -96,7 +93,6 @@ const AppContextProvider = ({ children }) => { env: appConfig.appEnv, account: account, }); - console.log("User Instance in read Mode",userInstance); dispatch(setUserPushSDKInstance(userInstance)); return userInstance; } @@ -220,7 +216,6 @@ const AppContextProvider = ({ children }) => { account: account, progressHook: onboardingProgressReformatter, }); - console.log("User Push SDK instance in App Context >>",userInstance); if (userInstance) { setBlockedLoading({ enabled: false, diff --git a/src/segments/Feedbox.tsx b/src/segments/Feedbox.tsx index 189faa29c5..89d9a2dda0 100644 --- a/src/segments/Feedbox.tsx +++ b/src/segments/Feedbox.tsx @@ -176,13 +176,11 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { setBgUpdateLoading(true); setLoading(true); try { - console.log("User Push sdk instance in fetch latest notifications",userPushSDKInstance); const results = await await userPushSDKInstance.notification.list('INBOX', { raw: true, page: 1, limit: NOTIFICATIONS_PER_PAGE }); - console.log("REsults >>>>",results); if (!notifications.length) { dispatch(incrementPage()); } @@ -247,7 +245,6 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { }; React.useEffect(() => { - console.log("User Push sdk instance",userPushSDKInstance,readOnlyWallet); if (userPushSDKInstance?.account == readOnlyWallet) return; fetchLatestNotifications(); fetchAllNotif(); From 7f43ee3b4a406f3fc2eb7e3f5dea43a2fe135b0d Mon Sep 17 00:00:00 2001 From: Harsh Rajat Date: Tue, 27 Feb 2024 23:35:56 +0530 Subject: [PATCH 07/23] channel profile page initial setup --- src/components/ViewChannelItem.js | 538 +++++++++++----------- src/modules/channels/ChannelsModule.tsx | 14 +- src/pages/ChannelsPage.js | 12 +- src/segments/ChannelProfile.tsx | 577 ++++++++++++++++++++++++ src/segments/ViewChannels.tsx | 38 +- src/structure/MasterInterfacePage.tsx | 98 +++- 6 files changed, 974 insertions(+), 303 deletions(-) create mode 100644 src/segments/ChannelProfile.tsx diff --git a/src/components/ViewChannelItem.js b/src/components/ViewChannelItem.js index 1f7ff7dee2..7c5f564c8b 100644 --- a/src/components/ViewChannelItem.js +++ b/src/components/ViewChannelItem.js @@ -3,46 +3,52 @@ import React, { useContext, useEffect, useMemo } from 'react'; // External Packages import Skeleton from '@yisheng90/react-loading'; +import axios from 'axios'; +import { cloneDeep } from 'lodash'; import { GoVerified } from 'react-icons/go'; import { IoMdPeople } from 'react-icons/io'; import { MdCheckCircle, MdError } from 'react-icons/md'; import { useDispatch, useSelector } from 'react-redux'; +import { useNavigate } from 'react-router-dom'; import { toast as toaster } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.min.css'; import styled, { css, useTheme } from 'styled-components'; -import axios from 'axios'; -import { cloneDeep } from 'lodash'; // Internal Compoonents import * as PushAPI from '@pushprotocol/restapi'; import { Device } from 'assets/Device'; import MetaInfoDisplayer from 'components/MetaInfoDisplayer'; import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; +import { + ButtonV2, +} from 'components/reusables/SharedStylingV2'; import { convertAddressToAddrCaip } from 'helpers/CaipHelper'; +import { isAddressEqual, LOGO_FROM_CHAIN_ID, MaskedAliasChannels, shortenText } from 'helpers/UtilityHelper'; import useToast from 'hooks/useToast'; import { cacheChannelInfo } from 'redux/slices/channelSlice'; import { addNewWelcomeNotif, incrementStepIndex } from 'redux/slices/userJourneySlice'; import ChannelTutorial, { isChannelTutorialized } from 'segments/ChannelTutorial'; +import ChannelsDataStore from 'singletons/ChannelsDataStore'; import NotificationToast from '../primaries/NotificationToast'; import { Image, ItemH, Span } from '../primaries/SharedStyling'; -import { isAddressEqual, LOGO_FROM_CHAIN_ID, MaskedAliasChannels, shortenText } from 'helpers/UtilityHelper'; -import ChannelsDataStore from 'singletons/ChannelsDataStore'; // Internal Configs +import { Button } from '@mui/material'; import { addresses, appConfig, CHAIN_DETAILS } from 'config'; -import Tooltip from './reusables/tooltip/Tooltip'; -import UpdateChannelTooltipContent from './UpdateChannelTooltipContent'; -import InfoImage from '../assets/info.svg'; -import VerifiedTooltipContent from "./VerifiedTooltipContent"; +import APP_PATHS from "config/AppPaths"; +import { AppContext } from 'contexts/AppContext'; import { IPFSGateway } from 'helpers/IpfsHelper'; import { useAccount, useDeviceWidthCheck } from 'hooks'; +import InfoImage from '../assets/info.svg'; import ManageNotifSettingDropdown from './dropdowns/ManageNotifSettingDropdown'; import OptinNotifSettingDropdown from './dropdowns/OptinNotifSettingDropdown'; import { ImageV2 } from './reusables/SharedStylingV2'; -import { AppContext } from 'contexts/AppContext'; +import Tooltip from './reusables/tooltip/Tooltip'; +import UpdateChannelTooltipContent from './UpdateChannelTooltipContent'; +import VerifiedTooltipContent from "./VerifiedTooltipContent"; // Create Header -function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser }) { +function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) { const dispatch = useDispatch(); const themes = useTheme(); @@ -81,6 +87,9 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser }) { const isMobile = useDeviceWidthCheck(600); const mobileToolTip = useDeviceWidthCheck(500); + // Setup navigation + const navigate = useNavigate(); + // ------ toast related section const isChannelBlacklisted = CHANNEL_BLACKLIST.includes(channelObject.channel); const [toast, showToast] = React.useState(null); @@ -358,6 +367,22 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser }) { } }; + const generateChannelProfileLink = (address, attachhost) => { + let url = `${APP_PATHS.Channels}/${address}`; + + if (attachhost) { + let hostname = window.location.hostname; + // if we are on localhost, attach the port + if (hostname === 'localhost') { + hostname = hostname + ':3000'; + } + + url = `${hostname}/${url}`; + } + + return url; + } + const correctChannelTitleLink = () => { const channelLink = CTA_OVERRIDE_CACHE[channelObject.channel] || channelObject.url; if (/(?:http|https):\/\//i.test(channelLink)) { @@ -384,10 +409,11 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser }) { {isMobile && ( - + {loading ? ( @@ -545,7 +571,13 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser }) { {!isMobile && ( <> - + { + console.log(generateChannelProfileLink(channelObject.channel, false)); + navigate(generateChannelProfileLink(channelObject.channel, false)) + }} + > {loading ? ( @@ -562,249 +594,252 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser }) { )} - - {!isMobile && ( - - {loading ? ( - - ) : ( - - - {showChannelChangedWarning && ( - - } - > -
{ - handleHeight(channelObject.channel); - }} - style={{ cursor: 'pointer' }} - > - -
- - )} - - correctChannelTitleLink()}>{channelObject.name} - - - {isVerified == 1 && ( - + {!minimal && + + {!isMobile && ( + + {loading ? ( + + ) : ( + + + {showChannelChangedWarning && ( } > - {/* TODO: HAS TO BE CHANGED TO A i icon */}
{ handleHeight(channelObject.channel); }} + style={{ cursor: 'pointer' }} > - +
- - )} - {channelObject && channelObject?.channel && ( - - Ethereum - - )} - {channelObject && - channelObject?.alias_address != null && - channelObject?.alias_address != 'NULL' && - appConfig.allowedNetworks.includes(+channelObject?.alias_blockchain_id) && - !MaskedAliasChannels[+channelObject?.alias_blockchain_id][channelObject?.channel] && ( + )} + + correctChannelTitleLink()}>{channelObject.name} + + + {isVerified == 1 && ( + + + } + > + {/* TODO: HAS TO BE CHANGED TO A i icon */} +
{ + handleHeight(channelObject.channel); + }} + > + +
+ + + )} + {channelObject && channelObject?.channel && ( Alias Chain Logo )} - - - )} - - )} - - - {loading ? ( - <> - - - + {channelObject && + channelObject?.alias_address != null && + channelObject?.alias_address != 'NULL' && + appConfig.allowedNetworks.includes(+channelObject?.alias_blockchain_id) && + !MaskedAliasChannels[+channelObject?.alias_blockchain_id][channelObject?.channel] && ( + + Alias Chain Logo + + )} + + + )} + + )} - - - + + {loading ? ( + <> + + + - - - - - ) : ( - {channelObject.info} - )} - - - - {loading ? ( - <> - - - - - ) : ( - - - - } - internalIcon={null} - text={subscriberCount} - padding="5.3px 10px" - bgColor={themes.viewChannelSecondaryBG} - color={themes.viewChannelSecondaryText} - /> + + + - { - copyToClipboard(channelObject.channel); - setCopyText('copied'); - }} - onMouseEnter={() => { - setCopyText('click to copy'); - }} - onMouseLeave={() => { - setCopyText(channelObject.channel); - }} - /> + + + + + ) : ( + {channelObject.info} + )} + + + + {loading ? ( + <> + + + + + ) : ( + + + + } + internalIcon={null} + text={subscriberCount} + padding="5.3px 10px" + bgColor={themes.viewChannelSecondaryBG} + color={themes.viewChannelSecondaryText} + /> - {isChannelTutorialized(channelObject.channel) && ( - { + copyToClipboard(channelObject.channel); + setCopyText('copied'); + }} + onMouseEnter={() => { + setCopyText('click to copy'); + }} + onMouseLeave={() => { + setCopyText(channelObject.channel); + }} /> - )} - - - )} - - - {!!account && !!provider && ( + + {isChannelTutorialized(channelObject.channel) && ( + + )} + + + )} + + + } + + {!!account && !!provider && !minimal && ( <> @@ -961,19 +996,19 @@ const Container = styled.div` flex: 1; display: flex; flex-wrap: wrap; - border: 1px solid ${(props) => props.theme.default.border}; + border: 1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}; border-bottom: none; border-left: none; border-right: none; margin: 0px 5px; justify-content: center; - padding: 25px 10px; + padding: ${(props) => props.minimal ? '5px 0px' : '25px 10px'}; align-self: stretch; @media (max-width: 768px) { display: flex; flex-direction: column; - border-bottom: 1px solid ${(props) => props.theme.default.border}; + border-bottom: 1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}; border-top: none; border-left: none; border-right: none; @@ -989,17 +1024,44 @@ const SkeletonWrapper = styled.div` margin-right: ${(props) => props.marginRight || 0}px; `; -const ChannelLogoContainer = styled.div` +const ChannelLogoImg = styled.img` + object-fit: contain; + width: 100%; + border-radius: 20px; + overflow: hidden; +`; + +const ChannelLogoInner = styled.div` + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + overflow: hidden; + border-radius: 20px; display: flex; + justify-content: center; + align-items: center; + @media (max-width: 600px) { + width: 78px; + height: 78px; + } `; -const ChannelLogo = styled.div` +const ChannelLogoOuter = styled.div` + padding-top: 100%; + width: 100%; + position: relative; +`; + +const ChannelLogo = styled(ButtonV2)` max-width: 100px; min-width: 32px; flex: 1; margin: 5px; padding: 10px; border: 1px solid ${(props) => props.theme.viewChannelIconBorder}; + background: transparent; overflow: hidden; border-radius: 20px; display: flex; @@ -1014,38 +1076,11 @@ const ChannelLogo = styled.div` @media (max-width: 600px) { align-self: center; - min-width: 78px; - min-height: 78px; } `; -const ChannelLogoOuter = styled.div` - padding-top: 100%; - position: relative; -`; - -const ChannelLogoInner = styled.div` - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - overflow: hidden; - border-radius: 20px; +const ChannelLogoContainer = styled.div` display: flex; - justify-content: center; - align-items: center; - @media (max-width: 600px) { - width: 78px; - height: 78px; - } -`; - -const ChannelLogoImg = styled.img` - object-fit: contain; - width: 100%; - border-radius: 20px; - overflow: hidden; `; const ImageInfo = styled.img` @@ -1273,12 +1308,13 @@ const LineBreak = styled.div` const ChannelActions = styled.div` margin: 5px; - flex-grow: 1; + flex: 0; // max-width: 250px; display: flex; - justify-content: flex-end; + justify-content: center; // justify-content: center; align-items: center; + gap: 20px; @media (max-width: 768px) { align-self: center; } diff --git a/src/modules/channels/ChannelsModule.tsx b/src/modules/channels/ChannelsModule.tsx index 5b902d188e..0d1c401086 100644 --- a/src/modules/channels/ChannelsModule.tsx +++ b/src/modules/channels/ChannelsModule.tsx @@ -1,26 +1,30 @@ // React + Web3 Essentials -import React from "react"; -import ReactGA from "react-ga";; +import React, { useEffect } from "react"; +import ReactGA from "react-ga"; // External Packages import styled from "styled-components"; // Internal Components +import ChannelProfile from "segments/ChannelProfile"; import ViewChannels from "segments/ViewChannels"; // Internal Configs -import GLOBALS, { device, globalsMargin } from "config/Globals"; import APP_PATHS from "config/AppPaths"; +import GLOBALS, { device, globalsMargin } from "config/Globals"; // Create Channels Module -const ChannelsModule = ({ loadTeaser, playTeaser }) => { +const ChannelsModule = ({ channelID, loadTeaser, playTeaser }) => { ReactGA.pageview(APP_PATHS.Channels); // Render return ( - + + {channelID && + + } ); diff --git a/src/pages/ChannelsPage.js b/src/pages/ChannelsPage.js index 0887e46fd5..64afe6fac2 100644 --- a/src/pages/ChannelsPage.js +++ b/src/pages/ChannelsPage.js @@ -1,7 +1,8 @@ // React + Web3 Essentials -import React, { useState } from "react"; +import React, { useEffect } from "react"; // External Packages +import { useNavigate, useParams, useSearchParams } from 'react-router-dom'; import styled from 'styled-components'; // Internal Components @@ -9,14 +10,19 @@ import { SectionV2 } from 'components/reusables/SharedStylingV2'; import ChannelsModule from "modules/channels/ChannelsModule"; // Internal Configs +import APP_PATHS from "config/AppPaths"; import GLOBALS from "config/Globals"; // Other Information section -const ChannelsPage = ({ loadTeaser, playTeaser }) => { +const ChannelsPage = ({ loadTeaser, playTeaser, channelID }) => { + let { channelid } = useParams(); + console.log("Channel ID:", channelid) + const calculatedChannelID = channelid ? channelid : channelID; + // RENDER return ( - + ); } diff --git a/src/segments/ChannelProfile.tsx b/src/segments/ChannelProfile.tsx new file mode 100644 index 0000000000..dadebccd3a --- /dev/null +++ b/src/segments/ChannelProfile.tsx @@ -0,0 +1,577 @@ +// React + Web3 Essentials +import React, { useContext } from "react"; + +// External Packages +import { useDispatch, useSelector } from "react-redux"; +import { toast as toaster } from "react-toastify"; +import { useClickAway } from "react-use"; +import { Waypoint } from "react-waypoint"; +import styled, { ThemeProvider, useTheme } from "styled-components"; + +// Internal Compoonents +import * as PushAPI from "@pushprotocol/restapi"; +import { NotificationItem } from "@pushprotocol/uiweb"; +import { ReactComponent as OpenLink } from 'assets/PushSnaps/GoToImage.svg'; +import { ReactComponent as MetamaskLogo } from 'assets/PushSnaps/metamasksnap.svg'; +import { ReactComponent as Close } from 'assets/chat/group-chat/close.svg'; +import SearchFilter from "components/SearchFilter"; +import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; +import { convertAddressToAddrCaip } from "helpers/CaipHelper"; +import CryptoHelper from "helpers/CryptoHelper"; +import { useAccount, useDeviceWidthCheck } from "hooks"; +import { Item } from "primaries/SharedStyling"; +import { + addPaginatedNotifications, + incrementPage, + setFinishedFetching, + updateTopNotifications +} from "redux/slices/notificationSlice"; +import DisplayNotice from "../primaries/DisplayNotice"; +import NotificationToast from "../primaries/NotificationToast"; +import { ScrollItem } from "./ViewChannels"; + +// Internal Configs +import { Image } from "components/SharedStyling"; +import { ItemHV2, SpanV2 } from "components/reusables/SharedStylingV2"; +import { appConfig } from "config"; +import { device } from "config/Globals"; +import { useNavigate } from "react-router-dom"; + +// Constants +const NOTIFICATIONS_PER_PAGE = 10; + +// Create Header +const ChannelProfile = ({ showFilter, setShowFilter, search, setSearch, channelID }) => { + const dispatch = useDispatch(); + const { userPushSDKInstance } = useSelector((state: any) => { + return state.user; + }); + const modalRef = React.useRef(null); + useClickAway(modalRef, () => showFilter && setShowFilter(false)); + + const { account, provider, chainId } = useAccount(); + const { notifications, page, finishedFetching, toggle } = useSelector( + (state: any) => state.notifications + ); + + const themes = useTheme(); + let user = convertAddressToAddrCaip(account, chainId) + + // toast related section + const [toast, showToast] = React.useState(null); + const clearToast = () => showToast(null); + + const { run, welcomeNotifs } = useSelector((state: any) => state.userJourney); + + const [limit, setLimit] = React.useState(10); + const [allNotf, setNotif] = React.useState([]); + const [filteredNotifications, setFilteredNotifications] = React.useState([]); + const [filter, setFilter] = React.useState(false); + const [allFilter, setAllFilter] = React.useState([]); + const [loadFilter, setLoadFilter] = React.useState(false); + const [bgUpdateLoading, setBgUpdateLoading] = React.useState(false); + const [loading, setLoading] = React.useState(false); + + const [showSnapInfo, setShowSnapInfo] = React.useState(true); + + const navigate = useNavigate(); + const navigateToSnaps = () => { + navigate('/snap'); + }; + + const NormalToast = ({ msg }) => ( + + {msg} + + ) + + //clear toast variable after it is shown + React.useEffect(() => { + if (toast) { + clearToast(); + } + }, [toast]); + + const reset = () => setFilter(false); + const filterNotifications = async (query, channels, startDate, endDate) => { + if (startDate == null) startDate = new Date('January 1, 2000'); + if (endDate == null) endDate = new Date('January 1, 3000'); + startDate = startDate.getTime() / 1000; + endDate = endDate.getTime() / 1000; + + if (loading) return; + setBgUpdateLoading(true); + setLoading(true); + setFilter(true); + var Filter = { + channels: channels, + date: { lowDate: startDate, highDate: endDate } + }; + if (channels.length == 0) delete Filter.channels; + + setFilteredNotifications([]); + try { + let filterNotif = []; + for (const notif of allNotf) { + let timestamp; + const matches = notif.message.match(/\[timestamp:(.*?)\]/); + if (matches) { + timestamp = matches[1]; + } + else timestamp = notif.epoch; + if ( + ((Filter.channels === undefined ? true : (Filter.channels.includes(notif.channel))) && + timestamp >= startDate && timestamp <= endDate + && (query === "" || notif.message.toLowerCase().includes(query.toLowerCase()))) + ) + filterNotif.push(notif); + } + const newNotifs = filterNotif + setAllFilter(newNotifs) + } catch (err) { + console.error(err); + } finally { + setLoading(false); + setBgUpdateLoading(false); + } + } + + React.useEffect(() => { + // console.log(allFilter) + setFilteredNotifications(allFilter) + }, [allFilter]) + + const loadNotifications = async () => { + if (loading || finishedFetching || !userPushSDKInstance) return; + setLoading(true); + try { + // const { count, results } = await PushAPI.fetchNotifications({ + // user: account, + // pageSize: NOTIFICATIONS_PER_PAGE, + // page, + // chainId, + // dev: true, + // }); + const results = await userPushSDKInstance.notification.list('INBOX', { + raw: true, + page: page, + limit: NOTIFICATIONS_PER_PAGE + }); + const parsedResponse = PushAPI.utils.parseApiResponse(results); + dispatch(addPaginatedNotifications(parsedResponse)); + if (parsedResponse.length === 0) { + dispatch(setFinishedFetching()); + } + } catch (err) { + console.error(err); + } finally { + setLoading(false); + } + }; + const fetchLatestNotifications = async () => { + if (loading || bgUpdateLoading) return; + setBgUpdateLoading(true); + setLoading(true); + try { + const results = await await userPushSDKInstance.notification.list('INBOX', { + raw: true, + page: 1, + limit: NOTIFICATIONS_PER_PAGE + }); + if (!notifications.length) { + dispatch(incrementPage()); + } + const parsedResponse = PushAPI.utils.parseApiResponse(results); + const map1 = new Map(); + const map2 = new Map(); + results.forEach(each => { + map1.set(each.payload.data.sid, each.epoch); + map2.set(each.payload.data.sid, each.sender); + }) + parsedResponse.forEach(each => { + each['date'] = map1.get(each.sid); + each['epoch'] = (new Date(each['date']).getTime() / 1000); + each['channel'] = map2.get(each.sid); + }) + dispatch( + updateTopNotifications({ + notifs: parsedResponse, + pageSize: NOTIFICATIONS_PER_PAGE, + }) + ); + if (parsedResponse.length === 0) { + dispatch(setFinishedFetching()); + } + } catch (err) { + console.error(err); + } finally { + setBgUpdateLoading(false); + setLoading(false); + } + }; + + const fetchAllNotif = async () => { + setLoadFilter(true); + try { + const results = await userPushSDKInstance.notification.list('INBOX', { + limit: 100000, + page: page, + raw: true + }); + if (!notifications.length) { + dispatch(incrementPage()); + } + const parsedResponse = PushAPI.utils.parseApiResponse(results); + const map1 = new Map(); + const map2 = new Map(); + results.forEach(each => { + map1.set(each.payload.data.sid, each.epoch); + map2.set(each.payload.data.sid, each.sender); + }) + parsedResponse.forEach(each => { + each['date'] = map1.get(each.sid); + each['epoch'] = (new Date(each['date']).getTime() / 1000); + each['channel'] = map2.get(each.sid); + }) + setNotif(parsedResponse); + } catch (err) { + console.error(err); + } finally { + setLoadFilter(false); + } + }; + + React.useEffect(() => { + if (!userPushSDKInstance) return; + fetchLatestNotifications(); + fetchAllNotif(); + }, [toggle, userPushSDKInstance]); + + //function to query more notifications + const handlePagination = async () => { + if (filter) { + setLimit(limit + 10); + } + else { + loadNotifications(); + dispatch(incrementPage()); + } + }; + + const showWayPoint = (index: any) => { + if (!filter) { + return ( + Number(index) === notifications.length - 1 && + !finishedFetching && + !bgUpdateLoading + ); + } + else { + return ( + Number(index) === limit - 1 + ); + } + + }; + + const onDecrypt = async ({ secret, title, message, image, cta }) => { + let txToast; + try { + let decryptedSecret = await CryptoHelper.decryptWithWalletRPCMethod(provider, secret, account); + // let decryptedSecret = await CryptoHelper.decryptWithWalletRPCMethod(library.provider, secret, account); + + // decrypt notification message + const decryptedBody = await CryptoHelper.decryptWithAES(message, decryptedSecret); + + // decrypt notification title + let decryptedTitle = await CryptoHelper.decryptWithAES(title, decryptedSecret); + + // decrypt notification image + let decryptedImage = await CryptoHelper.decryptWithAES(image, decryptedSecret); + + // decrypt notification cta + let decryptedCta = await CryptoHelper.decryptWithAES(cta, decryptedSecret); + return { title: decryptedTitle, body: decryptedBody, image: decryptedImage, cta: decryptedCta }; + } catch (error) { + if (error.code === 4001) { + // EIP-1193 userRejectedRequest error + console.error(error); + txToast = toaster.dark( + , + { + position: "bottom-right", + type: toaster.TYPE.ERROR, + autoClose: 5000, + hideProgressBar: true, + closeOnClick: true, + pauseOnHover: true, + draggable: true, + progress: undefined, + } + ); + } else if (error.code === -32601) { + console.error(error); + txToast = toaster.dark( + , + { + position: "bottom-right", + type: toaster.TYPE.ERROR, + autoClose: 5000, + hideProgressBar: true, + closeOnClick: true, + pauseOnHover: true, + draggable: true, + progress: undefined, + } + ); + } else { + console.error(error); + txToast = toaster.dark( + , + { + position: "bottom-right", + type: toaster.TYPE.ERROR, + autoClose: 5000, + hideProgressBar: true, + closeOnClick: true, + pauseOnHover: true, + draggable: true, + progress: undefined, + } + ); + } + } + }; + + // Render + return ( + + +
+ +
+ + + {showSnapInfo && ( + <> + + + + Get Notifications directly in MetaMask using Push Snap. + Install Push Snap + + { + setShowSnapInfo(false); + }}/> + + + + )} + + {((!run && !notifications.length) || + (!run && filter && !filteredNotifications.length) || + (run && !welcomeNotifs.length)) && + !loading && ( +
+ +
+ )} + {notifications && ( + + {bgUpdateLoading && ( + + + + )} + {run && + welcomeNotifs.map((oneNotification, index) => { + const { + cta, + title, + message, + app, + icon, + image, + blockchain, + url + } = oneNotification; + + // render the notification item + return ( + + + + ); + })} + {(filter + ? filteredNotifications + : notifications + ).map((oneNotification, index) => { + const { + cta, + title, + message, + app, + icon, + image, + secret, + notification, + blockchain, + url + } = oneNotification; + if (run) return; + // render the notification item + return ( + + {showWayPoint(index) && ( + handlePagination()} /> + )} + + onDecrypt({ secret, title, message, image, cta }) + } + chainName={blockchain} + theme={themes.scheme} + url={url} + /> + + ); + })} + + {loading && !bgUpdateLoading && ( + + + + )} + + )} + + {toast && ( + + )} + + + + ); +} + +// css styles +const Container = styled.div` + display: flex; + flex: 1; + flex-direction: column; + height: 85%; + align-content: center; + align-items: center; + justify-content: center; + font-weight: 200; + margin: 0 0 0 10px; + @media ${device.tablet} { + height: 74%; + } +`; + +const NotifsOuter = styled.div` + margin: 25px 0px; +`; + +const Notifs = styled.div` + align-self: stretch; + flex: 1; +`; + +const Toaster = styled.div` + display: flex; + flex-direction: row; + align-items: center; + margin: 0px 10px; +`; + +const ToasterMsg = styled.div` + margin: 0px 10px; +`; + +const SnapSection = styled(ItemHV2)` + max-height:28px; + margin-top:20px; + border-radius: 12px; + border: 1px solid #D4DCEA; + background: #FFF; + border: 1px solid ${(props) => props.theme.default.border}; + background:${(props) => props.theme.default.bg}; + padding: 12px 16px; + align-items: center; + gap: 16px; + + @media ${device.tablet} { + gap: 9px; + margin-right:10px; + } + + @media (max-width:525px) { + max-height:50px; + } +` + +const InstallText = styled(ItemHV2)` + @media ${device.tablet} { + flex-direction:column; + align-items: baseline; + display: block; + align-self: auto; + } + +` + +const CloseButton = styled(Close)` + cursor:pointer; + height:20px; + width:20px; + + + +` + +const InstallPushSnap = styled(SpanV2)` + cursor:pointer; + font-size:14px; + font-weight:500; + color:#D53A94; + + &:hover{ + text-decoration:underline; + text-underline-position: under; + } +` + +// Export Default +export default ChannelProfile; \ No newline at end of file diff --git a/src/segments/ViewChannels.tsx b/src/segments/ViewChannels.tsx index 95ad74ff7c..4917e8c427 100644 --- a/src/segments/ViewChannels.tsx +++ b/src/segments/ViewChannels.tsx @@ -2,31 +2,31 @@ import React, { useContext, useEffect, useRef, useState } from 'react'; // External Packages +import { AiOutlineSearch } from 'react-icons/ai'; import { useDispatch, useSelector } from 'react-redux'; import { Waypoint } from 'react-waypoint'; import styled, { useTheme } from 'styled-components'; -import { AiOutlineSearch } from 'react-icons/ai'; // Internal Compoonents +import ChainsSelect from 'components/ChainsSelect'; import Faucets from 'components/Faucets'; -import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; import ViewChannelItem from 'components/ViewChannelItem'; +import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; +import { convertAddressToAddrCaip } from 'helpers/CaipHelper'; import UtilityHelper, { MaskedAliasChannels, MaskedChannels } from 'helpers/UtilityHelper'; +import { useAccount } from 'hooks'; import { incrementPage, setChannelMeta, updateBulkSubscriptions, updateBulkUserSettings } from 'redux/slices/channelSlice'; import { incrementStepIndex } from 'redux/slices/userJourneySlice'; +import { getChannels, getChannelsSearch } from 'services'; // Api Services import DisplayNotice from '../primaries/DisplayNotice'; import { Item, ItemH } from '../primaries/SharedStyling'; -import { convertAddressToAddrCaip } from 'helpers/CaipHelper'; -import ChainsSelect from 'components/ChainsSelect'; -import { getChannels, getChannelsSearch } from 'services'; // Api Services -import { useAccount } from 'hooks'; // Internal Configs -import { appConfig } from 'config'; -import InfoImage from "../assets/info.svg"; -import Tooltip from 'components/reusables/tooltip/Tooltip'; import UpdateChannelTooltipContent from 'components/UpdateChannelTooltipContent'; +import Tooltip from 'components/reusables/tooltip/Tooltip'; +import { appConfig } from 'config'; import { AppContext } from 'contexts/AppContext'; +import InfoImage from "../assets/info.svg"; // import Tooltip from './reusables/tooltip/Tooltip'; // import UpdateChannelTooltipContent from './UpdateChannelTooltipContent'; @@ -40,7 +40,7 @@ const SEARCH_DELAY = 1500; const SEARCH_LIMIT = 10; // Create Header -function ViewChannels({ loadTeaser, playTeaser }) { +function ViewChannels({ loadTeaser, playTeaser, minimal }) { const theme = useTheme(); const dispatch = useDispatch(); const { userPushSDKInstance } = useSelector((state: any) => { @@ -208,19 +208,9 @@ function ViewChannels({ loadTeaser, playTeaser }) { })(); }, [account, userPushSDKInstance]); - useEffect(() => { - const parsedChannel = window.location.href.toString().slice(window.location.href.toString().length - 42); - if (!ADDRESS_REGEX.test(parsedChannel)) return; - setTimeout(() => { - setSearch(parsedChannel); - }, SEARCH_DELAY); - }, []); - return ( - - - - {!loading && ( + + {!loading && !minimal && ( )} @@ -409,7 +399,7 @@ const ItemBar = styled.div` const Container = styled.div` display: flex; - flex: 1; + flex: ${props => props.minimal ? 0 : 1}; flex-direction: column; font-weight: 200; align-content: center; diff --git a/src/structure/MasterInterfacePage.tsx b/src/structure/MasterInterfacePage.tsx index 8e62dbdf32..3d9c8a7f15 100644 --- a/src/structure/MasterInterfacePage.tsx +++ b/src/structure/MasterInterfacePage.tsx @@ -2,13 +2,13 @@ import React, { lazy, Suspense } from 'react'; // External Packages +import useToast from 'hooks/useToast'; +import { MdError } from 'react-icons/md'; import { VscClose } from 'react-icons/vsc'; -import { Navigate, Route, Routes, useLocation } from 'react-router-dom'; +import { Navigate, redirect, Route, Routes, useLocation, useNavigate, useSearchParams } from 'react-router-dom'; import { ToastContainer } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.min.css'; import styled from 'styled-components'; -import { MdError } from 'react-icons/md'; -import useToast from 'hooks/useToast'; // Internal Components import LoaderSpinner, { LOADER_OVERLAY, LOADER_TYPE, PROGRESS_POSITIONING } from 'components/reusables/loaders/LoaderSpinner'; @@ -57,24 +57,30 @@ const UserSettingsPage = lazy(() => import('pages/UserSettingsPage')); // Internal Configs import { ItemVV2 } from 'components/reusables/SharedStylingV2'; +import APP_PATHS from 'config/AppPaths'; import GLOBALS from 'config/Globals'; +import { AppContext } from 'contexts/AppContext'; import { ethers } from 'ethers'; import CryptoHelper from 'helpers/CryptoHelper'; import * as w2wHelper from 'helpers/w2w'; -import { ConnectedUser, Feeds, User } from 'types/chat'; +import { MODAL_POSITION } from 'hooks/useModalBlur'; +import MetamaskPushSnapModal from 'modules/receiveNotifs/MetamaskPushSnapModal'; import SnapPage from 'pages/SnapPage'; -import { AppContext } from 'contexts/AppContext'; +import { ConnectedUser, Feeds, User } from 'types/chat'; import { AppContextType } from 'types/context'; -import MetamaskPushSnapModal from 'modules/receiveNotifs/MetamaskPushSnapModal'; -import { MODAL_POSITION } from 'hooks/useModalBlur'; -import APP_PATHS from 'config/AppPaths'; // Create Header function MasterInterfacePage() { + // Get search params + const [searchParams, setSearchParams] = useSearchParams(); + + // get location + const location = useLocation(); + const { hash, pathname, search } = location; + // Master Interface controls settings const [playTeaserVideo, setPlayTeaserVideo] = React.useState(false); const [loadTeaserVideo, setLoadTeaserVideo] = React.useState(null); - const location = useLocation(); const { MetamaskPushSnapModalComponent, blockedLoading }: AppContextType = React.useContext(AppContext); @@ -85,6 +91,46 @@ function MasterInterfacePage() { showMetamaskPushSnap(); } }, [location]); + + // Check location and change it if search param is present + // Get nativage from useNavigate + const navigate = useNavigate(); + + // if (searchParams.get('channel')) { + // if (channelid !== searchParams.get('channel')) { + // channelid = searchParams.get('channel'); + // console.log('channel search', searchParams.get('channel')); + // navigate(`/chek`, { replace: true, relative: true }); + // } + // } + + + // // For redirecting if required + // React.useEffect(() => { + // const checkAndRedirect = () => { + // if (location.pathname === APP_PATHS.Channels && searchParams.get('channel')) { + // const navigate = useNavigate(); + + // const channelId = searchParams.get('channel'); + // console.log('redirecting to channel', `${APP_PATHS.Channels}/${channelId}`); + // navigate({ pathname: `${APP_PATHS.Channels}/${channelId}` }); + // } + // } + + // checkAndRedirect(); + // }, []); + + const ChannelsProfilePage = () => { + const channelid = searchParams.get('channel'); + console.log("I am here"); + return ; + }; + + // For toast const blockedLoadingToast = useToast(); // Render @@ -104,23 +150,35 @@ function MasterInterfacePage() { } /> } /> + {/* }> */} - } /> - } /> - } /> - } /> - {/* } /> */} + } /> + } /> + } /> + } /> + {/* } /> */} {/* */} + {/* Enable Channel specific routes */} + {/* } + /> */} + + } + /> + - } + element={} /> + } From 6c7cd95241a8516db1d22b8787e879b76fcbb92d Mon Sep 17 00:00:00 2001 From: Harsh Rajat Date: Wed, 28 Feb 2024 01:02:54 +0530 Subject: [PATCH 08/23] Channel Profile initial rerouting done --- src/components/ViewChannelItem.js | 268 +++++++-------- src/pages/ChannelsPage.js | 1 - src/segments/ChannelProfile.tsx | 470 +------------------------- src/segments/ViewChannels.tsx | 8 +- src/structure/MasterInterfacePage.tsx | 11 +- 5 files changed, 156 insertions(+), 602 deletions(-) diff --git a/src/components/ViewChannelItem.js b/src/components/ViewChannelItem.js index 7c5f564c8b..2ed8cd9e47 100644 --- a/src/components/ViewChannelItem.js +++ b/src/components/ViewChannelItem.js @@ -415,7 +415,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) - + {loading ? ( - - - {loading ? ( - - ) : ( - - - - {showChannelChangedWarning && ( - - } - > -
{ - handleHeight(channelObject.channel); + + {!minimal && + + {loading ? ( + + ) : ( + + + + {showChannelChangedWarning && ( + + } > - -
- - )} +
{ + handleHeight(channelObject.channel); + }} + > + +
+ + )} - correctChannelTitleLink()}>{channelObject.name} - + correctChannelTitleLink()}>{channelObject.name} + - {isVerified == 1 && ( - - - } + {isVerified == 1 && ( + - {/* TODO: HAS TO BE CHANGED TO A i icon */} -
{ - handleHeight(channelObject.channel); + + } > - -
- + {/* TODO: HAS TO BE CHANGED TO A i icon */} +
{ + handleHeight(channelObject.channel); + }} + > + +
+ - {channelObject && channelObject?.channel && ( - - Ethereum - - )} - {channelObject && - channelObject?.alias_address != null && - channelObject?.alias_address != 'NULL' && - appConfig.allowedNetworks.includes(+channelObject?.alias_blockchain_id) && - !MaskedAliasChannels[+channelObject?.alias_blockchain_id][channelObject?.channel] && ( + {channelObject && channelObject?.channel && ( Polygon )} - - )} - - - )} - + {channelObject && + channelObject?.alias_address != null && + channelObject?.alias_address != 'NULL' && + appConfig.allowedNetworks.includes(+channelObject?.alias_blockchain_id) && + !MaskedAliasChannels[+channelObject?.alias_blockchain_id][channelObject?.channel] && ( + + Polygon + + )} + + )} + + + )} + + } )} @@ -1038,14 +1040,11 @@ const ChannelLogoInner = styled.div` right: 0; bottom: 0; overflow: hidden; - border-radius: 20px; + border-radius: ${(props) => props.minimal ? '10px' : '20px'}; display: flex; justify-content: center; align-items: center; - @media (max-width: 600px) { - width: 78px; - height: 78px; - } + `; const ChannelLogoOuter = styled.div` @@ -1056,10 +1055,10 @@ const ChannelLogoOuter = styled.div` const ChannelLogo = styled(ButtonV2)` max-width: 100px; - min-width: 32px; + min-width: 48px; flex: 1; margin: 5px; - padding: 10px; + padding: ${props => props.minimal ? "5px" : "10px"}; border: 1px solid ${(props) => props.theme.viewChannelIconBorder}; background: transparent; overflow: hidden; @@ -1068,10 +1067,11 @@ const ChannelLogo = styled(ButtonV2)` flex-direction: column; justify-content: center; align-self: flex-start; + @media (max-width: 768px) { align-self: center; - min-width: 100px; - min-height: 100px; + min-width: ${props => props.minimal ? "48px" : "100px"}; + max-width: ${props => props.minimal ? "48px" : "100px"}; } @media (max-width: 600px) { diff --git a/src/pages/ChannelsPage.js b/src/pages/ChannelsPage.js index 64afe6fac2..b89293012a 100644 --- a/src/pages/ChannelsPage.js +++ b/src/pages/ChannelsPage.js @@ -16,7 +16,6 @@ import GLOBALS from "config/Globals"; // Other Information section const ChannelsPage = ({ loadTeaser, playTeaser, channelID }) => { let { channelid } = useParams(); - console.log("Channel ID:", channelid) const calculatedChannelID = channelid ? channelid : channelID; // RENDER diff --git a/src/segments/ChannelProfile.tsx b/src/segments/ChannelProfile.tsx index dadebccd3a..78ff988db6 100644 --- a/src/segments/ChannelProfile.tsx +++ b/src/segments/ChannelProfile.tsx @@ -1,486 +1,45 @@ // React + Web3 Essentials -import React, { useContext } from "react"; +import React from "react"; // External Packages import { useDispatch, useSelector } from "react-redux"; -import { toast as toaster } from "react-toastify"; import { useClickAway } from "react-use"; -import { Waypoint } from "react-waypoint"; -import styled, { ThemeProvider, useTheme } from "styled-components"; +import styled from "styled-components"; // Internal Compoonents -import * as PushAPI from "@pushprotocol/restapi"; -import { NotificationItem } from "@pushprotocol/uiweb"; -import { ReactComponent as OpenLink } from 'assets/PushSnaps/GoToImage.svg'; -import { ReactComponent as MetamaskLogo } from 'assets/PushSnaps/metamasksnap.svg'; import { ReactComponent as Close } from 'assets/chat/group-chat/close.svg'; -import SearchFilter from "components/SearchFilter"; -import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; -import { convertAddressToAddrCaip } from "helpers/CaipHelper"; -import CryptoHelper from "helpers/CryptoHelper"; -import { useAccount, useDeviceWidthCheck } from "hooks"; -import { Item } from "primaries/SharedStyling"; -import { - addPaginatedNotifications, - incrementPage, - setFinishedFetching, - updateTopNotifications -} from "redux/slices/notificationSlice"; -import DisplayNotice from "../primaries/DisplayNotice"; -import NotificationToast from "../primaries/NotificationToast"; +import ChannelLoading from "components/ChannelLoading"; import { ScrollItem } from "./ViewChannels"; // Internal Configs -import { Image } from "components/SharedStyling"; import { ItemHV2, SpanV2 } from "components/reusables/SharedStylingV2"; import { appConfig } from "config"; import { device } from "config/Globals"; -import { useNavigate } from "react-router-dom"; // Constants -const NOTIFICATIONS_PER_PAGE = 10; +const NOTIFICATIONS_PER_PAGE = 20; // Create Header -const ChannelProfile = ({ showFilter, setShowFilter, search, setSearch, channelID }) => { +const ChannelProfile = ({ channelID }) => { const dispatch = useDispatch(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; - }); + }); const modalRef = React.useRef(null); useClickAway(modalRef, () => showFilter && setShowFilter(false)); - const { account, provider, chainId } = useAccount(); - const { notifications, page, finishedFetching, toggle } = useSelector( - (state: any) => state.notifications - ); - - const themes = useTheme(); - let user = convertAddressToAddrCaip(account, chainId) - // toast related section - const [toast, showToast] = React.useState(null); - const clearToast = () => showToast(null); - - const { run, welcomeNotifs } = useSelector((state: any) => state.userJourney); - - const [limit, setLimit] = React.useState(10); - const [allNotf, setNotif] = React.useState([]); - const [filteredNotifications, setFilteredNotifications] = React.useState([]); - const [filter, setFilter] = React.useState(false); - const [allFilter, setAllFilter] = React.useState([]); - const [loadFilter, setLoadFilter] = React.useState(false); - const [bgUpdateLoading, setBgUpdateLoading] = React.useState(false); const [loading, setLoading] = React.useState(false); - const [showSnapInfo, setShowSnapInfo] = React.useState(true); - - const navigate = useNavigate(); - const navigateToSnaps = () => { - navigate('/snap'); - }; - - const NormalToast = ({ msg }) => ( - - {msg} - - ) - - //clear toast variable after it is shown - React.useEffect(() => { - if (toast) { - clearToast(); - } - }, [toast]); - - const reset = () => setFilter(false); - const filterNotifications = async (query, channels, startDate, endDate) => { - if (startDate == null) startDate = new Date('January 1, 2000'); - if (endDate == null) endDate = new Date('January 1, 3000'); - startDate = startDate.getTime() / 1000; - endDate = endDate.getTime() / 1000; - - if (loading) return; - setBgUpdateLoading(true); - setLoading(true); - setFilter(true); - var Filter = { - channels: channels, - date: { lowDate: startDate, highDate: endDate } - }; - if (channels.length == 0) delete Filter.channels; - - setFilteredNotifications([]); - try { - let filterNotif = []; - for (const notif of allNotf) { - let timestamp; - const matches = notif.message.match(/\[timestamp:(.*?)\]/); - if (matches) { - timestamp = matches[1]; - } - else timestamp = notif.epoch; - if ( - ((Filter.channels === undefined ? true : (Filter.channels.includes(notif.channel))) && - timestamp >= startDate && timestamp <= endDate - && (query === "" || notif.message.toLowerCase().includes(query.toLowerCase()))) - ) - filterNotif.push(notif); - } - const newNotifs = filterNotif - setAllFilter(newNotifs) - } catch (err) { - console.error(err); - } finally { - setLoading(false); - setBgUpdateLoading(false); - } - } - - React.useEffect(() => { - // console.log(allFilter) - setFilteredNotifications(allFilter) - }, [allFilter]) - - const loadNotifications = async () => { - if (loading || finishedFetching || !userPushSDKInstance) return; - setLoading(true); - try { - // const { count, results } = await PushAPI.fetchNotifications({ - // user: account, - // pageSize: NOTIFICATIONS_PER_PAGE, - // page, - // chainId, - // dev: true, - // }); - const results = await userPushSDKInstance.notification.list('INBOX', { - raw: true, - page: page, - limit: NOTIFICATIONS_PER_PAGE - }); - const parsedResponse = PushAPI.utils.parseApiResponse(results); - dispatch(addPaginatedNotifications(parsedResponse)); - if (parsedResponse.length === 0) { - dispatch(setFinishedFetching()); - } - } catch (err) { - console.error(err); - } finally { - setLoading(false); - } - }; - const fetchLatestNotifications = async () => { - if (loading || bgUpdateLoading) return; - setBgUpdateLoading(true); - setLoading(true); - try { - const results = await await userPushSDKInstance.notification.list('INBOX', { - raw: true, - page: 1, - limit: NOTIFICATIONS_PER_PAGE - }); - if (!notifications.length) { - dispatch(incrementPage()); - } - const parsedResponse = PushAPI.utils.parseApiResponse(results); - const map1 = new Map(); - const map2 = new Map(); - results.forEach(each => { - map1.set(each.payload.data.sid, each.epoch); - map2.set(each.payload.data.sid, each.sender); - }) - parsedResponse.forEach(each => { - each['date'] = map1.get(each.sid); - each['epoch'] = (new Date(each['date']).getTime() / 1000); - each['channel'] = map2.get(each.sid); - }) - dispatch( - updateTopNotifications({ - notifs: parsedResponse, - pageSize: NOTIFICATIONS_PER_PAGE, - }) - ); - if (parsedResponse.length === 0) { - dispatch(setFinishedFetching()); - } - } catch (err) { - console.error(err); - } finally { - setBgUpdateLoading(false); - setLoading(false); - } - }; - - const fetchAllNotif = async () => { - setLoadFilter(true); - try { - const results = await userPushSDKInstance.notification.list('INBOX', { - limit: 100000, - page: page, - raw: true - }); - if (!notifications.length) { - dispatch(incrementPage()); - } - const parsedResponse = PushAPI.utils.parseApiResponse(results); - const map1 = new Map(); - const map2 = new Map(); - results.forEach(each => { - map1.set(each.payload.data.sid, each.epoch); - map2.set(each.payload.data.sid, each.sender); - }) - parsedResponse.forEach(each => { - each['date'] = map1.get(each.sid); - each['epoch'] = (new Date(each['date']).getTime() / 1000); - each['channel'] = map2.get(each.sid); - }) - setNotif(parsedResponse); - } catch (err) { - console.error(err); - } finally { - setLoadFilter(false); - } - }; - - React.useEffect(() => { - if (!userPushSDKInstance) return; - fetchLatestNotifications(); - fetchAllNotif(); - }, [toggle, userPushSDKInstance]); - - //function to query more notifications - const handlePagination = async () => { - if (filter) { - setLimit(limit + 10); - } - else { - loadNotifications(); - dispatch(incrementPage()); - } - }; - - const showWayPoint = (index: any) => { - if (!filter) { - return ( - Number(index) === notifications.length - 1 && - !finishedFetching && - !bgUpdateLoading - ); - } - else { - return ( - Number(index) === limit - 1 - ); - } - - }; - - const onDecrypt = async ({ secret, title, message, image, cta }) => { - let txToast; - try { - let decryptedSecret = await CryptoHelper.decryptWithWalletRPCMethod(provider, secret, account); - // let decryptedSecret = await CryptoHelper.decryptWithWalletRPCMethod(library.provider, secret, account); - - // decrypt notification message - const decryptedBody = await CryptoHelper.decryptWithAES(message, decryptedSecret); - - // decrypt notification title - let decryptedTitle = await CryptoHelper.decryptWithAES(title, decryptedSecret); - - // decrypt notification image - let decryptedImage = await CryptoHelper.decryptWithAES(image, decryptedSecret); - - // decrypt notification cta - let decryptedCta = await CryptoHelper.decryptWithAES(cta, decryptedSecret); - return { title: decryptedTitle, body: decryptedBody, image: decryptedImage, cta: decryptedCta }; - } catch (error) { - if (error.code === 4001) { - // EIP-1193 userRejectedRequest error - console.error(error); - txToast = toaster.dark( - , - { - position: "bottom-right", - type: toaster.TYPE.ERROR, - autoClose: 5000, - hideProgressBar: true, - closeOnClick: true, - pauseOnHover: true, - draggable: true, - progress: undefined, - } - ); - } else if (error.code === -32601) { - console.error(error); - txToast = toaster.dark( - , - { - position: "bottom-right", - type: toaster.TYPE.ERROR, - autoClose: 5000, - hideProgressBar: true, - closeOnClick: true, - pauseOnHover: true, - draggable: true, - progress: undefined, - } - ); - } else { - console.error(error); - txToast = toaster.dark( - , - { - position: "bottom-right", - type: toaster.TYPE.ERROR, - autoClose: 5000, - hideProgressBar: true, - closeOnClick: true, - pauseOnHover: true, - draggable: true, - progress: undefined, - } - ); - } - } - }; - // Render return ( - - -
- -
- - - {showSnapInfo && ( - <> - - - - Get Notifications directly in MetaMask using Push Snap. - Install Push Snap - - { - setShowSnapInfo(false); - }}/> - - - - )} - - {((!run && !notifications.length) || - (!run && filter && !filteredNotifications.length) || - (run && !welcomeNotifs.length)) && - !loading && ( -
- -
- )} - {notifications && ( - - {bgUpdateLoading && ( - - - - )} - {run && - welcomeNotifs.map((oneNotification, index) => { - const { - cta, - title, - message, - app, - icon, - image, - blockchain, - url - } = oneNotification; - - // render the notification item - return ( - - - - ); - })} - {(filter - ? filteredNotifications - : notifications - ).map((oneNotification, index) => { - const { - cta, - title, - message, - app, - icon, - image, - secret, - notification, - blockchain, - url - } = oneNotification; - if (run) return; - // render the notification item - return ( - - {showWayPoint(index) && ( - handlePagination()} /> - )} - - onDecrypt({ secret, title, message, image, cta }) - } - chainName={blockchain} - theme={themes.scheme} - url={url} - /> - - ); - })} - - {loading && !bgUpdateLoading && ( - - - - )} - - )} - - {toast && ( - - )} - - - + + + + + + + ); } @@ -495,9 +54,6 @@ const Container = styled.div` justify-content: center; font-weight: 200; margin: 0 0 0 10px; - @media ${device.tablet} { - height: 74%; - } `; const NotifsOuter = styled.div` diff --git a/src/segments/ViewChannels.tsx b/src/segments/ViewChannels.tsx index 4917e8c427..9aed7fed87 100644 --- a/src/segments/ViewChannels.tsx +++ b/src/segments/ViewChannels.tsx @@ -270,7 +270,7 @@ function ViewChannels({ loadTeaser, playTeaser, minimal }) { )} - + {/* render all channels depending on if we are searching or not */}
{(search ? channelToShow : channels).map( @@ -316,7 +316,7 @@ function ViewChannels({ loadTeaser, playTeaser, minimal }) { {/* display loader if pagination is loading next batch of channelTotalList */} {((moreLoading && channels.length) || loading || loadingChannel) && ( - + )} @@ -438,7 +438,7 @@ const ScrollItem = styled(Item)` flex-wrap: nowrap; flex: 1; - padding: 0px 20px 10px 20px; + padding: ${props => props.minimal ? "20px 10px" : "0px 20px 10px 20px"}; overflow-y: auto; &::-webkit-scrollbar-track { @@ -452,7 +452,7 @@ const ScrollItem = styled(Item)` } @media (max-width: 768px) { - padding: 0px 0px 0px 0px; + padding: ${props => props.minimal ? "10px 5px" : "0px"}; &::-webkit-scrollbar-track { background-color: none; diff --git a/src/structure/MasterInterfacePage.tsx b/src/structure/MasterInterfacePage.tsx index 3d9c8a7f15..6c0738445a 100644 --- a/src/structure/MasterInterfacePage.tsx +++ b/src/structure/MasterInterfacePage.tsx @@ -122,7 +122,11 @@ function MasterInterfacePage() { const ChannelsProfilePage = () => { const channelid = searchParams.get('channel'); - console.log("I am here"); + + if (channelid) { + navigate(`${APP_PATHS.Channels}/${channelid}`); + } + return */} {/* Enable Channel specific routes */} - {/* } - /> */} - Date: Wed, 28 Feb 2024 15:11:53 +0530 Subject: [PATCH 09/23] Toast has been added for warning when the user rejects --- src/components/ViewChannelItem.js | 1 + src/config/Themization.js | 4 ++++ src/contexts/AppContext.tsx | 4 ++-- src/hooks/useToast.tsx | 21 ++++++++++++++++++--- src/segments/Feedbox.tsx | 10 +++++----- src/structure/MasterInterfacePage.tsx | 10 ++++++---- 6 files changed, 36 insertions(+), 14 deletions(-) diff --git a/src/components/ViewChannelItem.js b/src/components/ViewChannelItem.js index 1f7ff7dee2..2b00a1f0c8 100644 --- a/src/components/ViewChannelItem.js +++ b/src/components/ViewChannelItem.js @@ -1279,6 +1279,7 @@ const ChannelActions = styled.div` justify-content: flex-end; // justify-content: center; align-items: center; + gap:24px; @media (max-width: 768px) { align-self: center; } diff --git a/src/config/Themization.js b/src/config/Themization.js index d8b37f8308..8d493d4a1e 100644 --- a/src/config/Themization.js +++ b/src/config/Themization.js @@ -177,6 +177,8 @@ const themeLight = { toastSuccessBackground: 'linear-gradient(90.15deg, #30CC8B -125.65%, #30CC8B -125.63%, #F3FFF9 42.81%)', toastErrorBackground: 'linear-gradient(90.15deg, #FF2070 -125.65%, #FF2D79 -125.63%, #FFF9FB 42.81%)', + toastWarningBackground:'linear-gradient(90deg, #FFF2D1 0%, rgba(255, 255, 255, 0.00) 100%)', + // Profile profileBG: 'linear-gradient(107deg, rgba(226,8,128,1) 30%, rgba(103,76,159,1) 70%, rgba(53,197,243,1) 100%)', profileText: '#fff', @@ -471,6 +473,8 @@ const themeDark = { toastShadowColor: '#00000010', toastSuccessBackground: 'linear-gradient(90.15deg, #30CC8B -125.65%, #30CC8B -125.63%, #2F3137 42.81%)', toastErrorBackground: 'linear-gradient(89.96deg, #FF2070 -101.85%, #2F3137 51.33%)', + toastWarningBackground:'linear-gradient(90deg, #66562D 0.03%, #2F3137 74.67%)', + //Profile profileBG: '#2F3137', diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index 4bf45e1410..3e01f7192f 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -175,8 +175,8 @@ const AppContextProvider = ({ children }) => { onboardingProgress.progress = 99; break; case "PUSH-ERROR-00": - onboardingProgress.errorMessage = "User Rejected Signature"; - onboardingProgress.hookInfo.progressTitle = "User Rejected Signature"; + onboardingProgress.errorMessage = "The sign in was rejected by the user. You can still continue in read-only mode."; + onboardingProgress.hookInfo.progressTitle = "Profile Unlock Unsuccessful"; onboardingProgress.spinnerType = LOADER_SPINNER_TYPE.ERROR; break; case "PUSH-ERROR-01": diff --git a/src/hooks/useToast.tsx b/src/hooks/useToast.tsx index 07ea5e2aec..2bd94fd15f 100644 --- a/src/hooks/useToast.tsx +++ b/src/hooks/useToast.tsx @@ -56,7 +56,7 @@ export type ShowMessageToastType = ({ }: { toastTitle: string; toastMessage: string; - toastType: 'SUCCESS' | 'ERROR'; + toastType: 'SUCCESS' | 'ERROR' | 'WARNING'; getToastIcon?: (size: number) => JSX.Element; }) => void; @@ -100,7 +100,7 @@ const useToast = ( }; const showMessageToast: ShowMessageToastType = ({ toastTitle, toastMessage, toastType, getToastIcon }) => { - + const toastUI = ( {getToastIcon ? getToastIcon(30) : ''} @@ -123,6 +123,21 @@ const useToast = ( ); + let backgroundColor; + switch (toastType) { + case 'SUCCESS': + backgroundColor = themes.toastSuccessBackground; + break; + case 'ERROR': + backgroundColor = themes.toastErrorBackground; + break; + case 'WARNING': + backgroundColor = themes.toastWarningBackground; // Assuming you have a warning background color defined + break; + default: + backgroundColor = 'defaultBackgroundColor'; // Fallback color + } + const toastRenderParams = { position, hideProgressBar: true, @@ -134,7 +149,7 @@ const useToast = ( closeButton: CloseButton, autoClose: autoClose, style: { - background: toastType === 'SUCCESS' ? themes.toastSuccessBackground : themes.toastErrorBackground, + background: backgroundColor, boxShadow: `10px 10px 10px ${themes.toastShadowColor}`, borderRadius: '20px', margin: isMobile ? '20px' : '0px', diff --git a/src/segments/Feedbox.tsx b/src/segments/Feedbox.tsx index 89d9a2dda0..979454aaa2 100644 --- a/src/segments/Feedbox.tsx +++ b/src/segments/Feedbox.tsx @@ -47,7 +47,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { const dispatch = useDispatch(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; - }); + }); const modalRef = React.useRef(null); useClickAway(modalRef, () => showFilter && setShowFilter(false)); @@ -172,7 +172,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { } }; const fetchLatestNotifications = async () => { - if (loading || bgUpdateLoading) return; + // if (loading || bgUpdateLoading) return; setBgUpdateLoading(true); setLoading(true); try { @@ -245,7 +245,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { }; React.useEffect(() => { - if (userPushSDKInstance?.account == readOnlyWallet) return; + if (userPushSDKInstance?.account == readOnlyWallet || !userPushSDKInstance) return; fetchLatestNotifications(); fetchAllNotif(); }, [toggle, userPushSDKInstance]); @@ -369,13 +369,13 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { <> - + Get Notifications directly in MetaMask using Push Snap. Install Push Snap { setShowSnapInfo(false); - }}/> + }} /> diff --git a/src/structure/MasterInterfacePage.tsx b/src/structure/MasterInterfacePage.tsx index 8e62dbdf32..eee6d356f7 100644 --- a/src/structure/MasterInterfacePage.tsx +++ b/src/structure/MasterInterfacePage.tsx @@ -8,6 +8,8 @@ import { ToastContainer } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.min.css'; import styled from 'styled-components'; import { MdError } from 'react-icons/md'; +import { MdWarning } from "react-icons/md"; + import useToast from 'hooks/useToast'; // Internal Components @@ -231,13 +233,13 @@ function MasterInterfacePage() { {blockedLoading.errorMessage && ( blockedLoadingToast.showMessageToast({ - toastTitle: 'Error', + toastTitle: blockedLoading.title, toastMessage: blockedLoading.errorMessage, - toastType: 'ERROR', + toastType: 'WARNING', getToastIcon: (size) => ( - ), }) From 1b1deea5946332e2d08206fa531e311a91166a02 Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Fri, 1 Mar 2024 00:26:51 +0530 Subject: [PATCH 10/23] New Opt In flow when the user directly clicks on Opt In --- package.json | 4 +- src/contexts/AppContext.tsx | 30 +- src/sections/chat/ChatSidebarSection.tsx | 5 +- src/segments/ViewChannels.tsx | 2 +- yarn.lock | 511 ++--------------------- 5 files changed, 53 insertions(+), 499 deletions(-) diff --git a/package.json b/package.json index dfab0eecc7..e9ae162a8b 100644 --- a/package.json +++ b/package.json @@ -33,9 +33,9 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "0.0.1-alpha.64", + "@pushprotocol/restapi": "0.0.1-alpha.71", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "0.0.1-alpha.41", + "@pushprotocol/uiweb": "1.3.1-alpha.5", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index 3e01f7192f..ac32e44bf3 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -2,7 +2,7 @@ import useModalBlur from "hooks/useModalBlur"; import React, { createContext, useContext, useEffect, useState } from "react"; import { ProgressHookType, PushAPI } from '@pushprotocol/restapi'; - +import { ethers } from "ethers"; // Internal Components import { AppContextType, BlockedLoadingI, ConnectedPeerIDType, LocalPeerType, onboardingProgressI, Web3NameListType } from "types/context" @@ -24,6 +24,8 @@ const AppContextProvider = ({ children }) => { const { connect, provider, account, wallet, connecting } = useAccount(); const web3onboardToast = useToast(); + const { readOnlyWallet } = useContext(GlobalContext); + const [web3NameList, setWeb3NameList] = useState({}); const [snapInstalled, setSnapInstalled] = useState(false); @@ -70,8 +72,12 @@ const AppContextProvider = ({ children }) => { return userPushInstance; } else { const walletConnected = await connect(); - return null; - + if (walletConnected) { + const userPushInstance = await initializePushSDK(walletConnected[0]); + return userPushInstance; + } else { + return null; + } } } @@ -81,7 +87,7 @@ const AppContextProvider = ({ children }) => { const initialisePushSdkGuestMode = async () => { let userInstance; userInstance = await PushAPI.initialize({ - account: '0x0000000000000000000000000000000000000001', + account: readOnlyWallet, env: appConfig.appEnv, }); dispatch(setUserPushSDKInstance(userInstance)); @@ -207,13 +213,21 @@ const AppContextProvider = ({ children }) => { }; - const initializePushSDK = async () => { + const initializePushSDK = async (wallet?: any) => { let userInstance; try { - const librarySigner = provider?.getSigner(account); + + let web3Provider = provider; + let currentAddress = wallet ? wallet.accounts[0].address : account; + + if (wallet) { + web3Provider = new ethers.providers.Web3Provider(wallet.provider, 'any') + } + + const librarySigner = web3Provider?.getSigner(currentAddress); userInstance = await PushAPI.initialize(librarySigner!, { env: appConfig.appEnv, - account: account, + account: currentAddress, progressHook: onboardingProgressReformatter, }); if (userInstance) { @@ -286,7 +300,7 @@ const AppContextProvider = ({ children }) => { } else { initialisePushSdkGuestMode(); } - }, [account, provider, wallet]); + }, [account]); const createUserIfNecessary = async (): Promise => { try { diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx index adee178ae9..050dcee715 100644 --- a/src/sections/chat/ChatSidebarSection.tsx +++ b/src/sections/chat/ChatSidebarSection.tsx @@ -67,6 +67,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { // theme context const theme = useTheme(); + const {readOnlyWallet} = useContext(GlobalContext); const { setSelectedChatId } = useContext(Context); const { setMode } = useContext(GlobalContext); @@ -103,7 +104,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { } return formattedChatParticipant; } else { - if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000001') { + if (userPushSDKInstance.account === readOnlyWallet) { handleConnectWallet(); } else if (userPushSDKInstance.signer === undefined || userPushSDKInstance.decryptedPgpPvtKey === undefined) { await initializePushSDK(); @@ -116,7 +117,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { if (userPushSDKInstance.decryptedPgpPvtKey) { showCreateGroupModal(); } else { - if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000001') { + if (userPushSDKInstance.account === readOnlyWallet) { handleConnectWallet(); } else { if (userPushSDKInstance.signer === undefined) { diff --git a/src/segments/ViewChannels.tsx b/src/segments/ViewChannels.tsx index d2dcf15416..cad1573af9 100644 --- a/src/segments/ViewChannels.tsx +++ b/src/segments/ViewChannels.tsx @@ -65,7 +65,7 @@ function ViewChannels({ loadTeaser, playTeaser }) { useEffect(() => { setLoading(!channels.length); //if there are no channels initially then, set the loader fetchInitialsChannelMeta(); - }, [account, chainId]); + }, [account, chainId,userPushSDKInstance]); useEffect(() => { setChannelsNetworkId(chainId); diff --git a/yarn.lock b/yarn.lock index e39c26d170..0874fcab6f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -81,17 +81,6 @@ __metadata: languageName: node linkType: hard -"@ambire/signature-validator@npm:^1.3.1": - version: 1.3.1 - resolution: "@ambire/signature-validator@npm:1.3.1" - dependencies: - ethers: ^5.6.5 - tap-spec: ^5.0.0 - tape: ^5.5.3 - checksum: 44c4796f4cbb4624cfd64033523d3491afa899067026e9615322dc6efaca71b16358cbc1661f2fce62d9dedcf424c92d44fe3b2ab8c6f171a59c0c21dc17b2e2 - languageName: node - linkType: hard - "@ampproject/remapping@npm:^2.2.0": version: 2.2.0 resolution: "@ampproject/remapping@npm:2.2.0" @@ -4641,22 +4630,6 @@ __metadata: languageName: node linkType: hard -"@ljharb/resumer@npm:^0.0.1": - version: 0.0.1 - resolution: "@ljharb/resumer@npm:0.0.1" - dependencies: - "@ljharb/through": ^2.3.9 - checksum: 1cff0a485cb857933d2921cb05a349f8fe894fa2bb6b31a347010ecccc4a2b369e43ebe5383a32a60ee6c9572d2c83fcab383eb01727e1507bf29c59f312dae6 - languageName: node - linkType: hard - -"@ljharb/through@npm:^2.3.9": - version: 2.3.9 - resolution: "@ljharb/through@npm:2.3.9" - checksum: a47ffed12ef4b08d07458db8bff5f7a13a7030fddf7dbfa947a765581a634d42ee90f7b8c249315aad122c21ad061e97a74f65aef3c03d2c09291d11312f0bfb - languageName: node - linkType: hard - "@material-ui/core@npm:4.11.0": version: 4.11.0 resolution: "@material-ui/core@npm:4.11.0" @@ -5432,9 +5405,9 @@ __metadata: "@mui/icons-material": ^5.8.4 "@mui/lab": ^5.0.0-alpha.72 "@mui/material": ^5.5.0 - "@pushprotocol/restapi": 0.0.1-alpha.64 + "@pushprotocol/restapi": 0.0.1-alpha.71 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 0.0.1-alpha.41 + "@pushprotocol/uiweb": 1.3.1-alpha.5 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5621,11 +5594,10 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/restapi@npm:0.0.1-alpha.64": - version: 0.0.1-alpha.64 - resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.64" +"@pushprotocol/restapi@npm:0.0.1-alpha.71": + version: 0.0.1-alpha.71 + resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.71" dependencies: - "@ambire/signature-validator": ^1.3.1 "@metamask/eth-sig-util": ^5.0.2 axios: ^0.27.2 buffer: ^6.0.3 @@ -5644,7 +5616,10 @@ __metadata: viem: ^1.20.3 peerDependencies: ethers: ^5.0.0 || ^6.0.0 - checksum: 6c62724de1522572de2dfc62212f7a461f8b92b4c8f32097d8a1cea527bda4e3d00b65ada8b2adb2a466d7615af7eb8092b28defed7dc06293a25ea3b9713503 + peerDependenciesMeta: + ethers: + optional: true + checksum: f54952b8d5eeb6bfad61af52b5d25a5989e9075d3640800cd3042f56c411659ee3add38d673df1497479d3a7fb7500db7789fa9b4e696a0544b556345cd950f7 languageName: node linkType: hard @@ -5672,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:0.0.1-alpha.41": - version: 0.0.1-alpha.41 - resolution: "@pushprotocol/uiweb@npm:0.0.1-alpha.41" +"@pushprotocol/uiweb@npm:1.3.1-alpha.5": + version: 1.3.1-alpha.5 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.5" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5706,7 +5681,8 @@ __metadata: axios: ^0.27.2 react: ">=16.8.0" styled-components: ^6.0.8 - checksum: bbd07715409e0d22b17f825124202772f65169bbeec4c4b05cc4e5b9020e129957f78b3031549ec5c638046247375fecd8b3653c1dbc039363293763b4d7ba51 + viem: ^1.3.0 + checksum: 783d4be5e67c6c0f13ce1a116bd2ca13331e60822c90a0a267bee6e539b1e04ec43527e608c4a955d8b32b4ac3f638190adb3ca4e1f18ac6728cb608ebbc31d3 languageName: node linkType: hard @@ -10151,13 +10127,6 @@ __metadata: languageName: node linkType: hard -"ansi-regex@npm:^2.0.0": - version: 2.1.1 - resolution: "ansi-regex@npm:2.1.1" - checksum: 190abd03e4ff86794f338a31795d262c1dfe8c91f7e01d04f13f646f1dcb16c5800818f886047876f1272f065570ab86b24b99089f8b68a0e11ff19aed4ca8f1 - languageName: node - linkType: hard - "ansi-regex@npm:^4.0.0, ansi-regex@npm:^4.1.0": version: 4.1.1 resolution: "ansi-regex@npm:4.1.1" @@ -10179,13 +10148,6 @@ __metadata: languageName: node linkType: hard -"ansi-styles@npm:^2.2.1": - version: 2.2.1 - resolution: "ansi-styles@npm:2.2.1" - checksum: ebc0e00381f2a29000d1dac8466a640ce11943cef3bda3cd0020dc042e31e1058ab59bf6169cd794a54c3a7338a61ebc404b7c91e004092dd20e028c432c9c2c - languageName: node - linkType: hard - "ansi-styles@npm:^3.2.0, ansi-styles@npm:^3.2.1": version: 3.2.1 resolution: "ansi-styles@npm:3.2.1" @@ -10387,18 +10349,6 @@ __metadata: languageName: node linkType: hard -"array.prototype.every@npm:^1.1.4": - version: 1.1.5 - resolution: "array.prototype.every@npm:1.1.5" - dependencies: - call-bind: ^1.0.2 - define-properties: ^1.2.0 - es-abstract: ^1.22.1 - is-string: ^1.0.7 - checksum: 9974435604e135fc8c359a76c89bfe0672c1a80974a76dc61c673e5ea5068f78a31b7a168634ed7691501130ed61d3c788dd1d48ec1265c6cdf3910897b1eba4 - languageName: node - linkType: hard - "array.prototype.flat@npm:^1.2.5, array.prototype.flat@npm:^1.3.1": version: 1.3.1 resolution: "array.prototype.flat@npm:1.3.1" @@ -10449,20 +10399,6 @@ __metadata: languageName: node linkType: hard -"arraybuffer.prototype.slice@npm:^1.0.1": - version: 1.0.1 - resolution: "arraybuffer.prototype.slice@npm:1.0.1" - dependencies: - array-buffer-byte-length: ^1.0.0 - call-bind: ^1.0.2 - define-properties: ^1.2.0 - get-intrinsic: ^1.2.1 - is-array-buffer: ^3.0.2 - is-shared-array-buffer: ^1.0.2 - checksum: e3e9b2a3e988ebfeddce4c7e8f69df730c9e48cb04b0d40ff0874ce3d86b3d1339dd520ffde5e39c02610bc172ecfbd4bc93324b1cabd9554c44a56b131ce0ce - languageName: node - linkType: hard - "asap@npm:~2.0.6": version: 2.0.6 resolution: "asap@npm:2.0.6" @@ -11636,13 +11572,6 @@ __metadata: languageName: node linkType: hard -"buffer-shims@npm:~1.0.0": - version: 1.0.0 - resolution: "buffer-shims@npm:1.0.0" - checksum: 4defd1ffc9b270708ea39c17cac75c91c520c8e2f1d28a4d0ec74dc77445cbf8fc162003f0530fd1f81340347e9a26863d5aa27cd3cc351ec1d0361777d15ace - languageName: node - linkType: hard - "buffer-to-arraybuffer@npm:^0.0.5": version: 0.0.5 resolution: "buffer-to-arraybuffer@npm:0.0.5" @@ -11971,19 +11900,6 @@ __metadata: languageName: node linkType: hard -"chalk@npm:^1.0.0": - version: 1.1.3 - resolution: "chalk@npm:1.1.3" - dependencies: - ansi-styles: ^2.2.1 - escape-string-regexp: ^1.0.2 - has-ansi: ^2.0.0 - strip-ansi: ^3.0.0 - supports-color: ^2.0.0 - checksum: 9d2ea6b98fc2b7878829eec223abcf404622db6c48396a9b9257f6d0ead2acf18231ae368d6a664a83f272b0679158da12e97b5229f794939e555cc574478acd - languageName: node - linkType: hard - "chalk@npm:^2.0.0, chalk@npm:^2.0.1, chalk@npm:^2.4.1": version: 2.4.2 resolution: "chalk@npm:2.4.2" @@ -13437,32 +13353,6 @@ __metadata: languageName: node linkType: hard -"deep-equal@npm:^2.2.2": - version: 2.2.2 - resolution: "deep-equal@npm:2.2.2" - dependencies: - array-buffer-byte-length: ^1.0.0 - call-bind: ^1.0.2 - es-get-iterator: ^1.1.3 - get-intrinsic: ^1.2.1 - is-arguments: ^1.1.1 - is-array-buffer: ^3.0.2 - is-date-object: ^1.0.5 - is-regex: ^1.1.4 - is-shared-array-buffer: ^1.0.2 - isarray: ^2.0.5 - object-is: ^1.1.5 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - regexp.prototype.flags: ^1.5.0 - side-channel: ^1.0.4 - which-boxed-primitive: ^1.0.2 - which-collection: ^1.0.1 - which-typed-array: ^1.1.9 - checksum: eb61c35157b6ecb96a5359b507b083fbff8ddb4c86a78a781ee38485f77a667465e45d63ee2ebd8a00e86d94c80e499906900cd82c2debb400237e1662cd5397 - languageName: node - linkType: hard - "deep-is@npm:^0.1.3, deep-is@npm:~0.1.3": version: 0.1.4 resolution: "deep-is@npm:0.1.4" @@ -13510,7 +13400,7 @@ __metadata: languageName: node linkType: hard -"define-properties@npm:^1.1.3, define-properties@npm:^1.1.4, define-properties@npm:^1.2.0": +"define-properties@npm:^1.1.3, define-properties@npm:^1.1.4": version: 1.2.0 resolution: "define-properties@npm:1.2.0" dependencies: @@ -13520,13 +13410,6 @@ __metadata: languageName: node linkType: hard -"defined@npm:^1.0.1": - version: 1.0.1 - resolution: "defined@npm:1.0.1" - checksum: b1a852300bdb57f297289b55eafdd0c517afaa3ec8190e78fce91b9d8d0c0369d4505ecbdacfd3d98372e664f4a267d9bd793938d4a8c76209c9d9516fbe2101 - languageName: node - linkType: hard - "delay@npm:^5.0.0": version: 5.0.0 resolution: "delay@npm:5.0.0" @@ -14042,17 +13925,6 @@ __metadata: languageName: node linkType: hard -"dotignore@npm:^0.1.2": - version: 0.1.2 - resolution: "dotignore@npm:0.1.2" - dependencies: - minimatch: ^3.0.4 - bin: - ignored: bin/ignored - checksum: 06bab15e2a2400c6f823a0edbcd73661180f6245a4041a3fe3b9fde4b22ae74b896604df4520a877093f05c656bd080087376c9f605bccdea847664c59910f37 - languageName: node - linkType: hard - "drbg.js@npm:^1.0.1": version: 1.0.1 resolution: "drbg.js@npm:1.0.1" @@ -14074,7 +13946,7 @@ __metadata: languageName: node linkType: hard -"duplexer@npm:^0.1.1, duplexer@npm:^0.1.2": +"duplexer@npm:^0.1.2": version: 0.1.2 resolution: "duplexer@npm:0.1.2" checksum: 62ba61a830c56801db28ff6305c7d289b6dc9f859054e8c982abd8ee0b0a14d2e9a8e7d086ffee12e868d43e2bbe8a964be55ddbd8c8957714c87373c7a4f9b0 @@ -14599,53 +14471,6 @@ __metadata: languageName: node linkType: hard -"es-abstract@npm:^1.22.1": - version: 1.22.1 - resolution: "es-abstract@npm:1.22.1" - dependencies: - array-buffer-byte-length: ^1.0.0 - arraybuffer.prototype.slice: ^1.0.1 - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - es-set-tostringtag: ^2.0.1 - es-to-primitive: ^1.2.1 - function.prototype.name: ^1.1.5 - get-intrinsic: ^1.2.1 - get-symbol-description: ^1.0.0 - globalthis: ^1.0.3 - gopd: ^1.0.1 - has: ^1.0.3 - has-property-descriptors: ^1.0.0 - has-proto: ^1.0.1 - has-symbols: ^1.0.3 - internal-slot: ^1.0.5 - is-array-buffer: ^3.0.2 - is-callable: ^1.2.7 - is-negative-zero: ^2.0.2 - is-regex: ^1.1.4 - is-shared-array-buffer: ^1.0.2 - is-string: ^1.0.7 - is-typed-array: ^1.1.10 - is-weakref: ^1.0.2 - object-inspect: ^1.12.3 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - regexp.prototype.flags: ^1.5.0 - safe-array-concat: ^1.0.0 - safe-regex-test: ^1.0.0 - string.prototype.trim: ^1.2.7 - string.prototype.trimend: ^1.0.6 - string.prototype.trimstart: ^1.0.6 - typed-array-buffer: ^1.0.0 - typed-array-byte-length: ^1.0.0 - typed-array-byte-offset: ^1.0.0 - typed-array-length: ^1.0.4 - unbox-primitive: ^1.0.2 - which-typed-array: ^1.1.10 - checksum: 614e2c1c3717cb8d30b6128ef12ea110e06fd7d75ad77091ca1c5dbfb00da130e62e4bbbbbdda190eada098a22b27fe0f99ae5a1171dac2c8663b1e8be8a3a9b - languageName: node - linkType: hard - "es-array-method-boxes-properly@npm:^1.0.0": version: 1.0.0 resolution: "es-array-method-boxes-properly@npm:1.0.0" @@ -14653,7 +14478,7 @@ __metadata: languageName: node linkType: hard -"es-get-iterator@npm:^1.1.2, es-get-iterator@npm:^1.1.3": +"es-get-iterator@npm:^1.1.2": version: 1.1.3 resolution: "es-get-iterator@npm:1.1.3" dependencies: @@ -15724,7 +15549,7 @@ __metadata: languageName: node linkType: hard -"ethers@npm:^5.3.1, ethers@npm:^5.6.5, ethers@npm:^5.6.8, ethers@npm:^5.7.2": +"ethers@npm:^5.3.1, ethers@npm:^5.6.8, ethers@npm:^5.7.2": version: 5.7.2 resolution: "ethers@npm:5.7.2" dependencies: @@ -16126,16 +15951,6 @@ __metadata: languageName: node linkType: hard -"figures@npm:^1.4.0": - version: 1.7.0 - resolution: "figures@npm:1.7.0" - dependencies: - escape-string-regexp: ^1.0.5 - object-assign: ^4.1.0 - checksum: d77206deba991a7977f864b8c8edf9b8b43b441be005482db04b0526e36263adbdb22c1c6d2df15a1ad78d12029bd1aa41ccebcb5d425e1f2cf629c6daaa8e10 - languageName: node - linkType: hard - "file-entry-cache@npm:^6.0.1": version: 6.0.1 resolution: "file-entry-cache@npm:6.0.1" @@ -16572,7 +16387,7 @@ __metadata: languageName: node linkType: hard -"functions-have-names@npm:^1.2.2, functions-have-names@npm:^1.2.3": +"functions-have-names@npm:^1.2.2": version: 1.2.3 resolution: "functions-have-names@npm:1.2.3" checksum: c3f1f5ba20f4e962efb71344ce0a40722163e85bee2101ce25f88214e78182d2d2476aa85ef37950c579eb6cf6ee811c17b3101bb84004bb75655f3e33f3fdb5 @@ -16627,18 +16442,6 @@ __metadata: languageName: node linkType: hard -"get-intrinsic@npm:^1.2.1": - version: 1.2.1 - resolution: "get-intrinsic@npm:1.2.1" - dependencies: - function-bind: ^1.1.1 - has: ^1.0.3 - has-proto: ^1.0.1 - has-symbols: ^1.0.3 - checksum: 5b61d88552c24b0cf6fa2d1b3bc5459d7306f699de060d76442cce49a4721f52b8c560a33ab392cf5575b7810277d54ded9d4d39a1ea61855619ebc005aa7e5f - languageName: node - linkType: hard - "get-iterator@npm:^1.0.2": version: 1.0.2 resolution: "get-iterator@npm:1.0.2" @@ -16801,7 +16604,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6, glob@npm:^7.2.3": +"glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6": version: 7.2.3 resolution: "glob@npm:7.2.3" dependencies: @@ -17090,15 +16893,6 @@ __metadata: languageName: node linkType: hard -"has-ansi@npm:^2.0.0": - version: 2.0.0 - resolution: "has-ansi@npm:2.0.0" - dependencies: - ansi-regex: ^2.0.0 - checksum: 1b51daa0214440db171ff359d0a2d17bc20061164c57e76234f614c91dbd2a79ddd68dfc8ee73629366f7be45a6df5f2ea9de83f52e1ca24433f2cc78c35d8ec - languageName: node - linkType: hard - "has-bigints@npm:^1.0.1, has-bigints@npm:^1.0.2": version: 1.0.2 resolution: "has-bigints@npm:1.0.2" @@ -17106,16 +16900,6 @@ __metadata: languageName: node linkType: hard -"has-dynamic-import@npm:^2.0.1": - version: 2.0.1 - resolution: "has-dynamic-import@npm:2.0.1" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.1.1 - checksum: 1cb60255cdd354a5f53997dd4c8ae0f821706ced3d1047bb810cb74400f28988b08d4d986318cb6610b79e6b9993a6592e678b6cef3ef0b71ab553eaa99b9c4d - languageName: node - linkType: hard - "has-flag@npm:^3.0.0": version: 3.0.0 resolution: "has-flag@npm:3.0.0" @@ -17771,7 +17555,7 @@ __metadata: languageName: node linkType: hard -"inherits@npm:2, inherits@npm:2.0.4, inherits@npm:^2.0.1, inherits@npm:^2.0.3, inherits@npm:^2.0.4, inherits@npm:~2.0.1, inherits@npm:~2.0.3, inherits@npm:~2.0.4": +"inherits@npm:2, inherits@npm:2.0.4, inherits@npm:^2.0.1, inherits@npm:^2.0.3, inherits@npm:^2.0.4, inherits@npm:~2.0.3, inherits@npm:~2.0.4": version: 2.0.4 resolution: "inherits@npm:2.0.4" checksum: 4a48a733847879d6cf6691860a6b1e3f0f4754176e4d71494c41f3475553768b10f84b5ce1d40fbd0e34e6bfbb864ee35858ad4dd2cf31e02fc4a154b724d7f1 @@ -18392,13 +18176,6 @@ __metadata: languageName: node linkType: hard -"is-finite@npm:^1.0.1": - version: 1.1.0 - resolution: "is-finite@npm:1.1.0" - checksum: 532b97ed3d03e04c6bd203984d9e4ba3c0c390efee492bad5d1d1cd1802a68ab27adbd3ef6382f6312bed6c8bb1bd3e325ea79a8dc8fe080ed7a06f5f97b93e7 - languageName: node - linkType: hard - "is-fullwidth-code-point@npm:^2.0.0": version: 2.0.0 resolution: "is-fullwidth-code-point@npm:2.0.0" @@ -20940,7 +20717,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:^4.17.10, lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.5, lodash@npm:^4.7.0": +"lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.5, lodash@npm:^4.7.0": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7 @@ -21455,7 +21232,7 @@ __metadata: languageName: node linkType: hard -"minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6, minimist@npm:^1.2.8": +"minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6": version: 1.2.8 resolution: "minimist@npm:1.2.8" checksum: 75a6d645fb122dad29c06a7597bddea977258957ed88d7a6df59b5cd3fe4a527e253e9bbf2e783e4b73657f9098b96a5fe96ab8a113655d4109108577ecf85b0 @@ -23038,13 +22815,6 @@ __metadata: languageName: node linkType: hard -"parse-ms@npm:^1.0.0": - version: 1.0.1 - resolution: "parse-ms@npm:1.0.1" - checksum: 93fa7921554fe16bc73272a94bf812d1db6a144964fb57692f6de4fccf14bd771a232e8dcdcd4bbaa4aa477796cd3f35374d65596cca12323f2664bc023b4b4c - languageName: node - linkType: hard - "parse5-htmlparser2-tree-adapter@npm:^7.0.0": version: 7.0.0 resolution: "parse5-htmlparser2-tree-adapter@npm:7.0.0" @@ -23420,13 +23190,6 @@ __metadata: languageName: node linkType: hard -"plur@npm:^1.0.0": - version: 1.0.0 - resolution: "plur@npm:1.0.0" - checksum: bd8725178b2db5a708293c072631c84a33299dece6e5041835f874064e51c515d201905408c780e48df54d960d32bc0ac2e9e4cfe6d756ec4fff29ba5adfbf6c - languageName: node - linkType: hard - "pngjs@npm:^3.0.0, pngjs@npm:^3.3.0, pngjs@npm:^3.3.3": version: 3.4.0 resolution: "pngjs@npm:3.4.0" @@ -24415,24 +24178,6 @@ __metadata: languageName: node linkType: hard -"pretty-ms@npm:^2.1.0": - version: 2.1.0 - resolution: "pretty-ms@npm:2.1.0" - dependencies: - is-finite: ^1.0.1 - parse-ms: ^1.0.0 - plur: ^1.0.0 - checksum: a6a3df561f761902080df23407fc549cc3042fd685d8d2906e6cc2bd5024a814fb2bd4bd061e24879a8540c3aa48faba366421d5b49c268fbfb3501493835c2a - languageName: node - linkType: hard - -"process-nextick-args@npm:~1.0.6": - version: 1.0.7 - resolution: "process-nextick-args@npm:1.0.7" - checksum: 41224fbc803ac6c96907461d4dfc20942efa3ca75f2d521bcf7cf0e89f8dec127fb3fb5d76746b8fb468a232ea02d84824fae08e027aec185fd29049c66d49f8 - languageName: node - linkType: hard - "process-nextick-args@npm:~2.0.0": version: 2.0.1 resolution: "process-nextick-args@npm:2.0.1" @@ -24970,13 +24715,6 @@ __metadata: languageName: node linkType: hard -"re-emitter@npm:1.1.3": - version: 1.1.3 - resolution: "re-emitter@npm:1.1.3" - checksum: 3234850c26c4e51622ad7e54172396134cd510c2511da680275ab1e663e5d12c8b81e3e6f4ec025527ed241ad53dae9d1478c0148569840d2fec96a37d155431 - languageName: node - linkType: hard - "react-animation@npm:1.2.2": version: 1.2.2 resolution: "react-animation@npm:1.2.2" @@ -26042,21 +25780,6 @@ __metadata: languageName: node linkType: hard -"readable-stream@npm:2.2.9": - version: 2.2.9 - resolution: "readable-stream@npm:2.2.9" - dependencies: - buffer-shims: ~1.0.0 - core-util-is: ~1.0.0 - inherits: ~2.0.1 - isarray: ~1.0.0 - process-nextick-args: ~1.0.6 - string_decoder: ~1.0.0 - util-deprecate: ~1.0.1 - checksum: d186b7051c4a25b769fa158d1025da83dfb0052f8b0889df40e8e942d05b4d0d37470c49cfd73cce886db66d1a8cd5ec5e2ce97857894587d8158da5ed93baa7 - languageName: node - linkType: hard - "readable-stream@npm:> 1.0.0 < 3.0.0, readable-stream@npm:^2.0.1, readable-stream@npm:^2.2.10, readable-stream@npm:^2.2.2, readable-stream@npm:^2.2.8, readable-stream@npm:^2.3.0, readable-stream@npm:^2.3.5, readable-stream@npm:~2.3.6": version: 2.3.8 resolution: "readable-stream@npm:2.3.8" @@ -26242,17 +25965,6 @@ __metadata: languageName: node linkType: hard -"regexp.prototype.flags@npm:^1.5.0": - version: 1.5.0 - resolution: "regexp.prototype.flags@npm:1.5.0" - dependencies: - call-bind: ^1.0.2 - define-properties: ^1.2.0 - functions-have-names: ^1.2.3 - checksum: c541687cdbdfff1b9a07f6e44879f82c66bbf07665f9a7544c5fd16acdb3ec8d1436caab01662d2fbcad403f3499d49ab0b77fbc7ef29ef961d98cc4bc9755b4 - languageName: node - linkType: hard - "regexpp@npm:^3.1.0": version: 3.2.0 resolution: "regexpp@npm:3.2.0" @@ -26321,13 +26033,6 @@ __metadata: languageName: node linkType: hard -"repeat-string@npm:^1.5.2": - version: 1.6.1 - resolution: "repeat-string@npm:1.6.1" - checksum: 1b809fc6db97decdc68f5b12c4d1a671c8e3f65ec4a40c238bc5200e44e85bcc52a54f78268ab9c29fcf5fe4f1343e805420056d1f30fa9a9ee4c2d93e3cc6c0 - languageName: node - linkType: hard - "request@npm:^2.79.0": version: 2.88.2 resolution: "request@npm:2.88.2" @@ -26783,18 +26488,6 @@ __metadata: languageName: node linkType: hard -"safe-array-concat@npm:^1.0.0": - version: 1.0.0 - resolution: "safe-array-concat@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.2.0 - has-symbols: ^1.0.3 - isarray: ^2.0.5 - checksum: f43cb98fe3b566327d0c09284de2b15fb85ae964a89495c1b1a5d50c7c8ed484190f4e5e71aacc167e16231940079b326f2c0807aea633d47cc7322f40a6b57f - languageName: node - linkType: hard - "safe-buffer@npm:5.1.2, safe-buffer@npm:~5.1.0, safe-buffer@npm:~5.1.1": version: 5.1.2 resolution: "safe-buffer@npm:5.1.2" @@ -27683,15 +27376,6 @@ __metadata: languageName: node linkType: hard -"split@npm:1.0.0": - version: 1.0.0 - resolution: "split@npm:1.0.0" - dependencies: - through: 2 - checksum: 84837fa659662fab703efb41f5e3b3c4ae7de605555b6ce53c4fadb2a30b7cc7c8c005f905e6cb16e527ebb4117b6c2da1fe09c1caa150bdaf24df0dff8bf5d3 - languageName: node - linkType: hard - "sprintf-js@npm:1.1.2": version: 1.1.2 resolution: "sprintf-js@npm:1.1.2" @@ -28024,15 +27708,6 @@ __metadata: languageName: node linkType: hard -"string_decoder@npm:~1.0.0": - version: 1.0.3 - resolution: "string_decoder@npm:1.0.3" - dependencies: - safe-buffer: ~5.1.0 - checksum: 57ef02a148fd1ff2f20fe1accd944505ed3703e78bb28d302d940b2ad3dfb469508f79dcd0275ba1960d9675aa206452f76b2416059a6d0b0200bd7e9f552cdb - languageName: node - linkType: hard - "string_decoder@npm:~1.1.1": version: 1.1.1 resolution: "string_decoder@npm:1.1.1" @@ -28053,15 +27728,6 @@ __metadata: languageName: node linkType: hard -"strip-ansi@npm:^3.0.0": - version: 3.0.1 - resolution: "strip-ansi@npm:3.0.1" - dependencies: - ansi-regex: ^2.0.0 - checksum: 9b974de611ce5075c70629c00fa98c46144043db92ae17748fb780f706f7a789e9989fd10597b7c2053ae8d1513fd707816a91f1879b2f71e6ac0b6a863db465 - languageName: node - linkType: hard - "strip-ansi@npm:^5.0.0, strip-ansi@npm:^5.1.0, strip-ansi@npm:^5.2.0": version: 5.2.0 resolution: "strip-ansi@npm:5.2.0" @@ -28308,13 +27974,6 @@ __metadata: languageName: node linkType: hard -"supports-color@npm:^2.0.0": - version: 2.0.0 - resolution: "supports-color@npm:2.0.0" - checksum: 602538c5812b9006404370b5a4b885d3e2a1f6567d314f8b4a41974ffe7d08e525bf92ae0f9c7030e3b4c78e4e34ace55d6a67a74f1571bc205959f5972f88f0 - languageName: node - linkType: hard - "supports-color@npm:^5.3.0, supports-color@npm:^5.5.0": version: 5.5.0 resolution: "supports-color@npm:5.5.0" @@ -28515,39 +28174,6 @@ __metadata: languageName: node linkType: hard -"tap-out@npm:^2.1.0": - version: 2.1.0 - resolution: "tap-out@npm:2.1.0" - dependencies: - re-emitter: 1.1.3 - readable-stream: 2.2.9 - split: 1.0.0 - trim: 0.0.1 - bin: - tap-out: bin/cmd.js - checksum: b837d8adf646bf06f73a9306a9796a3201c55598c2c70045a2908d044fc2cc9466d52d27a7705c92a2c6ea37d560a84d135f4112bd377346f34d381ed836088b - languageName: node - linkType: hard - -"tap-spec@npm:^5.0.0": - version: 5.0.0 - resolution: "tap-spec@npm:5.0.0" - dependencies: - chalk: ^1.0.0 - duplexer: ^0.1.1 - figures: ^1.4.0 - lodash: ^4.17.10 - pretty-ms: ^2.1.0 - repeat-string: ^1.5.2 - tap-out: ^2.1.0 - through2: ^2.0.0 - bin: - tap-spec: bin/cmd.js - tspec: bin/cmd.js - checksum: 4413acc3ed4b8662b64439ad5be65a4d42edb2f3c5dc273b8ee563f9e7bfdde347e53c92de628a04ab640dda3cd8aea8aeb3ee7aa86bde8118d0584ffd76b788 - languageName: node - linkType: hard - "tapable@npm:^1.0.0": version: 1.1.3 resolution: "tapable@npm:1.1.3" @@ -28562,37 +28188,6 @@ __metadata: languageName: node linkType: hard -"tape@npm:^5.5.3": - version: 5.6.6 - resolution: "tape@npm:5.6.6" - dependencies: - "@ljharb/resumer": ^0.0.1 - "@ljharb/through": ^2.3.9 - array.prototype.every: ^1.1.4 - call-bind: ^1.0.2 - deep-equal: ^2.2.2 - defined: ^1.0.1 - dotignore: ^0.1.2 - for-each: ^0.3.3 - get-package-type: ^0.1.0 - glob: ^7.2.3 - has: ^1.0.3 - has-dynamic-import: ^2.0.1 - inherits: ^2.0.4 - is-regex: ^1.1.4 - minimist: ^1.2.8 - object-inspect: ^1.12.3 - object-is: ^1.1.5 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - resolve: ^2.0.0-next.4 - string.prototype.trim: ^1.2.7 - bin: - tape: bin/tape - checksum: aac4722c7104f8478c8079aa1f441636b720f432074355c2edb1b0c0e2f2822004af2097669186d65ce7c70c57164d85d7da3662338e53515bdb778f5412af30 - languageName: node - linkType: hard - "tar-stream@npm:^1.6.2": version: 1.6.2 resolution: "tar-stream@npm:1.6.2" @@ -28775,7 +28370,7 @@ __metadata: languageName: node linkType: hard -"through2@npm:^2.0.0, through2@npm:^2.0.2, through2@npm:^2.0.3": +"through2@npm:^2.0.2, through2@npm:^2.0.3": version: 2.0.5 resolution: "through2@npm:2.0.5" dependencies: @@ -28785,7 +28380,7 @@ __metadata: languageName: node linkType: hard -"through@npm:2, through@npm:>=2.2.7 <3": +"through@npm:>=2.2.7 <3": version: 2.3.8 resolution: "through@npm:2.3.8" checksum: a38c3e059853c494af95d50c072b83f8b676a9ba2818dcc5b108ef252230735c54e0185437618596c790bbba8fcdaef5b290405981ffa09dce67b1f1bf190cbd @@ -29016,13 +28611,6 @@ __metadata: languageName: node linkType: hard -"trim@npm:0.0.1": - version: 0.0.1 - resolution: "trim@npm:0.0.1" - checksum: 2b4646dff99a222e8e1526edd4e3a43bbd925af0b8e837c340455d250157e7deefaa4da49bb891ab841e5c27b1afc5e9e32d4b57afb875d2dfcabf4e319b8f7f - languageName: node - linkType: hard - "tryer@npm:^1.0.1": version: 1.0.1 resolution: "tryer@npm:1.0.1" @@ -29233,42 +28821,6 @@ __metadata: languageName: node linkType: hard -"typed-array-buffer@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-buffer@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.2.1 - is-typed-array: ^1.1.10 - checksum: 3e0281c79b2a40cd97fe715db803884301993f4e8c18e8d79d75fd18f796e8cd203310fec8c7fdb5e6c09bedf0af4f6ab8b75eb3d3a85da69328f28a80456bd3 - languageName: node - linkType: hard - -"typed-array-byte-length@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-byte-length@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - for-each: ^0.3.3 - has-proto: ^1.0.1 - is-typed-array: ^1.1.10 - checksum: b03db16458322b263d87a702ff25388293f1356326c8a678d7515767ef563ef80e1e67ce648b821ec13178dd628eb2afdc19f97001ceae7a31acf674c849af94 - languageName: node - linkType: hard - -"typed-array-byte-offset@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-byte-offset@npm:1.0.0" - dependencies: - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - for-each: ^0.3.3 - has-proto: ^1.0.1 - is-typed-array: ^1.1.10 - checksum: 04f6f02d0e9a948a95fbfe0d5a70b002191fae0b8fe0fe3130a9b2336f043daf7a3dda56a31333c35a067a97e13f539949ab261ca0f3692c41603a46a94e960b - languageName: node - linkType: hard - "typed-array-length@npm:^1.0.4": version: 1.0.4 resolution: "typed-array-length@npm:1.0.4" @@ -30603,19 +30155,6 @@ __metadata: languageName: node linkType: hard -"which-typed-array@npm:^1.1.10": - version: 1.1.11 - resolution: "which-typed-array@npm:1.1.11" - dependencies: - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - for-each: ^0.3.3 - gopd: ^1.0.1 - has-tostringtag: ^1.0.0 - checksum: 711ffc8ef891ca6597b19539075ec3e08bb9b4c2ca1f78887e3c07a977ab91ac1421940505a197758fb5939aa9524976d0a5bbcac34d07ed6faa75cedbb17206 - languageName: node - linkType: hard - "which-typed-array@npm:^1.1.2, which-typed-array@npm:^1.1.9": version: 1.1.9 resolution: "which-typed-array@npm:1.1.9" From f7e58e4829cec921174ba634b3fed9e45388b012 Mon Sep 17 00:00:00 2001 From: Harsh Rajat Date: Sun, 3 Mar 2024 14:31:13 +0400 Subject: [PATCH 11/23] Channel Profile notification fetch --- package.json | 2 +- src/App.tsx | 20 +- src/components/ViewChannelItem.js | 15 +- src/segments/ChannelProfile.tsx | 205 +++++++----- yarn.lock | 500 ++---------------------------- 5 files changed, 165 insertions(+), 577 deletions(-) diff --git a/package.json b/package.json index dfab0eecc7..1601d4a943 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "0.0.1-alpha.64", + "@pushprotocol/restapi": "1.6.10", "@pushprotocol/socket": "0.5.3", "@pushprotocol/uiweb": "0.0.1-alpha.41", "@reduxjs/toolkit": "^1.7.1", diff --git a/src/App.tsx b/src/App.tsx index 1c4c4a089c..cb2c4cffd7 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -100,20 +100,20 @@ const extendConsole = () => { // extend console extendConsole(); -// Disable consolve - -if (appConfig?.appEnv === "prod") { - console.enable("debug", false); - console.enable("log", false); - console.enable("info", false); - - // disable console.warn in prod +// Disable console but not on localhost +if (location.hostname !== "localhost" && location.hostname !== "127.0.0.1") { if (appConfig?.appEnv === "prod") { - console.enable("warn", false); + console.enable("debug", false); + console.enable("log", false); + console.enable("info", false); + + // disable console.warn in prod + if (appConfig?.appEnv === "prod") { + console.enable("warn", false); + } } } - // Provess App export default function App() { const dispatch = useDispatch(); diff --git a/src/components/ViewChannelItem.js b/src/components/ViewChannelItem.js index 2ed8cd9e47..436ae13b4b 100644 --- a/src/components/ViewChannelItem.js +++ b/src/components/ViewChannelItem.js @@ -348,12 +348,8 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) }; const copyToClipboard = (address) => { - let hostname = window.location.hostname; - // if we are on localhost, attach the port - if (hostname === 'localhost') { - hostname = hostname + ':3000'; - } - const url = `${hostname}/channels?channel=${address}`; + const url = generateChannelProfileLink(address, true); + // fallback for non navigator browser support if (navigator && navigator.clipboard) { navigator.clipboard.writeText(url); @@ -377,7 +373,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) hostname = hostname + ':3000'; } - url = `${hostname}/${url}`; + url = `${hostname}${url}`; } return url; @@ -484,7 +480,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) )} - correctChannelTitleLink()}>{channelObject.name} + navigate(generateChannelProfileLink(channelObject.channel, false))}>{channelObject.name} {isVerified == 1 && ( @@ -576,7 +572,6 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) { - console.log(generateChannelProfileLink(channelObject.channel, false)); navigate(generateChannelProfileLink(channelObject.channel, false)) }} > @@ -654,7 +649,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) )} - correctChannelTitleLink()}>{channelObject.name} + navigate(generateChannelProfileLink(channelObject.channel, false))}>{channelObject.name} {isVerified == 1 && ( diff --git a/src/segments/ChannelProfile.tsx b/src/segments/ChannelProfile.tsx index 78ff988db6..03fe6ac650 100644 --- a/src/segments/ChannelProfile.tsx +++ b/src/segments/ChannelProfile.tsx @@ -1,19 +1,23 @@ // React + Web3 Essentials -import React from "react"; +import React, { useEffect, useState } from "react"; // External Packages +import { NotificationItem } from "@pushprotocol/uiweb"; import { useDispatch, useSelector } from "react-redux"; +import { useNavigate } from 'react-router-dom'; import { useClickAway } from "react-use"; -import styled from "styled-components"; +import styled, { ThemeProvider, useTheme } from "styled-components"; // Internal Compoonents -import { ReactComponent as Close } from 'assets/chat/group-chat/close.svg'; +import { ReactComponent as Back } from 'assets/chat/arrowleft.svg'; import ChannelLoading from "components/ChannelLoading"; -import { ScrollItem } from "./ViewChannels"; +import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; // Internal Configs -import { ItemHV2, SpanV2 } from "components/reusables/SharedStylingV2"; +import { latest } from "@pushprotocol/restapi/src/lib/chat"; +import { ItemVV2, SpanV2 } from "components/reusables/SharedStylingV2"; import { appConfig } from "config"; +import APP_PATHS from "config/AppPaths"; import { device } from "config/Globals"; // Constants @@ -26,20 +30,93 @@ const ChannelProfile = ({ channelID }) => { return state.user; }); const modalRef = React.useRef(null); - useClickAway(modalRef, () => showFilter && setShowFilter(false)); - // toast related section - const [loading, setLoading] = React.useState(false); + // get theme + const themes = useTheme(); + + // loading + const [loading, setLoading] = useState(true); + const [notifications, setNotifications] = useState([]); + + // Setup navigation + const navigate = useNavigate(); + + // load notifications + useEffect(() => { + if (userPushSDKInstance) { + setLoading(true); + userPushSDKInstance.channel.notifications(channelID, { + page: 1, + limit: NOTIFICATIONS_PER_PAGE, + }).then((response) => { + setNotifications(response.feeds); + setLoading(false); + + // ENABLE PAGINATION HERE + }).catch((err) => { + // ENABLE NO NOTIFICATION FOUND HERE + }); + }; + return () => { + setNotifications([]); + setLoading(true); + } + }, [channelID]); // Render return ( - - - - - - - + + + + + { + navigate(APP_PATHS.Channels); + }} + /> + + + Channel Profile Here + + + + + {loading && + + } + + {notifications.map((item, index) => { + const payload = item.payload; + + // render the notification item + return ( + + + + ); + })} + + + ); } @@ -48,86 +125,64 @@ const Container = styled.div` display: flex; flex: 1; flex-direction: column; - height: 85%; align-content: center; align-items: center; justify-content: center; font-weight: 200; - margin: 0 0 0 10px; + margin: 20px 0px 0px 20px; `; const NotifsOuter = styled.div` - margin: 25px 0px; -`; -const Notifs = styled.div` - align-self: stretch; - flex: 1; `; -const Toaster = styled.div` +const ScrollItem = styled(ItemVV2)` display: flex; - flex-direction: row; - align-items: center; - margin: 0px 10px; -`; - -const ToasterMsg = styled.div` - margin: 0px 10px; -`; + align-self: stretch; + align-items: stretch; + justify-content: stretch; + flex-wrap: nowrap; -const SnapSection = styled(ItemHV2)` - max-height:28px; - margin-top:20px; - border-radius: 12px; - border: 1px solid #D4DCEA; - background: #FFF; - border: 1px solid ${(props) => props.theme.default.border}; - background:${(props) => props.theme.default.bg}; - padding: 12px 16px; - align-items: center; - gap: 16px; + flex: 1; + padding: 0px 20px 10px 0px; + overflow-y: auto; - @media ${device.tablet} { - gap: 9px; - margin-right:10px; + &::-webkit-scrollbar-track { + background-color: ${(props) => props.theme.scrollBg}; + border-radius: 10px; } - @media (max-width:525px) { - max-height:50px; - } -` - -const InstallText = styled(ItemHV2)` - @media ${device.tablet} { - flex-direction:column; - align-items: baseline; - display: block; - align-self: auto; + &::-webkit-scrollbar { + background-color: ${(props) => props.theme.scrollBg}; + width: 6px; } - -` - -const CloseButton = styled(Close)` - cursor:pointer; - height:20px; - width:20px; - - -` + @media (max-width: 768px) { + padding: 0px; -const InstallPushSnap = styled(SpanV2)` - cursor:pointer; - font-size:14px; - font-weight:500; - color:#D53A94; + &::-webkit-scrollbar-track { + background-color: none; + border-radius: 9px; + } + + &::-webkit-scrollbar { + background-color: none; + width: 4px; + } + } - &:hover{ - text-decoration:underline; - text-underline-position: under; + &::-webkit-scrollbar-thumb { + border-radius: 10px; + background-image: -webkit-gradient( + linear, + left top, + left bottom, + color-stop(0.44, #CF1C84), + color-stop(0.72, #CF1C84), + color-stop(0.86, #CF1C84) + ); } -` +`; // Export Default export default ChannelProfile; \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index e39c26d170..5224040235 100644 --- a/yarn.lock +++ b/yarn.lock @@ -81,17 +81,6 @@ __metadata: languageName: node linkType: hard -"@ambire/signature-validator@npm:^1.3.1": - version: 1.3.1 - resolution: "@ambire/signature-validator@npm:1.3.1" - dependencies: - ethers: ^5.6.5 - tap-spec: ^5.0.0 - tape: ^5.5.3 - checksum: 44c4796f4cbb4624cfd64033523d3491afa899067026e9615322dc6efaca71b16358cbc1661f2fce62d9dedcf424c92d44fe3b2ab8c6f171a59c0c21dc17b2e2 - languageName: node - linkType: hard - "@ampproject/remapping@npm:^2.2.0": version: 2.2.0 resolution: "@ampproject/remapping@npm:2.2.0" @@ -4641,22 +4630,6 @@ __metadata: languageName: node linkType: hard -"@ljharb/resumer@npm:^0.0.1": - version: 0.0.1 - resolution: "@ljharb/resumer@npm:0.0.1" - dependencies: - "@ljharb/through": ^2.3.9 - checksum: 1cff0a485cb857933d2921cb05a349f8fe894fa2bb6b31a347010ecccc4a2b369e43ebe5383a32a60ee6c9572d2c83fcab383eb01727e1507bf29c59f312dae6 - languageName: node - linkType: hard - -"@ljharb/through@npm:^2.3.9": - version: 2.3.9 - resolution: "@ljharb/through@npm:2.3.9" - checksum: a47ffed12ef4b08d07458db8bff5f7a13a7030fddf7dbfa947a765581a634d42ee90f7b8c249315aad122c21ad061e97a74f65aef3c03d2c09291d11312f0bfb - languageName: node - linkType: hard - "@material-ui/core@npm:4.11.0": version: 4.11.0 resolution: "@material-ui/core@npm:4.11.0" @@ -5432,7 +5405,7 @@ __metadata: "@mui/icons-material": ^5.8.4 "@mui/lab": ^5.0.0-alpha.72 "@mui/material": ^5.5.0 - "@pushprotocol/restapi": 0.0.1-alpha.64 + "@pushprotocol/restapi": 1.6.10 "@pushprotocol/socket": 0.5.3 "@pushprotocol/uiweb": 0.0.1-alpha.41 "@reduxjs/toolkit": ^1.7.1 @@ -5621,11 +5594,10 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/restapi@npm:0.0.1-alpha.64": - version: 0.0.1-alpha.64 - resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.64" +"@pushprotocol/restapi@npm:1.6.10": + version: 1.6.10 + resolution: "@pushprotocol/restapi@npm:1.6.10" dependencies: - "@ambire/signature-validator": ^1.3.1 "@metamask/eth-sig-util": ^5.0.2 axios: ^0.27.2 buffer: ^6.0.3 @@ -5644,7 +5616,10 @@ __metadata: viem: ^1.20.3 peerDependencies: ethers: ^5.0.0 || ^6.0.0 - checksum: 6c62724de1522572de2dfc62212f7a461f8b92b4c8f32097d8a1cea527bda4e3d00b65ada8b2adb2a466d7615af7eb8092b28defed7dc06293a25ea3b9713503 + peerDependenciesMeta: + ethers: + optional: true + checksum: 5c01d0c2fb4b4076c6e09d06dbf4a76cb6f552c0830c10bebce4bad91d96c86556fa5a034499d7b43d72541b60de805e34a9fb7578d1669fe1cfa5ab27edb9c7 languageName: node linkType: hard @@ -10151,13 +10126,6 @@ __metadata: languageName: node linkType: hard -"ansi-regex@npm:^2.0.0": - version: 2.1.1 - resolution: "ansi-regex@npm:2.1.1" - checksum: 190abd03e4ff86794f338a31795d262c1dfe8c91f7e01d04f13f646f1dcb16c5800818f886047876f1272f065570ab86b24b99089f8b68a0e11ff19aed4ca8f1 - languageName: node - linkType: hard - "ansi-regex@npm:^4.0.0, ansi-regex@npm:^4.1.0": version: 4.1.1 resolution: "ansi-regex@npm:4.1.1" @@ -10179,13 +10147,6 @@ __metadata: languageName: node linkType: hard -"ansi-styles@npm:^2.2.1": - version: 2.2.1 - resolution: "ansi-styles@npm:2.2.1" - checksum: ebc0e00381f2a29000d1dac8466a640ce11943cef3bda3cd0020dc042e31e1058ab59bf6169cd794a54c3a7338a61ebc404b7c91e004092dd20e028c432c9c2c - languageName: node - linkType: hard - "ansi-styles@npm:^3.2.0, ansi-styles@npm:^3.2.1": version: 3.2.1 resolution: "ansi-styles@npm:3.2.1" @@ -10387,18 +10348,6 @@ __metadata: languageName: node linkType: hard -"array.prototype.every@npm:^1.1.4": - version: 1.1.5 - resolution: "array.prototype.every@npm:1.1.5" - dependencies: - call-bind: ^1.0.2 - define-properties: ^1.2.0 - es-abstract: ^1.22.1 - is-string: ^1.0.7 - checksum: 9974435604e135fc8c359a76c89bfe0672c1a80974a76dc61c673e5ea5068f78a31b7a168634ed7691501130ed61d3c788dd1d48ec1265c6cdf3910897b1eba4 - languageName: node - linkType: hard - "array.prototype.flat@npm:^1.2.5, array.prototype.flat@npm:^1.3.1": version: 1.3.1 resolution: "array.prototype.flat@npm:1.3.1" @@ -10449,20 +10398,6 @@ __metadata: languageName: node linkType: hard -"arraybuffer.prototype.slice@npm:^1.0.1": - version: 1.0.1 - resolution: "arraybuffer.prototype.slice@npm:1.0.1" - dependencies: - array-buffer-byte-length: ^1.0.0 - call-bind: ^1.0.2 - define-properties: ^1.2.0 - get-intrinsic: ^1.2.1 - is-array-buffer: ^3.0.2 - is-shared-array-buffer: ^1.0.2 - checksum: e3e9b2a3e988ebfeddce4c7e8f69df730c9e48cb04b0d40ff0874ce3d86b3d1339dd520ffde5e39c02610bc172ecfbd4bc93324b1cabd9554c44a56b131ce0ce - languageName: node - linkType: hard - "asap@npm:~2.0.6": version: 2.0.6 resolution: "asap@npm:2.0.6" @@ -11636,13 +11571,6 @@ __metadata: languageName: node linkType: hard -"buffer-shims@npm:~1.0.0": - version: 1.0.0 - resolution: "buffer-shims@npm:1.0.0" - checksum: 4defd1ffc9b270708ea39c17cac75c91c520c8e2f1d28a4d0ec74dc77445cbf8fc162003f0530fd1f81340347e9a26863d5aa27cd3cc351ec1d0361777d15ace - languageName: node - linkType: hard - "buffer-to-arraybuffer@npm:^0.0.5": version: 0.0.5 resolution: "buffer-to-arraybuffer@npm:0.0.5" @@ -11971,19 +11899,6 @@ __metadata: languageName: node linkType: hard -"chalk@npm:^1.0.0": - version: 1.1.3 - resolution: "chalk@npm:1.1.3" - dependencies: - ansi-styles: ^2.2.1 - escape-string-regexp: ^1.0.2 - has-ansi: ^2.0.0 - strip-ansi: ^3.0.0 - supports-color: ^2.0.0 - checksum: 9d2ea6b98fc2b7878829eec223abcf404622db6c48396a9b9257f6d0ead2acf18231ae368d6a664a83f272b0679158da12e97b5229f794939e555cc574478acd - languageName: node - linkType: hard - "chalk@npm:^2.0.0, chalk@npm:^2.0.1, chalk@npm:^2.4.1": version: 2.4.2 resolution: "chalk@npm:2.4.2" @@ -13437,32 +13352,6 @@ __metadata: languageName: node linkType: hard -"deep-equal@npm:^2.2.2": - version: 2.2.2 - resolution: "deep-equal@npm:2.2.2" - dependencies: - array-buffer-byte-length: ^1.0.0 - call-bind: ^1.0.2 - es-get-iterator: ^1.1.3 - get-intrinsic: ^1.2.1 - is-arguments: ^1.1.1 - is-array-buffer: ^3.0.2 - is-date-object: ^1.0.5 - is-regex: ^1.1.4 - is-shared-array-buffer: ^1.0.2 - isarray: ^2.0.5 - object-is: ^1.1.5 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - regexp.prototype.flags: ^1.5.0 - side-channel: ^1.0.4 - which-boxed-primitive: ^1.0.2 - which-collection: ^1.0.1 - which-typed-array: ^1.1.9 - checksum: eb61c35157b6ecb96a5359b507b083fbff8ddb4c86a78a781ee38485f77a667465e45d63ee2ebd8a00e86d94c80e499906900cd82c2debb400237e1662cd5397 - languageName: node - linkType: hard - "deep-is@npm:^0.1.3, deep-is@npm:~0.1.3": version: 0.1.4 resolution: "deep-is@npm:0.1.4" @@ -13510,7 +13399,7 @@ __metadata: languageName: node linkType: hard -"define-properties@npm:^1.1.3, define-properties@npm:^1.1.4, define-properties@npm:^1.2.0": +"define-properties@npm:^1.1.3, define-properties@npm:^1.1.4": version: 1.2.0 resolution: "define-properties@npm:1.2.0" dependencies: @@ -13520,13 +13409,6 @@ __metadata: languageName: node linkType: hard -"defined@npm:^1.0.1": - version: 1.0.1 - resolution: "defined@npm:1.0.1" - checksum: b1a852300bdb57f297289b55eafdd0c517afaa3ec8190e78fce91b9d8d0c0369d4505ecbdacfd3d98372e664f4a267d9bd793938d4a8c76209c9d9516fbe2101 - languageName: node - linkType: hard - "delay@npm:^5.0.0": version: 5.0.0 resolution: "delay@npm:5.0.0" @@ -14042,17 +13924,6 @@ __metadata: languageName: node linkType: hard -"dotignore@npm:^0.1.2": - version: 0.1.2 - resolution: "dotignore@npm:0.1.2" - dependencies: - minimatch: ^3.0.4 - bin: - ignored: bin/ignored - checksum: 06bab15e2a2400c6f823a0edbcd73661180f6245a4041a3fe3b9fde4b22ae74b896604df4520a877093f05c656bd080087376c9f605bccdea847664c59910f37 - languageName: node - linkType: hard - "drbg.js@npm:^1.0.1": version: 1.0.1 resolution: "drbg.js@npm:1.0.1" @@ -14074,7 +13945,7 @@ __metadata: languageName: node linkType: hard -"duplexer@npm:^0.1.1, duplexer@npm:^0.1.2": +"duplexer@npm:^0.1.2": version: 0.1.2 resolution: "duplexer@npm:0.1.2" checksum: 62ba61a830c56801db28ff6305c7d289b6dc9f859054e8c982abd8ee0b0a14d2e9a8e7d086ffee12e868d43e2bbe8a964be55ddbd8c8957714c87373c7a4f9b0 @@ -14599,53 +14470,6 @@ __metadata: languageName: node linkType: hard -"es-abstract@npm:^1.22.1": - version: 1.22.1 - resolution: "es-abstract@npm:1.22.1" - dependencies: - array-buffer-byte-length: ^1.0.0 - arraybuffer.prototype.slice: ^1.0.1 - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - es-set-tostringtag: ^2.0.1 - es-to-primitive: ^1.2.1 - function.prototype.name: ^1.1.5 - get-intrinsic: ^1.2.1 - get-symbol-description: ^1.0.0 - globalthis: ^1.0.3 - gopd: ^1.0.1 - has: ^1.0.3 - has-property-descriptors: ^1.0.0 - has-proto: ^1.0.1 - has-symbols: ^1.0.3 - internal-slot: ^1.0.5 - is-array-buffer: ^3.0.2 - is-callable: ^1.2.7 - is-negative-zero: ^2.0.2 - is-regex: ^1.1.4 - is-shared-array-buffer: ^1.0.2 - is-string: ^1.0.7 - is-typed-array: ^1.1.10 - is-weakref: ^1.0.2 - object-inspect: ^1.12.3 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - regexp.prototype.flags: ^1.5.0 - safe-array-concat: ^1.0.0 - safe-regex-test: ^1.0.0 - string.prototype.trim: ^1.2.7 - string.prototype.trimend: ^1.0.6 - string.prototype.trimstart: ^1.0.6 - typed-array-buffer: ^1.0.0 - typed-array-byte-length: ^1.0.0 - typed-array-byte-offset: ^1.0.0 - typed-array-length: ^1.0.4 - unbox-primitive: ^1.0.2 - which-typed-array: ^1.1.10 - checksum: 614e2c1c3717cb8d30b6128ef12ea110e06fd7d75ad77091ca1c5dbfb00da130e62e4bbbbbdda190eada098a22b27fe0f99ae5a1171dac2c8663b1e8be8a3a9b - languageName: node - linkType: hard - "es-array-method-boxes-properly@npm:^1.0.0": version: 1.0.0 resolution: "es-array-method-boxes-properly@npm:1.0.0" @@ -14653,7 +14477,7 @@ __metadata: languageName: node linkType: hard -"es-get-iterator@npm:^1.1.2, es-get-iterator@npm:^1.1.3": +"es-get-iterator@npm:^1.1.2": version: 1.1.3 resolution: "es-get-iterator@npm:1.1.3" dependencies: @@ -15724,7 +15548,7 @@ __metadata: languageName: node linkType: hard -"ethers@npm:^5.3.1, ethers@npm:^5.6.5, ethers@npm:^5.6.8, ethers@npm:^5.7.2": +"ethers@npm:^5.3.1, ethers@npm:^5.6.8, ethers@npm:^5.7.2": version: 5.7.2 resolution: "ethers@npm:5.7.2" dependencies: @@ -16126,16 +15950,6 @@ __metadata: languageName: node linkType: hard -"figures@npm:^1.4.0": - version: 1.7.0 - resolution: "figures@npm:1.7.0" - dependencies: - escape-string-regexp: ^1.0.5 - object-assign: ^4.1.0 - checksum: d77206deba991a7977f864b8c8edf9b8b43b441be005482db04b0526e36263adbdb22c1c6d2df15a1ad78d12029bd1aa41ccebcb5d425e1f2cf629c6daaa8e10 - languageName: node - linkType: hard - "file-entry-cache@npm:^6.0.1": version: 6.0.1 resolution: "file-entry-cache@npm:6.0.1" @@ -16572,7 +16386,7 @@ __metadata: languageName: node linkType: hard -"functions-have-names@npm:^1.2.2, functions-have-names@npm:^1.2.3": +"functions-have-names@npm:^1.2.2": version: 1.2.3 resolution: "functions-have-names@npm:1.2.3" checksum: c3f1f5ba20f4e962efb71344ce0a40722163e85bee2101ce25f88214e78182d2d2476aa85ef37950c579eb6cf6ee811c17b3101bb84004bb75655f3e33f3fdb5 @@ -16627,18 +16441,6 @@ __metadata: languageName: node linkType: hard -"get-intrinsic@npm:^1.2.1": - version: 1.2.1 - resolution: "get-intrinsic@npm:1.2.1" - dependencies: - function-bind: ^1.1.1 - has: ^1.0.3 - has-proto: ^1.0.1 - has-symbols: ^1.0.3 - checksum: 5b61d88552c24b0cf6fa2d1b3bc5459d7306f699de060d76442cce49a4721f52b8c560a33ab392cf5575b7810277d54ded9d4d39a1ea61855619ebc005aa7e5f - languageName: node - linkType: hard - "get-iterator@npm:^1.0.2": version: 1.0.2 resolution: "get-iterator@npm:1.0.2" @@ -16801,7 +16603,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6, glob@npm:^7.2.3": +"glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6": version: 7.2.3 resolution: "glob@npm:7.2.3" dependencies: @@ -17090,15 +16892,6 @@ __metadata: languageName: node linkType: hard -"has-ansi@npm:^2.0.0": - version: 2.0.0 - resolution: "has-ansi@npm:2.0.0" - dependencies: - ansi-regex: ^2.0.0 - checksum: 1b51daa0214440db171ff359d0a2d17bc20061164c57e76234f614c91dbd2a79ddd68dfc8ee73629366f7be45a6df5f2ea9de83f52e1ca24433f2cc78c35d8ec - languageName: node - linkType: hard - "has-bigints@npm:^1.0.1, has-bigints@npm:^1.0.2": version: 1.0.2 resolution: "has-bigints@npm:1.0.2" @@ -17106,16 +16899,6 @@ __metadata: languageName: node linkType: hard -"has-dynamic-import@npm:^2.0.1": - version: 2.0.1 - resolution: "has-dynamic-import@npm:2.0.1" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.1.1 - checksum: 1cb60255cdd354a5f53997dd4c8ae0f821706ced3d1047bb810cb74400f28988b08d4d986318cb6610b79e6b9993a6592e678b6cef3ef0b71ab553eaa99b9c4d - languageName: node - linkType: hard - "has-flag@npm:^3.0.0": version: 3.0.0 resolution: "has-flag@npm:3.0.0" @@ -17771,7 +17554,7 @@ __metadata: languageName: node linkType: hard -"inherits@npm:2, inherits@npm:2.0.4, inherits@npm:^2.0.1, inherits@npm:^2.0.3, inherits@npm:^2.0.4, inherits@npm:~2.0.1, inherits@npm:~2.0.3, inherits@npm:~2.0.4": +"inherits@npm:2, inherits@npm:2.0.4, inherits@npm:^2.0.1, inherits@npm:^2.0.3, inherits@npm:^2.0.4, inherits@npm:~2.0.3, inherits@npm:~2.0.4": version: 2.0.4 resolution: "inherits@npm:2.0.4" checksum: 4a48a733847879d6cf6691860a6b1e3f0f4754176e4d71494c41f3475553768b10f84b5ce1d40fbd0e34e6bfbb864ee35858ad4dd2cf31e02fc4a154b724d7f1 @@ -18392,13 +18175,6 @@ __metadata: languageName: node linkType: hard -"is-finite@npm:^1.0.1": - version: 1.1.0 - resolution: "is-finite@npm:1.1.0" - checksum: 532b97ed3d03e04c6bd203984d9e4ba3c0c390efee492bad5d1d1cd1802a68ab27adbd3ef6382f6312bed6c8bb1bd3e325ea79a8dc8fe080ed7a06f5f97b93e7 - languageName: node - linkType: hard - "is-fullwidth-code-point@npm:^2.0.0": version: 2.0.0 resolution: "is-fullwidth-code-point@npm:2.0.0" @@ -20940,7 +20716,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:^4.17.10, lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.5, lodash@npm:^4.7.0": +"lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.5, lodash@npm:^4.7.0": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7 @@ -21455,7 +21231,7 @@ __metadata: languageName: node linkType: hard -"minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6, minimist@npm:^1.2.8": +"minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6": version: 1.2.8 resolution: "minimist@npm:1.2.8" checksum: 75a6d645fb122dad29c06a7597bddea977258957ed88d7a6df59b5cd3fe4a527e253e9bbf2e783e4b73657f9098b96a5fe96ab8a113655d4109108577ecf85b0 @@ -23038,13 +22814,6 @@ __metadata: languageName: node linkType: hard -"parse-ms@npm:^1.0.0": - version: 1.0.1 - resolution: "parse-ms@npm:1.0.1" - checksum: 93fa7921554fe16bc73272a94bf812d1db6a144964fb57692f6de4fccf14bd771a232e8dcdcd4bbaa4aa477796cd3f35374d65596cca12323f2664bc023b4b4c - languageName: node - linkType: hard - "parse5-htmlparser2-tree-adapter@npm:^7.0.0": version: 7.0.0 resolution: "parse5-htmlparser2-tree-adapter@npm:7.0.0" @@ -23420,13 +23189,6 @@ __metadata: languageName: node linkType: hard -"plur@npm:^1.0.0": - version: 1.0.0 - resolution: "plur@npm:1.0.0" - checksum: bd8725178b2db5a708293c072631c84a33299dece6e5041835f874064e51c515d201905408c780e48df54d960d32bc0ac2e9e4cfe6d756ec4fff29ba5adfbf6c - languageName: node - linkType: hard - "pngjs@npm:^3.0.0, pngjs@npm:^3.3.0, pngjs@npm:^3.3.3": version: 3.4.0 resolution: "pngjs@npm:3.4.0" @@ -24415,24 +24177,6 @@ __metadata: languageName: node linkType: hard -"pretty-ms@npm:^2.1.0": - version: 2.1.0 - resolution: "pretty-ms@npm:2.1.0" - dependencies: - is-finite: ^1.0.1 - parse-ms: ^1.0.0 - plur: ^1.0.0 - checksum: a6a3df561f761902080df23407fc549cc3042fd685d8d2906e6cc2bd5024a814fb2bd4bd061e24879a8540c3aa48faba366421d5b49c268fbfb3501493835c2a - languageName: node - linkType: hard - -"process-nextick-args@npm:~1.0.6": - version: 1.0.7 - resolution: "process-nextick-args@npm:1.0.7" - checksum: 41224fbc803ac6c96907461d4dfc20942efa3ca75f2d521bcf7cf0e89f8dec127fb3fb5d76746b8fb468a232ea02d84824fae08e027aec185fd29049c66d49f8 - languageName: node - linkType: hard - "process-nextick-args@npm:~2.0.0": version: 2.0.1 resolution: "process-nextick-args@npm:2.0.1" @@ -24970,13 +24714,6 @@ __metadata: languageName: node linkType: hard -"re-emitter@npm:1.1.3": - version: 1.1.3 - resolution: "re-emitter@npm:1.1.3" - checksum: 3234850c26c4e51622ad7e54172396134cd510c2511da680275ab1e663e5d12c8b81e3e6f4ec025527ed241ad53dae9d1478c0148569840d2fec96a37d155431 - languageName: node - linkType: hard - "react-animation@npm:1.2.2": version: 1.2.2 resolution: "react-animation@npm:1.2.2" @@ -26042,21 +25779,6 @@ __metadata: languageName: node linkType: hard -"readable-stream@npm:2.2.9": - version: 2.2.9 - resolution: "readable-stream@npm:2.2.9" - dependencies: - buffer-shims: ~1.0.0 - core-util-is: ~1.0.0 - inherits: ~2.0.1 - isarray: ~1.0.0 - process-nextick-args: ~1.0.6 - string_decoder: ~1.0.0 - util-deprecate: ~1.0.1 - checksum: d186b7051c4a25b769fa158d1025da83dfb0052f8b0889df40e8e942d05b4d0d37470c49cfd73cce886db66d1a8cd5ec5e2ce97857894587d8158da5ed93baa7 - languageName: node - linkType: hard - "readable-stream@npm:> 1.0.0 < 3.0.0, readable-stream@npm:^2.0.1, readable-stream@npm:^2.2.10, readable-stream@npm:^2.2.2, readable-stream@npm:^2.2.8, readable-stream@npm:^2.3.0, readable-stream@npm:^2.3.5, readable-stream@npm:~2.3.6": version: 2.3.8 resolution: "readable-stream@npm:2.3.8" @@ -26242,17 +25964,6 @@ __metadata: languageName: node linkType: hard -"regexp.prototype.flags@npm:^1.5.0": - version: 1.5.0 - resolution: "regexp.prototype.flags@npm:1.5.0" - dependencies: - call-bind: ^1.0.2 - define-properties: ^1.2.0 - functions-have-names: ^1.2.3 - checksum: c541687cdbdfff1b9a07f6e44879f82c66bbf07665f9a7544c5fd16acdb3ec8d1436caab01662d2fbcad403f3499d49ab0b77fbc7ef29ef961d98cc4bc9755b4 - languageName: node - linkType: hard - "regexpp@npm:^3.1.0": version: 3.2.0 resolution: "regexpp@npm:3.2.0" @@ -26321,13 +26032,6 @@ __metadata: languageName: node linkType: hard -"repeat-string@npm:^1.5.2": - version: 1.6.1 - resolution: "repeat-string@npm:1.6.1" - checksum: 1b809fc6db97decdc68f5b12c4d1a671c8e3f65ec4a40c238bc5200e44e85bcc52a54f78268ab9c29fcf5fe4f1343e805420056d1f30fa9a9ee4c2d93e3cc6c0 - languageName: node - linkType: hard - "request@npm:^2.79.0": version: 2.88.2 resolution: "request@npm:2.88.2" @@ -26783,18 +26487,6 @@ __metadata: languageName: node linkType: hard -"safe-array-concat@npm:^1.0.0": - version: 1.0.0 - resolution: "safe-array-concat@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.2.0 - has-symbols: ^1.0.3 - isarray: ^2.0.5 - checksum: f43cb98fe3b566327d0c09284de2b15fb85ae964a89495c1b1a5d50c7c8ed484190f4e5e71aacc167e16231940079b326f2c0807aea633d47cc7322f40a6b57f - languageName: node - linkType: hard - "safe-buffer@npm:5.1.2, safe-buffer@npm:~5.1.0, safe-buffer@npm:~5.1.1": version: 5.1.2 resolution: "safe-buffer@npm:5.1.2" @@ -27683,15 +27375,6 @@ __metadata: languageName: node linkType: hard -"split@npm:1.0.0": - version: 1.0.0 - resolution: "split@npm:1.0.0" - dependencies: - through: 2 - checksum: 84837fa659662fab703efb41f5e3b3c4ae7de605555b6ce53c4fadb2a30b7cc7c8c005f905e6cb16e527ebb4117b6c2da1fe09c1caa150bdaf24df0dff8bf5d3 - languageName: node - linkType: hard - "sprintf-js@npm:1.1.2": version: 1.1.2 resolution: "sprintf-js@npm:1.1.2" @@ -28024,15 +27707,6 @@ __metadata: languageName: node linkType: hard -"string_decoder@npm:~1.0.0": - version: 1.0.3 - resolution: "string_decoder@npm:1.0.3" - dependencies: - safe-buffer: ~5.1.0 - checksum: 57ef02a148fd1ff2f20fe1accd944505ed3703e78bb28d302d940b2ad3dfb469508f79dcd0275ba1960d9675aa206452f76b2416059a6d0b0200bd7e9f552cdb - languageName: node - linkType: hard - "string_decoder@npm:~1.1.1": version: 1.1.1 resolution: "string_decoder@npm:1.1.1" @@ -28053,15 +27727,6 @@ __metadata: languageName: node linkType: hard -"strip-ansi@npm:^3.0.0": - version: 3.0.1 - resolution: "strip-ansi@npm:3.0.1" - dependencies: - ansi-regex: ^2.0.0 - checksum: 9b974de611ce5075c70629c00fa98c46144043db92ae17748fb780f706f7a789e9989fd10597b7c2053ae8d1513fd707816a91f1879b2f71e6ac0b6a863db465 - languageName: node - linkType: hard - "strip-ansi@npm:^5.0.0, strip-ansi@npm:^5.1.0, strip-ansi@npm:^5.2.0": version: 5.2.0 resolution: "strip-ansi@npm:5.2.0" @@ -28308,13 +27973,6 @@ __metadata: languageName: node linkType: hard -"supports-color@npm:^2.0.0": - version: 2.0.0 - resolution: "supports-color@npm:2.0.0" - checksum: 602538c5812b9006404370b5a4b885d3e2a1f6567d314f8b4a41974ffe7d08e525bf92ae0f9c7030e3b4c78e4e34ace55d6a67a74f1571bc205959f5972f88f0 - languageName: node - linkType: hard - "supports-color@npm:^5.3.0, supports-color@npm:^5.5.0": version: 5.5.0 resolution: "supports-color@npm:5.5.0" @@ -28515,39 +28173,6 @@ __metadata: languageName: node linkType: hard -"tap-out@npm:^2.1.0": - version: 2.1.0 - resolution: "tap-out@npm:2.1.0" - dependencies: - re-emitter: 1.1.3 - readable-stream: 2.2.9 - split: 1.0.0 - trim: 0.0.1 - bin: - tap-out: bin/cmd.js - checksum: b837d8adf646bf06f73a9306a9796a3201c55598c2c70045a2908d044fc2cc9466d52d27a7705c92a2c6ea37d560a84d135f4112bd377346f34d381ed836088b - languageName: node - linkType: hard - -"tap-spec@npm:^5.0.0": - version: 5.0.0 - resolution: "tap-spec@npm:5.0.0" - dependencies: - chalk: ^1.0.0 - duplexer: ^0.1.1 - figures: ^1.4.0 - lodash: ^4.17.10 - pretty-ms: ^2.1.0 - repeat-string: ^1.5.2 - tap-out: ^2.1.0 - through2: ^2.0.0 - bin: - tap-spec: bin/cmd.js - tspec: bin/cmd.js - checksum: 4413acc3ed4b8662b64439ad5be65a4d42edb2f3c5dc273b8ee563f9e7bfdde347e53c92de628a04ab640dda3cd8aea8aeb3ee7aa86bde8118d0584ffd76b788 - languageName: node - linkType: hard - "tapable@npm:^1.0.0": version: 1.1.3 resolution: "tapable@npm:1.1.3" @@ -28562,37 +28187,6 @@ __metadata: languageName: node linkType: hard -"tape@npm:^5.5.3": - version: 5.6.6 - resolution: "tape@npm:5.6.6" - dependencies: - "@ljharb/resumer": ^0.0.1 - "@ljharb/through": ^2.3.9 - array.prototype.every: ^1.1.4 - call-bind: ^1.0.2 - deep-equal: ^2.2.2 - defined: ^1.0.1 - dotignore: ^0.1.2 - for-each: ^0.3.3 - get-package-type: ^0.1.0 - glob: ^7.2.3 - has: ^1.0.3 - has-dynamic-import: ^2.0.1 - inherits: ^2.0.4 - is-regex: ^1.1.4 - minimist: ^1.2.8 - object-inspect: ^1.12.3 - object-is: ^1.1.5 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - resolve: ^2.0.0-next.4 - string.prototype.trim: ^1.2.7 - bin: - tape: bin/tape - checksum: aac4722c7104f8478c8079aa1f441636b720f432074355c2edb1b0c0e2f2822004af2097669186d65ce7c70c57164d85d7da3662338e53515bdb778f5412af30 - languageName: node - linkType: hard - "tar-stream@npm:^1.6.2": version: 1.6.2 resolution: "tar-stream@npm:1.6.2" @@ -28775,7 +28369,7 @@ __metadata: languageName: node linkType: hard -"through2@npm:^2.0.0, through2@npm:^2.0.2, through2@npm:^2.0.3": +"through2@npm:^2.0.2, through2@npm:^2.0.3": version: 2.0.5 resolution: "through2@npm:2.0.5" dependencies: @@ -28785,7 +28379,7 @@ __metadata: languageName: node linkType: hard -"through@npm:2, through@npm:>=2.2.7 <3": +"through@npm:>=2.2.7 <3": version: 2.3.8 resolution: "through@npm:2.3.8" checksum: a38c3e059853c494af95d50c072b83f8b676a9ba2818dcc5b108ef252230735c54e0185437618596c790bbba8fcdaef5b290405981ffa09dce67b1f1bf190cbd @@ -29016,13 +28610,6 @@ __metadata: languageName: node linkType: hard -"trim@npm:0.0.1": - version: 0.0.1 - resolution: "trim@npm:0.0.1" - checksum: 2b4646dff99a222e8e1526edd4e3a43bbd925af0b8e837c340455d250157e7deefaa4da49bb891ab841e5c27b1afc5e9e32d4b57afb875d2dfcabf4e319b8f7f - languageName: node - linkType: hard - "tryer@npm:^1.0.1": version: 1.0.1 resolution: "tryer@npm:1.0.1" @@ -29233,42 +28820,6 @@ __metadata: languageName: node linkType: hard -"typed-array-buffer@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-buffer@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.2.1 - is-typed-array: ^1.1.10 - checksum: 3e0281c79b2a40cd97fe715db803884301993f4e8c18e8d79d75fd18f796e8cd203310fec8c7fdb5e6c09bedf0af4f6ab8b75eb3d3a85da69328f28a80456bd3 - languageName: node - linkType: hard - -"typed-array-byte-length@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-byte-length@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - for-each: ^0.3.3 - has-proto: ^1.0.1 - is-typed-array: ^1.1.10 - checksum: b03db16458322b263d87a702ff25388293f1356326c8a678d7515767ef563ef80e1e67ce648b821ec13178dd628eb2afdc19f97001ceae7a31acf674c849af94 - languageName: node - linkType: hard - -"typed-array-byte-offset@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-byte-offset@npm:1.0.0" - dependencies: - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - for-each: ^0.3.3 - has-proto: ^1.0.1 - is-typed-array: ^1.1.10 - checksum: 04f6f02d0e9a948a95fbfe0d5a70b002191fae0b8fe0fe3130a9b2336f043daf7a3dda56a31333c35a067a97e13f539949ab261ca0f3692c41603a46a94e960b - languageName: node - linkType: hard - "typed-array-length@npm:^1.0.4": version: 1.0.4 resolution: "typed-array-length@npm:1.0.4" @@ -30603,19 +30154,6 @@ __metadata: languageName: node linkType: hard -"which-typed-array@npm:^1.1.10": - version: 1.1.11 - resolution: "which-typed-array@npm:1.1.11" - dependencies: - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - for-each: ^0.3.3 - gopd: ^1.0.1 - has-tostringtag: ^1.0.0 - checksum: 711ffc8ef891ca6597b19539075ec3e08bb9b4c2ca1f78887e3c07a977ab91ac1421940505a197758fb5939aa9524976d0a5bbcac34d07ed6faa75cedbb17206 - languageName: node - linkType: hard - "which-typed-array@npm:^1.1.2, which-typed-array@npm:^1.1.9": version: 1.1.9 resolution: "which-typed-array@npm:1.1.9" From d7847d3efcd7000b587e4d8caaf026152c3c2e60 Mon Sep 17 00:00:00 2001 From: harshrajat Date: Tue, 5 Mar 2024 00:09:38 +0400 Subject: [PATCH 12/23] env build to support alpha.push.org --- .env.sample | 4 ++-- build.mjs | 4 ++-- public/index-alpha.html | 4 ++++ public/index-dev.html | 4 ++++ public/index-prod.html | 4 ++++ public/index-staging.html | 4 ++++ public/index-w2w.html | 4 ++++ public/index.html | 38 ++++++++++++++++++-------------------- public/robots.txt | 2 +- public/sitemap.txt | 34 +++++++++++++++++----------------- 10 files changed, 60 insertions(+), 42 deletions(-) diff --git a/.env.sample b/.env.sample index ba93d2c393..d764d8bf8a 100644 --- a/.env.sample +++ b/.env.sample @@ -9,7 +9,7 @@ REACT_APP_DEPLOY_ENV=DEV REACT_APP_PUBLIC_URL=https://dev.push.org/ # WALLET CONNECT PROJECT ID -# REACT_APP_WALLETCONNECT_PROJECT_ID=walletconnect_project_id +REACT_APP_WALLETCONNECT_PROJECT_ID=walletconnect_project_id # LOCALHOST CREDS # REACT_APP_IPFS_INFURA_API_KEY="your_secret_infura_api_key_for_localhost" @@ -17,6 +17,6 @@ REACT_APP_PUBLIC_URL=https://dev.push.org/ # ESLINT_NO_DEV_ERRORS=true TSC_COMPILE_ON_ERROR=true -DISABLE_ESLINT_PLUGIN=true +# DISABLE_ESLINT_PLUGIN=true GENERATE_SOURCEMAP=false # EXTEND_ESLINT=true diff --git a/build.mjs b/build.mjs index e9bcdf4c96..9e91c352e1 100644 --- a/build.mjs +++ b/build.mjs @@ -192,11 +192,11 @@ const changeENV = async (appEnv) => { value = await doSyncPrompt(rl, `${envSampleObject[envVar]} >`); if (value.trim().length == 0) { - LoggerInstance.error(" Incorrect Entry, Field can't be empty"); + console.log(chalk.bgRed.black(" Incorrect Entry, Field can't be empty")); } } - LoggerInstance.saved(` [Saved] ${envVar}=${value}`); + console.log(chalk.bgBlack.white(` [Saved] ${envVar}=${value}`)); moddedLine = `${envVar}=${value}${comment}`; fileModified = true; diff --git a/public/index-alpha.html b/public/index-alpha.html index 8f54b32a29..3ff8d6d661 100644 --- a/public/index-alpha.html +++ b/public/index-alpha.html @@ -14,6 +14,10 @@ + + + + + + + + + + + + - + - Push App (Previously EPNS) | Communication Protocol of Web3 - + Push Alpha App (Previously EPNS) | Communication Protocol of Web3 + - + - - - + + + - - - - - + + + + + @@ -80,12 +80,10 @@ -
-
-
-
-
- - \ No newline at end of file + diff --git a/public/robots.txt b/public/robots.txt index 3ba11f4206..eac4e33dd0 100644 --- a/public/robots.txt +++ b/public/robots.txt @@ -1,3 +1,3 @@ # https://www.robotstxt.org/robotstxt.html User-agent: * -Sitemap: https://app.push.org/sitemap.txt \ No newline at end of file +Sitemap: https://alpha.push.org/sitemap.txt \ No newline at end of file diff --git a/public/sitemap.txt b/public/sitemap.txt index d95448a9d6..fb6a4f5eba 100644 --- a/public/sitemap.txt +++ b/public/sitemap.txt @@ -1,17 +1,17 @@ -https://app.push.org/ -https://app.push.org/?/inbox -https://app.push.org/?/chat -https://app.push.org/?/channels -https://app.push.org/?/dashboard -https://app.push.org/?/send -https://app.push.org/?/spam -https://app.push.org/?/receive -https://app.push.org/?/govern -https://app.push.org/?/yield -https://app.push.org/?/rockstar -https://app.push.org/?/gratitude -https://app.push.org/?/live_walkthrough -https://app.push.org/?/notavailable -https://app.push.org/?/faq -https://app.push.org/?/internal -https://app.push.org/?/support \ No newline at end of file +https://alpha.push.org/ +https://alpha.push.org/?/inbox +https://alpha.push.org/?/chat +https://alpha.push.org/?/channels +https://alpha.push.org/?/dashboard +https://alpha.push.org/?/send +https://alpha.push.org/?/spam +https://alpha.push.org/?/receive +https://alpha.push.org/?/govern +https://alpha.push.org/?/yield +https://alpha.push.org/?/rockstar +https://alpha.push.org/?/gratitude +https://alpha.push.org/?/live_walkthrough +https://alpha.push.org/?/notavailable +https://alpha.push.org/?/faq +https://alpha.push.org/?/internal +https://alpha.push.org/?/support \ No newline at end of file From 649a370c2e5a0cc22796fe548609e2929c0ea009 Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Wed, 6 Mar 2024 00:01:12 +0530 Subject: [PATCH 13/23] User Opt In Flow with legacy APIs in guest mode and read mode --- package.json | 2 +- src/components/Dropdown.tsx | 14 +- .../dropdowns/ManageNotifSettingDropdown.tsx | 159 +++++++++++------- .../dropdowns/OptinNotifSettingDropdown.tsx | 76 +++++++-- src/contexts/AppContext.tsx | 18 ++ src/primaries/Profile.tsx | 2 +- src/types/context.ts | 1 + yarn.lock | 10 +- 8 files changed, 203 insertions(+), 79 deletions(-) diff --git a/package.json b/package.json index e9ae162a8b..75a2f612f0 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,7 @@ "@mui/material": "^5.5.0", "@pushprotocol/restapi": "0.0.1-alpha.71", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "1.3.1-alpha.5", + "@pushprotocol/uiweb": "1.3.1-alpha.6", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/src/components/Dropdown.tsx b/src/components/Dropdown.tsx index 2b17d78a78..190a5512c1 100644 --- a/src/components/Dropdown.tsx +++ b/src/components/Dropdown.tsx @@ -5,11 +5,13 @@ import { Link } from 'react-router-dom'; // External Packages import styled, { useTheme } from 'styled-components'; +import { useSelector } from 'react-redux'; // Internal Components import { A, Image, ItemH, Span } from '../primaries/SharedStyling'; -import { GlobalContext } from 'contexts/GlobalContext'; +import { GlobalContext,ReadOnlyWalletMode } from 'contexts/GlobalContext'; import { SpanV2 } from './reusables/SharedStylingV2'; +import { useAccount } from 'hooks'; export type DropdownValueType = { id: number|string, @@ -34,11 +36,16 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd const theme = useTheme(); const {mode} = useContext(GlobalContext); + const { wallet } = useAccount(); const getTextColor = (dropdownValue:DropdownValueType) => { return dropdownValue.textColor ? dropdownValue.textColor:textColor? textColor : theme.snackbarBorderText; } + const { userPushSDKInstance } = useSelector((state: any) => { + return state.user; + }); + const copyToClipboard = (address:string) => { if (navigator && navigator.clipboard) { @@ -80,6 +87,9 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd {shortenText(dropdownValue?.title,3)} + + {!(wallet?.accounts?.length > 0) ? ReadOnlyWalletMode.GUEST_MODE : userPushSDKInstance?.readMode && ReadOnlyWalletMode.READ_ONLY_MODE} + {dropdownValue?.invertedIcon && ( void; } -const ManageNotifSettingDropdownContainer: React.FC = ({ +const ManageNotifSettingDropdownContainer: React.FC = ({ centerOnMobile, optOutHandler, channelSetting, @@ -54,33 +55,33 @@ const ManageNotifSettingDropdownContainer: React.FC {(channelSetting && channelSetting.length != 0) && - - - - - Manage Settings - - - + + + + + Manage Settings + + + -} + } optOutHandler({ setLoading: setTxInProgress })}> {txInProgress && @@ -98,7 +99,7 @@ const ManageNotifSettingDropdownContainer: React.FC = (options) => { - const { + const { children, centerOnMobile, userSetting, @@ -106,15 +107,15 @@ const ManageNotifSettingDropdown: React.FC = (o onSuccessOptout } = options; const [isOpen, setIsOpen] = useState(false); - const { chainId } = useAccount(); + const { chainId, provider, account,wallet } = useAccount(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; }); const dispatch = useDispatch(); - const {handleConnectWallet} = useContext(AppContext); + const { handleConnectWallet,connectWallet } = useContext(AppContext); const channelSetting = useMemo(() => { - if(channelDetail && channelDetail?.channel_settings) { + if (channelDetail && channelDetail?.channel_settings) { return JSON.parse(channelDetail?.channel_settings); } return null; @@ -132,17 +133,18 @@ const ManageNotifSettingDropdown: React.FC = (o const unsubscribeToast = useToast(); const optOutHandler = async ({ setLoading }: { setLoading?: React.Dispatch> }) => { - const setLoadingFunc = setLoading || (() => {}); + const setLoadingFunc = setLoading || (() => { }); setLoadingFunc(true); let userPushInstance = userPushSDKInstance; - if (!userPushInstance.signer) { - userPushInstance = await handleConnectWallet(); - if (!userPushInstance) { - setLoadingFunc(false); - return; - } - } + //TODO: We can change this back to use Push User + // if (!userPushInstance.signer) { + // userPushInstance = await handleConnectWallet(); + // if (!userPushInstance) { + // setLoadingFunc(false); + // return; + // } + // } try { let channelAddress = channelDetail.channel; @@ -152,9 +154,12 @@ const ManageNotifSettingDropdown: React.FC = (o unsubscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushInstance.notification.unsubscribe(convertAddressToAddrCaip(channelAddress, chainId), { + const _signer = await provider.getSigner(account); + await PushAPI.channels.unsubscribe({ + signer: _signer, + channelAddress: convertAddressToAddrCaip(channelAddress, chainId), // channel address in CAIP + userAddress: convertAddressToAddrCaip(account, chainId), // user address in CAIP onSuccess: () => { - onSuccessOptout(); dispatch(updateSubscriptionStatus({ channelAddress: channelAddress, status: false })); dispatch(removeUserSetting(channelAddress)); @@ -173,7 +178,7 @@ const ManageNotifSettingDropdown: React.FC = (o closeDropdown(); }, onError: () => { - console.error('opt in error'); + console.error('opt out error'); unsubscribeToast.showMessageToast({ toastTitle: 'Error', toastMessage: `There was an error opting out of channel`, @@ -186,7 +191,45 @@ const ManageNotifSettingDropdown: React.FC = (o ), }); }, + env: appConfig.pushNodesEnv, }); + + + // await userPushInstance.notification.unsubscribe(convertAddressToAddrCaip(channelAddress, chainId), { + // onSuccess: () => { + // onSuccessOptout(); + // dispatch(updateSubscriptionStatus({ channelAddress: channelAddress, status: false })); + // dispatch(removeUserSetting(channelAddress)); + + // unsubscribeToast.showMessageToast({ + // toastTitle: 'Success', + // toastMessage: 'Successfully opted out of channel !', + // toastType: 'SUCCESS', + // getToastIcon: (size) => ( + // + // ), + // }); + + // closeDropdown(); + // }, + // onError: () => { + // console.error('opt in error'); + // unsubscribeToast.showMessageToast({ + // toastTitle: 'Error', + // toastMessage: `There was an error opting out of channel`, + // toastType: 'ERROR', + // getToastIcon: (size) => ( + // + // ), + // }); + // }, + // }); } catch (err) { unsubscribeToast.showMessageToast({ toastTitle: 'Error', @@ -208,24 +251,24 @@ const ManageNotifSettingDropdown: React.FC = (o // render return ( - } - containerPadding="12px 16px" - centerOnMobile={centerOnMobile} - > - {children} - + } + containerPadding="12px 16px" + centerOnMobile={centerOnMobile} + > + {children} + ); } diff --git a/src/components/dropdowns/OptinNotifSettingDropdown.tsx b/src/components/dropdowns/OptinNotifSettingDropdown.tsx index b786963854..f6f5f33471 100644 --- a/src/components/dropdowns/OptinNotifSettingDropdown.tsx +++ b/src/components/dropdowns/OptinNotifSettingDropdown.tsx @@ -1,5 +1,7 @@ // React + Web3 Essentials import React, { useContext, useMemo, useState } from "react"; +import * as PushAPI from "@pushprotocol/restapi"; +import { ethers } from "ethers"; // External Packages import Switch from 'react-switch'; @@ -141,14 +143,14 @@ const OptinNotifSettingDropdownContainer: React.FC = (options) => { const { children, channelDetail, setLoading, onSuccessOptin } = options; - const { chainId } = useAccount(); + const { chainId, provider, account, wallet } = useAccount(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; }); const [isOpen, setIsOpen] = useState(false); const dispatch = useDispatch(); - const { handleConnectWallet } = useContext(AppContext); + const { handleConnectWallet, connectWallet } = useContext(AppContext); const onCoreNetwork = chainId === appConfig.coreContractChain; @@ -174,14 +176,25 @@ const OptinNotifSettingDropdown: React.FC = (opt setLoadingFunc(true); let userPushInstance = userPushSDKInstance; - if (!userPushInstance.signer) { - userPushInstance = await handleConnectWallet(); - if (!userPushInstance) { - setLoadingFunc(false); - return; - } + // if (!userPushInstance.signer) { + // userPushInstance = await handleConnectWallet(); + // if (!userPushInstance) { + // setLoadingFunc(false); + // return; + // } + // } + + let walletAddress = account; + let web3Provider = provider; + + if(!(wallet?.accounts?.length > 0)){ + const connectedWallet = await connectWallet(); + walletAddress = connectedWallet.accounts[0].address; + web3Provider = new ethers.providers.Web3Provider(connectedWallet.provider, 'any') } + + try { let channelAddress = channelDetail.channel; if (!onCoreNetwork) { @@ -190,11 +203,13 @@ const OptinNotifSettingDropdown: React.FC = (opt subscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { - settings: notifChannelSettingFormatString({ settings: channelSettings }), - // settings: [], + const _signer = await web3Provider?.getSigner(walletAddress); + + await PushAPI.channels.subscribe({ + signer: _signer, + channelAddress: convertAddressToAddrCaip(channelAddress, chainId), // channel address in CAIP + userAddress: convertAddressToAddrCaip(walletAddress, chainId), // user address in CAIP onSuccess: () => { - onSuccessOptin(); dispatch(updateSubscriptionStatus({ channelAddress, status: true })); dispatch(updateUserSetting({ channelAddress, settings: userSettingsFromDefaultChannelSetting({ channelSetting: channelSettings }) })); @@ -224,8 +239,45 @@ const OptinNotifSettingDropdown: React.FC = (opt ), }); }, + env: appConfig.pushNodesEnv, }); + // await PUSHAPI.channels.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { + // settings: notifChannelSettingFormatString({ settings: channelSettings }), + // // settings: [], + // onSuccess: () => { + // onSuccessOptin(); + // dispatch(updateSubscriptionStatus({ channelAddress, status: true })); + // dispatch(updateUserSetting({ channelAddress, settings: userSettingsFromDefaultChannelSetting({ channelSetting: channelSettings }) })); + + // subscribeToast.showMessageToast({ + // toastTitle: 'Success', + // toastMessage: 'Successfully opted into channel !', + // toastType: 'SUCCESS', + // getToastIcon: (size) => ( + // + // ), + // }); + // }, + // onError: () => { + // console.error('opt in error'); + // subscribeToast.showMessageToast({ + // toastTitle: 'Error', + // toastMessage: `There was an error opting into channel`, + // toastType: 'ERROR', + // getToastIcon: (size) => ( + // + // ), + // }); + // }, + // }); + } catch (err) { subscribeToast.showMessageToast({ diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index ac32e44bf3..14ce27f32a 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -57,6 +57,23 @@ const AppContextProvider = ({ children }) => { const dispatch = useDispatch(); + const connectWallet = async (showToast = false, toastMessage?: string) =>{ + if (showToast) { + web3onboardToast.showMessageToast({ + toastMessage: toastMessage || "Please connect your wallet to continue", + toastTitle: "Connect Wallet", + toastType: "ERROR", + getToastIcon: (size) => , + }); + } + + if (!(wallet?.accounts?.length > 0)) { + const walletConnected = await connect(); + return walletConnected[0]; + } + + } + const handleConnectWallet = async (showToast = false, toastMessage?: string) => { if (showToast) { web3onboardToast.showMessageToast({ @@ -343,6 +360,7 @@ const AppContextProvider = ({ children }) => { initializePushSDK, SnapState, handleConnectWallet, + connectWallet, setSnapInstalled, snapInstalled, setBlockedLoading, diff --git a/src/primaries/Profile.tsx b/src/primaries/Profile.tsx index 509120cbcc..28621ea6ca 100644 --- a/src/primaries/Profile.tsx +++ b/src/primaries/Profile.tsx @@ -128,7 +128,7 @@ const Profile = ({ isDarkMode }) => { ) : ( <>{shortenText(account, 5)} )} - {!(wallet?.accounts?.length > 0) ? ReadOnlyWalletMode.GUEST_MODE : userPushSDKInstance?.readMode && ReadOnlyWalletMode.READ_ONLY_MODE} + {/* {!(wallet?.accounts?.length > 0) ? ReadOnlyWalletMode.GUEST_MODE : userPushSDKInstance?.readMode && ReadOnlyWalletMode.READ_ONLY_MODE} */} arrow void; handleConnectWallet: (showToast?: boolean, toastMessage?: string) => any; + connectWallet: (showToast?: boolean, toastMessage?: string) => any; setBlockedLoading: (blockedLoading: BlockedLoadingI) => void; blockedLoading: BlockedLoadingI; getUser: () => Promise; diff --git a/yarn.lock b/yarn.lock index 0874fcab6f..fec4edc6f2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5407,7 +5407,7 @@ __metadata: "@mui/material": ^5.5.0 "@pushprotocol/restapi": 0.0.1-alpha.71 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 1.3.1-alpha.5 + "@pushprotocol/uiweb": 1.3.1-alpha.6 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5647,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:1.3.1-alpha.5": - version: 1.3.1-alpha.5 - resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.5" +"@pushprotocol/uiweb@npm:1.3.1-alpha.6": + version: 1.3.1-alpha.6 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.6" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5682,7 +5682,7 @@ __metadata: react: ">=16.8.0" styled-components: ^6.0.8 viem: ^1.3.0 - checksum: 783d4be5e67c6c0f13ce1a116bd2ca13331e60822c90a0a267bee6e539b1e04ec43527e608c4a955d8b32b4ac3f638190adb3ca4e1f18ac6728cb608ebbc31d3 + checksum: b931b0e27ef2d209d46d19c651de538a0843f914509a53f7bdbb69e71156406287d2c1561c037f4762523e48bf3d2704e0c2a273b9b0736dcf4ab203f19894d4 languageName: node linkType: hard From c30a4624bd85ece4b71f31ca4bf4aab40a068da5 Mon Sep 17 00:00:00 2001 From: Nilesh Gupta Date: Wed, 6 Mar 2024 17:39:04 +0530 Subject: [PATCH 14/23] Updated phase 3 of guest mode (#1439) * Phase 3 of Guest Mode * Updated read mode feature * Chat is fixed for Guest Mode and sort imports is fixed * Fixed the infinte render issue * Fixed the Opt-in/opt-out and other flow for guest mode * Resolved Issues in Guest Mode and Read Mode (#1429) * Fixed issues in the Opt In flow * Removed consoles and fixed the send Notification case * Issues Fixed for diff Channel Features like edit channel or add delegate * Removed consoles * Toast has been added for warning when the user rejects * New Opt In flow when the user directly clicks on Opt In * User Opt In Flow with legacy APIs in guest mode and read mode --------- Co-authored-by: abhishek-01k Co-authored-by: Abhishek <77395788+abhishek-01k@users.noreply.github.com> --- package.json | 4 +- src/AppLogin.tsx | 2 +- src/components/ChannelDetails.js | 25 +- src/components/ChannelSettingsDropdown.tsx | 8 +- src/components/Dropdown.tsx | 14 +- src/components/SendNotifications.tsx | 11 +- src/components/ViewChannelItem.js | 1 + .../channel/NotificationSettings.tsx | 49 +- .../dropdowns/ManageNotifSettingDropdown.tsx | 160 ++++-- .../dropdowns/OptinNotifSettingDropdown.tsx | 153 ++++-- .../dropdowns/UpdateNotifSettingDropdown.tsx | 18 +- src/config/Themization.js | 4 + src/contexts/AppContext.tsx | 57 +- src/contexts/GlobalContext.tsx | 2 +- src/hooks/useToast.tsx | 21 +- .../ChannelOwnerDashboard.tsx | 8 +- src/primaries/Profile.tsx | 12 +- src/sections/chat/ChatSidebarSection.tsx | 5 +- src/segments/Feedbox.tsx | 13 +- src/segments/ViewChannels.tsx | 5 +- src/structure/MasterInterfacePage.tsx | 10 +- src/types/context.ts | 3 +- yarn.lock | 511 +----------------- 23 files changed, 412 insertions(+), 684 deletions(-) diff --git a/package.json b/package.json index dfab0eecc7..75a2f612f0 100644 --- a/package.json +++ b/package.json @@ -33,9 +33,9 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "0.0.1-alpha.64", + "@pushprotocol/restapi": "0.0.1-alpha.71", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "0.0.1-alpha.41", + "@pushprotocol/uiweb": "1.3.1-alpha.6", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/src/AppLogin.tsx b/src/AppLogin.tsx index e32da8f003..610081e1b6 100644 --- a/src/AppLogin.tsx +++ b/src/AppLogin.tsx @@ -121,7 +121,7 @@ const AppLogin = ({ toggleDarkMode }) => { } const initiateGuestModa = () => { - const guestModeAddress = '0x0000000000000000000000000000000000000000'; + const guestModeAddress = '0x0000000000000000000000000000000000000001'; setMode(ReadOnlyWalletMode.GUEST_MODE); setReadOnlyWallet(guestModeAddress); hideOnboardModal(); diff --git a/src/components/ChannelDetails.js b/src/components/ChannelDetails.js index 35c8f25a1b..046219fdc4 100644 --- a/src/components/ChannelDetails.js +++ b/src/components/ChannelDetails.js @@ -49,7 +49,7 @@ export default function ChannelDetails({ isChannelExpired, setIsChannelExpired, const { userPushSDKInstance } = useSelector((state) => { return state.user; }); - const {handleConnectWallet} = useContext(AppContext); + const { handleConnectWallet } = useContext(AppContext); const { CHANNEL_ACTIVE_STATE, CHANNNEL_DEACTIVATED_STATE } = useSelector((state) => state.channels); const { processingState } = useSelector((state) => state.channelCreation); const [verifyingChannel, setVerifyingChannel] = React.useState([]); @@ -77,10 +77,9 @@ export default function ChannelDetails({ isChannelExpired, setIsChannelExpired, const addDelegateToast = useToast(); - const handleDelegateModal = () => { + const handleDelegateModal = async () => { if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + await handleConnectWallet(); } showAddDelegateModal(); } @@ -156,17 +155,19 @@ export default function ChannelDetails({ isChannelExpired, setIsChannelExpired, } }, [account]); - const removeDelegate = (walletAddress) => { - return userPushSDKInstance.channel.delegate.remove(convertAddressToAddrCaip(walletAddress, chainId)); + const removeDelegate = async (walletAddress) => { + let userPushInstance = userPushSDKInstance; + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + if (!userPushInstance) { + return; + } + } + + return userPushInstance.channel.delegate.remove(convertAddressToAddrCaip(walletAddress, chainId)); }; const navigateToNotifSettings = () => { - - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } - navigate(APP_PATHS.ChannelSettings); }; diff --git a/src/components/ChannelSettingsDropdown.tsx b/src/components/ChannelSettingsDropdown.tsx index 6e501c4ca1..7649e66aae 100644 --- a/src/components/ChannelSettingsDropdown.tsx +++ b/src/components/ChannelSettingsDropdown.tsx @@ -128,10 +128,10 @@ function ChannelSettings({ DropdownRef, isDropdownOpen, closeDropdown }: Channel const userSignerToast = useToast(); const toggleChannelActivationState = () => { if (isChannelBlocked) return; - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } + // if (!userPushSDKInstance.signer) { + // handleConnectWallet(); + // return; + // } if (isChannelDeactivated) { showReactivateChannelModal(); } else { diff --git a/src/components/Dropdown.tsx b/src/components/Dropdown.tsx index 2b17d78a78..190a5512c1 100644 --- a/src/components/Dropdown.tsx +++ b/src/components/Dropdown.tsx @@ -5,11 +5,13 @@ import { Link } from 'react-router-dom'; // External Packages import styled, { useTheme } from 'styled-components'; +import { useSelector } from 'react-redux'; // Internal Components import { A, Image, ItemH, Span } from '../primaries/SharedStyling'; -import { GlobalContext } from 'contexts/GlobalContext'; +import { GlobalContext,ReadOnlyWalletMode } from 'contexts/GlobalContext'; import { SpanV2 } from './reusables/SharedStylingV2'; +import { useAccount } from 'hooks'; export type DropdownValueType = { id: number|string, @@ -34,11 +36,16 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd const theme = useTheme(); const {mode} = useContext(GlobalContext); + const { wallet } = useAccount(); const getTextColor = (dropdownValue:DropdownValueType) => { return dropdownValue.textColor ? dropdownValue.textColor:textColor? textColor : theme.snackbarBorderText; } + const { userPushSDKInstance } = useSelector((state: any) => { + return state.user; + }); + const copyToClipboard = (address:string) => { if (navigator && navigator.clipboard) { @@ -80,6 +87,9 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd {shortenText(dropdownValue?.title,3)} + + {!(wallet?.accounts?.length > 0) ? ReadOnlyWalletMode.GUEST_MODE : userPushSDKInstance?.readMode && ReadOnlyWalletMode.READ_ONLY_MODE} + {dropdownValue?.invertedIcon && ( (undefined); const [isLoading, setIsLoading] = React.useState(false); const [isLoadingSettings, setIsLoadingSettings] = React.useState(true); - const {handleConnectWallet} = useContext(AppContext); + const { handleConnectWallet } = useContext(AppContext); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; @@ -133,12 +133,17 @@ function NotificationSettings() { const saveSettings = async () => { try { - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; + setIsLoading(true); + + let userPushInstance = userPushSDKInstance; + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + if (!userPushInstance) { + setIsLoading(false); + return; + } } - setIsLoading(true); notificationToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); const settingData: NotificationSetting[] = settings.map((setting) => { @@ -153,14 +158,14 @@ function NotificationSettings() { console.info( { type: setting.type, - description: setting.description, - default: setting.default, - data: { - lower: setting.lowerLimit, - upper: setting.upperLimit, - ticker: setting.ticker, - enabled: setting.enabled, - }, + description: setting.description, + default: setting.default, + data: { + lower: setting.lowerLimit, + upper: setting.upperLimit, + ticker: setting.ticker, + enabled: setting.enabled, + }, } ) return { @@ -178,14 +183,14 @@ function NotificationSettings() { console.info( { type: setting.type, - description: setting.description, - default: setting.default, - data: { - lower: setting.lowerLimit, - upper: setting.upperLimit, - ticker: setting.ticker, - enabled: setting.enabled, - }, + description: setting.description, + default: setting.default, + data: { + lower: setting.lowerLimit, + upper: setting.upperLimit, + ticker: setting.ticker, + enabled: setting.enabled, + }, } ) return { @@ -202,7 +207,7 @@ function NotificationSettings() { } }); console.info(settingData); - await userPushSDKInstance.channel.setting(settingData); + await userPushInstance.channel.setting(settingData); dispatch(updateChannelSetting({ channelAddress, settings })); setIsLoading(false); diff --git a/src/components/dropdowns/ManageNotifSettingDropdown.tsx b/src/components/dropdowns/ManageNotifSettingDropdown.tsx index dadef23168..abf33cc4ca 100644 --- a/src/components/dropdowns/ManageNotifSettingDropdown.tsx +++ b/src/components/dropdowns/ManageNotifSettingDropdown.tsx @@ -4,6 +4,7 @@ import React, { useContext, useMemo, useState } from "react"; // External Packages import styled, { css, useTheme } from "styled-components"; import { useDispatch, useSelector } from "react-redux"; +import * as PushAPI from "@pushprotocol/restapi"; // Internal Components import { DropdownBtnHandler } from "./DropdownBtnHandler"; @@ -38,7 +39,7 @@ interface ManageNotifSettingDropdownContainerProps { closeDropdown: () => void; } -const ManageNotifSettingDropdownContainer: React.FC = ({ +const ManageNotifSettingDropdownContainer: React.FC = ({ centerOnMobile, optOutHandler, channelSetting, @@ -54,33 +55,33 @@ const ManageNotifSettingDropdownContainer: React.FC {(channelSetting && channelSetting.length != 0) && - - - - - Manage Settings - - - + + + + + Manage Settings + + + -} + } optOutHandler({ setLoading: setTxInProgress })}> {txInProgress && @@ -98,7 +99,7 @@ const ManageNotifSettingDropdownContainer: React.FC = (options) => { - const { + const { children, centerOnMobile, userSetting, @@ -106,15 +107,15 @@ const ManageNotifSettingDropdown: React.FC = (o onSuccessOptout } = options; const [isOpen, setIsOpen] = useState(false); - const { chainId } = useAccount(); + const { chainId, provider, account,wallet } = useAccount(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; }); const dispatch = useDispatch(); - const {handleConnectWallet} = useContext(AppContext); + const { handleConnectWallet,connectWallet } = useContext(AppContext); const channelSetting = useMemo(() => { - if(channelDetail && channelDetail?.channel_settings) { + if (channelDetail && channelDetail?.channel_settings) { return JSON.parse(channelDetail?.channel_settings); } return null; @@ -132,14 +133,18 @@ const ManageNotifSettingDropdown: React.FC = (o const unsubscribeToast = useToast(); const optOutHandler = async ({ setLoading }: { setLoading?: React.Dispatch> }) => { - const setLoadingFunc = setLoading || (() => {}); - - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } - + const setLoadingFunc = setLoading || (() => { }); setLoadingFunc(true); + let userPushInstance = userPushSDKInstance; + + //TODO: We can change this back to use Push User + // if (!userPushInstance.signer) { + // userPushInstance = await handleConnectWallet(); + // if (!userPushInstance) { + // setLoadingFunc(false); + // return; + // } + // } try { let channelAddress = channelDetail.channel; @@ -149,9 +154,12 @@ const ManageNotifSettingDropdown: React.FC = (o unsubscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushSDKInstance.notification.unsubscribe(convertAddressToAddrCaip(channelAddress, chainId), { + const _signer = await provider.getSigner(account); + await PushAPI.channels.unsubscribe({ + signer: _signer, + channelAddress: convertAddressToAddrCaip(channelAddress, chainId), // channel address in CAIP + userAddress: convertAddressToAddrCaip(account, chainId), // user address in CAIP onSuccess: () => { - onSuccessOptout(); dispatch(updateSubscriptionStatus({ channelAddress: channelAddress, status: false })); dispatch(removeUserSetting(channelAddress)); @@ -170,7 +178,7 @@ const ManageNotifSettingDropdown: React.FC = (o closeDropdown(); }, onError: () => { - console.error('opt in error'); + console.error('opt out error'); unsubscribeToast.showMessageToast({ toastTitle: 'Error', toastMessage: `There was an error opting out of channel`, @@ -183,7 +191,45 @@ const ManageNotifSettingDropdown: React.FC = (o ), }); }, + env: appConfig.pushNodesEnv, }); + + + // await userPushInstance.notification.unsubscribe(convertAddressToAddrCaip(channelAddress, chainId), { + // onSuccess: () => { + // onSuccessOptout(); + // dispatch(updateSubscriptionStatus({ channelAddress: channelAddress, status: false })); + // dispatch(removeUserSetting(channelAddress)); + + // unsubscribeToast.showMessageToast({ + // toastTitle: 'Success', + // toastMessage: 'Successfully opted out of channel !', + // toastType: 'SUCCESS', + // getToastIcon: (size) => ( + // + // ), + // }); + + // closeDropdown(); + // }, + // onError: () => { + // console.error('opt in error'); + // unsubscribeToast.showMessageToast({ + // toastTitle: 'Error', + // toastMessage: `There was an error opting out of channel`, + // toastType: 'ERROR', + // getToastIcon: (size) => ( + // + // ), + // }); + // }, + // }); } catch (err) { unsubscribeToast.showMessageToast({ toastTitle: 'Error', @@ -205,24 +251,24 @@ const ManageNotifSettingDropdown: React.FC = (o // render return ( - } - containerPadding="12px 16px" - centerOnMobile={centerOnMobile} - > - {children} - + } + containerPadding="12px 16px" + centerOnMobile={centerOnMobile} + > + {children} + ); } diff --git a/src/components/dropdowns/OptinNotifSettingDropdown.tsx b/src/components/dropdowns/OptinNotifSettingDropdown.tsx index a6c879f8a8..f6f5f33471 100644 --- a/src/components/dropdowns/OptinNotifSettingDropdown.tsx +++ b/src/components/dropdowns/OptinNotifSettingDropdown.tsx @@ -1,5 +1,7 @@ // React + Web3 Essentials import React, { useContext, useMemo, useState } from "react"; +import * as PushAPI from "@pushprotocol/restapi"; +import { ethers } from "ethers"; // External Packages import Switch from 'react-switch'; @@ -71,48 +73,48 @@ const OptinNotifSettingDropdownContainer: React.FC - - {setting.description} - handleSwitchChange(index)} checked={setting.type === 1 ? setting.default : setting.enabled} - checkedIcon={false} - uncheckedIcon={false} - onColor="#D53A94" - offColor="#A0A3B1" - height={16} - width={32} - handleDiameter={12} - /> - - {setting.type === 2 && setting.enabled === true && ( - - - {setting.default} - - handleSliderChange(index, x)} - /> - - )} + + {setting.description} + handleSwitchChange(index)} checked={setting.type === 1 ? setting.default : setting.enabled} + checkedIcon={false} + uncheckedIcon={false} + onColor="#D53A94" + offColor="#A0A3B1" + height={16} + width={32} + handleDiameter={12} + /> + + {setting.type === 2 && setting.enabled === true && ( + + + {setting.default} + + handleSliderChange(index, x)} + /> + + )} {setting.type === 3 && setting.enabled === true && ( - {setting.default.lower} - {setting.default.upper} + {setting.default.lower} - {setting.default.upper} handleSliderChange(index, {lower: startVal, upper: endVal})} + startVal={setting.default.lower} + endVal={setting.default.upper} + max={setting.upperLimit} + min={setting.lowerLimit} + step={setting.ticker || 1} + defaultStartVal={setting.default.lower} + defaultEndVal={setting.default.upper} + onChange={({ startVal, endVal }) => handleSliderChange(index, { lower: startVal, upper: endVal })} /> )} @@ -141,14 +143,14 @@ const OptinNotifSettingDropdownContainer: React.FC = (options) => { const { children, channelDetail, setLoading, onSuccessOptin } = options; - const { chainId } = useAccount(); + const { chainId, provider, account, wallet } = useAccount(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; }); const [isOpen, setIsOpen] = useState(false); const dispatch = useDispatch(); - const { handleConnectWallet } = useContext(AppContext); + const { handleConnectWallet, connectWallet } = useContext(AppContext); const onCoreNetwork = chainId === appConfig.coreContractChain; @@ -171,14 +173,28 @@ const OptinNotifSettingDropdown: React.FC = (opt const optInHandler = async ({ channelSettings, setLoading }: { channelSettings?: ChannelSetting[], setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (options && options.setLoading) || (() => { }); - - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } - setLoadingFunc(true); + let userPushInstance = userPushSDKInstance; + // if (!userPushInstance.signer) { + // userPushInstance = await handleConnectWallet(); + // if (!userPushInstance) { + // setLoadingFunc(false); + // return; + // } + // } + + let walletAddress = account; + let web3Provider = provider; + + if(!(wallet?.accounts?.length > 0)){ + const connectedWallet = await connectWallet(); + walletAddress = connectedWallet.accounts[0].address; + web3Provider = new ethers.providers.Web3Provider(connectedWallet.provider, 'any') + } + + + try { let channelAddress = channelDetail.channel; if (!onCoreNetwork) { @@ -187,11 +203,13 @@ const OptinNotifSettingDropdown: React.FC = (opt subscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushSDKInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { - settings: notifChannelSettingFormatString({ settings: channelSettings }), - // settings: [], + const _signer = await web3Provider?.getSigner(walletAddress); + + await PushAPI.channels.subscribe({ + signer: _signer, + channelAddress: convertAddressToAddrCaip(channelAddress, chainId), // channel address in CAIP + userAddress: convertAddressToAddrCaip(walletAddress, chainId), // user address in CAIP onSuccess: () => { - onSuccessOptin(); dispatch(updateSubscriptionStatus({ channelAddress, status: true })); dispatch(updateUserSetting({ channelAddress, settings: userSettingsFromDefaultChannelSetting({ channelSetting: channelSettings }) })); @@ -221,8 +239,45 @@ const OptinNotifSettingDropdown: React.FC = (opt ), }); }, + env: appConfig.pushNodesEnv, }); + // await PUSHAPI.channels.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { + // settings: notifChannelSettingFormatString({ settings: channelSettings }), + // // settings: [], + // onSuccess: () => { + // onSuccessOptin(); + // dispatch(updateSubscriptionStatus({ channelAddress, status: true })); + // dispatch(updateUserSetting({ channelAddress, settings: userSettingsFromDefaultChannelSetting({ channelSetting: channelSettings }) })); + + // subscribeToast.showMessageToast({ + // toastTitle: 'Success', + // toastMessage: 'Successfully opted into channel !', + // toastType: 'SUCCESS', + // getToastIcon: (size) => ( + // + // ), + // }); + // }, + // onError: () => { + // console.error('opt in error'); + // subscribeToast.showMessageToast({ + // toastTitle: 'Error', + // toastMessage: `There was an error opting into channel`, + // toastType: 'ERROR', + // getToastIcon: (size) => ( + // + // ), + // }); + // }, + // }); + } catch (err) { subscribeToast.showMessageToast({ diff --git a/src/components/dropdowns/UpdateNotifSettingDropdown.tsx b/src/components/dropdowns/UpdateNotifSettingDropdown.tsx index 055ea4c2fa..a7cc027a01 100644 --- a/src/components/dropdowns/UpdateNotifSettingDropdown.tsx +++ b/src/components/dropdowns/UpdateNotifSettingDropdown.tsx @@ -177,14 +177,18 @@ const UpdateNotifSettingDropdown: React.FC = ({ const saveUserSettingHandler = async ({ userSettings, setLoading }: { userSettings?: UserSetting[], setLoading?: React.Dispatch> }) => { const setLoadingFunc = setLoading || (() => {}); const saveOnSuccessSettingFunc = onSuccessSave || (() => {}); - - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } - setLoadingFunc(true); + let userPushInstance = userPushSDKInstance; + + if (!userPushInstance.signer) { + userPushInstance = await handleConnectWallet(); + if (!userPushInstance) { + setLoadingFunc(false); + return; + } + } + try { let channelAddress = channelDetail.channel; if (!onCoreNetwork) { @@ -193,7 +197,7 @@ const UpdateNotifSettingDropdown: React.FC = ({ subscribeToast.showLoaderToast({ loaderMessage: 'Waiting for Confirmation...' }); - await userPushSDKInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { + await userPushInstance.notification.subscribe(convertAddressToAddrCaip(channelAddress, chainId), { settings: notifUserSettingFormatString({ settings: userSettings }), // settings: [], onSuccess: () => { diff --git a/src/config/Themization.js b/src/config/Themization.js index d8b37f8308..8d493d4a1e 100644 --- a/src/config/Themization.js +++ b/src/config/Themization.js @@ -177,6 +177,8 @@ const themeLight = { toastSuccessBackground: 'linear-gradient(90.15deg, #30CC8B -125.65%, #30CC8B -125.63%, #F3FFF9 42.81%)', toastErrorBackground: 'linear-gradient(90.15deg, #FF2070 -125.65%, #FF2D79 -125.63%, #FFF9FB 42.81%)', + toastWarningBackground:'linear-gradient(90deg, #FFF2D1 0%, rgba(255, 255, 255, 0.00) 100%)', + // Profile profileBG: 'linear-gradient(107deg, rgba(226,8,128,1) 30%, rgba(103,76,159,1) 70%, rgba(53,197,243,1) 100%)', profileText: '#fff', @@ -471,6 +473,8 @@ const themeDark = { toastShadowColor: '#00000010', toastSuccessBackground: 'linear-gradient(90.15deg, #30CC8B -125.65%, #30CC8B -125.63%, #2F3137 42.81%)', toastErrorBackground: 'linear-gradient(89.96deg, #FF2070 -101.85%, #2F3137 51.33%)', + toastWarningBackground:'linear-gradient(90deg, #66562D 0.03%, #2F3137 74.67%)', + //Profile profileBG: '#2F3137', diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index b0bfebe771..c4b570eec9 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -2,7 +2,7 @@ import useModalBlur from "hooks/useModalBlur"; import React, { createContext, useContext, useEffect, useState } from "react"; import { ProgressHookType, PushAPI } from '@pushprotocol/restapi'; - +import { ethers } from "ethers"; // Internal Components import { AppContextType, BlockedLoadingI, ConnectedPeerIDType, LocalPeerType, onboardingProgressI, Web3NameListType } from "types/context" @@ -55,7 +55,7 @@ const AppContextProvider = ({ children }) => { const dispatch = useDispatch(); - const handleConnectWallet = async (showToast = false, toastMessage?: string) => { + const connectWallet = async (showToast = false, toastMessage?: string) =>{ if (showToast) { web3onboardToast.showMessageToast({ toastMessage: toastMessage || "Please connect your wallet to continue", @@ -65,11 +65,34 @@ const AppContextProvider = ({ children }) => { }); } + if (!(wallet?.accounts?.length > 0)) { + const walletConnected = await connect(); + return walletConnected[0]; + } + + } + + const handleConnectWallet = async (showToast = false, toastMessage?: string) => { + if (showToast) { + web3onboardToast.showMessageToast({ + toastMessage: toastMessage || "Please connect your wallet to continue", + toastTitle: "Connect Wallet", + toastType: "ERROR", + getToastIcon: (size) => , + }); + } if (wallet?.accounts?.length > 0) { - await initializePushSDK(); + const userPushInstance = await initializePushSDK(); + return userPushInstance; } else { - connect(); + const walletConnected = await connect(); + if (walletConnected) { + const userPushInstance = await initializePushSDK(walletConnected[0]); + return userPushInstance; + } else { + return null; + } } } @@ -87,13 +110,13 @@ const AppContextProvider = ({ children }) => { } const initialisePushSdkReadMode = async () => { - console.log("Initialising Push SDK Read Mode"); let userInstance; userInstance = await PushAPI.initialize({ env: appConfig.appEnv, account: account, }); dispatch(setUserPushSDKInstance(userInstance)); + return userInstance; } @@ -174,8 +197,8 @@ const AppContextProvider = ({ children }) => { onboardingProgress.progress = 99; break; case "PUSH-ERROR-00": - onboardingProgress.errorMessage = "User Rejected Signature"; - onboardingProgress.hookInfo.progressTitle = "User Rejected Signature"; + onboardingProgress.errorMessage = "The sign in was rejected by the user. You can still continue in read-only mode."; + onboardingProgress.hookInfo.progressTitle = "Profile Unlock Unsuccessful"; onboardingProgress.spinnerType = LOADER_SPINNER_TYPE.ERROR; break; case "PUSH-ERROR-01": @@ -206,16 +229,23 @@ const AppContextProvider = ({ children }) => { }; - const initializePushSDK = async () => { + const initializePushSDK = async (wallet?: any) => { let userInstance; try { - const librarySigner = provider?.getSigner(account); + + let web3Provider = provider; + let currentAddress = wallet ? wallet.accounts[0].address : account; + + if (wallet) { + web3Provider = new ethers.providers.Web3Provider(wallet.provider, 'any') + } + + const librarySigner = web3Provider?.getSigner(currentAddress); userInstance = await PushAPI.initialize(librarySigner!, { env: appConfig.appEnv, - account: account, + account: currentAddress, progressHook: onboardingProgressReformatter, }); - if (userInstance) { setBlockedLoading({ enabled: false, @@ -227,9 +257,11 @@ const AppContextProvider = ({ children }) => { } dispatch(setUserPushSDKInstance(userInstance)); + return userInstance; } catch (error) { // Handle initialization error console.log("Errror !!!!!", error); + return null; } }; @@ -284,7 +316,7 @@ const AppContextProvider = ({ children }) => { } else { initialisePushSdkGuestMode(); } - }, [account, provider, wallet]); + }, [account]); const createUserIfNecessary = async (): Promise => { try { @@ -327,6 +359,7 @@ const AppContextProvider = ({ children }) => { initializePushSDK, SnapState, handleConnectWallet, + connectWallet, setSnapInstalled, snapInstalled, setBlockedLoading, diff --git a/src/contexts/GlobalContext.tsx b/src/contexts/GlobalContext.tsx index 02c8528ffa..e14ea3bdf4 100644 --- a/src/contexts/GlobalContext.tsx +++ b/src/contexts/GlobalContext.tsx @@ -17,7 +17,7 @@ export type GlobalContextType = { export const GlobalContext = createContext(null); const GlobalContextProvider = ({ children }) => { - const [readOnlyWallet, setReadOnlyWallet] = useState('0x0000000000000000000000000000000000000000'); + const [readOnlyWallet, setReadOnlyWallet] = useState('0x0000000000000000000000000000000000000001'); const [mode, setMode] = useState(ReadOnlyWalletMode.GUEST_MODE); const [sidebarCollapsed, setSidebarCollapsed] = useState(false); diff --git a/src/hooks/useToast.tsx b/src/hooks/useToast.tsx index 07ea5e2aec..2bd94fd15f 100644 --- a/src/hooks/useToast.tsx +++ b/src/hooks/useToast.tsx @@ -56,7 +56,7 @@ export type ShowMessageToastType = ({ }: { toastTitle: string; toastMessage: string; - toastType: 'SUCCESS' | 'ERROR'; + toastType: 'SUCCESS' | 'ERROR' | 'WARNING'; getToastIcon?: (size: number) => JSX.Element; }) => void; @@ -100,7 +100,7 @@ const useToast = ( }; const showMessageToast: ShowMessageToastType = ({ toastTitle, toastMessage, toastType, getToastIcon }) => { - + const toastUI = ( {getToastIcon ? getToastIcon(30) : ''} @@ -123,6 +123,21 @@ const useToast = ( ); + let backgroundColor; + switch (toastType) { + case 'SUCCESS': + backgroundColor = themes.toastSuccessBackground; + break; + case 'ERROR': + backgroundColor = themes.toastErrorBackground; + break; + case 'WARNING': + backgroundColor = themes.toastWarningBackground; // Assuming you have a warning background color defined + break; + default: + backgroundColor = 'defaultBackgroundColor'; // Fallback color + } + const toastRenderParams = { position, hideProgressBar: true, @@ -134,7 +149,7 @@ const useToast = ( closeButton: CloseButton, autoClose: autoClose, style: { - background: toastType === 'SUCCESS' ? themes.toastSuccessBackground : themes.toastErrorBackground, + background: backgroundColor, boxShadow: `10px 10px 10px ${themes.toastShadowColor}`, borderRadius: '20px', margin: isMobile ? '20px' : '0px', diff --git a/src/modules/channelDashboard/ChannelOwnerDashboard.tsx b/src/modules/channelDashboard/ChannelOwnerDashboard.tsx index 76a5d93406..350b41ddf8 100644 --- a/src/modules/channelDashboard/ChannelOwnerDashboard.tsx +++ b/src/modules/channelDashboard/ChannelOwnerDashboard.tsx @@ -149,10 +149,10 @@ const ChannelOwnerDashboard = () => { } const showEditChannel = () => { - if (!userPushSDKInstance.signer) { - handleConnectWallet(); - return; - } + // if (!userPushSDKInstance.signer) { + // handleConnectWallet(); + // return; + // } setEditChannel(true); } diff --git a/src/primaries/Profile.tsx b/src/primaries/Profile.tsx index a33eff33d2..7d01911c14 100644 --- a/src/primaries/Profile.tsx +++ b/src/primaries/Profile.tsx @@ -76,7 +76,7 @@ const Profile = ({ isDarkMode }) => { function: async () => { await disconnect(wallet); setMode(ReadOnlyWalletMode.GUEST_MODE); - setReadOnlyWallet('0x0000000000000000000000000000000000000000'); + setReadOnlyWallet('0x0000000000000000000000000000000000000001'); }, title: 'Logout', invertedIcon: './logout.svg', @@ -87,6 +87,10 @@ const Profile = ({ isDarkMode }) => { setShowDropdown(false); }); + const ConnectWallet = ()=>{ + connect(); + } + // to create blockies return ( @@ -100,7 +104,7 @@ const Profile = ({ isDarkMode }) => { bg="linear-gradient(87.17deg, #B6A0F5 0%, #F46EF7 57.29%, #FF95D5 100%)" color='#FFF' isDarkMode={isDarkMode} - onClick={()=>handleConnectWallet()} + onClick={()=>ConnectWallet()} > Connect Wallet @@ -124,7 +128,7 @@ const Profile = ({ isDarkMode }) => { ) : ( <>{shortenText(account, 5)} )} - {!(wallet?.accounts?.length > 0) ? ReadOnlyWalletMode.GUEST_MODE : userPushSDKInstance?.readMode && ReadOnlyWalletMode.READ_ONLY_MODE} + {/* {!(wallet?.accounts?.length > 0) ? ReadOnlyWalletMode.GUEST_MODE : userPushSDKInstance?.readMode && ReadOnlyWalletMode.READ_ONLY_MODE} */} arrow { bg="linear-gradient(87.17deg, #B6A0F5 0%, #F46EF7 57.29%, #FF95D5 100%)" color='#FFF' isDarkMode={isDarkMode} - onClick={()=>handleConnectWallet()} + onClick={()=>ConnectWallet()} > Connect Wallet diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx index ef8095725d..d7636d860c 100644 --- a/src/sections/chat/ChatSidebarSection.tsx +++ b/src/sections/chat/ChatSidebarSection.tsx @@ -67,6 +67,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { // theme context const theme = useTheme(); + const {readOnlyWallet} = useContext(GlobalContext); const { setSelectedChatId } = useContext(Context); const { setMode } = useContext(GlobalContext); @@ -103,7 +104,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { } return formattedChatParticipant; } else { - if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000000') { + if (userPushSDKInstance.account === readOnlyWallet) { handleConnectWallet(); } else if (userPushSDKInstance.signer === undefined || userPushSDKInstance.decryptedPgpPvtKey === undefined) { await initializePushSDK(); @@ -116,7 +117,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { if (userPushSDKInstance.decryptedPgpPvtKey) { showCreateGroupModal(); } else { - if (userPushSDKInstance.account === '0x0000000000000000000000000000000000000000') { + if (userPushSDKInstance.account === readOnlyWallet) { handleConnectWallet(); } else { if (userPushSDKInstance.signer === undefined) { diff --git a/src/segments/Feedbox.tsx b/src/segments/Feedbox.tsx index f352e36153..979454aaa2 100644 --- a/src/segments/Feedbox.tsx +++ b/src/segments/Feedbox.tsx @@ -19,6 +19,7 @@ import { Item } from "primaries/SharedStyling"; import { addPaginatedNotifications, incrementPage, + resetNotificationsSlice, setFinishedFetching, updateTopNotifications } from "redux/slices/notificationSlice"; @@ -29,6 +30,7 @@ import { useAccount, useDeviceWidthCheck } from "hooks"; import { ReactComponent as MetamaskLogo } from 'assets/PushSnaps/metamasksnap.svg'; import { ReactComponent as Close } from 'assets/chat/group-chat/close.svg'; import { ReactComponent as OpenLink } from 'assets/PushSnaps/GoToImage.svg' +import { GlobalContext } from "contexts/GlobalContext"; // Internal Configs import { appConfig } from "config"; @@ -45,7 +47,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { const dispatch = useDispatch(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; - }); + }); const modalRef = React.useRef(null); useClickAway(modalRef, () => showFilter && setShowFilter(false)); @@ -71,6 +73,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { const [loadFilter, setLoadFilter] = React.useState(false); const [bgUpdateLoading, setBgUpdateLoading] = React.useState(false); const [loading, setLoading] = React.useState(false); + const {readOnlyWallet } = useContext(GlobalContext); const [showSnapInfo, setShowSnapInfo] = React.useState(true); @@ -169,7 +172,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { } }; const fetchLatestNotifications = async () => { - if (loading || bgUpdateLoading) return; + // if (loading || bgUpdateLoading) return; setBgUpdateLoading(true); setLoading(true); try { @@ -242,7 +245,7 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { }; React.useEffect(() => { - if (!userPushSDKInstance) return; + if (userPushSDKInstance?.account == readOnlyWallet || !userPushSDKInstance) return; fetchLatestNotifications(); fetchAllNotif(); }, [toggle, userPushSDKInstance]); @@ -366,13 +369,13 @@ const Feedbox = ({ showFilter, setShowFilter, search, setSearch }) => { <> - + Get Notifications directly in MetaMask using Push Snap. Install Push Snap { setShowSnapInfo(false); - }}/> + }} /> diff --git a/src/segments/ViewChannels.tsx b/src/segments/ViewChannels.tsx index 95ad74ff7c..cad1573af9 100644 --- a/src/segments/ViewChannels.tsx +++ b/src/segments/ViewChannels.tsx @@ -65,7 +65,7 @@ function ViewChannels({ loadTeaser, playTeaser }) { useEffect(() => { setLoading(!channels.length); //if there are no channels initially then, set the loader fetchInitialsChannelMeta(); - }, [account, chainId]); + }, [account, chainId,userPushSDKInstance]); useEffect(() => { setChannelsNetworkId(chainId); @@ -191,7 +191,8 @@ function ViewChannels({ loadTeaser, playTeaser }) { return () => { clearTimeout(timeout); }; - }, [search, userPushSDKInstance]); + // userPushSDKInstance should not be used as dependency here. + }, [search]); useEffect(() => { if (!account || !userPushSDKInstance) return; diff --git a/src/structure/MasterInterfacePage.tsx b/src/structure/MasterInterfacePage.tsx index 8e62dbdf32..eee6d356f7 100644 --- a/src/structure/MasterInterfacePage.tsx +++ b/src/structure/MasterInterfacePage.tsx @@ -8,6 +8,8 @@ import { ToastContainer } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.min.css'; import styled from 'styled-components'; import { MdError } from 'react-icons/md'; +import { MdWarning } from "react-icons/md"; + import useToast from 'hooks/useToast'; // Internal Components @@ -231,13 +233,13 @@ function MasterInterfacePage() { {blockedLoading.errorMessage && ( blockedLoadingToast.showMessageToast({ - toastTitle: 'Error', + toastTitle: blockedLoading.title, toastMessage: blockedLoading.errorMessage, - toastType: 'ERROR', + toastType: 'WARNING', getToastIcon: (size) => ( - ), }) diff --git a/src/types/context.ts b/src/types/context.ts index 933238ca01..d4fe95fdc4 100644 --- a/src/types/context.ts +++ b/src/types/context.ts @@ -45,7 +45,8 @@ export interface AppContextType { initializePushSDK: () => Promise; snapInstalled: boolean; setSnapInstalled: (snapInstalled: boolean) => void; - handleConnectWallet: (showToast?: boolean, toastMessage?: string) => void; + handleConnectWallet: (showToast?: boolean, toastMessage?: string) => any; + connectWallet: (showToast?: boolean, toastMessage?: string) => any; setBlockedLoading: (blockedLoading: BlockedLoadingI) => void; blockedLoading: BlockedLoadingI; getUser: () => Promise; diff --git a/yarn.lock b/yarn.lock index e39c26d170..fec4edc6f2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -81,17 +81,6 @@ __metadata: languageName: node linkType: hard -"@ambire/signature-validator@npm:^1.3.1": - version: 1.3.1 - resolution: "@ambire/signature-validator@npm:1.3.1" - dependencies: - ethers: ^5.6.5 - tap-spec: ^5.0.0 - tape: ^5.5.3 - checksum: 44c4796f4cbb4624cfd64033523d3491afa899067026e9615322dc6efaca71b16358cbc1661f2fce62d9dedcf424c92d44fe3b2ab8c6f171a59c0c21dc17b2e2 - languageName: node - linkType: hard - "@ampproject/remapping@npm:^2.2.0": version: 2.2.0 resolution: "@ampproject/remapping@npm:2.2.0" @@ -4641,22 +4630,6 @@ __metadata: languageName: node linkType: hard -"@ljharb/resumer@npm:^0.0.1": - version: 0.0.1 - resolution: "@ljharb/resumer@npm:0.0.1" - dependencies: - "@ljharb/through": ^2.3.9 - checksum: 1cff0a485cb857933d2921cb05a349f8fe894fa2bb6b31a347010ecccc4a2b369e43ebe5383a32a60ee6c9572d2c83fcab383eb01727e1507bf29c59f312dae6 - languageName: node - linkType: hard - -"@ljharb/through@npm:^2.3.9": - version: 2.3.9 - resolution: "@ljharb/through@npm:2.3.9" - checksum: a47ffed12ef4b08d07458db8bff5f7a13a7030fddf7dbfa947a765581a634d42ee90f7b8c249315aad122c21ad061e97a74f65aef3c03d2c09291d11312f0bfb - languageName: node - linkType: hard - "@material-ui/core@npm:4.11.0": version: 4.11.0 resolution: "@material-ui/core@npm:4.11.0" @@ -5432,9 +5405,9 @@ __metadata: "@mui/icons-material": ^5.8.4 "@mui/lab": ^5.0.0-alpha.72 "@mui/material": ^5.5.0 - "@pushprotocol/restapi": 0.0.1-alpha.64 + "@pushprotocol/restapi": 0.0.1-alpha.71 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 0.0.1-alpha.41 + "@pushprotocol/uiweb": 1.3.1-alpha.6 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5621,11 +5594,10 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/restapi@npm:0.0.1-alpha.64": - version: 0.0.1-alpha.64 - resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.64" +"@pushprotocol/restapi@npm:0.0.1-alpha.71": + version: 0.0.1-alpha.71 + resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.71" dependencies: - "@ambire/signature-validator": ^1.3.1 "@metamask/eth-sig-util": ^5.0.2 axios: ^0.27.2 buffer: ^6.0.3 @@ -5644,7 +5616,10 @@ __metadata: viem: ^1.20.3 peerDependencies: ethers: ^5.0.0 || ^6.0.0 - checksum: 6c62724de1522572de2dfc62212f7a461f8b92b4c8f32097d8a1cea527bda4e3d00b65ada8b2adb2a466d7615af7eb8092b28defed7dc06293a25ea3b9713503 + peerDependenciesMeta: + ethers: + optional: true + checksum: f54952b8d5eeb6bfad61af52b5d25a5989e9075d3640800cd3042f56c411659ee3add38d673df1497479d3a7fb7500db7789fa9b4e696a0544b556345cd950f7 languageName: node linkType: hard @@ -5672,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:0.0.1-alpha.41": - version: 0.0.1-alpha.41 - resolution: "@pushprotocol/uiweb@npm:0.0.1-alpha.41" +"@pushprotocol/uiweb@npm:1.3.1-alpha.6": + version: 1.3.1-alpha.6 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.6" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5706,7 +5681,8 @@ __metadata: axios: ^0.27.2 react: ">=16.8.0" styled-components: ^6.0.8 - checksum: bbd07715409e0d22b17f825124202772f65169bbeec4c4b05cc4e5b9020e129957f78b3031549ec5c638046247375fecd8b3653c1dbc039363293763b4d7ba51 + viem: ^1.3.0 + checksum: b931b0e27ef2d209d46d19c651de538a0843f914509a53f7bdbb69e71156406287d2c1561c037f4762523e48bf3d2704e0c2a273b9b0736dcf4ab203f19894d4 languageName: node linkType: hard @@ -10151,13 +10127,6 @@ __metadata: languageName: node linkType: hard -"ansi-regex@npm:^2.0.0": - version: 2.1.1 - resolution: "ansi-regex@npm:2.1.1" - checksum: 190abd03e4ff86794f338a31795d262c1dfe8c91f7e01d04f13f646f1dcb16c5800818f886047876f1272f065570ab86b24b99089f8b68a0e11ff19aed4ca8f1 - languageName: node - linkType: hard - "ansi-regex@npm:^4.0.0, ansi-regex@npm:^4.1.0": version: 4.1.1 resolution: "ansi-regex@npm:4.1.1" @@ -10179,13 +10148,6 @@ __metadata: languageName: node linkType: hard -"ansi-styles@npm:^2.2.1": - version: 2.2.1 - resolution: "ansi-styles@npm:2.2.1" - checksum: ebc0e00381f2a29000d1dac8466a640ce11943cef3bda3cd0020dc042e31e1058ab59bf6169cd794a54c3a7338a61ebc404b7c91e004092dd20e028c432c9c2c - languageName: node - linkType: hard - "ansi-styles@npm:^3.2.0, ansi-styles@npm:^3.2.1": version: 3.2.1 resolution: "ansi-styles@npm:3.2.1" @@ -10387,18 +10349,6 @@ __metadata: languageName: node linkType: hard -"array.prototype.every@npm:^1.1.4": - version: 1.1.5 - resolution: "array.prototype.every@npm:1.1.5" - dependencies: - call-bind: ^1.0.2 - define-properties: ^1.2.0 - es-abstract: ^1.22.1 - is-string: ^1.0.7 - checksum: 9974435604e135fc8c359a76c89bfe0672c1a80974a76dc61c673e5ea5068f78a31b7a168634ed7691501130ed61d3c788dd1d48ec1265c6cdf3910897b1eba4 - languageName: node - linkType: hard - "array.prototype.flat@npm:^1.2.5, array.prototype.flat@npm:^1.3.1": version: 1.3.1 resolution: "array.prototype.flat@npm:1.3.1" @@ -10449,20 +10399,6 @@ __metadata: languageName: node linkType: hard -"arraybuffer.prototype.slice@npm:^1.0.1": - version: 1.0.1 - resolution: "arraybuffer.prototype.slice@npm:1.0.1" - dependencies: - array-buffer-byte-length: ^1.0.0 - call-bind: ^1.0.2 - define-properties: ^1.2.0 - get-intrinsic: ^1.2.1 - is-array-buffer: ^3.0.2 - is-shared-array-buffer: ^1.0.2 - checksum: e3e9b2a3e988ebfeddce4c7e8f69df730c9e48cb04b0d40ff0874ce3d86b3d1339dd520ffde5e39c02610bc172ecfbd4bc93324b1cabd9554c44a56b131ce0ce - languageName: node - linkType: hard - "asap@npm:~2.0.6": version: 2.0.6 resolution: "asap@npm:2.0.6" @@ -11636,13 +11572,6 @@ __metadata: languageName: node linkType: hard -"buffer-shims@npm:~1.0.0": - version: 1.0.0 - resolution: "buffer-shims@npm:1.0.0" - checksum: 4defd1ffc9b270708ea39c17cac75c91c520c8e2f1d28a4d0ec74dc77445cbf8fc162003f0530fd1f81340347e9a26863d5aa27cd3cc351ec1d0361777d15ace - languageName: node - linkType: hard - "buffer-to-arraybuffer@npm:^0.0.5": version: 0.0.5 resolution: "buffer-to-arraybuffer@npm:0.0.5" @@ -11971,19 +11900,6 @@ __metadata: languageName: node linkType: hard -"chalk@npm:^1.0.0": - version: 1.1.3 - resolution: "chalk@npm:1.1.3" - dependencies: - ansi-styles: ^2.2.1 - escape-string-regexp: ^1.0.2 - has-ansi: ^2.0.0 - strip-ansi: ^3.0.0 - supports-color: ^2.0.0 - checksum: 9d2ea6b98fc2b7878829eec223abcf404622db6c48396a9b9257f6d0ead2acf18231ae368d6a664a83f272b0679158da12e97b5229f794939e555cc574478acd - languageName: node - linkType: hard - "chalk@npm:^2.0.0, chalk@npm:^2.0.1, chalk@npm:^2.4.1": version: 2.4.2 resolution: "chalk@npm:2.4.2" @@ -13437,32 +13353,6 @@ __metadata: languageName: node linkType: hard -"deep-equal@npm:^2.2.2": - version: 2.2.2 - resolution: "deep-equal@npm:2.2.2" - dependencies: - array-buffer-byte-length: ^1.0.0 - call-bind: ^1.0.2 - es-get-iterator: ^1.1.3 - get-intrinsic: ^1.2.1 - is-arguments: ^1.1.1 - is-array-buffer: ^3.0.2 - is-date-object: ^1.0.5 - is-regex: ^1.1.4 - is-shared-array-buffer: ^1.0.2 - isarray: ^2.0.5 - object-is: ^1.1.5 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - regexp.prototype.flags: ^1.5.0 - side-channel: ^1.0.4 - which-boxed-primitive: ^1.0.2 - which-collection: ^1.0.1 - which-typed-array: ^1.1.9 - checksum: eb61c35157b6ecb96a5359b507b083fbff8ddb4c86a78a781ee38485f77a667465e45d63ee2ebd8a00e86d94c80e499906900cd82c2debb400237e1662cd5397 - languageName: node - linkType: hard - "deep-is@npm:^0.1.3, deep-is@npm:~0.1.3": version: 0.1.4 resolution: "deep-is@npm:0.1.4" @@ -13510,7 +13400,7 @@ __metadata: languageName: node linkType: hard -"define-properties@npm:^1.1.3, define-properties@npm:^1.1.4, define-properties@npm:^1.2.0": +"define-properties@npm:^1.1.3, define-properties@npm:^1.1.4": version: 1.2.0 resolution: "define-properties@npm:1.2.0" dependencies: @@ -13520,13 +13410,6 @@ __metadata: languageName: node linkType: hard -"defined@npm:^1.0.1": - version: 1.0.1 - resolution: "defined@npm:1.0.1" - checksum: b1a852300bdb57f297289b55eafdd0c517afaa3ec8190e78fce91b9d8d0c0369d4505ecbdacfd3d98372e664f4a267d9bd793938d4a8c76209c9d9516fbe2101 - languageName: node - linkType: hard - "delay@npm:^5.0.0": version: 5.0.0 resolution: "delay@npm:5.0.0" @@ -14042,17 +13925,6 @@ __metadata: languageName: node linkType: hard -"dotignore@npm:^0.1.2": - version: 0.1.2 - resolution: "dotignore@npm:0.1.2" - dependencies: - minimatch: ^3.0.4 - bin: - ignored: bin/ignored - checksum: 06bab15e2a2400c6f823a0edbcd73661180f6245a4041a3fe3b9fde4b22ae74b896604df4520a877093f05c656bd080087376c9f605bccdea847664c59910f37 - languageName: node - linkType: hard - "drbg.js@npm:^1.0.1": version: 1.0.1 resolution: "drbg.js@npm:1.0.1" @@ -14074,7 +13946,7 @@ __metadata: languageName: node linkType: hard -"duplexer@npm:^0.1.1, duplexer@npm:^0.1.2": +"duplexer@npm:^0.1.2": version: 0.1.2 resolution: "duplexer@npm:0.1.2" checksum: 62ba61a830c56801db28ff6305c7d289b6dc9f859054e8c982abd8ee0b0a14d2e9a8e7d086ffee12e868d43e2bbe8a964be55ddbd8c8957714c87373c7a4f9b0 @@ -14599,53 +14471,6 @@ __metadata: languageName: node linkType: hard -"es-abstract@npm:^1.22.1": - version: 1.22.1 - resolution: "es-abstract@npm:1.22.1" - dependencies: - array-buffer-byte-length: ^1.0.0 - arraybuffer.prototype.slice: ^1.0.1 - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - es-set-tostringtag: ^2.0.1 - es-to-primitive: ^1.2.1 - function.prototype.name: ^1.1.5 - get-intrinsic: ^1.2.1 - get-symbol-description: ^1.0.0 - globalthis: ^1.0.3 - gopd: ^1.0.1 - has: ^1.0.3 - has-property-descriptors: ^1.0.0 - has-proto: ^1.0.1 - has-symbols: ^1.0.3 - internal-slot: ^1.0.5 - is-array-buffer: ^3.0.2 - is-callable: ^1.2.7 - is-negative-zero: ^2.0.2 - is-regex: ^1.1.4 - is-shared-array-buffer: ^1.0.2 - is-string: ^1.0.7 - is-typed-array: ^1.1.10 - is-weakref: ^1.0.2 - object-inspect: ^1.12.3 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - regexp.prototype.flags: ^1.5.0 - safe-array-concat: ^1.0.0 - safe-regex-test: ^1.0.0 - string.prototype.trim: ^1.2.7 - string.prototype.trimend: ^1.0.6 - string.prototype.trimstart: ^1.0.6 - typed-array-buffer: ^1.0.0 - typed-array-byte-length: ^1.0.0 - typed-array-byte-offset: ^1.0.0 - typed-array-length: ^1.0.4 - unbox-primitive: ^1.0.2 - which-typed-array: ^1.1.10 - checksum: 614e2c1c3717cb8d30b6128ef12ea110e06fd7d75ad77091ca1c5dbfb00da130e62e4bbbbbdda190eada098a22b27fe0f99ae5a1171dac2c8663b1e8be8a3a9b - languageName: node - linkType: hard - "es-array-method-boxes-properly@npm:^1.0.0": version: 1.0.0 resolution: "es-array-method-boxes-properly@npm:1.0.0" @@ -14653,7 +14478,7 @@ __metadata: languageName: node linkType: hard -"es-get-iterator@npm:^1.1.2, es-get-iterator@npm:^1.1.3": +"es-get-iterator@npm:^1.1.2": version: 1.1.3 resolution: "es-get-iterator@npm:1.1.3" dependencies: @@ -15724,7 +15549,7 @@ __metadata: languageName: node linkType: hard -"ethers@npm:^5.3.1, ethers@npm:^5.6.5, ethers@npm:^5.6.8, ethers@npm:^5.7.2": +"ethers@npm:^5.3.1, ethers@npm:^5.6.8, ethers@npm:^5.7.2": version: 5.7.2 resolution: "ethers@npm:5.7.2" dependencies: @@ -16126,16 +15951,6 @@ __metadata: languageName: node linkType: hard -"figures@npm:^1.4.0": - version: 1.7.0 - resolution: "figures@npm:1.7.0" - dependencies: - escape-string-regexp: ^1.0.5 - object-assign: ^4.1.0 - checksum: d77206deba991a7977f864b8c8edf9b8b43b441be005482db04b0526e36263adbdb22c1c6d2df15a1ad78d12029bd1aa41ccebcb5d425e1f2cf629c6daaa8e10 - languageName: node - linkType: hard - "file-entry-cache@npm:^6.0.1": version: 6.0.1 resolution: "file-entry-cache@npm:6.0.1" @@ -16572,7 +16387,7 @@ __metadata: languageName: node linkType: hard -"functions-have-names@npm:^1.2.2, functions-have-names@npm:^1.2.3": +"functions-have-names@npm:^1.2.2": version: 1.2.3 resolution: "functions-have-names@npm:1.2.3" checksum: c3f1f5ba20f4e962efb71344ce0a40722163e85bee2101ce25f88214e78182d2d2476aa85ef37950c579eb6cf6ee811c17b3101bb84004bb75655f3e33f3fdb5 @@ -16627,18 +16442,6 @@ __metadata: languageName: node linkType: hard -"get-intrinsic@npm:^1.2.1": - version: 1.2.1 - resolution: "get-intrinsic@npm:1.2.1" - dependencies: - function-bind: ^1.1.1 - has: ^1.0.3 - has-proto: ^1.0.1 - has-symbols: ^1.0.3 - checksum: 5b61d88552c24b0cf6fa2d1b3bc5459d7306f699de060d76442cce49a4721f52b8c560a33ab392cf5575b7810277d54ded9d4d39a1ea61855619ebc005aa7e5f - languageName: node - linkType: hard - "get-iterator@npm:^1.0.2": version: 1.0.2 resolution: "get-iterator@npm:1.0.2" @@ -16801,7 +16604,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6, glob@npm:^7.2.3": +"glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6": version: 7.2.3 resolution: "glob@npm:7.2.3" dependencies: @@ -17090,15 +16893,6 @@ __metadata: languageName: node linkType: hard -"has-ansi@npm:^2.0.0": - version: 2.0.0 - resolution: "has-ansi@npm:2.0.0" - dependencies: - ansi-regex: ^2.0.0 - checksum: 1b51daa0214440db171ff359d0a2d17bc20061164c57e76234f614c91dbd2a79ddd68dfc8ee73629366f7be45a6df5f2ea9de83f52e1ca24433f2cc78c35d8ec - languageName: node - linkType: hard - "has-bigints@npm:^1.0.1, has-bigints@npm:^1.0.2": version: 1.0.2 resolution: "has-bigints@npm:1.0.2" @@ -17106,16 +16900,6 @@ __metadata: languageName: node linkType: hard -"has-dynamic-import@npm:^2.0.1": - version: 2.0.1 - resolution: "has-dynamic-import@npm:2.0.1" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.1.1 - checksum: 1cb60255cdd354a5f53997dd4c8ae0f821706ced3d1047bb810cb74400f28988b08d4d986318cb6610b79e6b9993a6592e678b6cef3ef0b71ab553eaa99b9c4d - languageName: node - linkType: hard - "has-flag@npm:^3.0.0": version: 3.0.0 resolution: "has-flag@npm:3.0.0" @@ -17771,7 +17555,7 @@ __metadata: languageName: node linkType: hard -"inherits@npm:2, inherits@npm:2.0.4, inherits@npm:^2.0.1, inherits@npm:^2.0.3, inherits@npm:^2.0.4, inherits@npm:~2.0.1, inherits@npm:~2.0.3, inherits@npm:~2.0.4": +"inherits@npm:2, inherits@npm:2.0.4, inherits@npm:^2.0.1, inherits@npm:^2.0.3, inherits@npm:^2.0.4, inherits@npm:~2.0.3, inherits@npm:~2.0.4": version: 2.0.4 resolution: "inherits@npm:2.0.4" checksum: 4a48a733847879d6cf6691860a6b1e3f0f4754176e4d71494c41f3475553768b10f84b5ce1d40fbd0e34e6bfbb864ee35858ad4dd2cf31e02fc4a154b724d7f1 @@ -18392,13 +18176,6 @@ __metadata: languageName: node linkType: hard -"is-finite@npm:^1.0.1": - version: 1.1.0 - resolution: "is-finite@npm:1.1.0" - checksum: 532b97ed3d03e04c6bd203984d9e4ba3c0c390efee492bad5d1d1cd1802a68ab27adbd3ef6382f6312bed6c8bb1bd3e325ea79a8dc8fe080ed7a06f5f97b93e7 - languageName: node - linkType: hard - "is-fullwidth-code-point@npm:^2.0.0": version: 2.0.0 resolution: "is-fullwidth-code-point@npm:2.0.0" @@ -20940,7 +20717,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:^4.17.10, lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.5, lodash@npm:^4.7.0": +"lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.5, lodash@npm:^4.7.0": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7 @@ -21455,7 +21232,7 @@ __metadata: languageName: node linkType: hard -"minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6, minimist@npm:^1.2.8": +"minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6": version: 1.2.8 resolution: "minimist@npm:1.2.8" checksum: 75a6d645fb122dad29c06a7597bddea977258957ed88d7a6df59b5cd3fe4a527e253e9bbf2e783e4b73657f9098b96a5fe96ab8a113655d4109108577ecf85b0 @@ -23038,13 +22815,6 @@ __metadata: languageName: node linkType: hard -"parse-ms@npm:^1.0.0": - version: 1.0.1 - resolution: "parse-ms@npm:1.0.1" - checksum: 93fa7921554fe16bc73272a94bf812d1db6a144964fb57692f6de4fccf14bd771a232e8dcdcd4bbaa4aa477796cd3f35374d65596cca12323f2664bc023b4b4c - languageName: node - linkType: hard - "parse5-htmlparser2-tree-adapter@npm:^7.0.0": version: 7.0.0 resolution: "parse5-htmlparser2-tree-adapter@npm:7.0.0" @@ -23420,13 +23190,6 @@ __metadata: languageName: node linkType: hard -"plur@npm:^1.0.0": - version: 1.0.0 - resolution: "plur@npm:1.0.0" - checksum: bd8725178b2db5a708293c072631c84a33299dece6e5041835f874064e51c515d201905408c780e48df54d960d32bc0ac2e9e4cfe6d756ec4fff29ba5adfbf6c - languageName: node - linkType: hard - "pngjs@npm:^3.0.0, pngjs@npm:^3.3.0, pngjs@npm:^3.3.3": version: 3.4.0 resolution: "pngjs@npm:3.4.0" @@ -24415,24 +24178,6 @@ __metadata: languageName: node linkType: hard -"pretty-ms@npm:^2.1.0": - version: 2.1.0 - resolution: "pretty-ms@npm:2.1.0" - dependencies: - is-finite: ^1.0.1 - parse-ms: ^1.0.0 - plur: ^1.0.0 - checksum: a6a3df561f761902080df23407fc549cc3042fd685d8d2906e6cc2bd5024a814fb2bd4bd061e24879a8540c3aa48faba366421d5b49c268fbfb3501493835c2a - languageName: node - linkType: hard - -"process-nextick-args@npm:~1.0.6": - version: 1.0.7 - resolution: "process-nextick-args@npm:1.0.7" - checksum: 41224fbc803ac6c96907461d4dfc20942efa3ca75f2d521bcf7cf0e89f8dec127fb3fb5d76746b8fb468a232ea02d84824fae08e027aec185fd29049c66d49f8 - languageName: node - linkType: hard - "process-nextick-args@npm:~2.0.0": version: 2.0.1 resolution: "process-nextick-args@npm:2.0.1" @@ -24970,13 +24715,6 @@ __metadata: languageName: node linkType: hard -"re-emitter@npm:1.1.3": - version: 1.1.3 - resolution: "re-emitter@npm:1.1.3" - checksum: 3234850c26c4e51622ad7e54172396134cd510c2511da680275ab1e663e5d12c8b81e3e6f4ec025527ed241ad53dae9d1478c0148569840d2fec96a37d155431 - languageName: node - linkType: hard - "react-animation@npm:1.2.2": version: 1.2.2 resolution: "react-animation@npm:1.2.2" @@ -26042,21 +25780,6 @@ __metadata: languageName: node linkType: hard -"readable-stream@npm:2.2.9": - version: 2.2.9 - resolution: "readable-stream@npm:2.2.9" - dependencies: - buffer-shims: ~1.0.0 - core-util-is: ~1.0.0 - inherits: ~2.0.1 - isarray: ~1.0.0 - process-nextick-args: ~1.0.6 - string_decoder: ~1.0.0 - util-deprecate: ~1.0.1 - checksum: d186b7051c4a25b769fa158d1025da83dfb0052f8b0889df40e8e942d05b4d0d37470c49cfd73cce886db66d1a8cd5ec5e2ce97857894587d8158da5ed93baa7 - languageName: node - linkType: hard - "readable-stream@npm:> 1.0.0 < 3.0.0, readable-stream@npm:^2.0.1, readable-stream@npm:^2.2.10, readable-stream@npm:^2.2.2, readable-stream@npm:^2.2.8, readable-stream@npm:^2.3.0, readable-stream@npm:^2.3.5, readable-stream@npm:~2.3.6": version: 2.3.8 resolution: "readable-stream@npm:2.3.8" @@ -26242,17 +25965,6 @@ __metadata: languageName: node linkType: hard -"regexp.prototype.flags@npm:^1.5.0": - version: 1.5.0 - resolution: "regexp.prototype.flags@npm:1.5.0" - dependencies: - call-bind: ^1.0.2 - define-properties: ^1.2.0 - functions-have-names: ^1.2.3 - checksum: c541687cdbdfff1b9a07f6e44879f82c66bbf07665f9a7544c5fd16acdb3ec8d1436caab01662d2fbcad403f3499d49ab0b77fbc7ef29ef961d98cc4bc9755b4 - languageName: node - linkType: hard - "regexpp@npm:^3.1.0": version: 3.2.0 resolution: "regexpp@npm:3.2.0" @@ -26321,13 +26033,6 @@ __metadata: languageName: node linkType: hard -"repeat-string@npm:^1.5.2": - version: 1.6.1 - resolution: "repeat-string@npm:1.6.1" - checksum: 1b809fc6db97decdc68f5b12c4d1a671c8e3f65ec4a40c238bc5200e44e85bcc52a54f78268ab9c29fcf5fe4f1343e805420056d1f30fa9a9ee4c2d93e3cc6c0 - languageName: node - linkType: hard - "request@npm:^2.79.0": version: 2.88.2 resolution: "request@npm:2.88.2" @@ -26783,18 +26488,6 @@ __metadata: languageName: node linkType: hard -"safe-array-concat@npm:^1.0.0": - version: 1.0.0 - resolution: "safe-array-concat@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.2.0 - has-symbols: ^1.0.3 - isarray: ^2.0.5 - checksum: f43cb98fe3b566327d0c09284de2b15fb85ae964a89495c1b1a5d50c7c8ed484190f4e5e71aacc167e16231940079b326f2c0807aea633d47cc7322f40a6b57f - languageName: node - linkType: hard - "safe-buffer@npm:5.1.2, safe-buffer@npm:~5.1.0, safe-buffer@npm:~5.1.1": version: 5.1.2 resolution: "safe-buffer@npm:5.1.2" @@ -27683,15 +27376,6 @@ __metadata: languageName: node linkType: hard -"split@npm:1.0.0": - version: 1.0.0 - resolution: "split@npm:1.0.0" - dependencies: - through: 2 - checksum: 84837fa659662fab703efb41f5e3b3c4ae7de605555b6ce53c4fadb2a30b7cc7c8c005f905e6cb16e527ebb4117b6c2da1fe09c1caa150bdaf24df0dff8bf5d3 - languageName: node - linkType: hard - "sprintf-js@npm:1.1.2": version: 1.1.2 resolution: "sprintf-js@npm:1.1.2" @@ -28024,15 +27708,6 @@ __metadata: languageName: node linkType: hard -"string_decoder@npm:~1.0.0": - version: 1.0.3 - resolution: "string_decoder@npm:1.0.3" - dependencies: - safe-buffer: ~5.1.0 - checksum: 57ef02a148fd1ff2f20fe1accd944505ed3703e78bb28d302d940b2ad3dfb469508f79dcd0275ba1960d9675aa206452f76b2416059a6d0b0200bd7e9f552cdb - languageName: node - linkType: hard - "string_decoder@npm:~1.1.1": version: 1.1.1 resolution: "string_decoder@npm:1.1.1" @@ -28053,15 +27728,6 @@ __metadata: languageName: node linkType: hard -"strip-ansi@npm:^3.0.0": - version: 3.0.1 - resolution: "strip-ansi@npm:3.0.1" - dependencies: - ansi-regex: ^2.0.0 - checksum: 9b974de611ce5075c70629c00fa98c46144043db92ae17748fb780f706f7a789e9989fd10597b7c2053ae8d1513fd707816a91f1879b2f71e6ac0b6a863db465 - languageName: node - linkType: hard - "strip-ansi@npm:^5.0.0, strip-ansi@npm:^5.1.0, strip-ansi@npm:^5.2.0": version: 5.2.0 resolution: "strip-ansi@npm:5.2.0" @@ -28308,13 +27974,6 @@ __metadata: languageName: node linkType: hard -"supports-color@npm:^2.0.0": - version: 2.0.0 - resolution: "supports-color@npm:2.0.0" - checksum: 602538c5812b9006404370b5a4b885d3e2a1f6567d314f8b4a41974ffe7d08e525bf92ae0f9c7030e3b4c78e4e34ace55d6a67a74f1571bc205959f5972f88f0 - languageName: node - linkType: hard - "supports-color@npm:^5.3.0, supports-color@npm:^5.5.0": version: 5.5.0 resolution: "supports-color@npm:5.5.0" @@ -28515,39 +28174,6 @@ __metadata: languageName: node linkType: hard -"tap-out@npm:^2.1.0": - version: 2.1.0 - resolution: "tap-out@npm:2.1.0" - dependencies: - re-emitter: 1.1.3 - readable-stream: 2.2.9 - split: 1.0.0 - trim: 0.0.1 - bin: - tap-out: bin/cmd.js - checksum: b837d8adf646bf06f73a9306a9796a3201c55598c2c70045a2908d044fc2cc9466d52d27a7705c92a2c6ea37d560a84d135f4112bd377346f34d381ed836088b - languageName: node - linkType: hard - -"tap-spec@npm:^5.0.0": - version: 5.0.0 - resolution: "tap-spec@npm:5.0.0" - dependencies: - chalk: ^1.0.0 - duplexer: ^0.1.1 - figures: ^1.4.0 - lodash: ^4.17.10 - pretty-ms: ^2.1.0 - repeat-string: ^1.5.2 - tap-out: ^2.1.0 - through2: ^2.0.0 - bin: - tap-spec: bin/cmd.js - tspec: bin/cmd.js - checksum: 4413acc3ed4b8662b64439ad5be65a4d42edb2f3c5dc273b8ee563f9e7bfdde347e53c92de628a04ab640dda3cd8aea8aeb3ee7aa86bde8118d0584ffd76b788 - languageName: node - linkType: hard - "tapable@npm:^1.0.0": version: 1.1.3 resolution: "tapable@npm:1.1.3" @@ -28562,37 +28188,6 @@ __metadata: languageName: node linkType: hard -"tape@npm:^5.5.3": - version: 5.6.6 - resolution: "tape@npm:5.6.6" - dependencies: - "@ljharb/resumer": ^0.0.1 - "@ljharb/through": ^2.3.9 - array.prototype.every: ^1.1.4 - call-bind: ^1.0.2 - deep-equal: ^2.2.2 - defined: ^1.0.1 - dotignore: ^0.1.2 - for-each: ^0.3.3 - get-package-type: ^0.1.0 - glob: ^7.2.3 - has: ^1.0.3 - has-dynamic-import: ^2.0.1 - inherits: ^2.0.4 - is-regex: ^1.1.4 - minimist: ^1.2.8 - object-inspect: ^1.12.3 - object-is: ^1.1.5 - object-keys: ^1.1.1 - object.assign: ^4.1.4 - resolve: ^2.0.0-next.4 - string.prototype.trim: ^1.2.7 - bin: - tape: bin/tape - checksum: aac4722c7104f8478c8079aa1f441636b720f432074355c2edb1b0c0e2f2822004af2097669186d65ce7c70c57164d85d7da3662338e53515bdb778f5412af30 - languageName: node - linkType: hard - "tar-stream@npm:^1.6.2": version: 1.6.2 resolution: "tar-stream@npm:1.6.2" @@ -28775,7 +28370,7 @@ __metadata: languageName: node linkType: hard -"through2@npm:^2.0.0, through2@npm:^2.0.2, through2@npm:^2.0.3": +"through2@npm:^2.0.2, through2@npm:^2.0.3": version: 2.0.5 resolution: "through2@npm:2.0.5" dependencies: @@ -28785,7 +28380,7 @@ __metadata: languageName: node linkType: hard -"through@npm:2, through@npm:>=2.2.7 <3": +"through@npm:>=2.2.7 <3": version: 2.3.8 resolution: "through@npm:2.3.8" checksum: a38c3e059853c494af95d50c072b83f8b676a9ba2818dcc5b108ef252230735c54e0185437618596c790bbba8fcdaef5b290405981ffa09dce67b1f1bf190cbd @@ -29016,13 +28611,6 @@ __metadata: languageName: node linkType: hard -"trim@npm:0.0.1": - version: 0.0.1 - resolution: "trim@npm:0.0.1" - checksum: 2b4646dff99a222e8e1526edd4e3a43bbd925af0b8e837c340455d250157e7deefaa4da49bb891ab841e5c27b1afc5e9e32d4b57afb875d2dfcabf4e319b8f7f - languageName: node - linkType: hard - "tryer@npm:^1.0.1": version: 1.0.1 resolution: "tryer@npm:1.0.1" @@ -29233,42 +28821,6 @@ __metadata: languageName: node linkType: hard -"typed-array-buffer@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-buffer@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - get-intrinsic: ^1.2.1 - is-typed-array: ^1.1.10 - checksum: 3e0281c79b2a40cd97fe715db803884301993f4e8c18e8d79d75fd18f796e8cd203310fec8c7fdb5e6c09bedf0af4f6ab8b75eb3d3a85da69328f28a80456bd3 - languageName: node - linkType: hard - -"typed-array-byte-length@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-byte-length@npm:1.0.0" - dependencies: - call-bind: ^1.0.2 - for-each: ^0.3.3 - has-proto: ^1.0.1 - is-typed-array: ^1.1.10 - checksum: b03db16458322b263d87a702ff25388293f1356326c8a678d7515767ef563ef80e1e67ce648b821ec13178dd628eb2afdc19f97001ceae7a31acf674c849af94 - languageName: node - linkType: hard - -"typed-array-byte-offset@npm:^1.0.0": - version: 1.0.0 - resolution: "typed-array-byte-offset@npm:1.0.0" - dependencies: - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - for-each: ^0.3.3 - has-proto: ^1.0.1 - is-typed-array: ^1.1.10 - checksum: 04f6f02d0e9a948a95fbfe0d5a70b002191fae0b8fe0fe3130a9b2336f043daf7a3dda56a31333c35a067a97e13f539949ab261ca0f3692c41603a46a94e960b - languageName: node - linkType: hard - "typed-array-length@npm:^1.0.4": version: 1.0.4 resolution: "typed-array-length@npm:1.0.4" @@ -30603,19 +30155,6 @@ __metadata: languageName: node linkType: hard -"which-typed-array@npm:^1.1.10": - version: 1.1.11 - resolution: "which-typed-array@npm:1.1.11" - dependencies: - available-typed-arrays: ^1.0.5 - call-bind: ^1.0.2 - for-each: ^0.3.3 - gopd: ^1.0.1 - has-tostringtag: ^1.0.0 - checksum: 711ffc8ef891ca6597b19539075ec3e08bb9b4c2ca1f78887e3c07a977ab91ac1421940505a197758fb5939aa9524976d0a5bbcac34d07ed6faa75cedbb17206 - languageName: node - linkType: hard - "which-typed-array@npm:^1.1.2, which-typed-array@npm:^1.1.9": version: 1.1.9 resolution: "which-typed-array@npm:1.1.9" From 385d49b4a334037cd5f82d08cb5c6d24e1bea546 Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Thu, 7 Mar 2024 13:34:01 +0530 Subject: [PATCH 15/23] Flow is fixed for guest mode --- package.json | 2 +- .../chat/w2wChat/chatBox/ChatBox.tsx | 8 ++- src/contexts/AppContext.tsx | 12 +++- src/helpers/w2w/index.ts | 49 ++++++++++++++ src/modules/chat/ChatModule.tsx | 46 ++++++------- src/sections/chat/ChatSidebarSection.tsx | 64 +++++++++++++++---- yarn.lock | 10 +-- 7 files changed, 145 insertions(+), 46 deletions(-) diff --git a/package.json b/package.json index 75a2f612f0..0f8815c313 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,7 @@ "@mui/material": "^5.5.0", "@pushprotocol/restapi": "0.0.1-alpha.71", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "1.3.1-alpha.6", + "@pushprotocol/uiweb": "1.3.1-alpha.7", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/src/components/chat/w2wChat/chatBox/ChatBox.tsx b/src/components/chat/w2wChat/chatBox/ChatBox.tsx index c9e0c6a061..da3074bfcb 100644 --- a/src/components/chat/w2wChat/chatBox/ChatBox.tsx +++ b/src/components/chat/w2wChat/chatBox/ChatBox.tsx @@ -127,13 +127,15 @@ const ChatBox = ({ showGroupInfoModal }): JSX.Element => { const getChatId = () => { let chatId = selectedChatId || currentChat?.did; + + console.log("Chat Id in ChatBox >>>>>>>",chatId); + if(chatId){ return (chatId?.includes(':nft:') ? chatId.replace(/eip155:\d+:/, 'eip155:').split(':nft')[0] : chatId) ; } return chatId; - }; const handleCloseSuccessSnackbar = (event?: React.SyntheticEvent | Event, reason?: string): void => { @@ -171,9 +173,11 @@ const ChatBox = ({ showGroupInfoModal }): JSX.Element => { { id: 7, content: 'Access to more chat requests and messages will be added in the near future' }, ]; + console.log("viewChatBox >>>>><<<<<<<<<>>>>>>>><<<<<<<",viewChatBox,getChatId()); + return ( - {(!viewChatBox && !getChatId() )? ( + {(!viewChatBox || !getChatId()) ? ( {activeTab == 4 && ( { if (!(wallet?.accounts?.length > 0)) { const walletConnected = await connect(); - return walletConnected[0]; + console.log("Wallet Connected >>>",walletConnected); + if (walletConnected.length > 0) { + return walletConnected[0]; + }else{ + return null; + } } } @@ -89,7 +94,8 @@ const AppContextProvider = ({ children }) => { return userPushInstance; } else { const walletConnected = await connect(); - if (walletConnected) { + console.log("Wallet Connected >>>",walletConnected); + if (walletConnected.length > 0) { const userPushInstance = await initializePushSDK(walletConnected[0]); return userPushInstance; } else { @@ -111,6 +117,7 @@ const AppContextProvider = ({ children }) => { } const initialisePushSdkReadMode = async () => { + console.log("Initialising Push SDK Read Mode") let userInstance; userInstance = await PushAPI.initialize({ env: appConfig.appEnv, @@ -232,6 +239,7 @@ const AppContextProvider = ({ children }) => { const initializePushSDK = async (wallet?: any) => { let userInstance; + console.log("Initialising Push General Mode"); try { let web3Provider = provider; diff --git a/src/helpers/w2w/index.ts b/src/helpers/w2w/index.ts index 929b8486d4..b78553d5d8 100644 --- a/src/helpers/w2w/index.ts +++ b/src/helpers/w2w/index.ts @@ -1,4 +1,5 @@ // Internal Components +import { ethers } from 'ethers'; import { ConnectedUser, Feeds, MessageIPFSWithCID } from '../../types/chat'; import * as AES from './aes'; import * as Ceramic from './ceramic'; @@ -176,3 +177,51 @@ export default { DID: DIDHelper, Ceramic: Ceramic, }; + +export const reformatChatId = (chatid: string): string => { + let isWallet = false; + + // check if chatid: is appened, then skip anything else + if (chatid.startsWith('chatid:')) { + return chatid; + } + + // check if .eth is at the end, then skip anything else + if (chatid.endsWith('.eth')) { + return chatid; + } + + // check if .wallet is at the end, then skip anything else + if (chatid.endsWith('.wallet')) { + return chatid; + } + // check if this is eip155: which is considered default and therefore remove it + if (chatid.startsWith('eip155:') && !chatid.includes(':nft')) { + chatid = chatid.replace('eip155:', ''); + isWallet = true; + } + + if (chatid.includes(':nft')) { + chatid = chatid.replace(/eip155:\d+:/, 'eip155:').split(':nft')[0]; + } + + // check if this is eip155: which is considered default and therefore remove it + if (chatid.startsWith('eip155:')) { + chatid = chatid.replace('eip155:', ''); + isWallet = true; + } + + // check if this is an account address or not and based on that take appropriate action + if (!isWallet && ethers.utils.isAddress(chatid)) { + isWallet = true; + } + + // if all checks fail then this is probably a chat id + // WARNING: THIS WILL FAIL WITH NON-EVMS, NEED NODES TO INDICATE CHATID: + if (!isWallet) { + // append chatid: + chatid = `chatid:${chatid}`; + } + + return chatid; +}; diff --git a/src/modules/chat/ChatModule.tsx b/src/modules/chat/ChatModule.tsx index 045b89bd85..b1121b1a99 100644 --- a/src/modules/chat/ChatModule.tsx +++ b/src/modules/chat/ChatModule.tsx @@ -60,7 +60,7 @@ export const Context = React.createContext(null); // Create Header function Chat({ chatid }) { - const { account, chainId, provider,wallet } = useAccount(); + const { account, chainId, provider, wallet } = useAccount(); const { videoCallData } = useContext(VideoCallContext); const { @@ -71,7 +71,8 @@ function Chat({ chatid }) { connectedUser, setConnectedUser, displayQR, - setDisplayQR + setDisplayQR, + handleConnectWallet } = useContext(AppContext); const { userPushSDKInstance } = useSelector((state: any) => { @@ -108,7 +109,7 @@ function Chat({ chatid }) { connectedUser && socketData.messagesSinceLastConnection && w2wHelper.caip10ToWallet(socketData.messagesSinceLastConnection.fromCAIP10).toLowerCase() !== - account.toLowerCase() + account.toLowerCase() ) { if (currentChat) getUpdatedInbox(socketData.messagesSinceLastConnection); } @@ -311,10 +312,10 @@ function Chat({ chatid }) { return chatid; } - // check if .wallet is at the end, then skip anything else - if (chatid.endsWith('.wallet')) { - return chatid; - } + // check if .wallet is at the end, then skip anything else + if (chatid.endsWith('.wallet')) { + return chatid; + } // check if this is eip155: which is considered default and therefore remove it if (chatid.startsWith('eip155:') && !chatid.includes(':nft')) { chatid = chatid.replace('eip155:', ''); @@ -374,28 +375,31 @@ function Chat({ chatid }) { }; useEffect(() => { + let formattedchatId = selectedChatId || chatid; - + + console.log("Formatted Chat Id: " + formattedchatId); + if (formattedchatId) { - setViewChatBox(true); formattedchatId = reformatChatId(formattedchatId); - navigate(`/chat/${formattedchatId}`); - } - else - { + // navigate(`/chat/${formattedchatId}`); + setViewChatBox(true); + } else { setViewChatBox(false); navigate(`/chat`); } }, [selectedChatId]); - useEffect(() => {}, [account, connectedUser?.privateKey]); + useEffect(() => { }, [account, connectedUser?.privateKey]); + + console.log("userPushSDKInstance in Chat Module <<<>>>><<<>>>",userPushSDKInstance); return ( 0 ? account: readOnlyWallet} + account={wallet?.accounts?.length > 0 ? account : readOnlyWallet} pgpPrivateKey={pgpPvtKey} user={userPushSDKInstance} > @@ -451,7 +455,7 @@ function Chat({ chatid }) { {}} + onConfirm={() => { }} toastObject={groupInfoToast} modalPadding="0px" modalPosition={MODAL_POSITION.ON_PARENT} @@ -547,16 +551,14 @@ const Container = styled.div` @media ${device.laptop} { margin: ${GLOBALS.ADJUSTMENTS.MARGIN.MINI_MODULES.TABLET}; - height: calc(100vh - ${GLOBALS.CONSTANTS.HEADER_HEIGHT}px - ${globalsMargin.MINI_MODULES.TABLET.TOP} - ${ - globalsMargin.MINI_MODULES.TABLET.BOTTOM -}); + height: calc(100vh - ${GLOBALS.CONSTANTS.HEADER_HEIGHT}px - ${globalsMargin.MINI_MODULES.TABLET.TOP} - ${globalsMargin.MINI_MODULES.TABLET.BOTTOM + }); } @media ${device.mobileL} { margin: ${GLOBALS.ADJUSTMENTS.MARGIN.MINI_MODULES.MOBILE}; - height: calc(100vh - ${GLOBALS.CONSTANTS.HEADER_HEIGHT}px - ${globalsMargin.MINI_MODULES.MOBILE.TOP} - ${ - globalsMargin.MINI_MODULES.MOBILE.BOTTOM -}); + height: calc(100vh - ${GLOBALS.CONSTANTS.HEADER_HEIGHT}px - ${globalsMargin.MINI_MODULES.MOBILE.TOP} - ${globalsMargin.MINI_MODULES.MOBILE.BOTTOM + }); border: ${GLOBALS.ADJUSTMENTS.RADIUS.LARGE}; `; diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx index 050dcee715..e3c25faf92 100644 --- a/src/sections/chat/ChatSidebarSection.tsx +++ b/src/sections/chat/ChatSidebarSection.tsx @@ -8,6 +8,7 @@ import { useClickAway } from 'react-use'; import styled, { useTheme } from 'styled-components'; import { useSelector } from 'react-redux'; import { ethers } from 'ethers'; +import { useNavigate } from 'react-router-dom'; // Internal Compoonents import { ChatPreviewList, UserProfile } from '@pushprotocol/uiweb'; @@ -21,7 +22,7 @@ import { getIsNewTagVisible } from 'helpers/TimerHelper'; import { fetchIntent } from 'helpers/w2w/user'; import { Context } from 'modules/chat/ChatModule'; import { Feeds } from 'types/chat'; -import { caip10ToWallet } from 'helpers/w2w'; +import { caip10ToWallet, reformatChatId } from 'helpers/w2w'; import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderSpinner'; import { AppContext } from 'contexts/AppContext'; import NewTag from 'components/NewTag'; @@ -71,9 +72,11 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { const { setSelectedChatId } = useContext(Context); const { setMode } = useContext(GlobalContext); + const {wallet} = useAccount(); + const isNewTagVisible = getIsNewTagVisible(new Date('2023-02-22T00:00:00.000'), 90); - const { connectedUser, displayQR, setDisplayQR, initializePushSDK, handleConnectWallet } = useContext(AppContext); + const { connectedUser, displayQR, setDisplayQR, initializePushSDK, handleConnectWallet,connectWallet } = useContext(AppContext); const [searchedUser, setSearchedUser] = useState(''); const { activeTab, setActiveTab } = useContext(Context); @@ -93,24 +96,57 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { }; useClickAway(containerRef, () => closeQRDropdown()); + let navigate = useNavigate(); + const formatChatParticipant = async (chatParticipant: string, chatId: string) => { let formattedChatParticipant = chatParticipant; - //Checking if the user has signed the message or not - if (userPushSDKInstance.decryptedPgpPvtKey) { - if (!formattedChatParticipant.includes('.')) { - if (!await ethers.utils.isAddress(caip10ToWallet(formattedChatParticipant))) - formattedChatParticipant = chatId; + + //TODO: Check if the user has wallet connected or not if not then connect their wallet. + // when wallet gets connected then the dapp reloads, so when searched and then clicked on the chat for selecting navigate to chat/id. + + + let userPushInstance = userPushSDKInstance; + + if (!formattedChatParticipant.includes('.')) { + if (!await ethers.utils.isAddress(caip10ToWallet(formattedChatParticipant))) + formattedChatParticipant = chatId; + } + let formattedchatId = reformatChatId(formattedChatParticipant); + + console.log("Wallet in Chatsidebar ",wallet); + + // When the user has not connected their wallet, i.e, they try chat in guest mode + if(!(wallet?.accounts?.length > 0)) { + + let walletConnected = await connectWallet(); + + console.log("User Push Instance in Chat sidebar",walletConnected); + + if(walletConnected){ + navigate(`/chat/${formattedchatId}`); + // return formattedChatParticipant; } - return formattedChatParticipant; - } else { - if (userPushSDKInstance.account === readOnlyWallet) { - handleConnectWallet(); - } else if (userPushSDKInstance.signer === undefined || userPushSDKInstance.decryptedPgpPvtKey === undefined) { - await initializePushSDK(); - return null; + + }else{ + console.log("When wallet is connected then we have to do this",userPushInstance); + + if(!userPushInstance.decryptedPgpPvtKey){ + userPushInstance = await handleConnectWallet(); } + + console.log("User Push Instance in Chat sidebar 2",userPushInstance); + + if(userPushInstance.decryptedPgpPvtKey){ + return formattedChatParticipant; + } + + } + + + + } const handleCreateGroup = async () => { diff --git a/yarn.lock b/yarn.lock index fec4edc6f2..cf98b37a79 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5407,7 +5407,7 @@ __metadata: "@mui/material": ^5.5.0 "@pushprotocol/restapi": 0.0.1-alpha.71 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 1.3.1-alpha.6 + "@pushprotocol/uiweb": 1.3.1-alpha.7 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5647,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:1.3.1-alpha.6": - version: 1.3.1-alpha.6 - resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.6" +"@pushprotocol/uiweb@npm:1.3.1-alpha.7": + version: 1.3.1-alpha.7 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.7" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5682,7 +5682,7 @@ __metadata: react: ">=16.8.0" styled-components: ^6.0.8 viem: ^1.3.0 - checksum: b931b0e27ef2d209d46d19c651de538a0843f914509a53f7bdbb69e71156406287d2c1561c037f4762523e48bf3d2704e0c2a273b9b0736dcf4ab203f19894d4 + checksum: 5b5a667799185aa6c9fdfff9e498e8d90fb905bf0596a377f2f131b1eaff84ff1684a7d3a8b0842f92436bd096f8353f6f4976191bd360a25c686ff79b88a6c6 languageName: node linkType: hard From b91a3c17afa7d8649c2a1c0d51042421fb87536f Mon Sep 17 00:00:00 2001 From: abhishek-01k Date: Fri, 8 Mar 2024 19:17:07 +0530 Subject: [PATCH 16/23] Channel Profile UI --- src/components/MetaInfoDisplayer.js | 24 +- src/components/ViewChannelItem.js | 175 +++-- .../channel/ChannelProfileComponent.tsx | 605 ++++++++++++++++++ src/modules/channels/ChannelsModule.tsx | 13 +- src/segments/ChannelProfile.tsx | 84 ++- 5 files changed, 812 insertions(+), 89 deletions(-) create mode 100644 src/components/channel/ChannelProfileComponent.tsx diff --git a/src/components/MetaInfoDisplayer.js b/src/components/MetaInfoDisplayer.js index fc2dac8a8f..62d536c141 100644 --- a/src/components/MetaInfoDisplayer.js +++ b/src/components/MetaInfoDisplayer.js @@ -8,8 +8,30 @@ import styled from 'styled-components'; import { A, Item, ItemH, Span } from '../primaries/SharedStyling'; import { Device } from "assets/Device"; +interface MetaInfoDisplayProps { + externalIcon?: React.ReactNode; // Optional because it's checked before usage + internalIcon?: React.ReactNode; // Optional for the same reason + text: string; + bgColor: string; + color: string; + onClick?: React.MouseEventHandler; // Optional based on conditional use + onMouseEnter?: React.MouseEventHandler; // Optional based on conditional use + onMouseLeave?: React.MouseEventHandler; // Optional based on conditional use + padding: string; +} + // Faucet URLs -function MetaInfoDisplay({ externalIcon, internalIcon, text, bgColor, onClick, onMouseEnter, onMouseLeave, padding, color }) { +function MetaInfoDisplay({ + externalIcon = null, + internalIcon = null, + text, + bgColor, + onClick = () => {}, + onMouseEnter = () => {}, + onMouseLeave = () => {}, + padding, + color +}) { // render return ( diff --git a/src/components/ViewChannelItem.js b/src/components/ViewChannelItem.js index 436ae13b4b..5e3637af52 100644 --- a/src/components/ViewChannelItem.js +++ b/src/components/ViewChannelItem.js @@ -48,7 +48,7 @@ import UpdateChannelTooltipContent from './UpdateChannelTooltipContent'; import VerifiedTooltipContent from "./VerifiedTooltipContent"; // Create Header -function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) { +function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal, profileType }) { const dispatch = useDispatch(); const themes = useTheme(); @@ -56,7 +56,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) const { run, stepIndex } = useSelector((state) => state.userJourney); const { userPushSDKInstance } = useSelector((state) => { return state.user; - }); + }); const { epnsReadProvider, epnsWriteProvider, epnsCommReadProvider, pushAdminAddress, ZERO_ADDRESS } = useSelector( (state) => state.contracts ); @@ -99,6 +99,8 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) setSubscribed(subscriptionStatus[channelObject.channel]); }, [subscriptionStatus]); + // console.log("Channel Object >>>>>",channelObject); + useEffect(() => { setIsPushAdmin(pushAdminAddress == account); }, [pushAdminAddress, account]); @@ -106,6 +108,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) const fetchChannelJsonWithBlock = async () => { try { const channelJson = await ChannelsDataStore.instance.getChannelJsonStartBlockAsync(channelObject.channel); + // console.log("Channel JSON !!!!!",channelJson); return channelJson; } catch (err) { console.error(err); @@ -119,6 +122,8 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) const url = IPFS_GATEWAY + channelObject.ipfshash; const response = await axios.get(url); + // console.log("Response >>>>>",response); + if (response.data) setChannelObjectFromHash(response.data); if (response.data.icon) setChannelIcon(response.data.icon); }, [channelObject]); @@ -156,7 +161,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) let verifierAddress = null; const response = await epnsReadProvider.channels(channelObject.channel); verifierAddress = response.verifiedBy; - + if (channelsCache[verifierAddress]) { setVerifierDetails(channelsCache[verifierAddress]); } else { @@ -169,7 +174,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) } else { verifierAddrDetails = await userPushSDKInstance.channel.info(convertAddressToAddrCaip(verifierAddress, appConfig.coreContractChain)); } - + dispatch( cacheChannelInfo({ address: verifierAddress, @@ -184,7 +189,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) setLoading(false); } } - + }, [account, channelObject, userPushSDKInstance]); let isOwner; @@ -406,6 +411,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) key={channelObject.channel} id={channelObject.channel} minimal={minimal} + profileType={profileType} > {isMobile && ( @@ -423,8 +429,8 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) - - {!minimal && + + {!minimal && {loading ? ( Polygon - { navigate(generateChannelProfileLink(channelObject.channel, false)) @@ -591,7 +596,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) )} - {!minimal && + {!minimal && {!isMobile && ( @@ -615,19 +620,19 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) placementProps={ tooltTipHeight < 250 ? { - background: 'none', - // bottom: "25px", - top: '20px', - // right: "-175px", - left: '5px', - } + background: 'none', + // bottom: "25px", + top: '20px', + // right: "-175px", + left: '5px', + } : { - background: 'none', - bottom: '25px', - // top: "20px", - // right: "-175px", - left: '5px', - } + background: 'none', + bottom: '25px', + // top: "20px", + // right: "-175px", + left: '5px', + } } tooltipContent={ navigate(generateChannelProfileLink(channelObject.channel, false))}>{channelObject.name} - + {isVerified == 1 && ( + margin="3px 5px 0px" + style={{ display: 'flex' }} + > {channelObject.info} )} - + {loading ? ( <> @@ -845,7 +850,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) )} - {!loading && isPushAdmin && ( + {!loading && isPushAdmin && (profileType == "Channel") && ( Block channel )} - {!loading && (isPushAdmin || canVerify) && !isVerified && ( + {!loading && (isPushAdmin || canVerify) && !isVerified && (profileType == "Channel") && ( Verify Channel )} - {!loading && (isPushAdmin || canUnverify) && isVerified && ( + {!loading && (isPushAdmin || canUnverify) && isVerified && (profileType == "Channel") && ( - {isOwner && Owner} + {/* {isOwner && Owner} */} + {isOwner && ( + <> + {(profileType == "Profile") ? ( + navigate("/dashboard")}> + Go To Dashboard + + ) : ( + Owner + )} + + )} {!isOwner && ( - { setSubscribed(true); @@ -909,7 +925,7 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) }} > {}} + onClick={() => { }} disabled={txInProgress} className="optin" > @@ -930,9 +946,21 @@ function ViewChannelItem({ channelObjectProp, loadTeaser, playTeaser, minimal }) )} {!loading && subscribed && ( <> - {isOwner && Owner} + {/* {isOwner && Owner} */} + {isOwner && ( + <> + {(profileType == "Profile") ? ( + navigate("/dashboard")}> + Go To Dashboard + + ) : ( + Owner + )} + + )} + {!isOwner && ( - {}} + onClick={() => { }} disabled={txInProgress} > {txInProgress && ( @@ -990,17 +1018,16 @@ const ColumnFlex = styled(FlexBox)` `; // css styles const Container = styled.div` - flex: 1; + // flex: 1; display: flex; flex-wrap: wrap; - border: 1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}; + border: ${(props) => props.profileType == 'Profile' ? 'none' : `1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}`}; border-bottom: none; border-left: none; border-right: none; margin: 0px 5px; justify-content: center; padding: ${(props) => props.minimal ? '5px 0px' : '25px 10px'}; - align-self: stretch; @media (max-width: 768px) { display: flex; @@ -1412,6 +1439,14 @@ const OwnerButton = styled(ChannelActionButton)` min-width: 108px; `; +const DashboardButton = styled(ChannelActionButton)` + background: #e20880; + border-radius: 8px; + padding: 7px 14px; + min-height: 36px; + min-width: max-content; +` + const Toaster = styled.div` display: flex; flex-direction: row; diff --git a/src/components/channel/ChannelProfileComponent.tsx b/src/components/channel/ChannelProfileComponent.tsx new file mode 100644 index 0000000000..1bd75aa51a --- /dev/null +++ b/src/components/channel/ChannelProfileComponent.tsx @@ -0,0 +1,605 @@ +import { ItemH } from 'components/SharedStyling'; +import React, { useEffect, useState } from 'react'; +import { useSelector } from 'react-redux'; +import ChannelsDataStore from 'singletons/ChannelsDataStore'; +import styled, { useTheme } from 'styled-components'; +import Skeleton from '@yisheng90/react-loading'; +import { Image, Span } from 'primaries/SharedStyling'; +import { appConfig } from 'config'; +import { LOGO_FROM_CHAIN_ID, MaskedAliasChannels, shortenText } from 'helpers/UtilityHelper'; +import { ButtonV2 } from 'components/reusables/SharedStylingV2'; +import { IPFSGateway } from 'helpers/IpfsHelper'; +import axios from 'axios'; +import MetaInfoDisplayer from 'components/MetaInfoDisplayer'; +import OptinNotifSettingDropdown from 'components/dropdowns/OptinNotifSettingDropdown'; + + +const ChannelProfileComponent = ({ + channelID, + channelDetails +}) => { + + const themes = useTheme(); + const { channels, page, ZERO_ADDRESS } = useSelector((state: any) => state.channels); + + const [isLoading, setIsLoading] = useState(false); + const [channelIcon, setChannelIcon] = React.useState(''); + const [channelObjectFromHash, setChannelObjectFromHash] = React.useState({}); + const [copyText, setCopyText] = React.useState(channelDetails?.channel); + const [txInProgress, setTxInProgress] = React.useState(false); + + useEffect(() => { + + // Getting Channel Icon from Channel IPFS Hash + if (channelDetails) { + (async () => { + if (!channelDetails.ipfshash) return; + + const IPFS_GATEWAY = IPFSGateway; + const url = IPFS_GATEWAY + channelDetails.ipfshash; + const response = await axios.get(url); + if (response.data) setChannelObjectFromHash(response.data); + if (response.data.icon) setChannelIcon(response.data.icon); + })() + } + + }, [channelDetails]); + + const formatAddress = (addressText) => { + return addressText.length > 40 ? `${shortenText(addressText, 4, 6)}` : addressText; + }; + + const copyToClipboard = (address) => { + // const url = generateChannelProfileLink(address, true); + + // fallback for non navigator browser support + if (navigator && navigator.clipboard) { + navigator.clipboard.writeText(address); + } else { + const el = document.createElement('textarea'); + el.value = address; + document.body.appendChild(el); + el.select(); + document.execCommand('copy'); + document.body.removeChild(el); + } + }; + + + + return ( + + + + + + {isLoading ? ( + + ) : ( + + )} + + + + + + + + {isLoading || !channelDetails ? ( + + ) : ( + + + {/* ToolTip for Channel Changed warning */} + {/* {showChannelChangedWarning && ( + + } + > +
{ + handleHeight(channelObject.channel); + }} + style={{ cursor: 'pointer' }} + > + +
+ + )} */} + + {channelDetails.name} + + + {/* {isVerified == 1 && ( + + + } + > +
{ + handleHeight(channelObject.channel); + }} + > + +
+ + + )} */} + {channelDetails && channelDetails?.channel && ( + + Ethereum + + )} + {channelDetails && + channelDetails?.alias_address != null && + channelDetails?.alias_address != 'NULL' && + appConfig.allowedNetworks.includes(+channelDetails?.alias_blockchain_id) && + !MaskedAliasChannels[+channelDetails?.alias_blockchain_id][channelDetails?.channel] && ( + + Alias Chain Logo + + )} + + + )} + + + + {isLoading ? ( + <> + + + + + + + + + + + + + ) : ( + {channelDetails.info} + )} + + + + {isLoading ? ( + <> + + + + + ) : ( + + + + } + internalIcon={null} + text={channelDetails.subscriber_count} + padding="5.3px 10px" + bgColor={themes.viewChannelSecondaryBG} + color={themes.viewChannelSecondaryText} + /> + + { + copyToClipboard(channelDetails.channel); + setCopyText('copied'); + }} + onMouseEnter={() => { + setCopyText('click to copy'); + }} + onMouseLeave={() => { + setCopyText(channelDetails.channel); + }} + /> + + {/* {isChannelTutorialized(channelObject.channel) && ( + + )} */} + + + )} + + + + + {/* {!loading && !subscribed && ( + <> + {isOwner && Owner} + {!isOwner && ( + { + setSubscribed(true); + setSubscriberCount((prevSubscriberCount) => prevSubscriberCount + 1) + }} + > + {}} + disabled={txInProgress} + className="optin" + > + {txInProgress && ( + + + + )} + Opt-In + + + )} + + )} */} + + + + + + ); +}; + +export default ChannelProfileComponent; + +const Container = styled.div` +// flex: 1; + display: flex; + flex-wrap: wrap; + border: 1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}; + border-bottom: none; + border-left: none; + border-right: none; + margin: 0px 5px; + justify-content: center; + padding: ${(props) => props.minimal ? '5px 0px' : '25px 10px'}; + + align-self: stretch; + @media (max-width: 768px) { + display: flex; + flex-direction: column; + border-bottom: 1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}; + border-top: none; + border-left: none; + border-right: none; + } +`; + +const ChannelLogoInner = styled.div` + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + overflow: hidden; + border-radius:20px; + display: flex; + justify-content: center; + align-items: center; + +`; + +const ChannelLogoOuter = styled.div` + padding-top: 100%; + width: 100%; + position: relative; +`; + +const ChannelLogo = styled(ButtonV2)` + max-width: 100px; + min-width: 48px; + flex: 1; + margin: 5px; + padding: 10px; + border: 1px solid ${(props) => props.theme.viewChannelIconBorder}; + background: transparent; + overflow: hidden; + border-radius: 20px; + display: flex; + flex-direction: column; + justify-content: center; + align-self: flex-start; + + @media (max-width: 768px) { + align-self: center; + min-width: 100px; + max-width: 100px; + } + + @media (max-width: 600px) { + align-self: center; + } +`; + +const ChannelLogoImg = styled.img` + object-fit: contain; + width: 100%; + border-radius: 20px; + overflow: hidden; +`; + + +const ChannelTitle = styled(ItemH)` + padding: 5px 10px 5px 0px; + position: relative; + justify-content: flex-start; + margin: 0; + flex: initial; + align-items: center; + @media (max-width: 768px) { + align-self: center; + margin-top: 10px; + } + @media (max-width: 600px) { + flex: 5; + padding-left: 5px; + } +`; + +const ChannelTitleLink = styled.a` + text-decoration: none; + display: flex; + flex: inherit; + align-item: center; + &:hover { + text-decoration: underline; + cursor: pointer; + pointer: hand; + } + + & > span > span { + font-weight: 500; + color: ${(props) => props.theme.viewChannelLink}; + font-size: 18px; + cursor: pointer; + } + + & > span > span { + vertical-align: middle; + } +`; + +const ChannelInfo = styled.div` + flex: 1; + margin: 5px 10px; + min-width: 240px; + flex-grow: 4; + flex-direction: column; + display: flex; + + @media (max-width: 480px) { + min-width: 210px; + } +`; + +const ChannelDesc = styled.div` + flex: 1; + display: flex; + font-size: 15px; + color: rgba(0, 0, 0, 0.75); + padding: 5px 0px 10px 0px; + font-weight: 400; + flex-direction: column; + color: ${(props) => props.theme.color}; + @media (max-width: 768px) { + align-self: center; + text-align: center; + } + + @media (max-width: 600px) { + align-self: flex-start; + text-align: left; + } +`; + +const ChannelDescLabel = styled.label` + flex: 1; + line-height: 165%; + color: ${(props) => props.theme.viewChannelPrimaryTextColor}; +`; + +const SkeletonWrapper = styled.div` + overflow: hidden; + width: ${(props) => props.atW + '%' || '100%'}; + height: ${(props) => props.atH}px; + border-radius: ${(props) => props.borderRadius || 10}px; + margin-bottom: ${(props) => props.marginBottom || 5}px; + margin-right: ${(props) => props.marginRight || 0}px; +`; + +const ChannelMeta = styled.div` + display: flex; + flex-wrap: wrap; + flex-direction: row; + padding: 5px 0px; + font-size: 13px; + @media (max-width: 768px) { + align-self: center; + } +`; + +const ItemBody = styled.div` + width: 100%; + display: flex; + flex-wrap: wrap; + flex-direction: row; + align-items: center; + @media (max-width: 768px) { + width: 100%; + align-self: center; + justify-content: center; + } +`; + + +const ChannelActionButton = styled.button` + border: 0; + outline: 0; + display: flex; + align-items: center; + justify-content: center; + color: #fff; + border-radius: 5px; + font-size: 14px; + font-weight: 400; + position: relative; + &:hover { + opacity: 0.9; + cursor: pointer; + pointer: hand; + } + &:active { + opacity: 0.75; + cursor: pointer; + pointer: hand; + } + ${(props) => + props.disabled && + css` + &:hover { + opacity: 1; + cursor: default; + pointer: default; + } + &:active { + opacity: 1; + cursor: default; + pointer: default; + } + `} +`; + +const OwnerButton = styled(ChannelActionButton)` + background: #35c5f3; + border-radius: 8px; + min-height: 36px; + min-width: 108px; +`; diff --git a/src/modules/channels/ChannelsModule.tsx b/src/modules/channels/ChannelsModule.tsx index 0d1c401086..b02bb9f6b7 100644 --- a/src/modules/channels/ChannelsModule.tsx +++ b/src/modules/channels/ChannelsModule.tsx @@ -13,6 +13,11 @@ import ViewChannels from "segments/ViewChannels"; import APP_PATHS from "config/AppPaths"; import GLOBALS, { device, globalsMargin } from "config/Globals"; +export enum ChannelTYPE { + CHANNEL = 'Channel', + CHANNEL_PROFILE = 'Profile', +} + // Create Channels Module const ChannelsModule = ({ channelID, loadTeaser, playTeaser }) => { ReactGA.pageview(APP_PATHS.Channels); @@ -23,7 +28,13 @@ const ChannelsModule = ({ channelID, loadTeaser, playTeaser }) => { {channelID && - + } diff --git a/src/segments/ChannelProfile.tsx b/src/segments/ChannelProfile.tsx index 03fe6ac650..4012d896b1 100644 --- a/src/segments/ChannelProfile.tsx +++ b/src/segments/ChannelProfile.tsx @@ -19,12 +19,17 @@ import { ItemVV2, SpanV2 } from "components/reusables/SharedStylingV2"; import { appConfig } from "config"; import APP_PATHS from "config/AppPaths"; import { device } from "config/Globals"; +import ChannelProfileComponent from "components/channel/ChannelProfileComponent"; +import ChannelsDataStore from "singletons/ChannelsDataStore"; +import ViewChannelItem from "components/ViewChannelItem"; + + // Constants const NOTIFICATIONS_PER_PAGE = 20; // Create Header -const ChannelProfile = ({ channelID }) => { +const ChannelProfile = ({ channelID, loadTeaser, playTeaser, minimal, profileType }) => { const dispatch = useDispatch(); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; @@ -37,24 +42,41 @@ const ChannelProfile = ({ channelID }) => { // loading const [loading, setLoading] = useState(true); const [notifications, setNotifications] = useState([]); - + const [channelDetails, setChannelDetails] = useState(null); // Setup navigation const navigate = useNavigate(); - // load notifications useEffect(() => { + setChannelDetails(null) if (userPushSDKInstance) { setLoading(true); - userPushSDKInstance.channel.notifications(channelID, { - page: 1, - limit: NOTIFICATIONS_PER_PAGE, - }).then((response) => { - setNotifications(response.feeds); + (async () => { + try { + const channelBasedOnChannelID = await userPushSDKInstance.channel.info(channelID); + setChannelDetails(channelBasedOnChannelID); setLoading(false); + } catch (error) { + console.log("Error", error); + } + })() + } - // ENABLE PAGINATION HERE - }).catch((err) => { - // ENABLE NO NOTIFICATION FOUND HERE + }, [channelID, userPushSDKInstance]) + + // load notifications + useEffect(() => { + if (userPushSDKInstance) { + setLoading(true); + userPushSDKInstance.channel.notifications(channelID, { + page: 1, + limit: NOTIFICATIONS_PER_PAGE, + }).then((response) => { + setNotifications(response.feeds); + setLoading(false); + + // ENABLE PAGINATION HERE + }).catch((err) => { + // ENABLE NO NOTIFICATION FOUND HERE }); }; return () => { @@ -75,25 +97,45 @@ const ChannelProfile = ({ channelID }) => { - { navigate(APP_PATHS.Channels); }} /> - - Channel Profile Here - + {/* New Channel Profile Component */} + {/* {!loading && channelDetails && } */} + + {channelDetails && !loading && + + } + + + {!loading && + + Recent Notifications + + + } - {loading && + {loading && } - + {notifications.map((item, index) => { const payload = item.payload; @@ -184,5 +226,13 @@ const ScrollItem = styled(ItemVV2)` } `; +const TextContainer = styled(ItemVV2)` + flex:0; + border-bottom: 1px solid rgba(0, 0, 0, 0.10); + padding: 10px; + align-items:baseline; + margin:7px 20px 24px 5px; +` + // Export Default export default ChannelProfile; \ No newline at end of file From 19d17f11b804958c0c027f842759b1a4c7bf7014 Mon Sep 17 00:00:00 2001 From: harshrajat Date: Fri, 8 Mar 2024 20:47:09 +0400 Subject: [PATCH 17/23] Channel profile phase 1 completed --- package.json | 2 +- src/config/config-alpha.js | 170 ++++++++++++++++++++++++++++++++ src/config/index.js | 5 +- src/segments/ChannelProfile.tsx | 16 +-- yarn.lock | 10 +- 5 files changed, 188 insertions(+), 15 deletions(-) create mode 100644 src/config/config-alpha.js diff --git a/package.json b/package.json index 1601d4a943..363ea54570 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "1.6.10", + "@pushprotocol/restapi": "1.6.11", "@pushprotocol/socket": "0.5.3", "@pushprotocol/uiweb": "0.0.1-alpha.41", "@reduxjs/toolkit": "^1.7.1", diff --git a/src/config/config-alpha.js b/src/config/config-alpha.js new file mode 100644 index 0000000000..c278d73804 --- /dev/null +++ b/src/config/config-alpha.js @@ -0,0 +1,170 @@ +// environmental configurations for the dapp for different environments +export const config = { + /** + * Push Nodes Environment - can be dev, staging or prod - important to keep one on one connection + */ + pushNodesEnv: 'prod', + + /** + * API Calls Related + */ + appEnv: 'prod', // helps in deciding some text, links, etc, DO NOT CHANGE + + pushNodeApiVersion: 1, + apiUrl: 'https://backend.epns.io/apis', + w2wApiUrl: 'https://backend.epns.io/apis', + toolingApiUrl: 'https://tooling.epns.io/apis', + + ipfsInfuraAPIKey: process.env.REACT_APP_IPFS_INFURA_API_KEY || '22rfiNb1J645FdehoqbKMpLbF6V', + ipfsInfuraAPISecret: process.env.REACT_APP_IPFS_INFURA_API_SECRET || 'a757597f020425c3ae532e6be84de552', + + /** + * Allowed Networks + */ + allowedNetworks: [ + 1, //for ethereum mainnet + 137, //for polygon mainnet + 56, // for bnb mainnet + // 10, // for optimism mainnet + 42161, // arbitrum mainnet + 1101, // polygon zkevm mainnet + // 122 // fuse mainnet + ], + + /** + * Core Network Related Data + */ + coreContractChain: 1, //the chain id of the network which the core contract relies on + coreRPC: 'https://mainnet.infura.io/v3/4ff53a5254144d988a8318210b56f47a', + mainnetCoreRPC: 'https://mainnet.infura.io/v3/4ff53a5254144d988a8318210b56f47a', + mainnetCoreContractChain: 1, + aliasRPC: { + 137: "https://polygon-mainnet.infura.io/v3/150f25623ae64d08ab7ec7dd0c6b6ee9", + 56: "https://bsc-dataseed.binance.org/", + 10: "https://opt-mainnet.g.alchemy.com/v2/JYW0UaSC5Zd0hrI6vE2K9VN1wJupoY5B", + 42161: "https://arb1.arbitrum.io/rpc", + 1101: 'https://rpc.polygon-zkevm.gateway.fm', + }, + infuraApiUrl: 'https:/infura-ipfs.io/ipfs/', + + /** + * Analaytics + Firebase + */ + googleAnalyticsId: 'UA-165415629-1', + vapidKey: 'BFRmmAEEXOhk31FIsooph5CxlXKh6N0_NocUWHzvtpoUEvqQTwLXu6XtwkrH7ckyr2CvVz1ll-8q4oo6-ZqFJPY', + firebaseConfig: { + apiKey: 'AIzaSyClOk4qP0ttFW-BPnXy7WT920xfdXSbFu8', + authDomain: 'epns-internal.firebaseapp.com', + databaseURL: 'https://epns-internal.firebaseio.com', + projectId: 'epns-internal', + storageBucket: 'epns-internal.appspot.com', + messagingSenderId: '755180533582', + appId: '1:755180533582:web:752ff8db31905506b7d01f', + measurementId: 'G-ZJH2T7R9S1', + }, + + /** + * External links + */ + links: { + ios: 'https://apps.apple.com/app/ethereum-push-service-epns/id1528614910', + android: 'https://play.google.com/store/apps/details?id=io.epns.epns', + extension: 'https://chrome.google.com/webstore/detail/epns-protocol-beta/lbdcbpaldalgiieffakjhiccoeebchmg', + howto: 'https://push.org/docs', + }, +}; + +/** + * Smart Contract Related + */ +export const addresses = { + ceaErc20: '0xc1C0472c0C80bCcDC7F5D01A376Bd97a734B8815', // mainnet address + epnscore: '0x66329Fdd4042928BfCAB60b179e1538D56eeeeeE', // mainnet address core + epnsEthComm: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa', // mainnet address eth comm + epnsPolyComm: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa', // mainnet address polygon comm + pushToken: '0xf418588522d5dd018b425E472991E52EBBeEEEEE', // mainnet address + pushChannelAdmin: "0x65193c896eC400f731712D4f71046CeDd11Bff27", // mainnet push core admin + aDai: '0xcB1Fe6F440c49E9290c3eb7f158534c2dC374201', // mainnet address + staking: '0xB72ff1e675117beDefF05a7D0a472c3844cfec85', // mainnet address + yieldFarmPUSH: '0x6019B84E2eE9EB62BC42E32AB6375A7095886366', // mainnet address + yieldFarmLP: '0xbB2A70e67770D0A7F5f42d883C5BBE9b85e0DcD6', // mainnet address + epnsToken: '0xf418588522d5dd018b425E472991E52EBBeEEEEE', // mainnet address + epnsLPToken: '0xaf31fd9c3b0350424bf96e551d2d1264d8466205', // mainnet address + rockstar: '0x3f8C2152b79276b78315CAF66cCF951780580A8a', // mainnet address + batchMintNFT: '0x6BaeeD93336B277D8949Cb89161269032698f443', // mainnet address + NFTRewards: '0xc4708BB6EC3B797344f123126171302e4e3E68E2', // mainnet address + distributor: '0x64CfAb2eA55ADAe08c9040fdA247828444fB9D0D', // mainnet address + uniswapV2Router02: '0x7a250d5630B4cF539739dF2C5dAcb4c659F2488D', + WETHAddress: '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2', // mainnet address + USDTAddress: '0xdac17f958d2ee523a2206206994597c13d831ec7', // mainnet address + rockstarV2: '0xA2b885e7065EA59a3251489715ca80DE5Ff642f8', //mainnet address + NFTRewardsV2: '0xdc66567a990B7fa10730459537620857c9e03287', //mainnet address + + //For Yield Farm V1(Deprecated) + staking: "0xB72ff1e675117beDefF05a7D0a472c3844cfec85", // deprecated staking mainnet addresses + depYieldFarmPUSH: "0x6019B84E2eE9EB62BC42E32AB6375A7095886366", // deprecated YieldFarmPUSH mainnet address + depYieldFarmLP:"0xbB2A70e67770D0A7F5f42d883C5BBE9b85e0DcD6",// deprecated YieldFarmLP mainnet addresses + + //For Yield Farm V2 + stakingV2:"0x9D2513F5b539DC774C66b28ACEc94e4bD00105C2",//mainnet address + yieldFarmLP: "0x9af118D9fA1eFEa5b5a792847554960217DEdb04",//mainnet address + uniV2LPToken: "0xaf31fd9c3b0350424bf96e551d2d1264d8466205",//same as epnsLPToken + pushCoreV2: "0x66329Fdd4042928BfCAB60b179e1538D56eeeeeE",//not upgraded + + + +}; + +export const CHAIN_DETAILS = { + 1: { + label: "Ethereum Mainnet", + name: "ETH_MAINNET", + chainId: 1, + rpcUrl: "https://mainnet.infura.io/v3/4ff53a5254144d988a8318210b56f47a", + commAddress: "0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa", + network: "mainnet", + }, + 137: { + label: "Polygon Mainnet", + name: "POLYGON_MAINNET", + chainId: 137, + rpcUrl: "https://polygon-mainnet.infura.io/v3/150f25623ae64d08ab7ec7dd0c6b6ee9", + commAddress: "0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa", + network: "polygon-mainnet", + }, + 56: { + label: "BNB Mainnet", + name: "BNB_MAINNET", + chainId: 56, + rpcUrl: "https://bsc-dataseed.binance.org/", + commAddress: "0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa" + }, + 10: { + label: "Optimism Mainnet", + name: "OPTIMISM_MAINNET", + chainId: 10, + rpcUrl: 'https://opt-mainnet.g.alchemy.com/v2/JYW0UaSC5Zd0hrI6vE2K9VN1wJupoY5B', + commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa' + }, + 1101: { + label: "Polygon zkEVM Mainnet", + name: "POLYGON_ZK_EVM_MAINNET", + chainId: 1101, + rpcUrl: 'https://rpc.polygon-zkevm.gateway.fm', + commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa' + }, + 42161: { + label: "Arbitrum Mainnet", + name: "ARBITRUMONE_MAINNET", + chainId: 42161, + rpcUrl: 'https://arb1.arbitrum.io/rpc', + commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa' + }, + 122: { + label: "Fuse Mainnet", + name: "FUSE_MAINNET", + chainId: 122, + rpcUrl: 'https://rpc.fuse.io', + commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa' + }, +} \ No newline at end of file diff --git a/src/config/index.js b/src/config/index.js index aab9cdf67e..885c4a0c45 100644 --- a/src/config/index.js +++ b/src/config/index.js @@ -12,7 +12,7 @@ if (process.env.REACT_APP_DEPLOY_ENV == 'PROD') { } else if (process.env.REACT_APP_DEPLOY_ENV == 'W2W') { appendName = 'staging'; } else if (process.env.REACT_APP_DEPLOY_ENV == 'ALPHA') { - appendName = 'staging'; + appendName = 'prod'; } else { throw new Error('⚠️ Provide proper REACT_APP_DEPLOY_ENV in .env ⚠️'); } @@ -29,4 +29,5 @@ const abis = require('./config-general').abis; const appConfig = { ...dynamicConfig, ...generalConfig }; // export it out -export { appConfig, addresses, abis, CHAIN_DETAILS }; +export { CHAIN_DETAILS, abis, addresses, appConfig }; + diff --git a/src/segments/ChannelProfile.tsx b/src/segments/ChannelProfile.tsx index 4012d896b1..8c81bf5fa0 100644 --- a/src/segments/ChannelProfile.tsx +++ b/src/segments/ChannelProfile.tsx @@ -15,13 +15,13 @@ import LoaderSpinner, { LOADER_TYPE } from 'components/reusables/loaders/LoaderS // Internal Configs import { latest } from "@pushprotocol/restapi/src/lib/chat"; +import ViewChannelItem from "components/ViewChannelItem"; +import ChannelProfileComponent from "components/channel/ChannelProfileComponent"; import { ItemVV2, SpanV2 } from "components/reusables/SharedStylingV2"; import { appConfig } from "config"; import APP_PATHS from "config/AppPaths"; import { device } from "config/Globals"; -import ChannelProfileComponent from "components/channel/ChannelProfileComponent"; import ChannelsDataStore from "singletons/ChannelsDataStore"; -import ViewChannelItem from "components/ViewChannelItem"; @@ -41,6 +41,8 @@ const ChannelProfile = ({ channelID, loadTeaser, playTeaser, minimal, profileTyp // loading const [loading, setLoading] = useState(true); + const [loadingNotifs, setLoadingNotifs] = useState(true); + const [notifications, setNotifications] = useState([]); const [channelDetails, setChannelDetails] = useState(null); // Setup navigation @@ -72,7 +74,7 @@ const ChannelProfile = ({ channelID, loadTeaser, playTeaser, minimal, profileTyp limit: NOTIFICATIONS_PER_PAGE, }).then((response) => { setNotifications(response.feeds); - setLoading(false); + setLoadingNotifs(false); // ENABLE PAGINATION HERE }).catch((err) => { @@ -81,7 +83,7 @@ const ChannelProfile = ({ channelID, loadTeaser, playTeaser, minimal, profileTyp }; return () => { setNotifications([]); - setLoading(true); + setLoadingNotifs(true); } }, [channelID]); @@ -119,7 +121,7 @@ const ChannelProfile = ({ channelID, loadTeaser, playTeaser, minimal, profileTyp } - {!loading && + - } + - {loading && + {loadingNotifs && Date: Fri, 8 Mar 2024 22:18:40 +0400 Subject: [PATCH 18/23] mobile and desktop settings --- src/components/ViewChannelItem.js | 2 +- src/segments/ChannelProfile.tsx | 20 +++++++++++++++----- src/segments/ViewChannels.tsx | 4 ++++ 3 files changed, 20 insertions(+), 6 deletions(-) diff --git a/src/components/ViewChannelItem.js b/src/components/ViewChannelItem.js index 5e3637af52..98fc951af4 100644 --- a/src/components/ViewChannelItem.js +++ b/src/components/ViewChannelItem.js @@ -1020,7 +1020,7 @@ const ColumnFlex = styled(FlexBox)` const Container = styled.div` // flex: 1; display: flex; - flex-wrap: wrap; + flex-wrap: nowrap; border: ${(props) => props.profileType == 'Profile' ? 'none' : `1px solid ${(props) => props.minimal ? 'transparent' : props.theme.default.border}`}; border-bottom: none; border-left: none; diff --git a/src/segments/ChannelProfile.tsx b/src/segments/ChannelProfile.tsx index 8c81bf5fa0..e7c9101a34 100644 --- a/src/segments/ChannelProfile.tsx +++ b/src/segments/ChannelProfile.tsx @@ -94,7 +94,7 @@ const ChannelProfile = ({ channelID, loadTeaser, playTeaser, minimal, profileTyp {/* New Channel Profile Component */} - {/* {!loading && channelDetails && } */} - {channelDetails && !loading && } - + {/* Show Latest Notifications of the Channel */} Recent Notifications + + Showing preview of the latest non-encrypted notifications sent by the channel. + + {loadingNotifs && @@ -174,6 +176,10 @@ const Container = styled.div` justify-content: center; font-weight: 200; margin: 20px 0px 0px 20px; + + @media (max-width: 768px) { + margin: 20px 10px 0px 10px; + } `; const NotifsOuter = styled.div` @@ -202,7 +208,7 @@ const ScrollItem = styled(ItemVV2)` } @media (max-width: 768px) { - padding: 0px; + padding: 0px 20px; &::-webkit-scrollbar-track { background-color: none; @@ -236,5 +242,9 @@ const TextContainer = styled(ItemVV2)` margin:7px 20px 24px 5px; ` +const Notice = styled(SpanV2)` + font-size: 0.8em; +` + // Export Default export default ChannelProfile; \ No newline at end of file diff --git a/src/segments/ViewChannels.tsx b/src/segments/ViewChannels.tsx index 9aed7fed87..f8abef5a22 100644 --- a/src/segments/ViewChannels.tsx +++ b/src/segments/ViewChannels.tsx @@ -406,6 +406,10 @@ const Container = styled.div` align-items: center; justify-content: center; max-height: 100vh; + + @media (max-width: 768px) { + display: ${props => props.minimal ? 'none' : 'flex'}; + } `; const ContainerInfo = styled.div` From 221c1e382f85f8d34d80ea121447e49ee22b0cef Mon Sep 17 00:00:00 2001 From: harshrajat Date: Fri, 8 Mar 2024 22:56:43 +0400 Subject: [PATCH 19/23] Updated package --- package.json | 2 +- yarn.lock | 11 ++++++----- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 363ea54570..aa30cae319 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,7 @@ "@mui/material": "^5.5.0", "@pushprotocol/restapi": "1.6.11", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "0.0.1-alpha.41", + "@pushprotocol/uiweb": "1.2.6", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/yarn.lock b/yarn.lock index 3edad5851f..9de2b45714 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5407,7 +5407,7 @@ __metadata: "@mui/material": ^5.5.0 "@pushprotocol/restapi": 1.6.11 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 0.0.1-alpha.41 + "@pushprotocol/uiweb": 1.2.6 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5647,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:0.0.1-alpha.41": - version: 0.0.1-alpha.41 - resolution: "@pushprotocol/uiweb@npm:0.0.1-alpha.41" +"@pushprotocol/uiweb@npm:1.2.6": + version: 1.2.6 + resolution: "@pushprotocol/uiweb@npm:1.2.6" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5681,7 +5681,8 @@ __metadata: axios: ^0.27.2 react: ">=16.8.0" styled-components: ^6.0.8 - checksum: bbd07715409e0d22b17f825124202772f65169bbeec4c4b05cc4e5b9020e129957f78b3031549ec5c638046247375fecd8b3653c1dbc039363293763b4d7ba51 + viem: ^1.3.0 + checksum: 90a4271ccb770a72a5b388a2691684eafba79da0c722f3d86f24cf93cd073be091b405af17eb1f4477bd97d0366d23d60dbe7aef11fa29c1abb41f4c28707ed1 languageName: node linkType: hard From d9ac939c30852131470cd4b8437bce5aae52b019 Mon Sep 17 00:00:00 2001 From: harshrajat Date: Fri, 8 Mar 2024 23:13:21 +0400 Subject: [PATCH 20/23] Updated package json --- package.json | 4 ++-- yarn.lock | 20 ++++++++++---------- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index aa30cae319..092eb4f937 100644 --- a/package.json +++ b/package.json @@ -33,9 +33,9 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "1.6.11", + "@pushprotocol/restapi": "0.0.1-alpha.73", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "1.2.6", + "@pushprotocol/uiweb": "1.3.1-alpha.6", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/yarn.lock b/yarn.lock index 9de2b45714..f3d00f511d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5405,9 +5405,9 @@ __metadata: "@mui/icons-material": ^5.8.4 "@mui/lab": ^5.0.0-alpha.72 "@mui/material": ^5.5.0 - "@pushprotocol/restapi": 1.6.11 + "@pushprotocol/restapi": 0.0.1-alpha.73 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 1.2.6 + "@pushprotocol/uiweb": 1.3.1-alpha.6 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5594,9 +5594,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/restapi@npm:1.6.11": - version: 1.6.11 - resolution: "@pushprotocol/restapi@npm:1.6.11" +"@pushprotocol/restapi@npm:0.0.1-alpha.73": + version: 0.0.1-alpha.73 + resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.73" dependencies: "@metamask/eth-sig-util": ^5.0.2 axios: ^0.27.2 @@ -5619,7 +5619,7 @@ __metadata: peerDependenciesMeta: ethers: optional: true - checksum: 6de2c2703e252d0c255146a13b51982cc29d99212876ef4cd6320fb58bc8363af0d53713dca016f6ca4b17f8bd6c221ac6cd1730298d3287cfabd664c675f640 + checksum: 9013dd092976461a80caeb502e6ae6fe53986b9d477b0f96a4d9f322a99acd05eb6729994740b11ad3fc1e492725536793db53da4218e2b16f0da87f316d187f languageName: node linkType: hard @@ -5647,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:1.2.6": - version: 1.2.6 - resolution: "@pushprotocol/uiweb@npm:1.2.6" +"@pushprotocol/uiweb@npm:1.3.1-alpha.6": + version: 1.3.1-alpha.6 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.6" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5682,7 +5682,7 @@ __metadata: react: ">=16.8.0" styled-components: ^6.0.8 viem: ^1.3.0 - checksum: 90a4271ccb770a72a5b388a2691684eafba79da0c722f3d86f24cf93cd073be091b405af17eb1f4477bd97d0366d23d60dbe7aef11fa29c1abb41f4c28707ed1 + checksum: b931b0e27ef2d209d46d19c651de538a0843f914509a53f7bdbb69e71156406287d2c1561c037f4762523e48bf3d2704e0c2a273b9b0736dcf4ab203f19894d4 languageName: node linkType: hard From 7131f5b71493a7d526c49a5fc726139f2e62a829 Mon Sep 17 00:00:00 2001 From: harshrajat Date: Sat, 9 Mar 2024 04:36:45 +0400 Subject: [PATCH 21/23] Updated package to make chat and profile page work --- package.json | 4 ++-- public/index.html | 2 +- src/components/PushSnap/EnableSnoozeModal.tsx | 6 +++--- src/structure/MasterInterfacePage.tsx | 4 +--- yarn.lock | 20 +++++++++---------- 5 files changed, 17 insertions(+), 19 deletions(-) diff --git a/package.json b/package.json index 75a2f612f0..531dbc0fcf 100644 --- a/package.json +++ b/package.json @@ -33,9 +33,9 @@ "@mui/icons-material": "^5.8.4", "@mui/lab": "^5.0.0-alpha.72", "@mui/material": "^5.5.0", - "@pushprotocol/restapi": "0.0.1-alpha.71", + "@pushprotocol/restapi": "1.6.12-alpha.1", "@pushprotocol/socket": "0.5.3", - "@pushprotocol/uiweb": "1.3.1-alpha.6", + "@pushprotocol/uiweb": "1.3.1-alpha.8", "@reduxjs/toolkit": "^1.7.1", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/public/index.html b/public/index.html index 0c5ff95b89..3ff8d6d661 100644 --- a/public/index.html +++ b/public/index.html @@ -14,7 +14,7 @@ - + diff --git a/src/components/PushSnap/EnableSnoozeModal.tsx b/src/components/PushSnap/EnableSnoozeModal.tsx index bbd77af532..76923ffba9 100644 --- a/src/components/PushSnap/EnableSnoozeModal.tsx +++ b/src/components/PushSnap/EnableSnoozeModal.tsx @@ -5,14 +5,14 @@ import React, { useState } from 'react'; import styled, { useTheme } from 'styled-components'; // Internal Compoonents -import { ItemHV2, ItemVV2, ButtonV2 } from 'components/reusables/SharedStylingV2'; +import { ButtonV2, ItemHV2, ItemVV2 } from 'components/reusables/SharedStylingV2'; // Internal Configs +import { defaultSnapOrigin } from 'config'; import { device } from 'config/Globals'; import { AppContext } from 'contexts/AppContext'; -import { SnoozeDurationType } from 'types'; import { updateSnoozeDuration } from 'helpers'; -import { defaultSnapOrigin } from 'config'; +import { SnoozeDurationType } from 'types'; const EnableSnoozeModal = ({ setSnoozeDuration diff --git a/src/structure/MasterInterfacePage.tsx b/src/structure/MasterInterfacePage.tsx index 9397ba9ba3..1883d9f9d1 100644 --- a/src/structure/MasterInterfacePage.tsx +++ b/src/structure/MasterInterfacePage.tsx @@ -3,15 +3,13 @@ import React, { lazy, Suspense } from 'react'; // External Packages import useToast from 'hooks/useToast'; -import { MdError, MdError, MdWarning } from 'react-icons/md'; +import { MdError, MdWarning } from 'react-icons/md'; import { VscClose } from 'react-icons/vsc'; import { Navigate, redirect, Route, Routes, useLocation, useNavigate, useSearchParams } from 'react-router-dom'; import { ToastContainer } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.min.css'; import styled from 'styled-components'; -import useToast from 'hooks/useToast'; - // Internal Components import LoaderSpinner, { LOADER_OVERLAY, LOADER_TYPE, PROGRESS_POSITIONING } from 'components/reusables/loaders/LoaderSpinner'; import ConnectedWalletRoute from '../components/ConnectedWalletRoute'; diff --git a/yarn.lock b/yarn.lock index fec4edc6f2..d7019140e3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5405,9 +5405,9 @@ __metadata: "@mui/icons-material": ^5.8.4 "@mui/lab": ^5.0.0-alpha.72 "@mui/material": ^5.5.0 - "@pushprotocol/restapi": 0.0.1-alpha.71 + "@pushprotocol/restapi": 1.6.12-alpha.1 "@pushprotocol/socket": 0.5.3 - "@pushprotocol/uiweb": 1.3.1-alpha.6 + "@pushprotocol/uiweb": 1.3.1-alpha.8 "@reduxjs/toolkit": ^1.7.1 "@testing-library/dom": ^6.12.2 "@testing-library/jest-dom": ^4.2.4 @@ -5594,9 +5594,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/restapi@npm:0.0.1-alpha.71": - version: 0.0.1-alpha.71 - resolution: "@pushprotocol/restapi@npm:0.0.1-alpha.71" +"@pushprotocol/restapi@npm:1.6.12-alpha.1": + version: 1.6.12-alpha.1 + resolution: "@pushprotocol/restapi@npm:1.6.12-alpha.1" dependencies: "@metamask/eth-sig-util": ^5.0.2 axios: ^0.27.2 @@ -5619,7 +5619,7 @@ __metadata: peerDependenciesMeta: ethers: optional: true - checksum: f54952b8d5eeb6bfad61af52b5d25a5989e9075d3640800cd3042f56c411659ee3add38d673df1497479d3a7fb7500db7789fa9b4e696a0544b556345cd950f7 + checksum: 0ea3c7199091682a33dbed717946de1a4394c3e3e3b62af5fcae211ec80df2f097a420966f7e940058dac4b24cb02e5c0b7615be22aaaa24ed62d8da9c5fb432 languageName: node linkType: hard @@ -5647,9 +5647,9 @@ __metadata: languageName: node linkType: hard -"@pushprotocol/uiweb@npm:1.3.1-alpha.6": - version: 1.3.1-alpha.6 - resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.6" +"@pushprotocol/uiweb@npm:1.3.1-alpha.8": + version: 1.3.1-alpha.8 + resolution: "@pushprotocol/uiweb@npm:1.3.1-alpha.8" dependencies: "@livekit/components-react": ^1.2.2 "@livekit/components-styles": ^1.0.6 @@ -5682,7 +5682,7 @@ __metadata: react: ">=16.8.0" styled-components: ^6.0.8 viem: ^1.3.0 - checksum: b931b0e27ef2d209d46d19c651de538a0843f914509a53f7bdbb69e71156406287d2c1561c037f4762523e48bf3d2704e0c2a273b9b0736dcf4ab203f19894d4 + checksum: 25cf0f2f0990ac99e598c90bd602031f1f8dd299b674d50ea32c46fe39a6939dd912d08a5040056cf5583d7fcd33c96f966827c8ca9dfd6e1f088376d24cc200 languageName: node linkType: hard From 28c6e499381fb003502de0b1395a1bbd7cf86e9d Mon Sep 17 00:00:00 2001 From: harshrajat Date: Sat, 9 Mar 2024 05:18:08 +0400 Subject: [PATCH 22/23] Added recommended chats --- .../chat/w2wChat/chatBox/ChatBox.tsx | 32 ++++++++++------ src/modules/chat/ChatModule.tsx | 37 +++++++++++++++++-- src/sections/chat/ChatBoxSection.tsx | 3 +- src/sections/chat/ChatSidebarSection.tsx | 35 +++--------------- 4 files changed, 60 insertions(+), 47 deletions(-) diff --git a/src/components/chat/w2wChat/chatBox/ChatBox.tsx b/src/components/chat/w2wChat/chatBox/ChatBox.tsx index 604c373137..74c7a9b9e0 100644 --- a/src/components/chat/w2wChat/chatBox/ChatBox.tsx +++ b/src/components/chat/w2wChat/chatBox/ChatBox.tsx @@ -13,10 +13,10 @@ import { produce } from 'immer'; import { CID } from 'ipfs-http-client'; import { BsDashLg } from 'react-icons/bs'; import { MdOutlineArrowBackIos } from 'react-icons/md'; +import { useSelector } from 'react-redux'; import ScrollToBottom from 'react-scroll-to-bottom'; import { useClickAway } from 'react-use'; import styled, { useTheme } from 'styled-components'; -import { useSelector } from 'react-redux'; // Internal Components import { ReactComponent as Info } from 'assets/chat/group-chat/info.svg'; @@ -61,10 +61,11 @@ const Alert = React.forwardRef(function Alert(props, ); }); -const ChatBox = ({ showGroupInfoModal }): JSX.Element => { +const ChatBox = ({ showGroupInfoModal, triggerChatParticipant }): JSX.Element => { const { currentChat, viewChatBox, receivedIntents, activeTab, setViewChatBox, setChat, selectedChatId }: ContextType = useContext(Context); const { web3NameList }: AppContextType = useContext(AppContext); + const { setSelectedChatId } = useContext(Context); const { userPushSDKInstance } = useSelector((state: any) => { return state.user; @@ -213,13 +214,17 @@ const ChatBox = ({ showGroupInfoModal }): JSX.Element => { - setChat(chatId, chatParticipant)} /> - {InfoMessages.map((item) => ( - - - {item.content} - - ))} + setSelectedChatId(await triggerChatParticipant(chatParticipant, chatId))} /> + + + {InfoMessages.map((item) => ( + + + {item.content} + + ))} + + @@ -408,6 +413,11 @@ const Container = styled(Content)` position: relative; `; +const WelcomePoints = styled(ItemVV2)` + margin: 20px 0px 0px 0px; + gap: 10px; +` + const WelcomeItem = styled(ItemVV2)` width: 420px; min-width: 300px; @@ -424,12 +434,11 @@ const WelcomeItem = styled(ItemVV2)` `; const WelcomeContent = styled.div` - width: 304px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; - margin: 10px auto; + .icon { transform: rotate(-60deg); color: #d53893; @@ -462,7 +471,6 @@ const TextInfo = styled.div` font-size: 15px; line-height: 130%; color: ${(props) => props.theme.default.secondaryColor}; - width: 274px; `; const WelcomeMainText = styled(SpanV2)` diff --git a/src/modules/chat/ChatModule.tsx b/src/modules/chat/ChatModule.tsx index 920fca1071..17ac1ec352 100644 --- a/src/modules/chat/ChatModule.tsx +++ b/src/modules/chat/ChatModule.tsx @@ -8,14 +8,13 @@ import * as PushAPI from '@pushprotocol/restapi'; import ReactGA from 'react-ga'; import { QueryClient, QueryClientProvider } from 'react-query'; import { ReactQueryDevtools } from 'react-query/devtools'; +import { useSelector } from 'react-redux'; import { ToastOptions } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.css'; import { useClickAway } from 'react-use'; import styled, { useTheme } from 'styled-components'; -import { useSelector } from 'react-redux'; // Internal Compoonents -import { AppContext } from 'contexts/AppContext'; import ChatQR from 'components/chat/w2wChat/chatQR/chatQR'; import MobileView from 'components/chat/w2wChat/chatQR/mobileView'; import { CreateGroupModalContent } from 'components/chat/w2wChat/groupChat/createGroup/CreateGroupModalContent'; @@ -27,10 +26,12 @@ import LoaderSpinner, { LOADER_TYPE, PROGRESS_POSITIONING, } from 'components/reusables/loaders/LoaderSpinner'; +import { AppContext } from 'contexts/AppContext'; import { VideoCallContext } from 'contexts/VideoCallContext'; import { caip10ToWallet } from 'helpers/w2w'; import * as w2wHelper from 'helpers/w2w/'; import { checkIfGroup, rearrangeMembers } from 'helpers/w2w/groupChat'; +import { checkIfIntent, getUpdatedChatAndIntent, getUpdatedGroupInfo } from 'helpers/w2w/user'; import { useAccount, useDeviceWidthCheck, useSDKSocket } from 'hooks'; import useModalBlur, { MODAL_POSITION } from 'hooks/useModalBlur'; import useToast from 'hooks/useToast'; @@ -38,7 +39,6 @@ import ChatBoxSection from 'sections/chat/ChatBoxSection'; import ChatSidebarSection from 'sections/chat/ChatSidebarSection'; import VideoCallSection from 'sections/video/VideoCallSection'; import { ChatUserAppContext, Feeds, MessageIPFS, MessageIPFSWithCID, User, VideoCallInfoI } from 'types/chat'; -import { checkIfIntent, getUpdatedChatAndIntent, getUpdatedGroupInfo } from 'helpers/w2w/user'; // Internal Configs import { ChatUIProvider, darkChatTheme } from '@pushprotocol/uiweb'; @@ -104,6 +104,31 @@ function Chat({ chatid }) { const socketData = useSDKSocket({ account, chainId, env: appConfig.appEnv, socketType: 'chat' }); + // trigger chat participant open + const triggerChatParticipant = async (chatParticipant: string, chatId: string) => { + let formattedChatParticipant = chatParticipant; + let userPushInstance = userPushSDKInstance; + + if (!formattedChatParticipant.includes('.')) { + if (!await ethers.utils.isAddress(caip10ToWallet(formattedChatParticipant))) + formattedChatParticipant = chatId; + } + let formattedchatId = reformatChatId(formattedChatParticipant); + + //If no PGP keys then connect the wallet. + if (!userPushInstance.decryptedPgpPvtKey) { + userPushInstance = await handleConnectWallet(); + + if (userPushInstance && userPushInstance.decryptedPgpPvtKey) { + navigate(`/chat/${formattedchatId}`); + return formattedChatParticipant; + } + }else{ + navigate(`/chat/${formattedchatId}`); + return formattedChatParticipant; + } + } + useEffect(() => { if ( connectedUser && @@ -442,13 +467,17 @@ function Chat({ chatid }) { - + { +const ChatBoxSection = ({ showGroupInfoModal, triggerChatParticipant }) => { // RENDER return ( ); diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx index 809204476c..6d2ee7a56e 100644 --- a/src/sections/chat/ChatSidebarSection.tsx +++ b/src/sections/chat/ChatSidebarSection.tsx @@ -65,7 +65,7 @@ type loadingData = { loading: boolean, preload: boolean, paging: boolean, finish // Chat Sections // Divided into two, left and right -const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { +const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch, triggerChatParticipant }) => { // theme context const theme = useTheme(); const { wallet } = useAccount(); @@ -101,31 +101,6 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { let navigate = useNavigate(); - const formatChatParticipant = async (chatParticipant: string, chatId: string) => { - let formattedChatParticipant = chatParticipant; - let userPushInstance = userPushSDKInstance; - - if (!formattedChatParticipant.includes('.')) { - if (!await ethers.utils.isAddress(caip10ToWallet(formattedChatParticipant))) - formattedChatParticipant = chatId; - } - let formattedchatId = reformatChatId(formattedChatParticipant); - - //If no PGP keys then connect the wallet. - if (!userPushInstance.decryptedPgpPvtKey) { - userPushInstance = await handleConnectWallet(); - - if (userPushInstance && userPushInstance.decryptedPgpPvtKey) { - navigate(`/chat/${formattedchatId}`); - return formattedChatParticipant; - } - }else{ - navigate(`/chat/${formattedchatId}`); - return formattedChatParticipant; - } - - } - const handleCreateGroup = async () => { if (userPushSDKInstance.decryptedPgpPvtKey) { showCreateGroupModal(); @@ -289,7 +264,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { {showRecommended && { console.log(chatParticipant); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} + onChatSelected={async (chatid, chatParticipant) => { setSelectedChatId(await triggerChatParticipant(chatParticipant, chatid)) }} /> } @@ -297,7 +272,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { {!showRecommended && { console.log(chatParticipant, chatid); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} + onChatSelected={async (chatid, chatParticipant) => { setSelectedChatId(await triggerChatParticipant(chatParticipant, chatid)) }} onUnreadCountChange={(count) => { // console.log('Count is: ', count); @@ -321,7 +296,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { > { console.log(chatParticipant); setSelectedChatId(await formatChatParticipant(chatParticipant, chatid)) }} + onChatSelected={async (chatid, chatParticipant) => { setSelectedChatId(await triggerChatParticipant(chatParticipant, chatid)) }} onUnreadCountChange={(count) => { // console.log('Count is: ', count); }} @@ -357,7 +332,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => { setSelectedChatId(await formatChatParticipant(chatParticipant, chatid))} + onChatSelected={async (chatid, chatParticipant) => setSelectedChatId(await triggerChatParticipant(chatParticipant, chatid))} onUnreadCountChange={(count) => { // console.log('Count is: ', count); }} From 3ab91bf5d2fb6f5981309a66234026c60890cc8e Mon Sep 17 00:00:00 2001 From: harshrajat Date: Sat, 9 Mar 2024 05:22:25 +0400 Subject: [PATCH 23/23] Added recommended chat flow --- .../chat/w2wChat/chatBox/ChatBox.tsx | 1 + src/config/RecommendedChatsList.js | 28 +++++++++---------- 2 files changed, 15 insertions(+), 14 deletions(-) diff --git a/src/components/chat/w2wChat/chatBox/ChatBox.tsx b/src/components/chat/w2wChat/chatBox/ChatBox.tsx index 74c7a9b9e0..5d736b0b93 100644 --- a/src/components/chat/w2wChat/chatBox/ChatBox.tsx +++ b/src/components/chat/w2wChat/chatBox/ChatBox.tsx @@ -438,6 +438,7 @@ const WelcomeContent = styled.div` flex-direction: row; justify-content: space-between; align-items: center; + align-self: flex-start; .icon { transform: rotate(-60deg); diff --git a/src/config/RecommendedChatsList.js b/src/config/RecommendedChatsList.js index 35a392dd02..243dfd9f87 100644 --- a/src/config/RecommendedChatsList.js +++ b/src/config/RecommendedChatsList.js @@ -27,20 +27,20 @@ const RecommendedChatLists = [ } } }, - { - "chatParticipantAlias": "eip155:0x99A08ac6254dcf7ccc37CeC662aeba8eFA666666", - "payload": { - "chatId": "4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68", - "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAxElEQVR4AcXBsU1DUQyG0S/WW4EGMQETMIRX8BxpXFpCLMACXuGOlC5DhNZKcaUnBP85l8+P7wcntBc7sZIzDDFDzBA7eNJeTLGSKVZyRnsxxUomQ8wQM8SO9uI/tReTIWaIGWJHrGRqL6b2Yrq/fbHzcruyEyuZDDFDzBA7eBIr2Wm/shMrOcMQM8QMsaO9mGIlf6m9mAwxQ8wQO2IlU3vxG+3FTqxkMsQMMUPs8l6vDzZiJVN7sRMrmdqLHUPMEDPEfgBK0S/MKDp40gAAAABJRU5ErkJggg==", - "chatParticipant": "eip155:0xf8250D363BD1F25f52F10C21188fe82c68C049c4", - "chatGroup": true, - "chatTimestamp": null, - "chatMsg": { - "messageType": "Text", - "messageContent": "Hi! Stay tuned, while BRB IRL dev tour has wrapped up, We still have BRB Online with challenges from global projects that still needs to be solved: https://push.org/brb" - } - } - } + // { + // "chatParticipantAlias": "eip155:0x99A08ac6254dcf7ccc37CeC662aeba8eFA666666", + // "payload": { + // "chatId": "4ac5ab85c9c3d57adbdf2dba79357e56b2f9ef0256befe750d9f93af78d2ca68", + // "chatPic": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAxElEQVR4AcXBsU1DUQyG0S/WW4EGMQETMIRX8BxpXFpCLMACXuGOlC5DhNZKcaUnBP85l8+P7wcntBc7sZIzDDFDzBA7eNJeTLGSKVZyRnsxxUomQ8wQM8SO9uI/tReTIWaIGWJHrGRqL6b2Yrq/fbHzcruyEyuZDDFDzBA7eBIr2Wm/shMrOcMQM8QMsaO9mGIlf6m9mAwxQ8wQO2IlU3vxG+3FTqxkMsQMMUPs8l6vDzZiJVN7sRMrmdqLHUPMEDPEfgBK0S/MKDp40gAAAABJRU5ErkJggg==", + // "chatParticipant": "eip155:0xf8250D363BD1F25f52F10C21188fe82c68C049c4", + // "chatGroup": true, + // "chatTimestamp": null, + // "chatMsg": { + // "messageType": "Text", + // "messageContent": "Hi! Stay tuned, while BRB IRL dev tour has wrapped up, We still have BRB Online with challenges from global projects that still needs to be solved: https://push.org/brb" + // } + // } + // } ] export default RecommendedChatLists; \ No newline at end of file