signup with twitter

holaplex · Jul 17, 2023 · 1a963b2 · 1a963b2
1 parent a9f5619
commit 1a963b2
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 35 deletions.
diff --git a/src/app/login/Login.tsx b/src/app/login/Login.tsx
@@ -9,13 +9,19 @@ export default function Login() {
       <Link href='/' className='fixed top-8 right-8'>
         <XMarkIcon className='w-8 h-8 cursor-pointe hover:opacity-80' />
       </Link>
-      <h1 className='text-2xl bold mb-8'>Sign in to create your free wallet</h1>
+      <h1 className='text-2xl bold'>Sign in to create your free wallet</h1>
       <button
-        className='rounded-lg px-20 py-3 bg-cta text-black hover:opacity-80 transition'
+        className='rounded-lg px-20 py-3 bg-cta text-black hover:opacity-80 transition mt-8'
         onClick={() => signIn('google')}
       >
         Continue with Google
       </button>
+      <button
+        className='rounded-lg px-20 py-3 bg-cta text-black hover:opacity-80 transition mt-4'
+        onClick={() => signIn('twitter')}
+      >
+        Continue with Twitter
+      </button>
     </div>
   );
 }
diff --git a/src/pages/api/auth/[...nextauth].ts b/src/pages/api/auth/[...nextauth].ts
@@ -1,28 +1,29 @@
-import NextAuth from "next-auth";
-import GoogleProvider from "next-auth/providers/google";
-import { PrismaAdapter } from "@next-auth/prisma-adapter";
-import type { NextAuthOptions } from "next-auth";
-import prisma from "@/modules/db";
-import { waitUntil } from "async-wait-until";
+import NextAuth from 'next-auth';
+import GoogleProvider from 'next-auth/providers/google';
+import TwitterProvider from 'next-auth/providers/twitter';
+import { PrismaAdapter } from '@next-auth/prisma-adapter';
+import type { NextAuthOptions } from 'next-auth';
+import prisma from '@/modules/db';
+import { waitUntil } from 'async-wait-until';
 
 import {
   CreateCustomer,
-  CreateCustomerWallet,
-} from "@/mutations/customer.graphql";
+  CreateCustomerWallet
+} from '@/mutations/customer.graphql';
 import {
   CreateCustomerInput,
   CreateCustomerPayload,
   CreateCustomerWalletPayload,
   CreateCustomerWalletInput,
   AssetType,
-  Project,
-} from "@/graphql.types";
-import db from "@/modules/db";
-import holaplex from "@/modules/holaplex";
-import { GetCustomerTreasury } from "@/queries/customer.graphql";
+  Project
+} from '@/graphql.types';
+import db from '@/modules/db';
+import holaplex from '@/modules/holaplex';
+import { GetCustomerTreasury } from '@/queries/customer.graphql';
 
 interface GetCustomerTreasuryData {
-  project: Pick<Project, "customer">;
+  project: Pick<Project, 'customer'>;
 }
 
 interface GetCustomerTreasuryVars {
@@ -48,17 +49,17 @@ interface CreateCustomerWalletVars {
 
 function customerTreasuryReady(customer: string) {
   return async function checkCustomerTreasuryReady() {
-    console.log("waiting for treasurty to be ready", customer);
+    console.log('waiting for treasurty to be ready', customer);
     const { data } = await holaplex.query<
       GetCustomerTreasuryData,
       GetCustomerTreasuryVars
     >({
-      fetchPolicy: "network-only",
+      fetchPolicy: 'network-only',
       query: GetCustomerTreasury,
       variables: {
         project: process.env.HOLAPLEX_PROJECT_ID as string,
-        customer,
-      },
+        customer
+      }
     });
 
     console.log(customer, data);
@@ -72,8 +73,12 @@ export const authOptions: NextAuthOptions = {
   providers: [
     GoogleProvider({
       clientId: process.env.GOOGLE_CLIENT_ID as string,
-      clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
+      clientSecret: process.env.GOOGLE_CLIENT_SECRET as string
     }),
+    TwitterProvider({
+      clientId: process.env.TWITTER_CLIENT_ID as string,
+      clientSecret: process.env.TWITTER_CLIENT_SECRET as string
+    })
   ],
   events: {
     async createUser({ user }) {
@@ -84,24 +89,24 @@ export const authOptions: NextAuthOptions = {
         mutation: CreateCustomer,
         variables: {
           input: {
-            project: process.env.HOLAPLEX_PROJECT_ID,
-          },
-        },
+            project: process.env.HOLAPLEX_PROJECT_ID
+          }
+        }
       });
 
       const customer = createCustomerResponse.data?.createCustomer.customer;
 
       const me = await db.user.update({
         where: {
-          id: user.id,
+          id: user.id
         },
         data: {
-          holaplexCustomerId: customer?.id,
-        },
+          holaplexCustomerId: customer?.id
+        }
       });
 
       await waitUntil(customerTreasuryReady(customer?.id as string), {
-        intervalBetweenAttempts: 100,
+        intervalBetweenAttempts: 100
       });
 
       const createCustomerWalletResponse = await holaplex.mutate<
@@ -112,9 +117,9 @@ export const authOptions: NextAuthOptions = {
         variables: {
           input: {
             customer: me.holaplexCustomerId,
-            assetType: process.env.HOLAPLEX_WALLET_ASSET_TYPE as AssetType,
-          },
-        },
+            assetType: process.env.HOLAPLEX_WALLET_ASSET_TYPE as AssetType
+          }
+        }
       });
 
       const wallet =
@@ -123,11 +128,11 @@ export const authOptions: NextAuthOptions = {
       await db.wallet.create({
         data: {
           holaplexCustomerId: me.holaplexCustomerId as string,
-          address: wallet?.address as string,
-        },
+          address: wallet?.address as string
+        }
       });
-    },
-  },
+    }
+  }
 };
 
 export default NextAuth(authOptions);