@umituz/react-native-ai-generation-content 1.26.2 → 1.26.4

package/src/features/love-message/presentation/components/StepPartner.tsx

@@ -1,116 +0,0 @@
-/**
- * StepPartner Component
- */
-
-import React from "react";
-import { View, Pressable, Switch, StyleSheet, ImageBackground } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
-import { PartnerInput } from "./PartnerInput";
-
-interface StepPartnerProps {
-  partnerName: string;
-  setPartnerName: (name: string) => void;
-  useProfile: boolean;
-  setUseProfile: (val: boolean) => void;
-  hasProfile: boolean;
-  onEditProfile: () => void;
-}
-
-export const StepPartner: React.FC<StepPartnerProps> = ({
-  partnerName,
-  setPartnerName,
-  useProfile,
-  setUseProfile,
-  hasProfile,
-  onEditProfile,
-}) => {
-  const tokens = useAppDesignTokens();
-  const { t } = useLocalization();
-
-  return (
-    <View>
-      <PartnerInput value={partnerName} onChangeText={setPartnerName} />
-      
-      <Pressable 
-        onPress={onEditProfile}
-        style={[styles.profileCard, { backgroundColor: tokens.colors.surfaceSecondary }]}
-      >
-        <View style={styles.profileLeft}>
-          <View style={[styles.profileIconCircle, { backgroundColor: `${tokens.colors.primary}20` }]}>
-            <AtomicIcon name="heart" color="primary" size="sm" />
-          </View>
-          <View>
-            <AtomicText type="labelMedium" color="textPrimary">
-              {hasProfile ? t("loveMessage.editPartnerProfile") : t("loveMessage.partnerProfile.title")}
-            </AtomicText>
-            <AtomicText type="bodySmall" color="textTertiary">
-              {t("loveMessage.partnerProfile.subtitle")}
-            </AtomicText>
-          </View>
-        </View>
-        <Switch 
-          value={useProfile} 
-          onValueChange={setUseProfile}
-          trackColor={{ false: tokens.colors.borderLight, true: tokens.colors.primary }}
-          thumbColor="#fff"
-        />
-      </Pressable>
-
-      <ImageBackground
-        source={{ uri: 'https://images.unsplash.com/photo-1518621736915-f3b1c41bfd00?q=80&w=600&auto=format&fit=crop' }}
-        style={styles.decorativeCard}
-        imageStyle={{ borderRadius: 24, opacity: 0.6 }}
-      >
-        <View style={styles.decorativeOverlay}>
-          <AtomicText type="bodySmall" color="onPrimary" style={styles.decorativeQuote}>
-            {`"Words are the keys to the heart."`}
-          </AtomicText>
-        </View>
-      </ImageBackground>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  profileCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    padding: 16,
-    borderRadius: 20,
-    marginBottom: 24,
-  },
-  profileLeft: {
-    flexDirection: "row",
-    alignItems: "center",
-    flex: 1,
-  },
-  profileIconCircle: {
-    width: 40,
-    height: 40,
-    borderRadius: 20,
-    alignItems: "center",
-    justifyContent: "center",
-    marginRight: 12,
-  },
-  decorativeCard: {
-    width: '100%',
-    height: 160,
-    justifyContent: 'flex-end',
-    marginBottom: 24,
-  },
-  decorativeOverlay: {
-    padding: 20,
-    alignItems: 'center',
-  },
-  decorativeQuote: {
-    fontStyle: 'italic',
-    textAlign: 'center',
-    fontWeight: 'bold',
-  },
-});

package/src/features/love-message/presentation/components/StepVibe.tsx

@@ -1,30 +0,0 @@
-/**
- * StepVibe Component
- */
-
-import React from "react";
-import { View } from "react-native";
-import { MessageType, MessageTone } from "../../domain/types";
-import { TypeSelector } from "./TypeSelector";
-import { ToneSelector } from "./ToneSelector";
-
-interface StepVibeProps {
-  selectedType: MessageType;
-  setSelectedType: (type: MessageType) => void;
-  selectedTone: MessageTone;
-  setSelectedTone: (tone: MessageTone) => void;
-}
-
-export const StepVibe: React.FC<StepVibeProps> = ({
-  selectedType,
-  setSelectedType,
-  selectedTone,
-  setSelectedTone,
-}) => {
-  return (
-    <View>
-      <TypeSelector selectedType={selectedType} onSelectType={setSelectedType} />
-      <ToneSelector selectedTone={selectedTone} onSelectTone={setSelectedTone} />
-    </View>
-  );
-};

