Skip to content

Commit

Permalink
Merge pull request #258 from multiversx/development
Browse files Browse the repository at this point in the history
update sdks (#257)
  • Loading branch information
DanutIlie authored Nov 26, 2024
2 parents ab7efc9 + 99e4a58 commit 7ebeca6
Show file tree
Hide file tree
Showing 11 changed files with 85 additions and 22 deletions.
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
"@fortawesome/fontawesome-svg-core": "6.5.1",
"@fortawesome/free-solid-svg-icons": "6.5.1",
"@fortawesome/react-fontawesome": "0.2.0",
"@multiversx/sdk-core": "13.13.0",
"@multiversx/sdk-dapp": "3.0.3",
"@multiversx/sdk-core": "13.15.0",
"@multiversx/sdk-dapp": "3.0.14",
"axios": "1.7.4",
"classnames": "2.3.2",
"moment": "2.29.4",
Expand Down
6 changes: 2 additions & 4 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,7 @@ import {
apiTimeout,
walletConnectV2ProjectId,
environment,
sampleAuthenticatedDomains,
metamaskSnapWalletAddress
sampleAuthenticatedDomains
} from 'config';
import { RouteNamesEnum } from 'localConstants';
import { PageNotFound, Unlock } from 'pages';
Expand All @@ -30,8 +29,7 @@ const AppContent = () => {
customNetworkConfig={{
name: 'customConfig',
apiTimeout,
walletConnectV2ProjectId,
metamaskSnapWalletAddress
walletConnectV2ProjectId
}}
dappConfig={{
shouldUseWebViewProvider: true,
Expand Down
2 changes: 0 additions & 2 deletions src/config/config.devnet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,5 +7,3 @@ export const contractAddress =
export const API_URL = 'https://devnet-template-api.multiversx.com';
export const sampleAuthenticatedDomains = [API_URL];
export const environment = EnvironmentsEnum.devnet;
export const metamaskSnapWalletAddress =
'https://devnet-snap-wallet.multiversx.com';
1 change: 0 additions & 1 deletion src/config/config.mainnet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,3 @@ export const contractAddress =
export const API_URL = 'https://template-api.multiversx.com';
export const sampleAuthenticatedDomains = [API_URL];
export const environment = EnvironmentsEnum.mainnet;
export const metamaskSnapWalletAddress = 'https://snap-wallet.multiversx.com';
2 changes: 0 additions & 2 deletions src/config/config.testnet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,5 +7,3 @@ export const contractAddress =
export const API_URL = 'https://testnet-template-api.multiversx.com';
export const sampleAuthenticatedDomains = [API_URL];
export const environment = EnvironmentsEnum.testnet;
export const metamaskSnapWalletAddress =
'https://testnet-snap-wallet.multiversx.com';
1 change: 1 addition & 0 deletions src/hooks/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,4 @@ export * from './withPageTitle';
export * from './transactions';
export * from './useScrollToElement';
export * from './useIsWebProvider';
export * from './useWindowSize';
25 changes: 25 additions & 0 deletions src/hooks/useWindowSize.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { useEffect, useState } from 'react';

export const useWindowSize = () => {
const [windowSize, setWindowSize] = useState<{
width: number;
height: number;
}>({
width: window.innerWidth,
height: window.innerHeight,
});

useEffect(() => {
function handleResize() {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
}
window.addEventListener('resize', handleResize);
handleResize();

return () => window.removeEventListener('resize', handleResize);
}, []);
return windowSize;
};
41 changes: 30 additions & 11 deletions src/pages/Unlock/Unlock.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,28 @@ import {
type WebWalletLoginButtonPropsType,
type OperaWalletLoginButtonPropsType,
type LedgerLoginButtonPropsType,
type WalletConnectLoginButtonPropsType,
IframeButton
type WalletConnectLoginButtonPropsType
} from '@multiversx/sdk-dapp/UI';
import {
ExtensionLoginButton,
LedgerLoginButton,
OperaWalletLoginButton,
WalletConnectLoginButton,
WebWalletLoginButton as WebWalletUrlLoginButton,
XaliasCrossWindowLoginButton,
CrossWindowLoginButton
} from 'components/sdkDappComponents';
import { nativeAuth } from 'config';
import { RouteNamesEnum } from 'localConstants';
import { useNavigate } from 'react-router-dom';
import { AuthRedirectWrapper } from 'wrappers';
import { WebWalletLoginWrapper, XaliasLoginWrapper } from './components';
import {
IframeButton,
WebWalletLoginWrapper,
XaliasLoginWrapper
} from './components';
import { IframeLoginTypes } from '@multiversx/sdk-web-wallet-iframe-provider/out/constants';
import { useIframeLogin } from '@multiversx/sdk-dapp/hooks/login/useIframeLogin';
import { useWindowSize } from 'hooks';

type CommonPropsType =
| OperaWalletLoginButtonPropsType
Expand All @@ -37,12 +42,24 @@ const WebWalletLoginButton = USE_WEB_WALLET_CROSS_WINDOW

export const Unlock = () => {
const navigate = useNavigate();
const commonProps: CommonPropsType = {
const { width } = useWindowSize();

const [onInitiateLogin, { isLoading }] = useIframeLogin({
callbackRoute: RouteNamesEnum.dashboard,
nativeAuth,
onLoginRedirect: () => {
navigate(RouteNamesEnum.dashboard);
}
});

const isMobile = width < 768;
const commonProps: CommonPropsType = {
callbackRoute: RouteNamesEnum.dashboard,
nativeAuth,
onLoginRedirect: () => {
navigate(RouteNamesEnum.dashboard);
},
disabled: isLoading
};

return (
Expand Down Expand Up @@ -74,16 +91,18 @@ export const Unlock = () => {
/>
<XaliasLoginWrapper {...commonProps} />
<WebWalletLoginWrapper {...commonProps} />
<IframeButton
loginButtonText='Passkey Proxy'
loginType='passkey'
{...commonProps}
/>
{isMobile && (
<IframeButton
loginButtonText='Passkey Proxy'
{...commonProps}
onClick={() => onInitiateLogin(IframeLoginTypes.passkey)}
/>
)}

<IframeButton
loginButtonText='Metamask Proxy'
loginType='metamask'
{...commonProps}
onClick={() => onInitiateLogin(IframeLoginTypes.metamask)}
/>
</div>
</div>
Expand Down
23 changes: 23 additions & 0 deletions src/pages/Unlock/components/IframeButton/IframeButton.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { Button } from 'components';

export interface IframeButtonPropsType {
loginButtonText?: string;
disabled?: boolean;
onClick?: () => void;
}

export const IframeButton = ({
disabled,
onClick,
loginButtonText
}: IframeButtonPropsType) => {
return (
<Button
onClick={() => onClick?.()}
disabled={disabled}
className='inline-block mx-4 rounded-md m-1 text-base text-center bg-[#1b46c2] border-[#007bff] text-white disabled:opacity-[0.65] disabled:cursor-not-allowed px-3 py-1.5 focus:shadow-[0_0_0_0.2rem_rgba(38,143,255,0.5)]'
>
{loginButtonText}
</Button>
);
};
1 change: 1 addition & 0 deletions src/pages/Unlock/components/IframeButton/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export * from './IframeButton';
1 change: 1 addition & 0 deletions src/pages/Unlock/components/index.tsx
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export * from './WebWalletLoginWrapper';
export * from './XaliasLoginWrapper';
export * from './IframeButton';

0 comments on commit 7ebeca6

Please sign in to comment.