franpcode/create-better-t-stack
1
0
Fork 0
mirror of https://github.com/FranP-code/create-better-t-stack.git synced 2025-10-12 23:52:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add clerk auth support with convex (#548)

Browse Source
This commit is contained in:
Aman Varshney
2025-08-29 00:21:08 +05:30
committed by GitHub
parent 8d48ae0359
commit 54bcdf1cbc
153 changed files with 1954 additions and 771 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
apps/cli/templates/frontend/native/nativewind/app/(drawer)/index.tsx.hbs
View File

@@ -9,9 +9,17 @@ import { useQuery } from "@tanstack/react-query";
import { trpc } from "@/utils/trpc";
{{/if}}
{{#if (eq backend "convex")}}
{{#if (eq auth "clerk")}}
import { Link } from "expo-router";
import { Authenticated, AuthLoading, Unauthenticated, useQuery } from "convex/react";
import { api } from "@{{ projectName }}/backend/convex/_generated/api";
import { useUser } from "@clerk/clerk-expo";
import { SignOutButton } from "@/components/sign-out-button";
{{else}}
import { useQuery } from "convex/react";
import { api } from "@{{ projectName }}/backend/convex/_generated/api";
{{/if}}
{{/if}}
export default function Home() {
{{#if (eq api "orpc")}}
@@ -21,21 +29,27 @@ export default function Home() {
const healthCheck = useQuery(trpc.healthCheck.queryOptions());
{{/if}}
{{#if (eq backend "convex")}}
{{#if (eq auth "clerk")}}
const { user } = useUser();
const healthCheck = useQuery(api.healthCheck.get);
const privateData = useQuery(api.privateData.get);
{{else}}
const healthCheck = useQuery(api.healthCheck.get);
{{/if}}
{{/if}}
return (
<Container>
<ScrollView showsVerticalScrollIndicator={false} className="flex-1">
<Text className="font-mono text-foreground text-3xl font-bold mb-4">
BETTER T STACK
</Text>
BETTER T STACK
</Text>
<View className="bg-card border border-border rounded-xl p-6 mb-6 shadow-sm">
{{#if (eq backend "convex")}}
<View className="flex-row items-center gap-3">
<View
className={`h-3 w-3 rounded-full ${
healthCheck ? "bg-green-500" : "bg-orange-500"
healthCheck ? "bg-green-500" : "bg-orange-500"
}`}
/>
<View className="flex-1">
@@ -89,6 +103,24 @@ export default function Home() {
{{/unless}}
{{/if}}
</View>
{{#if (and (eq backend "convex") (eq auth "clerk"))}}
<Authenticated>
<Text>Hello {user?.emailAddresses[0].emailAddress}</Text>
<Text>Private Data: {privateData?.message}</Text>
<SignOutButton />
</Authenticated>
<Unauthenticated>
<Link href="/(auth)/sign-in">
<Text>Sign in</Text>
</Link>
<Link href="/(auth)/sign-up">
<Text>Sign up</Text>
</Link>
</Unauthenticated>
<AuthLoading>
<Text>Loading...</Text>
</AuthLoading>
{{/if}}
</ScrollView>
</Container>
);