package/src/features/love-message/presentation/components/ToneSelector.tsx

@@ -1,100 +0,0 @@
-/**
- * Message Tone Selector Component
- * Premium icon-based selector
- */
-
-import type { FC } from "react";
-import { View, Pressable, StyleSheet, ScrollView } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-  type IconName,
-} from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
-import { MESSAGE_TONES } from "../../domain/constants";
-import type { MessageTone } from "../../domain/types";
-
-interface ToneSelectorProps {
-  selectedTone: MessageTone;
-  onSelectTone: (tone: MessageTone) => void;
-}
-
-export const ToneSelector: FC<ToneSelectorProps> = ({
-  selectedTone,
-  onSelectTone,
-}) => {
-  const tokens = useAppDesignTokens();
-  const { t } = useLocalization();
-
-  return (
-    <View style={styles.container}>
-      <AtomicText type="labelLarge" color="textPrimary" style={styles.label}>
-        {t("loveMessage.tone")}
-      </AtomicText>
-      <ScrollView
-        horizontal
-        showsHorizontalScrollIndicator={false}
-        contentContainerStyle={styles.scrollContent}
-      >
-        {MESSAGE_TONES.map((config) => {
-          const isSelected = selectedTone === config.tone;
-          return (
-            <Pressable
-              key={config.tone}
-              onPress={() => onSelectTone(config.tone)}
-              style={[
-                styles.item,
-                {
-                  backgroundColor: isSelected
-                    ? tokens.colors.primary
-                    : tokens.colors.surfaceSecondary,
-                  borderColor: isSelected
-                    ? tokens.colors.primary
-                    : tokens.colors.borderLight,
-                },
-              ]}
-            >
-              <AtomicIcon
-                name={config.icon as IconName}
-                color={isSelected ? "onPrimary" : "secondary"}
-                size="sm"
-                style={styles.icon}
-              />
-              <AtomicText
-                type="labelSmall"
-                color={isSelected ? "onPrimary" : "textSecondary"}
-              >
-                {t(config.labelKey)}
-              </AtomicText>
-            </Pressable>
-          );
-        })}
-      </ScrollView>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    marginBottom: 24,
-  },
-  label: {
-    marginBottom: 12,
-  },
-  scrollContent: {
-    gap: 8,
-    paddingRight: 20,
-  },
-  item: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingVertical: 8,
-    paddingHorizontal: 16,
-    borderRadius: 20,
-    borderWidth: 1.5,
-  },
-  icon: {
-    marginRight: 6,
-  },
-});

package/src/features/love-message/presentation/components/TrendingSection.tsx

