vibefast-cli 0.6.2 → 0.7.1

package/2/apps/native/src/app/(root)/(protected)/(tabs)/_layout.tsx

@@ -1,166 +0,0 @@
-import { isLiquidGlassAvailable } from 'expo-glass-effect';
-import { SplashScreen, Tabs, useRouter } from 'expo-router';
-import { Icon, Label, NativeTabs } from 'expo-router/unstable-native-tabs';
-import { useCallback, useEffect, useMemo, useRef } from 'react';
-import { Platform } from 'react-native';
-
-import {
-  Home,
-  Settings as SettingsIcon,
-  Style as StyleIcon,
-  User as UserIcon,
-} from '@/components/ui/icons';
-import { translate } from '@/lib';
-import { useAuthClientStore } from '@/lib/state';
-import { useThemeConfig } from '@/lib/use-theme-config';
-
-export default function TabLayout() {
-  const router = useRouter();
-  const isAuthenticated = useAuthClientStore((state) => state.isAuthenticated);
-  const authHydrated = useAuthClientStore((state) => !state.isLoading);
-  const theme = useThemeConfig();
-  const hasRedirectedRef = useRef(false);
-
-  const hideSplash = useCallback(async () => {
-    await SplashScreen.hideAsync();
-  }, []);
-
-  // Hide splash screen once auth is fully hydrated
-  useEffect(() => {
-    if (authHydrated) {
-      hideSplash();
-    }
-  }, [hideSplash, authHydrated]);
-
-  // Handle authentication redirect logic
-  useEffect(() => {
-    if (!authHydrated) {
-      return;
-    }
-
-    if (!isAuthenticated && !hasRedirectedRef.current) {
-      hasRedirectedRef.current = true;
-      router.replace('/login');
-      return;
-    }
-
-    if (isAuthenticated) {
-      hasRedirectedRef.current = false;
-    }
-  }, [authHydrated, isAuthenticated, router]);
-
-  // Translated titles
-  const homeTitle = translate('home.title');
-  const styleTitle = translate('style.title');
-  const profileTitle = translate('profile.title');
-  const settingsTitle = translate('settings.title');
-
-  // Memoized tab screen options
-  const tabsScreenOptions = useMemo(
-    () => ({
-      tabBarActiveTintColor: theme.colors.primary,
-      tabBarInactiveTintColor: theme.colors.secondaryForeground,
-      tabBarStyle: {
-        backgroundColor: theme.colors.background,
-        borderTopColor: theme.colors.border,
-        ...(Platform.OS === 'android' && {
-          height: 112,
-          paddingTop: 4,
-        }),
-      },
-    }),
-    [
-      theme.colors.background,
-      theme.colors.border,
-      theme.colors.primary,
-      theme.colors.secondaryForeground,
-    ],
-  );
-
-  // Wait for auth to be fully hydrated before making routing decisions
-  // This prevents Fast Refresh from prematurely redirecting to login
-  if (!authHydrated) {
-    return null; // Keep splash screen visible
-  }
-
-  // Redirect to login if not authenticated
-  if (!isAuthenticated) {
-    return null;
-  }
-
-  if (isLiquidGlassAvailable()) {
-    return (
-      <>
-        <NativeTabs>
-          <NativeTabs.Trigger name="index">
-            <Icon sf="house" />
-            <Label>Home</Label>
-          </NativeTabs.Trigger>
-          <NativeTabs.Trigger name="style" disableScrollToTop>
-            <Icon sf="paintpalette.fill" />
-            <Label>Style</Label>
-          </NativeTabs.Trigger>
-          <NativeTabs.Trigger name="profile">
-            <Icon sf="person.fill" />
-            <Label>Profile</Label>
-          </NativeTabs.Trigger>
-          <NativeTabs.Trigger name="settings">
-            <Icon sf="gear" />
-            <Label>Settings</Label>
-          </NativeTabs.Trigger>
-        </NativeTabs>
-      </>
-    );
-  }
-  return (
-    <>
-      <Tabs screenOptions={tabsScreenOptions}>
-        <Tabs.Screen
-          name="index"
-          options={{
-            title: homeTitle,
-            tabBarIcon: ({ color }) => <Home color={color} />,
-            tabBarButtonTestID: 'home-tab',
-            headerShown: false,
-          }}
-        />
-        <Tabs.Screen
-          name="style"
-          options={{
-            title: styleTitle,
-            headerShown: true,
-            headerTintColor: theme.colors.text,
-            headerTitleAlign: 'center',
-            headerShadowVisible: false,
-            tabBarIcon: ({ color }) => <StyleIcon color={color} />,
-            tabBarButtonTestID: 'style-tab',
-          }}
-        />
-        <Tabs.Screen
-          name="profile"
-          options={{
-            title: profileTitle,
-            headerShown: true,
-            headerTintColor: theme.colors.text,
-            headerTitleAlign: 'center',
-            headerShadowVisible: false,
-            tabBarIcon: ({ color }) => <UserIcon color={color} />,
-            tabBarButtonTestID: 'profile-tab',
-          }}
-        />
-        <Tabs.Screen
-          name="settings"
-          options={{
-            title: settingsTitle,
-            headerShown: true,
-            headerTintColor: theme.colors.text,
-            headerTitleAlign: 'center',
-            headerShadowVisible: false,
-            tabBarIcon: ({ color }) => <SettingsIcon color={color} />,
-            tabBarButtonTestID: 'settings-tab',
-          }}
-        />
-      </Tabs>
-    </>
-  );
-}

