create-croissant 0.1.47 → 0.1.48

package/template/apps/mobile/app/(tabs)/index.tsx

@@ -1,112 +0,0 @@
-import { useEffect } from "react";
-import { View, Text, StyleSheet, ScrollView, Platform } from "react-native";
-import { useRouter } from "expo-router";
-import { authClient } from "@/lib/auth-client";
-import { useSecretData } from "@workspace/orpc/react";
-import { Button } from "@/components/ui/button";
-
-export default function DashboardScreen() {
-  const router = useRouter();
-  const { data: session, isPending: isAuthPending } = authClient.useSession();
-  
-  const { data: secretData, isLoading: isLoadingSecret, error: secretError } = useSecretData({
-    enabled: !!session,
-  });
-
-  useEffect(() => {
-    if (!isAuthPending && !session) {
-      router.replace("/login");
-    }
-  }, [session, isAuthPending, router]);
-
-  const handleSignOut = async () => {
-    await authClient.signOut();
-    router.replace("/");
-  };
-
-  if (isAuthPending) {
-    return (
-      <View style={styles.center}>
-        <Text>Loading dashboard...</Text>
-      </View>
-    );
-  }
-
-  return (
-    <ScrollView style={styles.container} contentContainerStyle={styles.content}>
-      <Text style={styles.title}>Dashboard</Text>
-      <Text style={styles.welcome}>Welcome, {session?.user?.name}!</Text>
-      <Text style={styles.description}>
-        This is a protected page. Only authenticated users can see this.
-      </Text>
-
-      <View style={styles.secureBox}>
-        <Text style={styles.secureTitle}>Secure oRPC Data:</Text>
-        {isLoadingSecret ? (
-          <Text style={styles.secureContent}>Loading secret data...</Text>
-        ) : secretError ? (
-          <Text style={[styles.secureContent, styles.errorText]}>
-            Error: {secretError.message || "Unknown error"}
-          </Text>
-        ) : (
-          <Text style={styles.secureContent}>{secretData?.secret}</Text>
-        )}
-      </View>
-
-      <Button variant="destructive" onPress={handleSignOut} style={styles.signOutBtn}>
-        Sign Out
-      </Button>
-    </ScrollView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#fff",
-  },
-  content: {
-    padding: 24,
-  },
-  center: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-  },
-  title: {
-    fontSize: 28,
-    fontWeight: "bold",
-    marginBottom: 8,
-  },
-  welcome: {
-    fontSize: 18,
-    marginBottom: 8,
-  },
-  description: {
-    fontSize: 14,
-    color: "#666",
-    marginBottom: 24,
-  },
-  secureBox: {
-    padding: 16,
-    backgroundColor: "#f9f9f9",
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: "#eee",
-    marginBottom: 24,
-  },
-  secureTitle: {
-    fontWeight: "600",
-    marginBottom: 8,
-  },
-  secureContent: {
-    fontFamily: Platform.OS === "ios" ? "Courier" : "monospace",
-    fontSize: 12,
-  },
-  errorText: {
-    color: "#ef4444",
-  },
-  signOutBtn: {
-    marginTop: 12,
-  },
-});

package/template/apps/mobile/app/_layout.tsx

@@ -1,43 +0,0 @@
-import { DarkTheme, DefaultTheme, ThemeProvider } from "@react-navigation/native";
-import { Stack } from "expo-router";
-import { StatusBar } from "expo-status-bar";
-import "react-native-reanimated";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { ORPCProvider } from "@workspace/orpc/react";
-import { orpc } from "@/lib/orpc";
-
-import { useColorScheme } from "@/hooks/use-color-scheme";
-
-const queryClient = new QueryClient({
-  defaultOptions: {
-    mutations: {
-      onError: (error) => {
-        console.error("Global Mutation Error:", error);
-      },
-    },
-  },
-});
-
-export const unstable_settings = {
-  anchor: "(tabs)",
-};
-
-export default function RootLayout() {
-  const colorScheme = useColorScheme();
-
-  return (
-    <QueryClientProvider client={queryClient}>
-      <ORPCProvider client={orpc}>
-        <ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
-          <Stack>
-            <Stack.Screen name="index" options={{ headerShown: false }} />
-            <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
-            <Stack.Screen name="login" options={{ title: "Login" }} />
-            <Stack.Screen name="signup" options={{ title: "Sign Up" }} />
-          </Stack>
-          <StatusBar style="auto" />
-        </ThemeProvider>
-      </ORPCProvider>
-    </QueryClientProvider>
-  );
-}