@@ -1,130 +0,0 @@
-/**
- * Trending Section Component
- */
-
-import React from "react";
-import { View, Pressable, ImageBackground, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
-
-interface TrendingSectionProps {
-  onViewAll: () => void;
-}
-
-export const TrendingSection: React.FC<TrendingSectionProps> = ({ onViewAll }) => {
-  const tokens = useAppDesignTokens();
-  const { t } = useLocalization();
-
-  return (
-    <View>
-      <View style={styles.sectionHeader}>
-        <AtomicText type="headlineSmall" color="textPrimary" style={styles.sectionTitle}>
-          {t("loveMessage.explore.trending")}
-        </AtomicText>
-        <Pressable onPress={onViewAll}>
-          <AtomicText type="labelMedium" color="primary">{t("loveMessage.explore.viewAll")}</AtomicText>
-        </Pressable>
-      </View>
-
-      <View style={styles.trendingContainer}>
-        <Pressable 
-          onPress={onViewAll}
-          style={[styles.trendingCard, { backgroundColor: tokens.colors.surface, borderColor: tokens.colors.borderLight }]}
-        >
-          <ImageBackground 
-            source={{ uri: 'https://images.unsplash.com/photo-1516589174184-c68526614488?q=80&w=200&auto=format&fit=crop' }} 
-            style={styles.trendingThumb}
-            imageStyle={{ borderRadius: 12 }}
-          />
-          <View style={styles.trendingContent}>
-            <AtomicText type="labelLarge" color="textPrimary">Deep Connection</AtomicText>
-            <AtomicText type="bodySmall" color="textTertiary" numberOfLines={1}>
-              Thoughtful AI generated notes for partners.
-            </AtomicText>
-            <View style={styles.trendingTagRow}>
-              <View style={[styles.trendingTag, { backgroundColor: `${tokens.colors.primary}20` }]}>
-                <AtomicText type="bodySmall" color="primary" style={styles.tagText}>5K SENT</AtomicText>
-              </View>
-            </View>
-          </View>
-          <AtomicIcon name="chevron-forward" color="textTertiary" size="sm" />
-        </Pressable>
-
-        <Pressable 
-          onPress={onViewAll}
-          style={[styles.trendingCard, { backgroundColor: tokens.colors.surface, borderColor: tokens.colors.borderLight }]}
-        >
-          <ImageBackground 
-            source={{ uri: 'https://images.unsplash.com/photo-1529333166437-7750a6dd5a70?q=80&w=200&auto=format&fit=crop' }} 
-            style={styles.trendingThumb}
-            imageStyle={{ borderRadius: 12 }}
-          />
-          <View style={styles.trendingContent}>
-            <AtomicText type="labelLarge" color="textPrimary">Short & Sweet</AtomicText>
-            <AtomicText type="bodySmall" color="textTertiary" numberOfLines={1}>
-              Quick texts to make their heart skip a beat.
-            </AtomicText>
-            <View style={styles.trendingTagRow}>
-              <View style={[styles.trendingTag, { backgroundColor: `${tokens.colors.primary}20` }]}>
-                <AtomicText type="bodySmall" color="primary" style={styles.tagText}>12K SENT</AtomicText>
-              </View>
-            </View>
-          </View>
-          <AtomicIcon name="chevron-forward" color="textTertiary" size="sm" />
-        </Pressable>
-      </View>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  sectionHeader: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    paddingHorizontal: 20,
-    marginBottom: 16,
-  },
-  sectionTitle: {
-    fontWeight: 'bold',
-  },
-  trendingContainer: {
-    paddingHorizontal: 16,
-    gap: 12,
-  },
-  trendingCard: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    padding: 12,
-    borderRadius: 20,
-    borderWidth: 1,
-  },
-  trendingThumb: {
-    width: 64,
-    height: 64,
-    borderRadius: 12,
-    backgroundColor: '#333',
-    marginRight: 12,
-  },
-  trendingContent: {
-    flex: 1,
-    justifyContent: 'center',
-  },
-  trendingTagRow: {
-    flexDirection: 'row',
-    marginTop: 6,
-  },
-  trendingTag: {
-    paddingHorizontal: 8,
-    paddingVertical: 2,
-    borderRadius: 6,
-  },
-  tagText: {
-    fontSize: 9,
-    fontWeight: 'bold',
-  },
-});

package/src/features/love-message/presentation/components/TypeSelector.tsx

