Skip to content

Commit 5e12bc2

Browse files
smgvsmgv
committed
Functions added
1 parent 2887ad7 commit 5e12bc2

File tree

14 files changed

+762
-106
lines changed

14 files changed

+762
-106
lines changed

‎.vscode/settings.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,5 +13,5 @@
1313
"changeProcessCWD": true
1414
}
1515
],
16-
"cSpell.words": ["clsx", "JRPC", "Ronin", "Solana"]
16+
"cSpell.words": ["clsx", "JRPC", "PASSWORDLESS", "Ronin", "Solana", "WEBAUTHN"]
1717
}

‎package-lock.json‎

Lines changed: 6 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"@types/chai": "^4.3.19",
1313
"@types/mocha": "^10.0.9",
1414
"@types/node": "^22",
15+
"buffer": "^6.0.3",
1516
"chai": "^5.1.1",
1617
"cross-env": "^7.0.3",
1718
"dotenv": "^16.4.5",
@@ -21,6 +22,7 @@
2122
"lint-staged": "^15.2.10",
2223
"mocha": "^10.7.3",
2324
"prettier": "^3.3.3",
25+
"process": "^0.11.10",
2426
"rimraf": "^6.0.1",
2527
"ts-node": "^10.9.2",
2628
"tsconfig-paths": "^4.2.0",

‎packages/modal-ui/index.html‎

Lines changed: 70 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,75 @@
1-
<!doctype html>
2-
<html lang="en">
1+
<html>
32
<head>
4-
<meta charset="utf-8" />
5-
<meta name="viewport" content="width=device-width, initial-scale=1" />
6-
<meta name="theme-color" content="#000000" />
7-
<title>Web3auth Modal UI</title>
3+
<title>Test web3auth app</title>
84
</head>
9-
<body>
10-
<noscript>You need to enable JavaScript to run this app.</noscript>
11-
<div id="root" id="w3a-parent-container" class="w3a-parent-container"></div>
125

13-
<script src="/src/index.tsx" type="module"></script>
6+
<body>
7+
<h1>Test web3auth app</h1>
8+
<div>
9+
<button class="show-modal" onclick="showModal()">Show Modal</button>
10+
</div>
11+
<script src="./dist/assets/index-De1Kpl9H.js"></script>
12+
<script src="https://cdn.jsdelivr.net/npm/@web3auth/auth"></script>
13+
<script>
14+
let modal = null;
15+
let testEventEmitter = null;
16+
function showModal() {
17+
console.log("open");
18+
modal.open();
19+
// testEventEmitter.emit("connecting", { adapter: "auth" })
20+
// testEventEmitter.emit("errored", { error: new Error("something went wrong") })
21+
// testEventEmitter.emit("connected", { adapter: "wallet-connect-v1" })
22+
// testEventEmitter.emit("disconnected", { adapter: "wallet-connect-v1" })
23+
}
24+
(async function init() {
25+
try {
26+
testEventEmitter = new Auth.SafeEventEmitter();
27+
modal = new Ui({
28+
adapterListener: testEventEmitter,
29+
theme: "dark",
30+
// version: "1",
31+
});
32+
await modal.initModal();
33+
console.log("modal init");
34+
modal.addSocialLogins(
35+
"auth",
36+
{
37+
google: {
38+
name: "google",
39+
},
40+
facebook: {
41+
name: "facebook",
42+
},
43+
twitter: {
44+
name: "twitter",
45+
},
46+
reddit: {
47+
name: "reddit",
48+
},
49+
twitch: {
50+
name: "twitch",
51+
},
52+
github: {
53+
name: "github",
54+
},
55+
},
56+
["facebook"]
57+
);
58+
modal.initExternalWalletContainer();
59+
modal.addWalletLogins(
60+
{
61+
"wallet-connect-v2": {
62+
label: "wallet-connect-v2",
63+
},
64+
},
65+
{ showExternalWalletsOnly: false }
66+
);
67+
testEventEmitter.emit("adapter_data_updated", { adapterName: "wallet-connect-v1", data: { uri: "alslkslkalls" } });
68+
// showModal()
69+
} catch (error) {
70+
console.log("error in ui", error);
71+
}
72+
})();
73+
</script>
1474
</body>
1575
</html>

‎packages/modal-ui/src/components/Body/Body.tsx‎

