@umituz/react-native-auth 2.5.4 → 2.5.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-auth",
-  "version": "2.5.4",
+  "version": "2.5.5",
   "description": "Authentication service for React Native apps - Secure, type-safe, and production-ready. Provider-agnostic design with dependency injection, configurable validation, and comprehensive error handling.",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/domain/entities/UserProfile.ts

@@ -0,0 +1,19 @@
+/**
+ * User Profile Types
+ * Domain types for user profile management across all apps
+ */
+
+export interface UserProfile {
+    uid: string;
+    email: string | null;
+    displayName: string | null;
+    photoURL: string | null;
+    isAnonymous: boolean;
+    createdAt: Date | null;
+    lastLoginAt: Date | null;
+}
+
+export interface UpdateProfileParams {
+    displayName?: string;
+    photoURL?: string;
+}

package/src/index.ts

@@ -102,12 +102,23 @@ export type { UseAuthResult } from './presentation/hooks/useAuth';
 export { useUserProfile } from './presentation/hooks/useUserProfile';
 export type { UserProfileData, UseUserProfileParams } from './presentation/hooks/useUserProfile';
 
+export { useAccountManagement } from './presentation/hooks/useAccountManagement';
+export type { UseAccountManagementReturn } from './presentation/hooks/useAccountManagement';
+
+export { useProfileUpdate } from './presentation/hooks/useProfileUpdate';
+export type { UseProfileUpdateReturn } from './presentation/hooks/useProfileUpdate';
+
+export type { UserProfile, UpdateProfileParams } from './domain/entities/UserProfile';
+
 // =============================================================================
 // PRESENTATION LAYER - Screens & Navigation
 // =============================================================================
 
 export { LoginScreen } from './presentation/screens/LoginScreen';
 export { RegisterScreen } from './presentation/screens/RegisterScreen';
