Ian/multi auth (#4538)

This commit is contained in:
ian
2024-09-11 14:42:52 -07:00
committed by GitHub
parent 4f2c15f3cd
commit adbac73065
22 changed files with 886 additions and 929 deletions
+719 -922
View File
File diff suppressed because it is too large Load Diff
@@ -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

+19 -2
View File
@@ -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: [