package/2/apps/native/src/app/(root)/(protected)/(tabs)/index.tsx

@@ -1,174 +0,0 @@
-import { router, Stack } from 'expo-router';
-import { ScrollView, View } from 'react-native';
-import { useSharedValue } from 'react-native-reanimated';
-
-import { FeatureButton, FocusAwareStatusBar } from '@/components/ui';
-import { vibefastFeatures } from '@/features/vibefast-features';
-import { translate } from '@/lib';
-import { useResponsiveSize } from '@/lib/hooks';
-import { useScreenOptions } from '@/lib/hooks/use-navigation-options';
-import { useThemeConfig } from '@/lib/use-theme-config';
-
-export default function Home() {
-  const { isTablet } = useResponsiveSize();
-  const scrollY = useSharedValue(0);
-  const theme = useThemeConfig();
-
-  const builtInFeatures = [
-    {
-      id: 'voice-bot',
-      title: 'Voice Assistant',
-      icon: '🗣️',
-      color: '#14B8A6', // teal
-      description: 'Have real-time voice conversations with AI',
-      route: '/voice-bot',
-      testID: 'voice-bot-button',
-    },
-    {
-      id: 'chatbot',
-      title: translate('home.features.ai_assistant'),
-      icon: '💬',
-      color: '#F43F5E', // rose
-      description: translate('home.features.ai_assistant_description'),
-      route: '/chatbot',
-      testID: 'chatbot-button',
-    },
-    {
-      id: 'image-generator',
-      title: translate('home.features.image_generator'),
-      icon: '🎨',
-      color: '#A855F7', // violet
-      description: translate('home.features.image_generator_description'),
-      route: '/image-generator',
-      testID: 'image-generator-button',
-    },
-    {
-      id: 'quiz',
-      title: 'Quiz',
-      icon: '📱',
-      color: '#F97316', // orange
-      description: 'Take a fun and engaging quiz!',
-      route: '/quiz',
-      testID: 'quiz-button',
-    },
-    {
-      id: 'analytics',
-      title: translate('home.features.chart_preview'),
-      icon: '📊',
-      color: '#6366F1', // indigo (distinct from sky)
-      description: translate('home.features.chart_preview_description'),
-      route: '/charts',
-      testID: 'analytics-button',
-    },
-    {
-      id: 'face-analysis',
-      title: translate('home.features.image_analysis'),
-      icon: '🔍',
-      color: '#22C55E', // green
-      description: translate('home.features.image_analysis_description'),
-      route: '/analysis/face-analysis',
-      testID: 'face-analysis-button',
-    },
-    {
-      id: 'audio-recorder',
-      title: translate('home.features.voice_notes'),
-      icon: '🎤',
-      color: '#EF4444', // red
-      description: translate('home.features.voice_notes_description'),
-      route: '/audio-recorder',
-      testID: 'audio-recorder-button',
-    },
-    {
-      id: 'wake-word-test',
-      title: 'Wake Word Test',
-      icon: '🎤',
-      color: '#0EA5E9', // sky
-      description: 'Test "Hello World" wake word detection',
-      route: '/test-wake-word',
-      testID: 'wake-word-test-button',
-    },
-    {
-      id: 'onboarding',
-      title: translate('home.features.onboarding'),
-      icon: '🎯',
-      color: '#84CC16', // lime
-      description: translate('home.features.onboarding_description'),
-      route: '/onboarding',
-      testID: 'onboarding-selection-button',
-    },
-    {
-      id: 'paywall-selection',
-      title: translate('home.features.all_paywalls'),
-      icon: '💳',
-      color: '#F59E0B', // amber
-      description: translate('home.features.all_paywalls_description'),
-      route: '/paywall',
-      testID: 'paywall-selection-button',
-    },
-    {
-      id: 'tracker-app',
-      title: translate('home.features.tracker_app'),
-      icon: '🍎',
-      color: '#06B6D4', // cyan
-      description: translate('home.features.tracker_app_description'),
-      route: '/tracker-app',
-      testID: 'dashboard-warning-button',
-    },
-  ];
-
-  // Merge built-in features with VibeFast CLI installed features
-  const features = [...builtInFeatures, ...vibefastFeatures];
-
-  const handleFeaturePress = (route: string) => {
-    router.push(route as any);
-  };
-
-  // Determine grid columns based on screen size
-  const columns = isTablet ? 3 : 2;
-
-  const screenOptions = useScreenOptions(
-    {
-      title: translate('home.title'),
-      headerShown: false,
-    },
-    'scrollable',
-  );
-
-  return (
-    <>
-      <FocusAwareStatusBar />
-      <Stack.Screen options={screenOptions} />
-      {/* Scrollable Content */}
-      <ScrollView
-        style={{ backgroundColor: theme.colors.background }}
-        className="flex-1 pt-10"
-        onScroll={(event) => {
-          scrollY.value = event.nativeEvent.contentOffset.y;
-        }}
-        scrollEventThrottle={16}
-        showsVerticalScrollIndicator={false}
-      >
-        {/* Features Grid */}
-        <View className="px-6 py-8">
-          <View className="-mx-2 flex-row flex-wrap">
-            {features.map((feature) => (
-              <View
-                key={feature.id}
-                className={`px-2 pb-4 ${columns === 2 ? 'w-1/2' : 'w-1/3'}`}
-              >
-                <FeatureButton
-                  title={feature.title}
-                  icon={feature.icon}
-                  color={feature.color}
-                  description={feature.description}
-                  testID={feature.testID}
-                  onPress={() => handleFeaturePress(feature.route)}
-                />
-              </View>
-            ))}
-          </View>
-        </View>
-      </ScrollView>
-    </>
-  );
-}