+export { AccountScreen } from './presentation/screens/AccountScreen';
+export type { AccountScreenConfig, AccountScreenProps } from './presentation/screens/AccountScreen';
+
 export { AuthNavigator } from './presentation/navigation/AuthNavigator';
 export type {
   AuthStackParamList,
@@ -133,6 +144,8 @@ export { AuthBottomSheet } from './presentation/components/AuthBottomSheet';
 export type { AuthBottomSheetProps } from './presentation/components/AuthBottomSheet';
 export { ProfileSection } from './presentation/components/ProfileSection';
 export type { ProfileSectionConfig, ProfileSectionProps } from './presentation/components/ProfileSection';
+export { AccountActions } from './presentation/components/AccountActions';
+export type { AccountActionsConfig, AccountActionsProps } from './presentation/components/AccountActions';
 
 // =============================================================================
 // PRESENTATION LAYER - Stores

package/src/presentation/components/AccountActions.tsx

@@ -0,0 +1,138 @@
+/**
+ * Account Actions Component
+ * Provides logout and delete account functionality
+ * Only shown for authenticated (non-anonymous) users
+ */
+
+import React from "react";
+import { View, Text, TouchableOpacity, StyleSheet, Alert } from "react-native";
+import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+
+export interface AccountActionsConfig {
+    logoutText?: string;
+    deleteAccountText?: string;
+    logoutConfirmTitle?: string;
+    logoutConfirmMessage?: string;
+    deleteConfirmTitle?: string;
+    deleteConfirmMessage?: string;
+    onLogout: () => Promise<void>;
+    onDeleteAccount: () => Promise<void>;
+}
+
+export interface AccountActionsProps {
+    config: AccountActionsConfig;
+}
+
+export const AccountActions: React.FC<AccountActionsProps> = ({ config }) => {
+    const tokens = useAppDesignTokens();
+    const {
+        logoutText = "Log Out",
+        deleteAccountText = "Delete Account",
+        logoutConfirmTitle = "Log Out?",
+        logoutConfirmMessage = "Are you sure you want to log out?",
+        deleteConfirmTitle = "Delete Account?",
+        deleteConfirmMessage =
+        "This will permanently delete your account and all data. This action cannot be undone.",
+        onLogout,
+        onDeleteAccount,
+    } = config;
+
+    const handleLogout = () => {
+        Alert.alert(logoutConfirmTitle, logoutConfirmMessage, [
+            { text: "Cancel", style: "cancel" },
+            {
+                text: logoutText,
+                style: "destructive",
+                onPress: async () => {
+                    try {
+                        await onLogout();
+                    } catch (error) {
+                        console.error("Logout failed:", error);
+                    }
+                },
+            },
+        ]);
+    };
+
+    const handleDeleteAccount = () => {
+        Alert.alert(deleteConfirmTitle, deleteConfirmMessage, [
+            { text: "Cancel", style: "cancel" },
+            {
+                text: deleteAccountText,
+                style: "destructive",
+                onPress: async () => {
+                    try {
+                        await onDeleteAccount();
+                    } catch (error) {
+                        console.error("Delete account failed:", error);
+                    }
+                },
+            },
+        ]);
+    };
+
+    return (
+        <View style={styles.container}>
+            {/* Logout */}
+            <TouchableOpacity
+                style={[styles.actionButton, { borderColor: tokens.colors.border }]}
+                onPress={handleLogout}
+                activeOpacity={0.7}
+            >
+                <Text style={[styles.actionIcon, { color: tokens.colors.error }]}>
+                    ⎋
+                </Text>
+                <Text style={[styles.actionText, { color: tokens.colors.error }]}>
+                    {logoutText}
+                </Text>
+                <Text style={[styles.chevron, { color: tokens.colors.textTertiary }]}>
+                    ›
+                </Text>
+            </TouchableOpacity>
+
+            {/* Delete Account */}
+            <TouchableOpacity
+                style={[styles.actionButton, { borderColor: tokens.colors.border }]}
+                onPress={handleDeleteAccount}
+                activeOpacity={0.7}
+            >
+                <Text style={[styles.actionIcon, { color: tokens.colors.error }]}>
+                    🗑
+                </Text>
+                <Text style={[styles.actionText, { color: tokens.colors.error }]}>
+                    {deleteAccountText}
+                </Text>
+                <Text style={[styles.chevron, { color: tokens.colors.textTertiary }]}>
+                    ›
+                </Text>
+            </TouchableOpacity>
+        </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    container: {
+        gap: 12,
+    },
+    actionButton: {
+        flexDirection: "row",
+        alignItems: "center",
+        paddingVertical: 16,
+        paddingHorizontal: 16,
+        borderRadius: 12,
+        borderWidth: 1,
+        gap: 12,
+    },
+    actionIcon: {
+        fontSize: 20,
+    },
+    actionText: {
+        flex: 1,
+        fontSize: 16,
+        fontWeight: "500",
+    },
+    chevron: {
+        fontSize: 24,
+        fontWeight: "400",
+    },
+});

package/src/presentation/hooks/useAccountManagement.ts

@@ -0,0 +1,41 @@
+/**
+ * useAccountManagement Hook
+ * Provides account management functionality (logout, delete)
+ */
+
+import { useCallback } from "react";
+import { useAuth } from "./useAuth";
+
+export interface UseAccountManagementReturn {
+    logout: () => Promise<void>;
+    deleteAccount: () => Promise<void>;
+    isLoading: boolean;
+}
+
+export const useAccountManagement = (): UseAccountManagementReturn => {
+    const { user, loading, signOut } = useAuth();
+
+    const logout = useCallback(async () => {
+        await signOut();
+    }, [signOut]);
+
+    const deleteAccount = useCallback(async () => {
+        if (!user) {
+            throw new Error("No user logged in");
+        }
+
+        if (user.isAnonymous) {
+            throw new Error("Cannot delete anonymous account");
+        }
+
+        // Note: Add user deletion logic via Firebase Admin SDK on backend
+        // Frontend should call backend API to delete user account
+        throw new Error("Account deletion requires backend implementation");
+    }, [user]);
+
+    return {
+        logout,
+        deleteAccount,
+        isLoading: loading,
+    };
+};

package/src/presentation/hooks/useProfileUpdate.ts

@@ -0,0 +1,44 @@
+/**
+ * useProfileUpdate Hook
+ * Hook for profile updates - implementation should be provided by app
+ * Apps should use Firebase SDK directly or backend API
+ */
+
+import { useState, useCallback } from "react";
+import { useAuth } from "./useAuth";
+import type { UpdateProfileParams } from "../../domain/entities/UserProfile";
+
+export interface UseProfileUpdateReturn {
+    updateProfile: (params: UpdateProfileParams) => Promise<void>;
+    isUpdating: boolean;
+    error: string | null;
+}
+
+export const useProfileUpdate = (): UseProfileUpdateReturn => {
+    const { user } = useAuth();
+    const [isUpdating, setIsUpdating] = useState(false);
+    const [error, setError] = useState<string | null>(null);
+
+    const updateProfile = useCallback(
+        async (params: UpdateProfileParams) => {
+            if (!user) {
+                throw new Error("No user logged in");
+            }
+
+            if (user.isAnonymous) {
+                throw new Error("Anonymous users cannot update profile");
+            }
+
+            // Note: App should implement this via Firebase SDK
+            // Example: auth().currentUser?.updateProfile({ displayName, photoURL })
+            throw new Error("Profile update should be implemented by app");
+        },
+        [user],
+    );
+
+    return {
+        updateProfile,
+        isUpdating,
+        error,
+    };
+};

package/src/presentation/screens/AccountScreen.tsx

@@ -0,0 +1,47 @@
+/**
+ * Account Screen
+ * Pure UI component for account management
+ * Business logic provided via props from app layer
+ */
+
+import React from "react";
+import { View, ScrollView, StyleSheet } from "react-native";
+import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { ProfileSection, type ProfileSectionConfig } from "../components/ProfileSection";
+import { AccountActions, type AccountActionsConfig } from "../components/AccountActions";
+
+export interface AccountScreenConfig {
+    profile: ProfileSectionConfig;
+    accountActions: AccountActionsConfig;
+}
+
+export interface AccountScreenProps {
+    config: AccountScreenConfig;
+}
+
+export const AccountScreen: React.FC<AccountScreenProps> = ({ config }) => {
+    const tokens = useAppDesignTokens();
+
+    return (
+        <ScrollView
+            style={[styles.container, { backgroundColor: tokens.colors.backgroundPrimary }]}
+            contentContainerStyle={styles.content}
+        >
+            <ProfileSection profile={config.profile} />
+            <View style={styles.divider} />
+            <AccountActions config={config.accountActions} />
+        </ScrollView>
+    );
+};
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    content: {
+        padding: 16,
+    },
+    divider: {
+        height: 24,
+    },
+});