Skip to content
This repository has been archived by the owner on Dec 21, 2023. It is now read-only.

update privy login options based on wallet or socials #2552

Merged
merged 1 commit into from
Nov 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 23 additions & 4 deletions packages/app/components/header/header.md.web.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,11 @@
import { useEffect, useRef, useState, Suspense, useMemo } from "react";
import {
useEffect,
useRef,
useState,
Suspense,
useMemo,
useContext,
} from "react";
import { Platform, useWindowDimensions } from "react-native";

import { usePrivy } from "@privy-io/react-auth";
Expand Down Expand Up @@ -49,6 +56,7 @@ import { downloadCollectorList } from "app/hooks/use-download-collector-list";
import { useFooter } from "app/hooks/use-footer";
import { useNotifications } from "app/hooks/use-notifications";
import { useUser } from "app/hooks/use-user";
import { PrivySetLoginMethodContext } from "app/lib/privy/privy-provider.web";
import { Link, TextLink } from "app/navigation/link";
import { useNavigateToLogin } from "app/navigation/use-navigate-to";

Expand Down Expand Up @@ -235,7 +243,7 @@ const ChannelsUnreadMessages = () => {

export const HeaderMd = withColorScheme(() => {
const { user, isAuthenticated } = useUser();
const { handleSubmitWallet, loading: loginLoading } = useLogin();
const { loading: loginLoading } = useLogin();
const { links, social } = useFooter();
const isDark = useIsDarkMode();
const router = useRouter();
Expand Down Expand Up @@ -314,6 +322,7 @@ export const HeaderMd = withColorScheme(() => {
]
);

const privyLoginMethodContext = useContext(PrivySetLoginMethodContext);
return (
<View tw="fixed top-0 h-full bg-white pl-2 dark:bg-black">
<View tw="h-full min-h-screen w-60 overflow-y-auto pl-4">
Expand Down Expand Up @@ -564,7 +573,10 @@ export const HeaderMd = withColorScheme(() => {
if (privy.authenticated) {
await privy.logout();
}
privy.login();
privyLoginMethodContext.setLoginMethods(["wallet"]);
setTimeout(() => {
privy.login();
});
}}
disabled={loginLoading}
>
Expand All @@ -582,7 +594,14 @@ export const HeaderMd = withColorScheme(() => {
if (privy.authenticated) {
await privy.logout();
}
privy.login();
privyLoginMethodContext.setLoginMethods([
"sms",
"google",
"apple",
]);
setTimeout(() => {
privy.login();
});
}}
>
<>
Expand Down
18 changes: 15 additions & 3 deletions packages/app/components/login/index.web.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useEffect } from "react";
import { useEffect, useContext } from "react";
import { StyleSheet } from "react-native";

import { PortalProvider } from "@gorhom/portal";
Expand All @@ -17,6 +17,7 @@ import { View } from "@showtime-xyz/universal.view";

import { usePreviousValue } from "app/hooks/use-previous-value";
import { useUser } from "app/hooks/use-user";
import { PrivySetLoginMethodContext } from "app/lib/privy/privy-provider.web";

import { useLogin } from "./use-login";

Expand All @@ -35,6 +36,7 @@ export function Login() {
const prevUser = usePreviousValue(user);
//#endregion
const modalScreenContext = useModalScreenContext();
const privyLoginMethodContext = useContext(PrivySetLoginMethodContext);

useEffect(() => {
if (showSignMessage) {
Expand Down Expand Up @@ -89,7 +91,14 @@ export function Login() {
if (privy.authenticated) {
await privy.logout();
}
privy.login();
privyLoginMethodContext.setLoginMethods([
"sms",
"google",
"apple",
]);
setTimeout(() => {
privy.login();
});
}}
>
Phone & Social
Expand All @@ -103,7 +112,10 @@ export function Login() {
if (privy.authenticated) {
await privy.logout();
}
privy.login();
privyLoginMethodContext.setLoginMethods(["wallet"]);
setTimeout(() => {
privy.login();
});
}}
>
<View tw="absolute left-4 top-3">
Expand Down
24 changes: 21 additions & 3 deletions packages/app/lib/privy/privy-provider.web.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,11 @@
import { forwardRef, useRef, useEffect } from "react";
import {
forwardRef,
useRef,
useEffect,
useState,
useContext,
createContext,
} from "react";

import {
PrivyProvider as PrivyProviderImpl,
Expand All @@ -15,13 +22,22 @@
import { useStableCallback } from "app/hooks/use-stable-callback";
import { useWallet } from "app/hooks/use-wallet";

export const PrivySetLoginMethodContext = createContext<any>(null);

export const PrivyProvider = ({ children }: any) => {
const colorScheme = useIsDarkMode() ? "dark" : "light";
const [loginMethods, setLoginMethods] = useState<any>([
"wallet",
"sms",
"google",
"apple",
] as const);

return (
<PrivyProviderImpl
appId={process.env.NEXT_PUBLIC_PRIVY_APP_ID}
config={{
loginMethods: ["wallet", "sms", "google", "apple"],
loginMethods: loginMethods,
defaultChain: baseChain,
embeddedWallets: {
noPromptOnSignature: true,
Expand All @@ -35,7 +51,9 @@
},
}}
>
{children}
<PrivySetLoginMethodContext.Provider value={{ setLoginMethods }}>
{children}
</PrivySetLoginMethodContext.Provider>
</PrivyProviderImpl>
);
};
Expand All @@ -44,7 +62,7 @@
current: null,
} as { current: PrivyInterface | null };

export const PrivyAuth = forwardRef(function PrivyAuth(props: any, ref) {

Check warning on line 65 in packages/app/lib/privy/privy-provider.web.tsx

View workflow job for this annotation

GitHub Actions / ESLint Report Analysis

packages/app/lib/privy/privy-provider.web.tsx#L65

[unused-imports/no-unused-vars] 'ref' is defined but never used. Allowed unused args must match /^_/u.
const privy = usePrivy();
const { authenticationStatus, setAuthenticationStatus, login, logout } =
useAuth();
Expand Down
Loading