Lines changed: 48 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1-
import { createEffect, createSignal, on } from "solid-js";
1+
import { createSignal, Show } from "solid-js";
22
import Footer from "../Footer/Footer";
33
import ConnectWallet from "./ConnectWallet";
44
import Login from "./Login";
5-
import { SocialLoginEventType, ExternalWalletEventType, StateEmitterEvents, ModalState, MODAL_STATUS } from "../../interfaces";
6-
import { LOGIN_PROVIDER, type SafeEventEmitter } from "@web3auth/auth";
7-
import { ADAPTER_NAMES, ChainNamespaceType, cloneDeep, log, WalletRegistry } from "@web3auth/base";
8-
import deepmerge from "deepmerge";
9-
// import { on } from "events";
5+
import { SocialLoginEventType, ExternalWalletEventType, StateEmitterEvents, ModalState, SocialLoginsConfig } from "../../interfaces";
6+
import { type SafeEventEmitter } from "@web3auth/auth";
7+
import { ChainNamespaceType, WalletRegistry } from "@web3auth/base/src";
8+
109
export interface BodyProps {
1110
stateListener: SafeEventEmitter<StateEmitterEvents>;
1211
appLogo?: string;
@@ -16,6 +15,16 @@ export interface BodyProps {
1615
handleSocialLoginClick: (params: SocialLoginEventType) => void;
1716
handleExternalWalletClick: (params: ExternalWalletEventType) => void;
1817
handleShowExternalWallets: (externalWalletsInitialized: boolean) => void;
18+
showPasswordLessInput: boolean;
19+
showExternalWalletButton: boolean;
20+
socialLoginsConfig: SocialLoginsConfig;
21+
areSocialLoginsVisible: boolean;
22+
isEmailPrimary: boolean
23+
isExternalPrimary: boolean
24+
showExternalWalletPage: boolean;
25+
handleExternalWalletBtnClick?: (flag: boolean) => void;
26+
modalState: ModalState,
27+
preHandleExternalWalletClick: (params: { adapter: string }) => void;
1928
}
2029

2130
const PAGES = {
@@ -26,10 +35,41 @@ const PAGES = {
2635
const Body = (props: BodyProps) => {
2736
const [currentPage, setCurrentPage] = createSignal(PAGES.LOGIN);
2837

38+
const handleExternalWalletBtnClick = (flag: boolean) => {
39+
setCurrentPage(PAGES.CONNECT_WALLET);
40+
if (props.handleExternalWalletBtnClick) props.handleExternalWalletBtnClick(flag)
41+
}
42+
43+
const handleBackClick = (flag: boolean) => {
44+
setCurrentPage(PAGES.LOGIN);
45+
if (props.handleExternalWalletBtnClick) props.handleExternalWalletBtnClick(flag)
46+
}
47+
2948
return (
3049
<div class="w3a--h-[760px] w3a--p-6 w3a--flex w3a--flex-col w3a--flex-1">
31-
{currentPage() === PAGES.LOGIN && <Login onExternalWalletClick={() => setCurrentPage(PAGES.CONNECT_WALLET)} />}
32-
{currentPage() === PAGES.CONNECT_WALLET && <ConnectWallet onBackClick={() => setCurrentPage(PAGES.LOGIN)} />}
50+
<Show when={currentPage() === PAGES.LOGIN && !props.showExternalWalletPage}>
51+
<Login
52+
showPasswordLessInput={props.showPasswordLessInput}
53+
showExternalWalletButton={props.showExternalWalletButton}
54+
handleSocialLoginClick={props.handleSocialLoginClick}
55+
socialLoginsConfig={props.socialLoginsConfig}
56+
areSocialLoginsVisible={props.areSocialLoginsVisible}
57+
isEmailPrimary={props.isEmailPrimary}
58+
isExternalPrimary={props.isExternalPrimary}
59+
handleExternalWalletBtnClick={handleExternalWalletBtnClick}
60+
/>
61+
</Show>
62+
<Show when={currentPage() === PAGES.CONNECT_WALLET && props.showExternalWalletPage}>
63+
<ConnectWallet
64+
onBackClick={handleBackClick}
65+
modalStatus={props.modalState.status}
66+
showBackButton={props.areSocialLoginsVisible || props.showPasswordLessInput}
67+
handleExternalWalletClick={props.preHandleExternalWalletClick}
68+
chainNamespace={props.chainNamespace}
69+
walletConnectUri={props.modalState.walletConnectUri}
70+
config={props.modalState.externalWalletsConfig}
71+
walletRegistry={props.walletRegistry} />
72+
</Show>
3373
<Footer />
3474
</div>
3575
);

0 commit comments

Comments
 (0)