Merge pull request #2 from cornell-dti/annie/setup-auth

set up convex auth with Google OAuth

Author: anchen9

bun.lock

@@ -8,13 +8,19 @@
  * @module
  */
 
+import type * as auth from "../auth.js";
+import type * as http from "../http.js";
+
 import type {
   ApiFromModules,
   FilterApi,
   FunctionReference,
 } from "convex/server";
 
-declare const fullApi: ApiFromModules<{}>;
+declare const fullApi: ApiFromModules<{
+  auth: typeof auth;
+  http: typeof http;
+}>;
 
 /**
  * A utility for referencing Convex functions in your app's public API.

convex/_generated/api.d.ts

@@ -8,29 +8,29 @@
  * @module
  */
 
-import { AnyDataModel } from "convex/server";
+import type {
+  DataModelFromSchemaDefinition,
+  DocumentByName,
+  TableNamesInDataModel,
+  SystemTableNames,
+} from "convex/server";
 import type { GenericId } from "convex/values";
-
-/**
- * No `schema.ts` file found!
- *
- * This generated code has permissive types like `Doc = any` because
- * Convex doesn't know your schema. If you'd like more type safety, see
- * https://docs.convex.dev/using/schemas for instructions on how to add a
- * schema file.
- *
- * After you change a schema, rerun codegen with `npx convex dev`.
- */
+import schema from "../schema.js";
 
 /**
  * The names of all of your Convex tables.
  */
-export type TableNames = string;
+export type TableNames = TableNamesInDataModel<DataModel>;
 
 /**
  * The type of a document stored in Convex.
+ *
+ * @typeParam TableName - A string literal type of the table name (like "users").
  */
-export type Doc = any;
+export type Doc<TableName extends TableNames> = DocumentByName<
+  DataModel,
+  TableName
+>;
 
 /**
  * An identifier for a document in Convex.
@@ -42,8 +42,10 @@ export type Doc = any;
  *
  * IDs are just strings at runtime, but this type can be used to distinguish them from other
  * strings when type checking.
+ *
+ * @typeParam TableName - A string literal type of the table name (like "users").
  */
-export type Id<TableName extends TableNames = TableNames> =
+export type Id<TableName extends TableNames | SystemTableNames> =
   GenericId<TableName>;
 
 /**
@@ -55,4 +57,4 @@ export type Id<TableName extends TableNames = TableNames> =
  * This type is used to parameterize methods like `queryGeneric` and
  * `mutationGeneric` to make them type-safe.
  */
-export type DataModel = AnyDataModel;
+export type DataModel = DataModelFromSchemaDefinition<typeof schema>;

convex/_generated/dataModel.d.ts

@@ -0,0 +1,8 @@
+export default {
+  providers: [
+    {
+      domain: process.env.CONVEX_SITE_URL,
+      applicationID: "convex",
+    },
+  ],
+};

convex/auth.config.ts

@@ -0,0 +1,6 @@
+import Google from "@auth/core/providers/google";
+import { convexAuth } from "@convex-dev/auth/server";
+
+export const { auth, signIn, signOut, store, isAuthenticated } = convexAuth({
+  providers: [Google],
+});

convex/auth.ts

@@ -0,0 +1,8 @@
+import { httpRouter } from "convex/server";
+import { auth } from "./auth";
+
+const http = httpRouter();
+
+auth.addHttpRoutes(http);
+
+export default http;

convex/http.ts

@@ -0,0 +1,9 @@
+import { defineSchema } from "convex/server";
+import { authTables } from "@convex-dev/auth/server";
+ 
+const schema = defineSchema({
+  ...authTables,
+  // Your other tables...
+});
+ 
+export default schema;

convex/schema.ts

@@ -11,6 +11,8 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
+    "@auth/core": "0.37.0",
+    "@convex-dev/auth": "^0.0.91",
     "convex": "^1.32.0",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"

package.json

@@ -1,35 +1,12 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
-import './App.css'
+import './App.css';
 
 function App() {
-  const [count, setCount] = useState(0)
-
+  
   return (
-    <>
-      <div>
-        <a href="https://vite.dev" target="_blank">
-          <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
-        <a href="https://react.dev" target="_blank">
-          <img src={reactLogo} className="logo react" alt="React logo" />
-        </a>
-      </div>
-      <h1>Vite + React</h1>
-      <div className="card">
-        <button onClick={() => setCount((count) => count + 1)}>
-          count is {count}
-        </button>
-        <p>
-          Edit <code>src/App.tsx</code> and save to test HMR
-        </p>
-      </div>
-      <p className="read-the-docs">
-        Click on the Vite and React logos to learn more
-      </p>
-    </>
+    <div>
+      App
+    </div>
   )
-}
+};
 
 export default App

src/App.tsx

@@ -0,0 +1,21 @@
+import { useAuthActions } from "@convex-dev/auth/react";
+ 
+export function SignIn() {
+  const { signIn } = useAuthActions();
+  return (
+    <button onClick={() => {
+        console.log("Signing in...");
+        void signIn("google").then(() => console.log("Signed in!"));
+    }}>Sign in with Google</button>
+  );
+}
+
+export function SignOut() {
+  const { signOut } = useAuthActions();
+  return (
+    <button onClick={() => {
+        console.log("Signing out...");
+        void signOut().then(() => console.log("Signed out!"));
+    }}>Sign Out</button>
+  );
+}