Merge pull request #1443 from ethereum-push-notification-service/Fix-…

…PushChat-issues-with-guest-and-read-mode

Fix push chat issues with guest and read mode

.env.sample

@@ -9,14 +9,14 @@ 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"
 # REACT_APP_IPFS_INFURA_API_SECRET="your_secret_infura_api_secret_for_localhost"
 
 # ESLINT_NO_DEV_ERRORS=true
 TSC_COMPILE_ON_ERROR=true
-DISABLE_ESLINT_PLUGIN=true
+# DISABLE_ESLINT_PLUGIN=true
 GENERATE_SOURCEMAP=false
 # EXTEND_ESLINT=true

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;

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",

public/index-alpha.html

@@ -14,6 +14,10 @@
     <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#cf1c84" />
     <meta name="msapplication-TileColor" content="#9f00a7" />
     <meta name="theme-color" content="#ffffff" />
+
+    <!-- Content Security Policy (CSP) to help add a layer of protection against Cross-Site Scripting (XSS), clickjacking, and other code injection attacks -->
+    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; object-src 'none'; frame-src 'none'; base-uri 'none';" /> -->
+
     <!-- <script type="text/javascript" src="https://app.olvy.co/script.js" defer="defer"></script> -->
     <!--
       manifest.json provides metadata used when your web app is installed on a

public/index-dev.html

@@ -14,6 +14,10 @@
     <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#cf1c84" />
     <meta name="msapplication-TileColor" content="#9f00a7" />
     <meta name="theme-color" content="#ffffff" />
+
+    <!-- Content Security Policy (CSP) to help add a layer of protection against Cross-Site Scripting (XSS), clickjacking, and other code injection attacks -->
+    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; object-src 'none'; frame-src 'none'; base-uri 'none';" /> -->
+
     <!-- <script type="text/javascript" src="https://app.olvy.co/script.js" defer="defer"></script> -->
     <!--
       manifest.json provides metadata used when your web app is installed on a

public/index-prod.html

@@ -14,6 +14,10 @@
     <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#cf1c84" />
     <meta name="msapplication-TileColor" content="#9f00a7" />
     <meta name="theme-color" content="#ffffff" />
+
+    <!-- Content Security Policy (CSP) to help add a layer of protection against Cross-Site Scripting (XSS), clickjacking, and other code injection attacks -->
+    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; object-src 'none'; frame-src 'none'; base-uri 'none';" /> -->
+
     <!-- <script type="text/javascript" src="https://app.olvy.co/script.js" defer="defer"></script> -->
     <!--
       manifest.json provides metadata used when your web app is installed on a

public/index-staging.html

@@ -14,6 +14,10 @@
     <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#cf1c84" />
     <meta name="msapplication-TileColor" content="#9f00a7" />
     <meta name="theme-color" content="#ffffff" />
+
+    <!-- Content Security Policy (CSP) to help add a layer of protection against Cross-Site Scripting (XSS), clickjacking, and other code injection attacks -->
+    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; object-src 'none'; frame-src 'none'; base-uri 'none';" /> -->
+
     <!-- <script type="text/javascript" src="https://app.olvy.co/script.js" defer="defer"></script> -->
     <!--
       manifest.json provides metadata used when your web app is installed on a

public/index-w2w.html

@@ -14,6 +14,10 @@
     <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#cf1c84" />
     <meta name="msapplication-TileColor" content="#9f00a7" />
     <meta name="theme-color" content="#ffffff" />
+
+    <!-- Content Security Policy (CSP) to help add a layer of protection against Cross-Site Scripting (XSS), clickjacking, and other code injection attacks -->
+    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; object-src 'none'; frame-src 'none'; base-uri 'none';" /> -->
+
     <!-- <script type="text/javascript" src="https://app.olvy.co/script.js" defer="defer"></script> -->
     <!--
       manifest.json provides metadata used when your web app is installed on a

public/index.html

@@ -14,10 +14,10 @@
     <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#cf1c84" />
     <meta name="msapplication-TileColor" content="#9f00a7" />
     <meta name="theme-color" content="#ffffff" />
-
+        
     <!-- Content Security Policy (CSP) to help add a layer of protection against Cross-Site Scripting (XSS), clickjacking, and other code injection attacks -->
     <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; object-src 'none'; frame-src 'none'; base-uri 'none';" /> -->