package/2/apps/native/src/app/(root)/(protected)/(tabs)/profile.tsx

@@ -1,320 +0,0 @@
-import { Env } from '@env';
-import * as SecureStore from 'expo-secure-store';
-import type React from 'react';
-import { ActivityIndicator, Alert, ScrollView, View } from 'react-native';
-import { MMKV } from 'react-native-mmkv';
-
-import {
-  Button,
-  FocusAwareStatusBar,
-  handleError,
-  Text,
-} from '@/components/ui';
-import { User as UserIcon } from '@/components/ui/icons';
-import { defaultCacheService } from '@/core/cache';
-import { error as logError } from '@/core/logging';
-import { storage } from '@/core/storage';
-import { useConvexAuth } from '@/features/authentication/services';
-import { DebugInfo } from '@/features/settings/ui/debug-info';
-import { translate } from '@/lib';
-import { useThemeConfig } from '@/lib/use-theme-config';
-
-/**
- * Simple profile item component for displaying profile information
- */
-const ProfileItem = ({ label, value }: { label: string; value: string }) => (
-  <View className="flex-1 flex-row items-center justify-between p-3.5">
-    <Text className="text-base">{label}</Text>
-    <Text className="text-neutral-600 dark:text-white">{value}</Text>
-  </View>
-);
-
-/**
- * Simple profile container component with regular string title
- */
-const ProfileContainer = ({
-  title,
-  children,
-}: {
-  title: string;
-  children: React.ReactNode;
-}) => (
-  <>
-    <Text className="pb-2 pt-4 text-lg font-medium">{title}</Text>
-    <View className="rounded-md border border-neutral-200 dark:border-neutral-700 dark:bg-neutral-900">
-      {children}
-    </View>
-  </>
-);
-
-export default function Profile() {
-  const { userQuery, isLoading, signOut } = useConvexAuth();
-  const theme = useThemeConfig();
-  const isDarkMode = theme.dark;
-
-  if (isLoading) {
-    return (
-      <View className="flex-1 items-center justify-center">
-        <ActivityIndicator size="large" color={theme.colors.primary} />
-      </View>
-    );
-  }
-
-  const user = userQuery;
-  const displayName = user?.name || translate('profile.guest');
-  const email = user?.email || translate('profile.no_email');
-  const credits = user?.credits || 0;
-  const joinedDate = user?._creationTime
-    ? new Date(user._creationTime).toLocaleDateString()
-    : translate('profile.unknown');
-
-  const getAllMMKVData = (mmkvInstance: MMKV, instanceName: string) => {
-    const keys = mmkvInstance.getAllKeys();
-    const data = keys.map((key) => {
-      const str = mmkvInstance.getString(key);
-      if (str !== undefined) return { key, value: str, type: 'string' };
-
-      const num = mmkvInstance.getNumber(key);
-      if (num !== undefined) return { key, value: num, type: 'number' };
-
-      const bool = mmkvInstance.getBoolean(key);
-      if (bool !== undefined) return { key, value: bool, type: 'boolean' };
-
-      return { key, value: null, type: 'unknown' };
-    });
-
-    return { instanceName, keys: keys.length, data };
-  };
-
-  const handleViewAllMMKVData = () => {
-    try {
-      const legacyData = getAllMMKVData(storage, 'Legacy Storage');
-
-      const cacheServiceInstance = new MMKV();
-      const cacheData = getAllMMKVData(cacheServiceInstance, 'Cache Service');
-
-      const allData = [legacyData, cacheData];
-
-      let displayText = '';
-      let totalKeys = 0;
-
-      allData.forEach(({ instanceName, keys, data }) => {
-        totalKeys += keys;
-        displayText += `\n=== ${instanceName} (${keys} keys) ===\n`;
-
-        if (data.length === 0) {
-          displayText += 'No data found\n';
-        } else {
-          data.forEach(({ key, value, type }) => {
-            let displayValue = String(value);
-            if (type === 'string' && displayValue.length > 100) {
-              displayValue = displayValue.substring(0, 100) + '...';
-            }
-            displayText += `\n${key} (${type}):\n${displayValue}\n`;
-          });
-        }
-      });
-
-      if (totalKeys === 0) {
-        Alert.alert(
-          translate('profile.mmkv_debug'),
-          translate('profile.no_data_found'),
-        );
-      } else {
-        Alert.alert(
-          `${translate('profile.mmkv_debug')} (${totalKeys} total keys)`,
-          displayText.trim(),
-          [{ text: translate('common.ok') }],
-        );
-      }
-    } catch (error) {
-      Alert.alert(
-        translate('profile.error'),
-        translate('profile.failed_read_mmkv'),
-      );
-      handleError(error, {
-        feature: 'profile.mmkv_debug',
-        fallbackMessage: 'Error reading MMKV data',
-        toast: false,
-      });
-    }
-  };
-  const handleClearCache = async () => {
-    try {
-      await defaultCacheService.clearAll();
-      storage.clearAll();
-      // Remove Convex auth tokens stored via SecureStore adapter
-      const authKeys = [
-        'convexAuth:accessToken',
-        'convexAuth:refreshToken',
-        'convexAuth:tokenExpiresAt',
-      ];
-      await Promise.all(
-        authKeys.map((key) =>
-          SecureStore.deleteItemAsync(key).catch(() => undefined),
-        ),
-      );
-      await signOut();
-      Alert.alert(
-        translate('profile.success'),
-        translate('profile.storage_cleared'),
-      );
-    } catch (err) {
-      handleError(err, {
-        feature: 'profile.clear_storage',
-        toast: false, // Don't show toast since we're showing Alert
-      });
-      Alert.alert(
-        translate('profile.error'),
-        translate('profile.storage_clear_failed'),
-      );
-    }
-  };
-  const handleViewCacheKeys = async () => {
-    try {
-      const commonCacheKeys = [
-        'chatbot_settings',
-        'image_generator_settings',
-        'gallery_images',
-        'onboarding_completed',
-        'theme_preference',
-        'language_preference',
-      ];
-
-      const foundKeys: string[] = [];
-
-      for (const key of commonCacheKeys) {
-        try {
-          const value = await defaultCacheService.getItem(key);
-          if (value !== null) {
-            foundKeys.push(`${key}: Found`);
-          }
-        } catch (error) {
-          logError(
-            error instanceof Error
-              ? error
-              : new Error(`Error checking key ${key}`),
-            { feature: 'profile.cache_keys', key },
-          );
-        }
-      }
-
-      if (foundKeys.length === 0) {
-        Alert.alert(
-          translate('profile.cache_keys_found'),
-          translate('profile.no_cache_keys'),
-        );
-      } else {
-        Alert.alert(
-          translate('profile.cache_keys_found'),
-          foundKeys.join('\n'),
-        );
-      }
-    } catch (error) {
-      Alert.alert(
-        translate('profile.error'),
-        translate('profile.failed_view_cache'),
-      );
-      handleError(error, {
-        feature: 'profile.cache_keys',
-        fallbackMessage: 'Error viewing cache keys',
-        toast: false,
-      });
-    }
-  };
-
-  return (
-    <>
-      <FocusAwareStatusBar />
-      <ScrollView className="bg-background pt-6">
-        <View className="flex-1 px-4">
-          <View className="mb-2 flex items-center">
-            <View
-              className={`size-24 items-center justify-center rounded-full ${
-                isDarkMode ? 'bg-neutral-900' : 'bg-neutral-200'
-              }`}
-            >
-              <UserIcon
-                color={isDarkMode ? '#9CA3AF' : '#6B7280'}
-                width={42}
-                height={42}
-              />
-            </View>
-          </View>
-
-          {/* Account Information */}
-          <ProfileContainer title={translate('profile.account_information')}>
-            <ProfileItem
-              label={translate('profile.name')}
-              value={displayName}
-            />
-            <ProfileItem label={translate('profile.email')} value={email} />
-            <ProfileItem
-              label={translate('profile.member_since')}
-              value={joinedDate}
-            />
-            <ProfileItem
-              label={translate('profile.available_credits')}
-              value={credits.toString()}
-            />
-          </ProfileContainer>
-
-          {/* App Information */}
-          <ProfileContainer title={translate('profile.app_information')}>
-            <ProfileItem
-              label={translate('profile.version')}
-              value={Env.VERSION}
-            />
-            <ProfileItem
-              label={translate('profile.environment')}
-              value={Env.APP_ENV}
-            />
-          </ProfileContainer>
-
-          {/* Developer Tools - Only visible in local environment */}
-          {Env.APP_ENV === 'local' && (
-            <>
-              <Text className="pb-2 pt-10 text-lg font-medium">
-                {translate('profile.development_only')}
-              </Text>
-              <View className="rounded-md border border-neutral-200 p-4 dark:border-neutral-700 dark:bg-neutral-900">
-                <Text className="mb-3 text-base font-medium">
-                  {translate('profile.storage_cache')}
-                </Text>
-
-                <Button
-                  size="sm"
-                  variant="outline"
-                  label={translate('profile.view_all_mmkv_data')}
-                  onPress={handleViewAllMMKVData}
-                  className="mb-2 h-10"
-                />
-
-                <Button
-                  size="sm"
-                  variant="outline"
-                  label={translate('profile.view_cache_keys')}
-                  onPress={handleViewCacheKeys}
-                  className="mb-2 h-10"
-                />
-
-                <Button
-                  size="sm"
-                  variant="destructive"
-                  label={translate('profile.clear_all_storage')}
-                  onPress={handleClearCache}
-                  className="mb-4 h-10"
-                />
-              </View>
-            </>
-          )}
-
-          {/* Debug Info - Only visible in local environment */}
-          {Env.APP_ENV === 'local' && <DebugInfo />}
-
-          <View className="mb-8" />
-        </View>
-      </ScrollView>
-    </>
-  );
-}