package/template/apps/mobile/app/index.tsx

@@ -1,129 +0,0 @@
-import { View, Text, StyleSheet, ScrollView } from "react-native";
-import { useRouter } from "expo-router";
-import { Button } from "@/components/ui/button";
-import { usePlanets, useHello } from "@workspace/orpc/react";
-
-export default function LandingScreen() {
-  const router = useRouter();
-  const { data: helloData, isLoading: isHelloLoading } = useHello("Croissant Stack Mobile");
-  const { data: planets = [], isLoading: isPlanetsLoading } = usePlanets();
-
-  return (
-    <ScrollView style={styles.container} contentContainerStyle={styles.content}>
-      <View style={styles.header}>
-        <Text style={styles.title}>Project ready!</Text>
-        <Text style={styles.subtitle}>
-          oRPC integration: <Text style={styles.bold}>
-            {isHelloLoading ? "Loading..." : helloData?.message}
-          </Text>
-        </Text>
-      </View>
-
-      <View style={styles.section}>
-        <Text style={styles.sectionTitle}>Planets from Database:</Text>
-        {isPlanetsLoading ? (
-          <Text style={styles.loading}>Loading planets...</Text>
-        ) : planets.length === 0 ? (
-          <Text style={styles.empty}>
-            No planets found in the database. Run `db:push` and seed data if needed.
-          </Text>
-        ) : (
-          planets.map((planet: any) => (
-            <View key={planet.id} style={styles.planetCard}>
-              <Text style={styles.planetName}>{planet.name}</Text>
-              <Text style={styles.planetDesc}>{planet.description}</Text>
-            </View>
-          ))
-        )}
-      </View>
-
-      <View style={styles.footer}>
-        <Button onPress={() => router.push("/login")} style={styles.button}>
-          Go to Login
-        </Button>
-        <Button 
-          onPress={() => router.push("/(tabs)")} 
-          variant="outline" 
-          style={styles.button}
-        >
-          Go to Dashboard
-        </Button>
-        <Text style={styles.footerText}>
-          You may now add components and start building.
-        </Text>
-      </View>
-    </ScrollView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#fff",
-  },
-  content: {
-    padding: 24,
-    paddingTop: 60,
-  },
-  header: {
-    marginBottom: 32,
-  },
-  title: {
-    fontSize: 28,
-    fontWeight: "bold",
-    marginBottom: 8,
-  },
-  subtitle: {
-    fontSize: 16,
-    color: "#666",
-  },
-  bold: {
-    fontWeight: "bold",
-    color: "#000",
-  },
-  section: {
-    marginBottom: 32,
-  },
-  sectionTitle: {
-    fontSize: 20,
-    fontWeight: "600",
-    marginBottom: 16,
-  },
-  planetCard: {
-    padding: 16,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: "#eee",
-    marginBottom: 12,
-    backgroundColor: "#fafafa",
-  },
-  planetName: {
-    fontSize: 16,
-    fontWeight: "bold",
-    marginBottom: 4,
-  },
-  planetDesc: {
-    fontSize: 14,
-    color: "#666",
-  },
-  loading: {
-    fontStyle: "italic",
-    color: "#999",
-  },
-  empty: {
-    fontStyle: "italic",
-    color: "#999",
-  },
-  footer: {
-    gap: 12,
-  },
-  button: {
-    width: "100%",
-  },
-  footerText: {
-    marginTop: 16,
-    textAlign: "center",
-    color: "#999",
-    fontSize: 14,
-  },
-});

package/template/apps/mobile/app/login.tsx

