Ian/multi auth (#4538)
|
Before Width: | Height: | Size: 76 KiB After Width: | Height: | Size: 76 KiB |
|
Before Width: | Height: | Size: 51 KiB After Width: | Height: | Size: 51 KiB |
|
Before Width: | Height: | Size: 64 KiB After Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 223 KiB After Width: | Height: | Size: 223 KiB |
|
Before Width: | Height: | Size: 179 KiB After Width: | Height: | Size: 179 KiB |
|
Before Width: | Height: | Size: 217 KiB After Width: | Height: | Size: 217 KiB |
|
Before Width: | Height: | Size: 150 KiB After Width: | Height: | Size: 150 KiB |
@@ -3,17 +3,17 @@ import { createMetadata } from "@doc";
|
||||
|
||||
export const metadata = createMetadata({
|
||||
image: {
|
||||
title: "Interact with In-App Wallet",
|
||||
title: "Interact with Accounts",
|
||||
icon: "wallets",
|
||||
},
|
||||
title: "Interact with In-App Wallet",
|
||||
title: "Interact with Accounts",
|
||||
description:
|
||||
"Learn how to interact with the in-app wallet using the React hooks or the InAppWallet instance.",
|
||||
"Learn how to interact with the in-app wallet using Typescript or React Hooks",
|
||||
});
|
||||
|
||||
# Interact with wallets
|
||||
# Interact with users
|
||||
|
||||
Once connected, you can interact with the wallet using the `thirdweb/wallets/inApp` specific methods.
|
||||
Once connected, you can interact with user accounts using the `thirdweb/wallets` specific methods.
|
||||
|
||||
## Get the user email
|
||||
|
||||
@@ -0,0 +1,99 @@
|
||||
import { createMetadata } from "@doc";
|
||||
|
||||
export const metadata = createMetadata({
|
||||
image: {
|
||||
title: "Linking Mulitple Profiles",
|
||||
icon: "wallets",
|
||||
},
|
||||
title: "Linking Mulitple Profiles",
|
||||
description:
|
||||
"Learn how to associate multiple social profiles with a single wallet address.",
|
||||
});
|
||||
|
||||
# Linking Multiple Profiles
|
||||
|
||||
In-App Wallets allow users to tie the same wallet address to multiple social profiles. Developers can programmatically link additional profiles at any point in their user journey.
|
||||
|
||||
## Link a Profile
|
||||
|
||||
```ts
|
||||
import { inAppWallet, linkProfile } from "thirdweb/wallets";
|
||||
|
||||
const wallet = inAppWallet();
|
||||
|
||||
await wallet.connect({ strategy: "google" });
|
||||
await linkProfile(wallet, { strategy: "discord" });
|
||||
```
|
||||
|
||||
Both the Google and Discord accounts will now be linked to the same wallet.
|
||||
|
||||
If the Discord account is already linked to this or another wallet, this will throw an error.
|
||||
|
||||
You can retrieve all profiles linked to a wallet using the `getProfiles` method:
|
||||
|
||||
```ts
|
||||
import { inAppWallet, getProfiles } from "thirdweb/wallets";
|
||||
|
||||
const wallet = inAppWallet();
|
||||
wallet.connect({ strategy: "google" });
|
||||
|
||||
const profiles = getProfiles(wallet);
|
||||
```
|
||||
|
||||
This will return an array of profiles:
|
||||
|
||||
```ts
|
||||
[
|
||||
{
|
||||
type: "google",
|
||||
details: {
|
||||
email: "[email protected]",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "discord",
|
||||
details: {
|
||||
email: "[email protected]",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "wallet",
|
||||
details: {
|
||||
address: "0xeC...c4",
|
||||
},
|
||||
},
|
||||
];
|
||||
```
|
||||
|
||||
## Retrieve Linked Profiles
|
||||
|
||||
You can use the `useProfiles` hook to fetch linked profiles for the current wallet.
|
||||
|
||||
```jsx
|
||||
import { useProfiles } from "thirdweb/react";
|
||||
|
||||
const { data: profiles } = useProfiles();
|
||||
|
||||
console.log("Type:", profiles[0].type); // "discord"
|
||||
console.log("Email:", profiles[0].details.email); // "[email protected]"
|
||||
```
|
||||
|
||||
Note that the `email` field above will differ based on the profile type. We list the expected field below in our list of strategies.
|
||||
|
||||
## List of Strategies
|
||||
|
||||
| Strategy | Type | `details` Field |
|
||||
| ------------- | ----------------- | --------------- |
|
||||
| Email | `"email"` | `email` |
|
||||
| Phone | `"phone"` | `phone` |
|
||||
| Passkey | `"passkey"` | `id` |
|
||||
| Google | `"google"` | `email` |
|
||||
| Discord | `"discord"` | `email` |
|
||||
| Telegram | `"telegram"` | `id` |
|
||||
| Farcaster | `"farcaster"` | `id` |
|
||||
| Line | `"line"` | `id` |
|
||||
| Apple | `"apple"` | `email` |
|
||||
| Facebook | `"facebook"` | `email` |
|
||||
| Wallet | `"wallet"` | `address` |
|
||||
| JWT | `"jwt"` | `id` |
|
||||
| Auth Endpoint | `"auth_endpoint"` | `id` |
|
||||
@@ -0,0 +1,44 @@
|
||||
import { createMetadata } from "@doc";
|
||||
|
||||
export const metadata = createMetadata({
|
||||
image: {
|
||||
title: "Retrieve Linked Profiles",
|
||||
icon: "wallets",
|
||||
},
|
||||
title: "Linking Mulitple Profiles",
|
||||
description:
|
||||
"Learn how to associate multiple social profiles with a single wallet address.",
|
||||
});
|
||||
|
||||
# Retrieving Linked Profiles
|
||||
|
||||
You can use the `useProfiles` hook to fetch linked profiles for the current wallet.
|
||||
|
||||
```jsx
|
||||
import { useProfiles } from "thirdweb/react";
|
||||
|
||||
const { data: profiles } = useProfiles();
|
||||
|
||||
console.log("Type:", profiles[0].type); // "discord"
|
||||
console.log("Email:", profiles[0].details.email); // "[email protected]"
|
||||
```
|
||||
|
||||
Note that the `email` field above will differ based on the profile type. We list the expected field below in our list of strategies.
|
||||
|
||||
## List of Strategies
|
||||
|
||||
| Strategy | Type | `details` Field |
|
||||
| ------------- | ----------------- | --------------- |
|
||||
| Email | `"email"` | `email` |
|
||||
| Phone | `"phone"` | `phone` |
|
||||
| Passkey | `"passkey"` | `id` |
|
||||
| Google | `"google"` | `email` |
|
||||
| Discord | `"discord"` | `email` |
|
||||
| Telegram | `"telegram"` | `id` |
|
||||
| Farcaster | `"farcaster"` | `id` |
|
||||
| Line | `"line"` | `id` |
|
||||
| Apple | `"apple"` | `email` |
|
||||
| Facebook | `"facebook"` | `email` |
|
||||
| Wallet | `"wallet"` | `address` |
|
||||
| JWT | `"jwt"` | `id` |
|
||||
| Auth Endpoint | `"auth_endpoint"` | `id` |
|
||||
|
Before Width: | Height: | Size: 1.4 MiB After Width: | Height: | Size: 1.4 MiB |
|
Before Width: | Height: | Size: 246 KiB After Width: | Height: | Size: 246 KiB |
@@ -172,8 +172,8 @@ export const sidebar: SideBar = {
|
||||
href: `${inAppSlug}/overview`,
|
||||
},
|
||||
{
|
||||
name: "How it works",
|
||||
href: `${inAppSlug}/how-it-works`,
|
||||
name: "Security",
|
||||
href: `${inAppSlug}/security`,
|
||||
},
|
||||
{
|
||||
name: "Get Started",
|
||||
@@ -206,6 +206,23 @@ export const sidebar: SideBar = {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: "Guides",
|
||||
links: [
|
||||
{
|
||||
name: "Export Private Keys",
|
||||
href: `${inAppSlug}/guides/export-private-key`,
|
||||
},
|
||||
{
|
||||
name: "Link Multiple Profiles",
|
||||
href: `${inAppSlug}/guides/link-multiple-profiles`,
|
||||
},
|
||||
{
|
||||
name: "Retrieving Linked Profiles",
|
||||
href: `${inAppSlug}/guides/retrieve-linked-profiles`,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: "Custom Authentication",
|
||||
links: [
|
||||
|
||||