-    
+
     <!-- <script type="text/javascript" src="https://app.olvy.co/script.js" defer="defer"></script> -->
     <!--
       manifest.json provides metadata used when your web app is installed on a
@@ -33,23 +33,23 @@
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
     <!-- HTML Meta Tags -->
-    <title>Push App (Previously EPNS) | Communication Protocol of Web3</title>
-    <meta name="description" content="Push App (Previously EPNS) | Communication Protocol of Web3">
+    <title>Push Alpha App (Previously EPNS) | Communication Protocol of Web3</title>
+    <meta name="description" content="Push Alpha App (Previously EPNS) | Communication Protocol of Web3">
 
     <!-- Facebook Meta Tags -->
-    <meta property="og:url" content="https://app.push.org">
+    <meta property="og:url" content="https://alpha.push.org">
     <meta property="og:type" content="website">
-    <meta property="og:title" content="Push App (Previously EPNS)">
-    <meta property="og:description" content="Push App (Previously EPNS) | Communication Protocol of Web3">
-    <meta property="og:image" content="https://app.push.org/previews/homepage.jpg">
+    <meta property="og:title" content="Push Alpha App (Previously EPNS)">
+    <meta property="og:description" content="Push Alpha App (Previously EPNS) | Communication Protocol of Web3">
+    <meta property="og:image" content="https://alpha.push.org/previews/homepage-alpha.jpg">
 
     <!-- Twitter Meta Tags -->
     <meta name="twitter:card" content="summary_large_image">
-    <meta property="twitter:domain" content="app.push.org">
-    <meta property="twitter:url" content="https://app.push.org">
-    <meta name="twitter:title" content="Push App (Previously EPNS)">
-    <meta name="twitter:description" content="Push App (Previously EPNS) | Communication Protocol of Web3">
-    <meta name="twitter:image" content="https://app.push.org/previews/homepagetwitter.jpg">
+    <meta property="twitter:domain" content="alpha.push.org">
+    <meta property="twitter:url" content="https://alpha.push.org">
+    <meta name="twitter:title" content="Push Alpha App (Previously EPNS)">
+    <meta name="twitter:description" content="Push Alpha App (Previously EPNS) | Communication Protocol of Web3">
+    <meta name="twitter:image" content="https://alpha.push.org/previews/homepagetwitter-alpha.jpg">
 
     <!-- Meta Tags Generated via https://www.opengraph.xyz -->
 
@@ -80,12 +80,10 @@
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div>
-      <div id="root"></div>
-      <div id="portal"></div>
-      <div id="onboard-container"></div>
-    </div>
-      <!--
+    <div id="root"></div>
+    <div id="portal"></div>
+    <div id="onboard-container"></div>
+    <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.
       You can add webfonts, meta tags, or analytics to this file.
@@ -94,4 +92,4 @@
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
   </body>
-</html>
+</html>

public/robots.txt

@@ -1,3 +1,3 @@
 # https://www.robotstxt.org/robotstxt.html
 User-agent: *
-Sitemap: https://app.push.org/sitemap.txt
+Sitemap: https://alpha.push.org/sitemap.txt

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
+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

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();

src/components/Dropdown.tsx

@@ -28,11 +28,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);
@@ -59,6 +60,7 @@ function Dropdown({ dropdownValues, textColor, iconFilter, hoverBGColor }: Dropd
       document.body.removeChild(el);
     }
   };
+
   return (
     <>
       {dropdownValues.map((dropdownValue) =>
@@ -71,7 +73,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()
+            }}
           >
             <Span
               margin="11px 22px 11px 2px"

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<HTMLDivElement>; // Optional based on conditional use
+  onMouseEnter?: React.MouseEventHandler<HTMLDivElement>; // Optional based on conditional use
+  onMouseLeave?: React.MouseEventHandler<HTMLDivElement>; // 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 (

src/components/ProfileModal.tsx

@@ -91,7 +91,11 @@ const ProfileModal = ({ showDropdown, setShowDropdown, dropdownValues })=>{
                 size="16px"
                 cursor="pointer"
                 width="max-content"
-                onClick={() => dropdownValue?.function()}
+                onClick={() => {
+                setShowDropdown(false);
+                  dropdownValue?.function()
+
+                }}
               >
                 {dropdownValue.title}
               </Span>

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