@@ -1,99 +0,0 @@
-/**
- * Message Type Selector Component
- * Premium icon-based selector
- */
-
-import type { FC } from "react";
-import { View, Pressable, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-  type IconName,
-} from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
-import { MESSAGE_TYPES } from "../../domain/constants";
-import type { MessageType } from "../../domain/types";
-
-interface TypeSelectorProps {
-  selectedType: MessageType;
-  onSelectType: (type: MessageType) => void;
-}
-
-export const TypeSelector: FC<TypeSelectorProps> = ({
-  selectedType,
-  onSelectType,
-}) => {
-  const tokens = useAppDesignTokens();
-  const { t } = useLocalization();
-
-  return (
-    <View style={styles.container}>
-      <AtomicText type="labelLarge" color="textPrimary" style={styles.label}>
-        {t("loveMessage.messageType")}
-      </AtomicText>
-      <View style={styles.grid}>
-        {MESSAGE_TYPES.map((config) => {
-          const isSelected = selectedType === config.type;
-          return (
-            <Pressable
-              key={config.type}
-              onPress={() => onSelectType(config.type)}
-              style={[
-                styles.item,
-                {
-                  backgroundColor: isSelected
-                    ? tokens.colors.primary
-                    : tokens.colors.surfaceSecondary,
-                  borderColor: isSelected
-                    ? tokens.colors.primary
-                    : tokens.colors.borderLight,
-                },
-              ]}
-            >
-              <AtomicIcon
-                name={config.icon as IconName}
-                color={isSelected ? "onPrimary" : "secondary"}
-                size="md"
-                style={styles.icon}
-              />
-              <AtomicText
-                type="labelSmall"
-                color={isSelected ? "onPrimary" : "textSecondary"}
-              >
-                {t(config.labelKey)}
-              </AtomicText>
-            </Pressable>
-          );
-        })}
-      </View>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    marginBottom: 24,
-  },
-  label: {
-    marginBottom: 12,
-  },
-  grid: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 10,
-  },
-  item: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingVertical: 10,
-    paddingHorizontal: 12,
-    borderRadius: 12,
-    borderWidth: 1.5,
-    minWidth: "47%",
-    flex: 1,
-  },
-  icon: {
-    marginRight: 8,
-  },
-});

package/src/features/love-message/presentation/hooks/useLoveMessageGenerator.ts

@@ -1,114 +0,0 @@
-/**
- * useLoveMessageGenerator Hook
- * Business logic for Love Message Generation
- */
-
-import { useState, useCallback, useEffect } from "react";
-import { useAppIsFocused } from "@umituz/react-native-design-system";
-import { MessageType, MessageTone } from "../../domain/types";
-import { generateLoveMessage } from "../../infrastructure/services/LoveMessageService";
-import { PartnerProfileRepository } from "../../infrastructure/persistence/PartnerProfileRepository";
-
-export enum GeneratorStep {
-  PARTNER = 0,
-  VIBE = 1,
-  DETAILS = 2,
-  RESULT = 3
-}
-
-export const useLoveMessageGenerator = (config: {
-  onBack: () => void;
-  initialType?: MessageType;
-  onSuccess?: () => void;
-  onError?: () => void;
-}) => {
-  const isFocused = useAppIsFocused();
-
-  const [currentStep, setCurrentStep] = useState<GeneratorStep>(GeneratorStep.PARTNER);
-  const [partnerName, setPartnerName] = useState("");
-  const [selectedType, setSelectedType] = useState(config.initialType || MessageType.ROMANTIC);
-  const [selectedTone, setSelectedTone] = useState(MessageTone.ROMANTIC);
-  const [details, setDetails] = useState("");
-  const [useProfile, setUseProfile] = useState(true);
-  const [hasProfile, setHasProfile] = useState(false);
-  const [generatedMessage, setGeneratedMessage] = useState("");
-  const [isGenerating, setIsGenerating] = useState(false);
-
-  useEffect(() => {
-    if (isFocused) {
-      const checkProfile = async () => {
-        const profile = await PartnerProfileRepository.getProfile();
-        if (profile) {
-          setHasProfile(true);
-          if (!partnerName) setPartnerName(profile.name);
-        } else {
-          setHasProfile(false);
-        }
-      };
-      checkProfile();
-    }
-  }, [isFocused, partnerName]);
-
-  const handleNext = useCallback(() => {
-    if (currentStep < GeneratorStep.DETAILS) {
-      setCurrentStep(currentStep + 1);
-    }
-  }, [currentStep]);
-
-  const handleBack = useCallback(() => {
-    if (currentStep > 0) {
-      setCurrentStep(currentStep - 1);
-    } else {
-      config.onBack();
-    }
-  }, [currentStep, config]);
-
-  const handleGenerate = useCallback(async () => {
-    if (!partnerName.trim() || isGenerating) return;
-
-    try {
-      setIsGenerating(true);
-      const message = await generateLoveMessage({
-        partnerName,
-        type: selectedType,
-        tone: selectedTone,
-        details,
-        usePartnerProfile: useProfile,
-      });
-
-      setGeneratedMessage(message);
-      setCurrentStep(GeneratorStep.RESULT);
-      config.onSuccess?.();
-    } catch {
-      config.onError?.();
-    } finally {
-      setIsGenerating(false);
-    }
-  }, [partnerName, selectedType, selectedTone, details, useProfile, isGenerating, config]);
-
-  const startOver = useCallback(() => {
-    setCurrentStep(GeneratorStep.PARTNER);
-    setGeneratedMessage("");
-  }, []);
-
-  return {
-    currentStep,
-    partnerName,
-    setPartnerName,
-    selectedType,
-    setSelectedType,
-    selectedTone,
-    setSelectedTone,
-    details,
-    setDetails,
-    useProfile,
-    setUseProfile,
-    hasProfile,
-    generatedMessage,
-    isGenerating,
-    handleNext,
-    handleBack,
-    handleGenerate,
-    startOver,
-  };
-};