@@ -1,135 +0,0 @@
-import { useState } from "react";
-import { View, StyleSheet, KeyboardAvoidingView, Platform, ScrollView, Text } from "react-native";
-import { useRouter } from "expo-router";
-import { authClient } from "@/lib/auth-client";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-
-export default function LoginScreen() {
-  const router = useRouter();
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const handleLogin = async () => {
-    if (!email || !password) {
-      setError("Please fill in all fields");
-      return;
-    }
-    
-    setLoading(true);
-    setError(null);
-    try {
-      const { error } = await authClient.signIn.email({
-        email,
-        password,
-      });
-      
-      if (error) {
-        setError(error.message || "Invalid credentials");
-      } else {
-        router.replace("/(tabs)");
-      }
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "An error occurred during login");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return (
-    <KeyboardAvoidingView
-      behavior={Platform.OS === "ios" ? "padding" : "height"}
-      style={styles.container}
-    >
-      <ScrollView contentContainerStyle={styles.scrollContent}>
-        <View style={styles.header}>
-          <Text style={styles.title}>Welcome Back</Text>
-          <Text style={styles.subtitle}>Sign in to your account</Text>
-        </View>
-
-        <View style={styles.form}>
-          <Input
-            label="Email"
-            placeholder="email@example.com"
-            value={email}
-            onChangeText={setEmail}
-            autoCapitalize="none"
-            keyboardType="email-address"
-          />
-
-          <Input
-            label="Password"
-            placeholder="••••••••"
-            value={password}
-            onChangeText={setPassword}
-            secureTextEntry
-          />
-
-          {error && <Text style={styles.errorText}>{error}</Text>}
-
-          <Button
-            onPress={handleLogin}
-            loading={loading}
-          >
-            Sign In
-          </Button>
-
-          <View style={styles.footer}>
-            <Text style={styles.footerText}>Don't have an account? </Text>
-            <Text
-              style={styles.link}
-              onPress={() => router.push("/signup")}
-            >
-              Sign Up
-            </Text>
-          </View>
-        </View>
-      </ScrollView>
-    </KeyboardAvoidingView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#fff",
-  },
-  scrollContent: {
-    flexGrow: 1,
-    padding: 24,
-    justifyContent: "center",
-  },
-  header: {
-    marginBottom: 40,
-  },
-  title: {
-    fontSize: 32,
-    fontWeight: "bold",
-    marginBottom: 8,
-  },
-  subtitle: {
-    fontSize: 16,
-    color: "#666",
-  },
-  form: {
-    gap: 20,
-  },
-  errorText: {
-    color: "#ef4444",
-    fontSize: 14,
-  },
-  footer: {
-    flexDirection: "row",
-    justifyContent: "center",
-    marginTop: 20,
-  },
-  footerText: {
-    color: "#666",
-  },
-  link: {
-    color: "#000",
-    fontWeight: "bold",
-  },
-});

package/template/apps/mobile/app/signup.tsx

@@ -1,144 +0,0 @@
-import { useState } from "react";
-import { View, StyleSheet, KeyboardAvoidingView, Platform, ScrollView, Text } from "react-native";
-import { useRouter } from "expo-router";
-import { authClient } from "@/lib/auth-client";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-
-export default function SignupScreen() {
-  const router = useRouter();
-  const [name, setName] = useState("");
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const handleSignup = async () => {
-    if (!name || !email || !password) {
-      setError("Please fill in all fields");
-      return;
-    }
-    
-    setLoading(true);
-    setError(null);
-    try {
-      const { error } = await authClient.signUp.email({
-        email,
-        password,
-        name,
-      });
-      
-      if (error) {
-        setError(error.message || "An error occurred during signup");
-      } else {
-        router.replace("/(tabs)");
-      }
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "An error occurred during signup");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return (
-    <KeyboardAvoidingView
-      behavior={Platform.OS === "ios" ? "padding" : "height"}
-      style={styles.container}
-    >
-      <ScrollView contentContainerStyle={styles.scrollContent}>
-        <View style={styles.header}>
-          <Text style={styles.title}>Create Account</Text>
-          <Text style={styles.subtitle}>Join the Croissant Stack</Text>
-        </View>
-
-        <View style={styles.form}>
-          <Input
-            label="Name"
-            placeholder="John Doe"
-            value={name}
-            onChangeText={setName}
-          />
-
-          <Input
-            label="Email"
-            placeholder="email@example.com"
-            value={email}
-            onChangeText={setEmail}
-            autoCapitalize="none"
-            keyboardType="email-address"
-          />
-
-          <Input
-            label="Password"
-            placeholder="••••••••"
-            value={password}
-            onChangeText={setPassword}
-            secureTextEntry
-          />
-
-          {error && <Text style={styles.errorText}>{error}</Text>}
-
-          <Button
-            onPress={handleSignup}
-            loading={loading}
-          >
-            Sign Up
-          </Button>
-
-          <View style={styles.footer}>
-            <Text style={styles.footerText}>Already have an account? </Text>
-            <Text
-              style={styles.link}
-              onPress={() => router.push("/login")}
-            >
-              Sign In
-            </Text>
-          </View>
-        </View>
-      </ScrollView>
-    </KeyboardAvoidingView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#fff",
-  },
-  scrollContent: {
-    flexGrow: 1,
-    padding: 24,
-    justifyContent: "center",
-  },
-  header: {
-    marginBottom: 40,
-  },
-  title: {
-    fontSize: 32,
-    fontWeight: "bold",
-    marginBottom: 8,
-  },
-  subtitle: {
-    fontSize: 16,
-    color: "#666",
-  },
-  form: {
-    gap: 20,
-  },
-  errorText: {
-    color: "#ef4444",
-    fontSize: 14,
-  },
-  footer: {
-    flexDirection: "row",
-    justifyContent: "center",
-    marginTop: 20,
-  },
-  footerText: {
-    color: "#666",
-  },
-  link: {
-    color: "#000",
-    fontWeight: "bold",
-  },
-});

