Skip to content

Commit

Permalink
Merge pull request #280 from torusresearch/feat/legacy-support
Browse files Browse the repository at this point in the history 
add support for legacy networks and sapphire
  • Loading branch information
@chaitanyapotti
chaitanyapotti committed Jul 5, 2023
2 parents 0a68268 + 3980a89 commit 8da64eb
Show file tree
Hide file tree
Showing 10 changed files with 3,247 additions and 2,600 deletions.
4,931 changes: 2,795 additions & 2,136 deletions examples/vue-app/package-lock.json
View file

Large diffs are not rendered by default.

33 changes: 17 additions & 16 deletions examples/vue-app/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,38 +10,39 @@
},
"dependencies": {
"@toruslabs/customauth": "file:../..",
"@toruslabs/openlogin-starkkey": "^2.1.0",
"@web3auth/ethereum-provider": "^3.2.0",
"core-js": "^3.26.1",
"daisyui": "^2.42.1",
"@toruslabs/openlogin-starkkey": "^3.2.0",
"@web3auth/ethereum-provider": "^6.1.1",
"core-js": "^3.31.0",
"daisyui": "^3.1.7",
"enc-utils": "^3.0.0",
"vue": "^3.2.45",
"vue-router": "^4.1.6",
"vue": "^3.3.4",
"vue-router": "^4.2.2",
"web3": "^1.8.1"
},
"devDependencies": {
"@types/elliptic": "^6.4.14",
"@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0",
"@typescript-eslint/eslint-plugin": "^5.61.0",
"@typescript-eslint/parser": "^5.61.0",
"@vue/cli-plugin-babel": "~5.0.8",
"@vue/cli-plugin-eslint": "~5.0.8",
"@vue/cli-plugin-typescript": "~5.0.8",
"@vue/cli-service": "~5.0.8",
"@vue/eslint-config-prettier": "^7.0.0",
"@vue/eslint-config-typescript": "^11.0.2",
"autoprefixer": "^10.4.13",
"@vue/eslint-config-prettier": "^7.1.0",
"@vue/eslint-config-typescript": "^11.0.3",
"autoprefixer": "^10.4.14",
"babel-eslint": "^10.1.0",
"color": "^4.2.3",
"crypto-browserify": "^3.12.0",
"eslint": "^8.28.0",
"eslint-plugin-vue": "^9.8.0",
"eslint": "^8.44.0",
"eslint-plugin-vue": "^9.15.1",
"https-browserify": "^1.0.0",
"os-browserify": "^0.3.0",
"postcss": "^8.4.19",
"prettier": "^2.8.0",
"postcss": "^8.4.24",
"prettier": "^2.8.8",
"source-map-loader": "^4.0.1",
"stream-browserify": "^3.0.0",
"stream-http": "^3.2.0",
"tailwindcss": "^3.2.4",
"tailwindcss": "^3.3.2",
"typescript": "~4.9.3",
"vue-template-compiler": "^2.7.14"
},
Expand Down
16 changes: 9 additions & 7 deletions examples/vue-app/src/views/PopupMode/Login.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,11 +67,11 @@
</form>
</div>
</div> -->
<div v-if="loginResponse && loginResponse.privateKey">
<div v-if="loginResponse && loginResponse.finalKeyData.privKey">
<div class="flex m-6 text-left box md:rows-span-2">
<div class="ml-6 overflow-hidden mt-7 text-ellipsis">
<span class="text-2xl font-semibold">demo-customauth.web3auth.io</span>
<h6 class="pb-8 overflow-hidden text-left text-ellipsis">Customauth Private key : {{ getPrivatekey(loginResponse) }}</h6>
<h6 class="pb-8 overflow-hidden text-left text-ellipsis">Customauth Private key : {{ getPrivateKey(loginResponse) }}</h6>
</div>
<div class="ml-auto mt-7">
<!-- <span class="pr-32">Connected ChainId : {{ ethereumPrivateKeyProvider.state.chainId }}</span> -->
Expand Down Expand Up @@ -313,6 +313,8 @@ export default defineComponent({
queryParameters,
});
const privateKey = loginDetails.finalKeyData.privKey || loginDetails.oAuthKeyData.privKey;
const providerInstance = await EthereumPrivateKeyProvider.getProviderInstance({
chainConfig: {
rpcTarget: "https://polygon-rpc.com",
Expand All @@ -322,7 +324,7 @@ export default defineComponent({
displayName: "Polygon Mainnet",
blockExplorer: "https://polygonscan.com",
},
privKey: loginDetails.privateKey,
privKey: privateKey,
});
this.provider = providerInstance.provider;
Expand Down Expand Up @@ -382,9 +384,9 @@ export default defineComponent({
console.error(error, "caught");
}
},
getPrivatekey(loginDetails: any): unknown {
// console.log(loginDetails);
return loginDetails.privateKey;
getPrivateKey(loginDetails: TorusLoginResponse | null): string {
if (!loginDetails) return "";
return loginDetails.finalKeyData.privKey || loginDetails.oAuthKeyData.privKey;
},
clearUiconsole() {
const el = document.querySelector("#console>p");
Expand Down Expand Up @@ -412,7 +414,7 @@ export default defineComponent({
},
getStarkAccount(index: number): ec.KeyPair {
const account = getStarkHDAccount((this.loginResponse?.privateKey as string).padStart(64, "0"), index, STARKNET_NETWORKS.testnet);
const account = getStarkHDAccount(this.getPrivateKey(this.loginResponse).padStart(64, "0"), index, STARKNET_NETWORKS.testnet);
return account;
},
Expand Down
22 changes: 10 additions & 12 deletions examples/vue-app/src/views/RedirectMode/Auth.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="flex box md:rows-span-2 m-6 text-left">
<div class="mt-7 ml-6 text-ellipsis overflow-hidden">
<span class="text-2xl font-semibold">demo-customauth.web3auth.io</span>
<h6 class="pb-8 text-left text-ellipsis overflow-hidden">Customauth Private key : {{ getPrivatekey(loginDetails) }}</h6>
<h6 class="pb-8 text-left text-ellipsis overflow-hidden">Customauth Private key : {{ getPrivateKey(loginDetails) }}</h6>
</div>
<div class="ml-auto mt-7">
<!-- <span class="pr-32">Connected ChainId : {{ ethereumPrivateKeyProvider.state.chainId }}</span> -->
Expand Down Expand Up @@ -151,7 +151,7 @@
</template>

<script lang="ts">
import TorusSdk, { RedirectResult } from "@toruslabs/customauth";
import TorusSdk, { RedirectResult, TorusLoginResponse } from "@toruslabs/customauth";
import { getStarkHDAccount, pedersen, sign, STARKNET_NETWORKS, verify } from "@toruslabs/openlogin-starkkey";
import { SafeEventEmitterProvider } from "@web3auth/base";
import { EthereumPrivateKeyProvider } from "@web3auth/ethereum-provider";
Expand Down Expand Up @@ -179,8 +179,9 @@ export default defineComponent({
el.innerHTML = JSON.stringify(args || {}, null, 2);
}
},
getPrivatekey(loginDetails: any): unknown {
return loginDetails?.result?.privateKey;
getPrivateKey(loginDetails: RedirectResult | null): string {
if (!loginDetails) return "";
return (loginDetails.result as TorusLoginResponse)?.finalKeyData.privKey || (loginDetails.result as TorusLoginResponse)?.oAuthKeyData.privKey;
},
async signMessage() {
const signedMessage = await signEthMessage(this.provider as SafeEventEmitterProvider);
Expand All @@ -195,11 +196,7 @@ export default defineComponent({
this.console("latest block", block);
},
getStarkAccount(index: number): ec.KeyPair {
const account = getStarkHDAccount(
((this.loginDetails as any)?.result?.privateKey as string).padStart(64, "0"),
index,
STARKNET_NETWORKS.testnet
);
const account = getStarkHDAccount(this.getPrivateKey(this.loginDetails).padStart(64, "0"), index, STARKNET_NETWORKS.testnet);
return account;
},
Expand Down Expand Up @@ -272,15 +269,16 @@ export default defineComponent({
},
},
async mounted() {
const torusdirectsdk = new TorusSdk({
const customAuthSdk = new TorusSdk({
baseUrl: location.origin,
redirectPathName: "auth",
enableLogging: true,
uxMode: "redirect",
network: "testnet",
web3AuthClientId: WEB3AUTH_CLIENT_ID,
});
const loginDetails = await torusdirectsdk.getRedirectResult();
const loginDetails = await customAuthSdk.getRedirectResult();
const privKey = this.getPrivateKey(loginDetails);
const providerInstance = await EthereumPrivateKeyProvider.getProviderInstance({
chainConfig: {
rpcTarget: "https://polygon-rpc.com",
Expand All @@ -290,7 +288,7 @@ export default defineComponent({
displayName: "Polygon Mainnet",
blockExplorer: "https://polygonscan.com",
},
privKey: ((loginDetails as any)?.result?.privateKey as string).padStart(64, "0"),
privKey: privKey.padStart(64, "0"),
});
this.provider = providerInstance.provider;
console.log(loginDetails);
Expand Down
37 changes: 25 additions & 12 deletions examples/vue-app/src/views/RedirectMode/Login.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,13 @@
</select>
</div>
<input v-model="login_hint" v-if="selectedVerifier === 'torus_email_passwordless'" placeholder="Enter an email" required class="input-field" />
<input v-model="login_hint" v-if="selectedVerifier === 'torus_sms_passwordless'" placeholder="Eg: (+{cc}-{number})" required class="input-field" />
<input
v-model="login_hint"
v-if="selectedVerifier === 'torus_sms_passwordless'"
placeholder="Eg: (+{cc}-{number})"
required
class="input-field"
/>
<div :style="{ marginTop: '20px' }">
<button @click="login" class="btn-login">Login with Torus</button>
</div>
Expand Down Expand Up @@ -55,7 +61,7 @@ export default defineComponent({
name: "RedirectLogin",
data() {
return {
torusdirectsdk: null as TorusSdk | null,
customAuthSdk: null as TorusSdk | null,
selectedVerifier: "google",
verifierMap,
login_hint: "",
Expand Down Expand Up @@ -88,38 +94,45 @@ export default defineComponent({
verifierIdField: "name",
login_hint: this.login_hint,
connection: "sms",
}
},
};
},
},
async mounted() {
const torusdirectsdk = new TorusSdk({
const customAuthSdk = new TorusSdk({
baseUrl: location.origin,
redirectPathName: "auth",
enableLogging: true,
uxMode: UX_MODE.REDIRECT,
network: "sapphire_mainnet",
network: "testnet",
web3AuthClientId: WEB3AUTH_CLIENT_ID,
});
this.torusdirectsdk = torusdirectsdk;
await torusdirectsdk.init({ skipSw: true });
this.customAuthSdk = customAuthSdk;
await customAuthSdk.init({ skipSw: true });
},
methods: {
async login() {
if (!this.torusdirectsdk) return;
if (!this.customAuthSdk) return;
const jwtParams = this.loginToConnectionMap[this.selectedVerifier] || {};
const { typeOfLogin, clientId, verifier, name } = verifierMap[this.selectedVerifier];
const webauthnRegister = name === "WebAuthn Register"
const webauthnRegister = name === "WebAuthn Register";
const registerOnly = webauthnRegister ? true : false;
const loginOnly = webauthnRegister ? "false" : "true";
return this.torusdirectsdk.triggerLogin({
return this.customAuthSdk.triggerLogin({
typeOfLogin,
verifier,
clientId,
jwtParams,
registerOnly,
customState: { client: "great-company", webauthnURL: "https://d1f8-115-66-172-125.ngrok.io/", localhostAll: "true", loginOnly, webauthnTransports: 'ble', credTransports: 'ble' },
customState: {
client: "great-company",
webauthnURL: "https://d1f8-115-66-172-125.ngrok.io/",
localhostAll: "true",
loginOnly,
webauthnTransports: "ble",
credTransports: "ble",
},
});
},
},
Expand All @@ -139,4 +152,4 @@ export default defineComponent({
@apply bg-white h-12 rounded-xl text-center p-2 mt-4 w-80;
border: solid 1px;
}
</style>
</style>
19 changes: 8 additions & 11 deletions examples/vue-app/vue.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,24 +19,21 @@ module.exports = {
}
// console.log(config);
config.resolve.alias = { ...config.resolve.alias, "bn.js": path.resolve(__dirname, "node_modules/bn.js") };
config.plugins.push(
new ProvidePlugin({
Buffer: ["buffer", "Buffer"],
})
);
config.plugins.push(
new ProvidePlugin({
process: "process/browser",
Buffer: ["buffer", "Buffer"],
})
);
config.resolve.fallback = {
...(config.resolve.fallback || {}),
http: require.resolve("stream-http"),
https: require.resolve("https-browserify"),
os: require.resolve("os-browserify/browser"),
crypto: require.resolve("crypto-browserify"),
assert: require.resolve("assert/"),
stream: require.resolve("stream-browserify"),
http: false,
https: false,
os: false,
crypto: false,
assert: false,
stream: false,
zlib: false,
};
},
};
Loading

0 comments on commit 8da64eb

Please sign in to comment.