package/src/features/love-message/presentation/hooks/usePartnerProfile.ts

@@ -1,43 +0,0 @@
-/**
- * usePartnerProfile Hook
- */
-
-import { useState, useEffect, useCallback } from "react";
-import { PartnerProfile } from "../../domain/types";
-import { PartnerProfileRepository } from "../../infrastructure/persistence/PartnerProfileRepository";
-
-export const usePartnerProfile = (onBack: () => void) => {
-  const [profile, setProfile] = useState<PartnerProfile>({
-    name: "",
-    nickname: "",
-    hobbies: "",
-    traits: "",
-    quirks: "",
-  });
-  const [isLoading, setIsLoading] = useState(true);
-
-  useEffect(() => {
-    const loadProfile = async () => {
-      const savedProfile = await PartnerProfileRepository.getProfile();
-      if (savedProfile) {
-        setProfile(savedProfile);
-      }
-      setIsLoading(false);
-    };
-    loadProfile();
-  }, []);
-
-  const handleSave = useCallback(async () => {
-    const success = await PartnerProfileRepository.saveProfile(profile);
-    if (success) {
-      onBack();
-    }
-  }, [profile, onBack]);
-
-  return {
-    profile,
-    setProfile,
-    isLoading,
-    handleSave,
-  };
-};

package/src/features/love-message/presentation/navigation/LoveMessageStack.tsx

@@ -1,39 +0,0 @@
-/**
- * Love Message Stack
- * Navigation for Love Message domain
- */
-
-import React from "react";
-import {
-  StackNavigator,
-  type StackNavigatorConfig,
-} from "@umituz/react-native-design-system";
-import { LoveMessageExploreScreen } from "../screens/LoveMessageExploreScreen";
-import { MessageListScreen } from "../screens/MessageListScreen";
-import { LoveMessageGeneratorScreen } from "../screens/LoveMessageGeneratorScreen";
-import { PartnerProfileScreen } from "../screens/PartnerProfileScreen";
-import type { MessageType } from "../../domain/types";
-
-export type LoveMessageStackParamList = {
-  LoveMessageExplore: undefined;
-  MessageList: { categoryId: string };
-  MessageGenerator: { initialType?: MessageType };
-  PartnerProfile: undefined;
-};
-
-const stackConfig: StackNavigatorConfig<LoveMessageStackParamList> = {
-  initialRouteName: "LoveMessageExplore",
-  screenOptions: {
-    headerShown: false,
-  },
-  screens: [
-    { name: "LoveMessageExplore", component: LoveMessageExploreScreen },
-    { name: "MessageList", component: MessageListScreen },
-    { name: "MessageGenerator", component: LoveMessageGeneratorScreen },
-    { name: "PartnerProfile", component: PartnerProfileScreen },
-  ],
-};
-
-export const LoveMessageStack: React.FC = () => {
-  return <StackNavigator config={stackConfig} />;
-};