package/template/apps/mobile/app.json

@@ -1,56 +0,0 @@
-{
-  "expo": {
-    "name": "mobile",
-    "slug": "mobile",
-    "version": "1.0.0",
-    "orientation": "portrait",
-    "icon": "./assets/images/icon.png",
-    "scheme": "mobile",
-    "userInterfaceStyle": "automatic",
-    "newArchEnabled": true,
-    "ios": {
-      "supportsTablet": true,
-      "infoPlist": {
-        "NSAppTransportSecurity": {
-          "NSAllowsLocalNetworking": true
-        }
-      }
-    },
-    "android": {
-      "adaptiveIcon": {
-        "backgroundColor": "#E6F4FE",
-        "foregroundImage": "./assets/images/android-icon-foreground.png",
-        "backgroundImage": "./assets/images/android-icon-background.png",
-        "monochromeImage": "./assets/images/android-icon-monochrome.png"
-      },
-      "edgeToEdgeEnabled": true,
-      "predictiveBackGestureEnabled": false
-    },
-    "web": {
-      "output": "single",
-      "favicon": "./assets/images/favicon.png",
-      "bundler": "metro"
-    },
-    "plugins": [
-      "expo-router",
-      [
-        "expo-splash-screen",
-        {
-          "image": "./assets/images/splash-icon.png",
-          "imageWidth": 200,
-          "resizeMode": "contain",
-          "backgroundColor": "#ffffff",
-          "dark": {
-            "backgroundColor": "#000000"
-          }
-        }
-      ],
-      "expo-font",
-      "expo-image",
-      "expo-web-browser"
-    ],
-    "experiments": {
-      "typedRoutes": true
-    }
-  }
-}

package/template/apps/mobile/components/external-link.tsx

@@ -1,25 +0,0 @@
-import { Href, Link } from "expo-router";
-import { openBrowserAsync, WebBrowserPresentationStyle } from "expo-web-browser";
-import { type ComponentProps } from "react";
-
-type Props = Omit<ComponentProps<typeof Link>, "href"> & { href: Href & string };
-
-export function ExternalLink({ href, ...rest }: Props) {
-  return (
-    <Link
-      target="_blank"
-      {...rest}
-      href={href}
-      onPress={async (event) => {
-        if (process.env.EXPO_OS !== "web") {
-          // Prevent the default behavior of linking to the default browser on native.
-          event.preventDefault();
-          // Open the link in an in-app browser.
-          await openBrowserAsync(href, {
-            presentationStyle: WebBrowserPresentationStyle.AUTOMATIC,
-          });
-        }
-      }}
-    />
-  );
-}

package/template/apps/mobile/components/haptic-tab.tsx

@@ -1,18 +0,0 @@
-import { BottomTabBarButtonProps } from "@react-navigation/bottom-tabs";
-import { PlatformPressable } from "@react-navigation/elements";
-import * as Haptics from "expo-haptics";
-
-export function HapticTab(props: BottomTabBarButtonProps) {
-  return (
-    <PlatformPressable
-      {...props}
-      onPressIn={(ev) => {
-        if (process.env.EXPO_OS === "ios") {
-          // Add a soft haptic feedback when pressing down on the tabs.
-          Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
-        }
-        props.onPressIn?.(ev);
-      }}
-    />
-  );
-}