Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Snaps Issues resolved #1272

Merged
merged 2 commits into from
Oct 16, 2023
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 14 additions & 8 deletions src/components/MetamaskSnap/InstallMetamaskSnapModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
import React, { useEffect } from 'react';

// External Packages
import styled,{useTheme} from 'styled-components';
import styled, { useTheme } from 'styled-components';

// Internal Compoonents
import { A } from 'primaries/SharedStyling';
Expand All @@ -14,6 +14,7 @@ import AppStoreQRCode from 'assets/PushSnaps/AppStoreQRCode.svg';
import PlayStoreQRCode from 'assets/PushSnaps/PlayStoreQRCode.svg';
import AppleIcon from 'assets/PushSnaps/AppleIcon.svg';
import PlayStore from 'assets/PushSnaps/PlayStore.svg';
import { useNavigate } from 'react-router-dom';


const InstallMetamaskSnapModal = ({
Expand All @@ -40,6 +41,8 @@ const InstallMetamaskSnapModal = ({
)
}

const navigate = useNavigate();

return (
<ItemVV2 margin='30px 0 20px 0' gap='14px'>
<SnapContainer>
Expand All @@ -58,8 +61,11 @@ const InstallMetamaskSnapModal = ({
</SnapInner>
{
configure ? (
<InstallButton onClick={() => setSnapState(3)}>
Settings
<InstallButton onClick={() => {
setSnapState(3)
navigate('/snap')
}}>
Configure
</InstallButton>
) : (
<InstallButton onClick={() => setSnapState(2)}>
Expand Down Expand Up @@ -154,9 +160,9 @@ export default InstallMetamaskSnapModal;
const SnapContainer = styled(ItemHV2)`
border-radius: 14px;
padding:7px 14px;
background:${(props)=>props.theme.snapUIBackground};
background:${(props) => props.theme.snapUIBackground};
justify-content:space-between;
border: 1px solid ${(props)=>props.theme.default.border};
border: 1px solid ${(props) => props.theme.default.border};
`

const SnapInner = styled.div`
Expand Down Expand Up @@ -191,8 +197,8 @@ const InstallButton = styled(Button)`
const QRCodeContainer = styled(ItemVV2)`
border-radius: 14px;
padding:7px 14px;
background:${(props)=>props.theme.snapUIBackground};
border: 1px solid ${(props)=>props.theme.default.border};
background:${(props) => props.theme.snapUIBackground};
border: 1px solid ${(props) => props.theme.default.border};
padding-bottom:15px;
gap:4px;
&:hover{
Expand All @@ -204,7 +210,7 @@ const QRCodeContainer = styled(ItemVV2)`
const DownloadContainer = styled.div`
display:flex;
border-radius: 8px;
background: ${(props)=>props.theme.snapButtonBackground};
background: ${(props) => props.theme.snapButtonBackground};
padding: 4px 11px;
gap: 8px;
height:36px;
Expand Down
2 changes: 1 addition & 1 deletion src/config/NavigationList.js
Original file line number Diff line number Diff line change
Expand Up @@ -195,7 +195,7 @@ const NavigationList = {
name: 'Receive Notifications',
title: 'Receive Notifications',
alt: 'Receive Notifications',
href: '',
href: '#receive-notifications',
hasOnClickFunction:true,
newTab: false,
isRoute: true,
Expand Down
17 changes: 14 additions & 3 deletions src/modules/receiveNotifs/MetamaskPushSnapModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,17 +14,28 @@ import SnapInformationModal from 'components/MetamaskSnap/SnapInformationModal';
import MetamaskSnapConfigureModal from 'components/MetamaskSnap/MetamaskSnapConfigureModal';
import { AppContext } from 'contexts/AppContext';
import GLOBALS, { device, globalsMargin } from "config/Globals";
import { useLocation } from 'react-router-dom';

const MetamaskPushSnapModal = ({
onClose
}) => {
const theme = useTheme();
const location = useLocation();

const [configure, setConfigure] = useState(false);

const {setSnapState,SnapState } = React.useContext(AppContext);
const { setSnapState, SnapState } = React.useContext(AppContext);

const handleCloseModal = () => {

var uri = window.location.toString();

if (uri.indexOf("#") > 0) {
var clean_uri = uri.substring(0,uri.indexOf("#"));

window.history.replaceState({},document.title, clean_uri);
}

const handleCloseModal = ()=>{
setSnapState(1);
onClose();
}
Expand All @@ -33,7 +44,7 @@ const MetamaskPushSnapModal = ({
<Container padding="20px 15px" >
<ItemHV2 justifyContent='space-between'>

{SnapState !== 1 && <Back width='24px' cursor='pointer' onClick={()=>setSnapState(1)}/>}
{SnapState !== 1 && <Back width='24px' cursor='pointer' onClick={() => setSnapState(1)} />}

{SnapState === 1 && <SpanV2
fontWeight="500"
Expand Down
44 changes: 24 additions & 20 deletions src/structure/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -100,25 +100,29 @@ function Header({ isDarkMode, darkModeToggle }) {
};

const isMobile = useDeviceWidthCheck(600);

const isSnapPage = location?.pathname === '/snap';

return (
<Container direction="row" padding="0px 15px">
<ItemH justify="flex-start" flex="0">
<RightBarContainer justify="flex-start" flex="0">
<RightBarDesktop justify="flex-start" flex="0">
<Logo src={!isDarkMode ? 'push.svg' : 'pushDark.svg'} />
<a href='/channels'>
<Logo src={!isDarkMode ? 'push.svg' : 'pushDark.svg'} />
</a>
</RightBarDesktop>

<LogoMobile justify="flex-start" flex="0">
<Logo src={!isDarkMode ? 'logo512.png' : 'logo512.png'} />
</LogoMobile>
</RightBarContainer>

{/* mobile navbar */}
{navigationSetup && showNavBar && isActive && !error && (
<NavMenuContainer ref={navRef} tabletAlign="flex-start">
<NavMenu>
<ChainIndicator isDarkMode={isDarkMode}/>
<ChainIndicator isDarkMode={isDarkMode} />
<Profile isDarkMode={isDarkMode} />

<NavMenuInner tabletAlign="flex-start">
Expand All @@ -130,13 +134,13 @@ function Header({ isDarkMode, darkModeToggle }) {
</ItemH>

<ItemH justify="flex-end">
{headerTag && isActive && !error && (
{headerTag && isActive && !error && !isSnapPage && (
<HeaderTag align="flex-start" overflow="hidden">
<Span
textTransform="capitalize"
spacing="-0.02em"
weight="normal"
padding={isMobile ? "8px 7px" : "8px 20px" }
padding={isMobile ? "8px 7px" : "8px 20px"}
className='text'
color={!isDarkMode ? headerTag.light.fg : headerTag.dark.fg}>
{headerTag.title}
Expand All @@ -155,26 +159,26 @@ function Header({ isDarkMode, darkModeToggle }) {
/>
)}

{isActive && !error && (
<RightBarMobile>
<Button
bg="transparent"
padding="5px"
radius="4px"
onClick={() => {
setShowNavBar(!showNavBar);
}}>
<AiOutlineMenu size={30} color={theme.headerIconsBg} />
</Button>
</RightBarMobile>
)}
{isActive && !error && (
<RightBarMobile>
<Button
bg="transparent"
padding="5px"
radius="4px"
onClick={() => {
setShowNavBar(!showNavBar);
}}>
<AiOutlineMenu size={30} color={theme.headerIconsBg} />
</Button>
</RightBarMobile>
)}

<ItemH justify="flex-end" flex="initial">
{!!error && <PrimaryTheme>{getErrorMessage(error)}</PrimaryTheme>}
{!isActive && !error && <ThirdTheme>Please connect to a Web3 Network</ThirdTheme>}
{isActive && !showLoginControls && !error && (
<RightBarDesktop justify="flex-end" flex="initial">
<ChainIndicator isDarkMode={isDarkMode}/>
<ChainIndicator isDarkMode={isDarkMode} />
<Profile isDarkMode={isDarkMode} />
</RightBarDesktop>
)}{' '}
Expand Down Expand Up @@ -215,7 +219,7 @@ const RightBarMobile = styled(ItemH)`
}
`;

const LogoMobile = styled(ItemH)`
const LogoMobile = styled(ItemH)`
@media (min-width: 993px) {
display: none;
}
Expand Down
11 changes: 10 additions & 1 deletion src/structure/MasterInterfacePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,14 @@ function MasterInterfacePage() {

const { MetamaskPushSnapModalComponent }:AppContextType = React.useContext(AppContext);

const { showMetamaskPushSnap } = React.useContext(AppContext);

React.useEffect(()=>{
if(location.hash == '#receive-notifications'){
showMetamaskPushSnap();
}
},[location])

// Render
return (
<Container>
Expand Down Expand Up @@ -127,10 +135,11 @@ function MasterInterfacePage() {
draggable
/>

{/* Modal displaying ReceiveNotifications */}
<MetamaskPushSnapModalComponent
id='receive-notifications'
InnerComponent={MetamaskPushSnapModal}
modalPadding='0px'
// InnerComponentProps={}
modalPosition={MODAL_POSITION.ON_ROOT}
/>

Expand Down
20 changes: 10 additions & 10 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -5345,9 +5345,9 @@ __metadata:
"@mui/lab": ^5.0.0-alpha.72
"@mui/material": ^5.5.0
"@pushprotocol/ledgerlive": latest
"@pushprotocol/restapi": 1.4.18
"@pushprotocol/restapi": 1.4.21
"@pushprotocol/socket": latest
"@pushprotocol/uiweb": 1.1.13
"@pushprotocol/uiweb": 1.1.14
"@reduxjs/toolkit": ^1.7.1
"@testing-library/dom": ^6.12.2
"@testing-library/jest-dom": ^4.2.4
Expand Down Expand Up @@ -5546,9 +5546,9 @@ __metadata:
languageName: node
linkType: hard

"@pushprotocol/restapi@npm:1.4.18":
version: 1.4.18
resolution: "@pushprotocol/restapi@npm:1.4.18"
"@pushprotocol/restapi@npm:1.4.21":
version: 1.4.21
resolution: "@pushprotocol/restapi@npm:1.4.21"
dependencies:
"@ambire/signature-validator": ^1.3.1
"@metamask/eth-sig-util": ^5.0.2
Expand All @@ -5566,7 +5566,7 @@ __metadata:
video-stream-merger: ^4.0.1
peerDependencies:
ethers: ^5.6.8
checksum: a350b385db72c5ce106ed940d77acfac11cec1960409b18698d63d3359a84788da503b62fa3fd01f94b7a7d3634614e26346432d833eb0d69b717c00bb627415
checksum: e466b817bf19087d8b7bac25ac60354ad804fd964c668eac547d012d1a52cfe9ded2ffb74b67bb8c0ac40bb148410aa8c8b1269fcb7efb9a83bd211f84e1184c
languageName: node
linkType: hard

Expand Down Expand Up @@ -5594,9 +5594,9 @@ __metadata:
languageName: node
linkType: hard

"@pushprotocol/uiweb@npm:1.1.13":
version: 1.1.13
resolution: "@pushprotocol/uiweb@npm:1.1.13"
"@pushprotocol/uiweb@npm:1.1.14":
version: 1.1.14
resolution: "@pushprotocol/uiweb@npm:1.1.14"
dependencies:
"@livepeer/react": ^2.6.0
"@pushprotocol/socket": ^0.5.0
Expand All @@ -5617,7 +5617,7 @@ __metadata:
ethers: ^5.7.1
react: ">=16.8.0"
styled-components: ^5.3.5
checksum: a03933a5e2c010435aad2bf36657198276b75025521146a64e66847f9f7f492ff85ec4612cf190758d6fac873634feb7250ccf2f3034f399859f478716a96c8e
checksum: c06f684851892d3c71e4c8f38210a4b04e8e1f039d82a2bda728f3cc1414d059989c6ef91a5f6bf07e945ad61fd84a630c6e2ac72cba9493f138387396eda421
languageName: node
linkType: hard

Expand Down
Loading