create-croissant 0.1.46 → 0.1.48

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);
-      }}
-    />
-  );
-}

package/template/apps/mobile/components/hello-wave.tsx

@@ -1,20 +0,0 @@
-import Animated from "react-native-reanimated";
-
-export function HelloWave() {
-  return (
-    <Animated.Text
-      style={{
-        fontSize: 28,
-        lineHeight: 32,
-        marginTop: -6,
-        animationName: {
-          "50%": { transform: [{ rotate: "25deg" }] },
-        },
-        animationIterationCount: 4,
-        animationDuration: "300ms",
-      }}
-    >
-      👋
-    </Animated.Text>
-  );
-}

package/template/apps/mobile/components/parallax-scroll-view.tsx

@@ -1,81 +0,0 @@
-import type { PropsWithChildren, ReactElement } from "react";
-import { StyleSheet } from "react-native";
-import Animated, {
-  interpolate,
-  useAnimatedRef,
-  useAnimatedStyle,
-  useScrollOffset,
-} from "react-native-reanimated";
-
-import { ThemedView } from "@/components/themed-view";
-import { useColorScheme } from "@/hooks/use-color-scheme";
-import { useThemeColor } from "@/hooks/use-theme-color";
-
-const HEADER_HEIGHT = 250;
-
-type Props = PropsWithChildren<{
-  headerImage: ReactElement;
-  headerBackgroundColor: { dark: string; light: string };
-}>;
-
-export default function ParallaxScrollView({
-  children,
-  headerImage,
-  headerBackgroundColor,
-}: Props) {
-  const backgroundColor = useThemeColor({}, "background");
-  const colorScheme = useColorScheme() ?? "light";
-  const scrollRef = useAnimatedRef<Animated.ScrollView>();
-  const scrollOffset = useScrollOffset(scrollRef);
-  const headerAnimatedStyle = useAnimatedStyle(() => {
-    return {
-      transform: [
-        {
-          translateY: interpolate(
-            scrollOffset.value,
-            [-HEADER_HEIGHT, 0, HEADER_HEIGHT],
-            [-HEADER_HEIGHT / 2, 0, HEADER_HEIGHT * 0.75],
-          ),
-        },
-        {
-          scale: interpolate(scrollOffset.value, [-HEADER_HEIGHT, 0, HEADER_HEIGHT], [2, 1, 1]),
-        },
-      ],
-    };
-  });
-
-  return (
-    <Animated.ScrollView
-      ref={scrollRef}
-      style={{ backgroundColor, flex: 1 }}
-      scrollEventThrottle={16}
-    >
-      <Animated.View
-        style={[
-          styles.header,
-          { backgroundColor: headerBackgroundColor[colorScheme] },
-          headerAnimatedStyle,
-        ]}
-      >
-        {headerImage}
-      </Animated.View>
-      <ThemedView style={styles.content}>{children}</ThemedView>
-    </Animated.ScrollView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-  header: {
-    height: HEADER_HEIGHT,
-    overflow: "hidden",
-  },
-  content: {
-    flex: 1,
-    padding: 32,
-    gap: 16,
-    overflow: "hidden",
-  },
-});

package/template/apps/mobile/components/themed-text.tsx

@@ -1,60 +0,0 @@
-import { StyleSheet, Text, type TextProps } from "react-native";
-
-import { useThemeColor } from "@/hooks/use-theme-color";
-
-export type ThemedTextProps = TextProps & {
-  lightColor?: string;
-  darkColor?: string;
-  type?: "default" | "title" | "defaultSemiBold" | "subtitle" | "link";
-};
-
-export function ThemedText({
-  style,
-  lightColor,
-  darkColor,
-  type = "default",
-  ...rest
-}: ThemedTextProps) {
-  const color = useThemeColor({ light: lightColor, dark: darkColor }, "text");
-
-  return (
-    <Text
-      style={[
-        { color },
-        type === "default" ? styles.default : undefined,
-        type === "title" ? styles.title : undefined,
-        type === "defaultSemiBold" ? styles.defaultSemiBold : undefined,
-        type === "subtitle" ? styles.subtitle : undefined,
-        type === "link" ? styles.link : undefined,
-        style,
-      ]}
-      {...rest}
-    />
-  );
-}
-
-const styles = StyleSheet.create({
-  default: {
-    fontSize: 16,
-    lineHeight: 24,
-  },
-  defaultSemiBold: {
-    fontSize: 16,
-    lineHeight: 24,
-    fontWeight: "600",
-  },
-  title: {
-    fontSize: 32,
-    fontWeight: "bold",
-    lineHeight: 32,
-  },
-  subtitle: {
-    fontSize: 20,
-    fontWeight: "bold",
-  },
-  link: {
-    lineHeight: 30,
-    fontSize: 16,
-    color: "#0a7ea4",
-  },
-});

package/template/apps/mobile/components/themed-view.tsx

@@ -1,14 +0,0 @@
-import { View, type ViewProps } from "react-native";
-
-import { useThemeColor } from "@/hooks/use-theme-color";
-
-export type ThemedViewProps = ViewProps & {
-  lightColor?: string;
-  darkColor?: string;
-};
-
-export function ThemedView({ style, lightColor, darkColor, ...otherProps }: ThemedViewProps) {
-  const backgroundColor = useThemeColor({ light: lightColor, dark: darkColor }, "background");
-
-  return <View style={[{ backgroundColor }, style]} {...otherProps} />;
-}

package/template/apps/mobile/components/ui/button.tsx

@@ -1,86 +0,0 @@
-import React from "react";
-import { TouchableOpacity, Text, StyleSheet, ActivityIndicator, ViewStyle, StyleProp } from "react-native";
-
-interface ButtonProps {
-  onPress: () => void;
-  children: React.ReactNode;
-  disabled?: boolean;
-  loading?: boolean;
-  variant?: "primary" | "secondary" | "outline" | "destructive";
-  style?: StyleProp<ViewStyle>;
-}
-
-export function Button({ 
-  onPress, 
-  children, 
-  disabled, 
-  loading, 
-  variant = "primary",
-  style
-}: ButtonProps) {
-  const containerStyle = [
-    styles.button,
-    styles[variant],
-    disabled && styles.disabled,
-    style,
-  ];
-
-  const textStyle = [
-    styles.text,
-    variant === "outline" && styles.outlineText,
-    disabled && styles.disabledText,
-  ];
-
-  return (
-    <TouchableOpacity 
-      style={containerStyle} 
-      onPress={onPress} 
-      disabled={disabled || loading}
-    >
-      {loading ? (
-        <ActivityIndicator color={variant === "outline" ? "#000" : "#fff"} />
-      ) : (
-        <Text style={textStyle}>{children}</Text>
-      )}
-    </TouchableOpacity>
-  );
-}
-
-const styles = StyleSheet.create({
-  button: {
-    height: 48,
-    borderRadius: 8,
-    justifyContent: "center",
-    alignItems: "center",
-    paddingHorizontal: 16,
-  },
-  primary: {
-    backgroundColor: "#000",
-  },
-  secondary: {
-    backgroundColor: "#f0f0f0",
-  },
-  outline: {
-    backgroundColor: "transparent",
-    borderWidth: 1,
-    borderColor: "#e0e0e0",
-  },
-  destructive: {
-    backgroundColor: "#ef4444",
-  },
-  disabled: {
-    backgroundColor: "#ccc",
-    borderColor: "#ccc",
-  },
-  text: {
-    color: "#fff",
-    fontSize: 16,
-    fontWeight: "600",
-  },
-  outlineText: {
-    color: "#000",
-  },
-  disabledText: {
-    color: "#999",
-  },
-});