From 2c65327de822acc7ea86da0cadb97fef77210526 Mon Sep 17 00:00:00 2001 From: Hitesh Joshi Date: Sun, 9 Mar 2025 18:15:03 +0800 Subject: [PATCH] quotes --- app/(tabs)/_layout.tsx | 5 +- app/(tabs)/quotes.tsx | 369 ++++++++++++++++++++++++++++++++++++ app/quote/_layout.tsx | 26 +++ app/quote/add.tsx | 290 ++++++++++++++++++++++++++++ app/quote/edit.tsx | 390 ++++++++++++++++++++++++++++++++++++++ components/EmptyState.tsx | 70 +++++++ components/QuoteCard.tsx | 156 +++++++++++++++ models/types.ts | 11 +- services/authService.ts | 363 ----------------------------------- services/quoteService.ts | 67 +++++++ 10 files changed, 1380 insertions(+), 367 deletions(-) create mode 100644 app/(tabs)/quotes.tsx create mode 100644 app/quote/_layout.tsx create mode 100644 app/quote/add.tsx create mode 100644 app/quote/edit.tsx create mode 100644 components/EmptyState.tsx create mode 100644 components/QuoteCard.tsx delete mode 100644 services/authService.ts create mode 100644 services/quoteService.ts diff --git a/app/(tabs)/_layout.tsx b/app/(tabs)/_layout.tsx index 3feb87b..bd44723 100644 --- a/app/(tabs)/_layout.tsx +++ b/app/(tabs)/_layout.tsx @@ -1,3 +1,4 @@ +// app/(tabs)/_layout.tsx import React from 'react'; import { Tabs } from 'expo-router'; import { Ionicons } from '@expo/vector-icons'; @@ -67,8 +68,6 @@ export default function TabsLayout() { }} /> - {/* Add your future tabs here */} - {/* + {/* Add your future tabs here */} + {/* ([]); + const [loading, setLoading] = useState(true); + const [refreshing, setRefreshing] = useState(false); + const [searchText, setSearchText] = useState(''); + const [selectedCategory, setSelectedCategory] = useState(null); + const [allCategories, setAllCategories] = useState([]); + + // Function to load all quotes + const loadQuotes = useCallback(async () => { + if (!userInfo?.uid) return; + + try { + setLoading(true); + const userQuotes = await quoteService.getUserItems(userInfo.uid, []); + setQuotes(userQuotes); + + // Extract all unique categories + const categories = new Set(); + userQuotes.forEach(quote => { + quote.categories.forEach(category => categories.add(category)); + }); + + setAllCategories(Array.from(categories).sort()); + } catch (error) { + console.error('Error loading quotes:', error); + Alert.alert('Error', 'Failed to load quotes. Please try again.'); + } finally { + setLoading(false); + } + }, [userInfo?.uid]); + + // Initial load + useEffect(() => { + loadQuotes(); + }, [loadQuotes]); + + // Reload when screen comes into focus + useFocusEffect( + useCallback(() => { + loadQuotes(); + }, [loadQuotes]) + ); + + // Handle pull-to-refresh + const onRefresh = useCallback(async () => { + setRefreshing(true); + await loadQuotes(); + setRefreshing(false); + }, [loadQuotes]); + + // Handle search + const handleSearch = useCallback(async () => { + if (!userInfo?.uid) return; + + try { + setLoading(true); + const results = await quoteService.searchQuotes(userInfo.uid, searchText); + setQuotes(results); + } catch (error) { + console.error('Error searching quotes:', error); + } finally { + setLoading(false); + } + }, [userInfo?.uid, searchText]); + + // Filter by category + const filterByCategory = useCallback((category: string | null) => { + setSelectedCategory(category); + + if (!userInfo?.uid) return; + + const getFilteredQuotes = async () => { + try { + setLoading(true); + if (!category) { + await loadQuotes(); + } else { + const filtered = await quoteService.getQuotesByCategory(userInfo.uid, category); + setQuotes(filtered); + } + } catch (error) { + console.error('Error filtering quotes:', error); + } finally { + setLoading(false); + } + }; + + getFilteredQuotes(); + }, [userInfo?.uid, loadQuotes]); + + // Toggle favorite + const toggleFavorite = async (quoteId: string, currentStatus: boolean) => { + try { + await quoteService.toggleFavorite(quoteId, !currentStatus); + + // Update local state + setQuotes(prevQuotes => + prevQuotes.map(quote => + quote.id === quoteId + ? { ...quote, favorite: !currentStatus } + : quote + ) + ); + } catch (error) { + console.error('Error toggling favorite:', error); + Alert.alert('Error', 'Failed to update favorite status. Please try again.'); + } + }; + + // Handle delete + const handleDelete = (quote: Quote) => { + Alert.alert( + "Delete Quote", + "Are you sure you want to delete this quote?", + [ + { + text: "Cancel", + style: "cancel" + }, + { + text: "Delete", + onPress: async () => { + try { + await quoteService.deleteItem(quote.id); + setQuotes(prevQuotes => prevQuotes.filter(q => q.id !== quote.id)); + } catch (error) { + console.error('Error deleting quote:', error); + Alert.alert('Error', 'Failed to delete quote. Please try again.'); + } + }, + style: "destructive" + } + ] + ); + }; + + // Navigate to add quote screen + const navigateToAddQuote = () => { + router.push('/quote/add'); + }; + + // Navigate to edit quote screen + const navigateToEditQuote = (quote: Quote) => { + router.push({ + pathname: '/quote/edit', + params: { quoteId: quote.id } + }); + }; + + // Handle share + const handleShare = (quote: Quote) => { + Alert.alert( + "Share Quote", + "This feature will be implemented soon!", + [{ text: "OK" }] + ); + }; + + // Category chips + const renderCategoryChips = () => ( + + + {['All', ...allCategories].map((item) => ( + filterByCategory(item === 'All' ? null : item)} + > + + {item} + + + ))} + + + ); + + return ( + + {/* Search Bar */} + + + + + + + + {/* Category Filter */} + {renderCategoryChips()} + + {/* Quotes List */} + {loading ? ( + + + + ) : quotes.length === 0 ? ( + + ) : ( + item.id} + renderItem={({ item }) => ( + toggleFavorite(item.id, item.favorite)} + onEdit={() => navigateToEditQuote(item)} + onShare={() => handleShare(item)} + onDelete={() => handleDelete(item)} + /> + )} + contentContainerStyle={styles.listContent} + refreshControl={ + + } + /> + )} + + {/* FAB for adding a new quote */} + + + + + ); +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#f5f5f5', + }, + searchBarContainer: { + flexDirection: 'row', + margin: 16, + borderRadius: 25, + backgroundColor: '#fff', + elevation: 2, + shadowColor: '#000', + shadowOffset: { width: 0, height: 1 }, + shadowOpacity: 0.2, + shadowRadius: 1.5, + }, + searchInput: { + flex: 1, + paddingVertical: 12, + paddingHorizontal: 16, + fontSize: 16, + }, + searchButton: { + backgroundColor: '#3498db', + paddingHorizontal: 16, + justifyContent: 'center', + alignItems: 'center', + borderTopRightRadius: 25, + borderBottomRightRadius: 25, + }, + categoryChipsWrapper: { + height: 48, + marginBottom: 10, + }, + categoryChipsContainer: { + paddingHorizontal: 16, + alignItems: 'center', + height: 48, + }, + categoryChip: { + paddingHorizontal: 16, + paddingVertical: 8, + backgroundColor: '#e7e7e7', + borderRadius: 20, + marginRight: 8, + height: 36, + justifyContent: 'center', + }, + selectedCategoryChip: { + backgroundColor: '#3498db', + }, + categoryChipText: { + color: '#333', + }, + selectedCategoryChipText: { + color: '#fff', + }, + loadingContainer: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + }, + listContent: { + padding: 16, + paddingBottom: 80, // Add extra padding for FAB + }, + addButton: { + position: 'absolute', + right: 16, + bottom: 16, + width: 56, + height: 56, + borderRadius: 28, + backgroundColor: '#3498db', + justifyContent: 'center', + alignItems: 'center', + elevation: 4, + shadowColor: '#000', + shadowOffset: { width: 0, height: 2 }, + shadowOpacity: 0.2, + shadowRadius: 3, + }, +}); \ No newline at end of file diff --git a/app/quote/_layout.tsx b/app/quote/_layout.tsx new file mode 100644 index 0000000..d1738cf --- /dev/null +++ b/app/quote/_layout.tsx @@ -0,0 +1,26 @@ +// app/quote/_layout.tsx +import { Stack } from 'expo-router'; +import AuthProtectedRoute from '../../components/AuthProtectedRoute'; + +export default function QuoteLayout() { + return ( + + + + + + + ); +} \ No newline at end of file diff --git a/app/quote/add.tsx b/app/quote/add.tsx new file mode 100644 index 0000000..85621dd --- /dev/null +++ b/app/quote/add.tsx @@ -0,0 +1,290 @@ +// app/quote/add.tsx +import React, { useState } from 'react'; +import { + View, + Text, + TextInput, + StyleSheet, + TouchableOpacity, + ScrollView, + Alert, + KeyboardAvoidingView, + Platform, +} from 'react-native'; +import { Ionicons } from '@expo/vector-icons'; +import { router } from 'expo-router'; +import { useAuth } from '../../context/AuthContext'; +import { quoteService } from '../../services/quoteService'; + +export default function AddQuoteScreen() { + const { userInfo } = useAuth(); + const [quoteText, setQuoteText] = useState(''); + const [author, setAuthor] = useState(''); + const [category, setCategory] = useState(''); + const [categories, setCategories] = useState([]); + const [isSubmitting, setIsSubmitting] = useState(false); + + // Add a category + const addCategory = () => { + if (category.trim() && !categories.includes(category.trim())) { + setCategories([...categories, category.trim()]); + setCategory(''); + } + }; + + // Remove a category + const removeCategory = (index: number) => { + setCategories(categories.filter((_, i) => i !== index)); + }; + + // Save the quote + const saveQuote = async () => { + if (!quoteText.trim()) { + Alert.alert('Error', 'Please enter the quote text'); + return; + } + + if (!author.trim()) { + Alert.alert('Error', 'Please enter the author name'); + return; + } + + if (!userInfo?.uid) { + Alert.alert('Error', 'You need to be logged in to add quotes'); + return; + } + + try { + setIsSubmitting(true); + + await quoteService.addItem( + userInfo.uid, + { + text: quoteText.trim(), + author: author.trim(), + categories: categories.length > 0 ? categories : ['Uncategorized'], + favorite: false, + }, + new Date() + ); + + router.back(); + + } catch (error) { + console.error('Error adding quote:', error); + Alert.alert('Error', 'Failed to add quote. Please try again.'); + } finally { + setIsSubmitting(false); + } + }; + + return ( + + + + {/* Quote Text */} + + Quote + + + + {/* Author */} + + Author + + + + {/* Categories */} + + Categories + + + + + + + + {/* Category chips */} + + {categories.map((cat, index) => ( + + {cat} + removeCategory(index)} + style={styles.removeCategoryButton} + > + + + + ))} + {categories.length === 0 && ( + + No categories added. Quote will be saved as "Uncategorized". + + )} + + + + {/* Submit Button */} + + + {isSubmitting ? 'Saving...' : 'Save Quote'} + + + + {/* Cancel Button */} + router.back()} + disabled={isSubmitting} + > + Cancel + + + + + ); +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#f5f5f5', + }, + scrollView: { + flex: 1, + }, + formContainer: { + padding: 16, + }, + inputGroup: { + marginBottom: 20, + }, + label: { + fontSize: 16, + fontWeight: 'bold', + marginBottom: 8, + color: '#34495e', + }, + input: { + backgroundColor: '#fff', + borderRadius: 8, + padding: 12, + fontSize: 16, + borderWidth: 1, + borderColor: '#ddd', + }, + textArea: { + backgroundColor: '#fff', + borderRadius: 8, + padding: 12, + fontSize: 16, + minHeight: 120, + borderWidth: 1, + borderColor: '#ddd', + }, + categoryInputContainer: { + flexDirection: 'row', + marginBottom: 8, + }, + categoryInput: { + flex: 1, + backgroundColor: '#fff', + borderTopLeftRadius: 8, + borderBottomLeftRadius: 8, + padding: 12, + fontSize: 16, + borderWidth: 1, + borderColor: '#ddd', + borderRightWidth: 0, + }, + addCategoryButton: { + backgroundColor: '#3498db', + borderTopRightRadius: 8, + borderBottomRightRadius: 8, + padding: 12, + justifyContent: 'center', + alignItems: 'center', + }, + categoriesContainer: { + flexDirection: 'row', + flexWrap: 'wrap', + }, + categoryChip: { + flexDirection: 'row', + alignItems: 'center', + backgroundColor: '#3498db', + borderRadius: 16, + paddingVertical: 6, + paddingHorizontal: 12, + margin: 4, + }, + categoryText: { + color: '#fff', + marginRight: 4, + }, + removeCategoryButton: { + backgroundColor: 'rgba(0,0,0,0.2)', + borderRadius: 12, + width: 20, + height: 20, + justifyContent: 'center', + alignItems: 'center', + }, + noCategoriesText: { + color: '#95a5a6', + fontStyle: 'italic', + padding: 8, + }, + saveButton: { + backgroundColor: '#3498db', + borderRadius: 8, + padding: 16, + alignItems: 'center', + marginBottom: 12, + }, + saveButtonText: { + color: '#fff', + fontSize: 16, + fontWeight: 'bold', + }, + cancelButton: { + backgroundColor: '#ecf0f1', + borderRadius: 8, + padding: 16, + alignItems: 'center', + marginBottom: 24, + }, + cancelButtonText: { + color: '#34495e', + fontSize: 16, + }, +}); \ No newline at end of file diff --git a/app/quote/edit.tsx b/app/quote/edit.tsx new file mode 100644 index 0000000..aca6c00 --- /dev/null +++ b/app/quote/edit.tsx @@ -0,0 +1,390 @@ +// app/quote/edit.tsx +import React, { useState, useEffect } from 'react'; +import { + View, + Text, + TextInput, + StyleSheet, + TouchableOpacity, + ScrollView, + Alert, + KeyboardAvoidingView, + Platform, + ActivityIndicator, +} from 'react-native'; +import { Ionicons } from '@expo/vector-icons'; +import { router, useLocalSearchParams } from 'expo-router'; +import { useAuth } from '../../context/AuthContext'; +import { quoteService } from '../../services/quoteService'; +import { Quote } from '../../models/types'; + +export default function EditQuoteScreen() { + const { userInfo } = useAuth(); + const { quoteId } = useLocalSearchParams<{ quoteId: string }>(); + + const [isLoading, setIsLoading] = useState(true); + const [quoteText, setQuoteText] = useState(''); + const [author, setAuthor] = useState(''); + const [category, setCategory] = useState(''); + const [categories, setCategories] = useState([]); + const [isFavorite, setIsFavorite] = useState(false); + const [isSubmitting, setIsSubmitting] = useState(false); + const [quote, setQuote] = useState(null); + + // Load quote data + useEffect(() => { + const loadQuote = async () => { + if (!quoteId) { + Alert.alert('Error', 'No quote ID provided'); + router.back(); + return; + } + + try { + setIsLoading(true); + const quoteData = await quoteService.getDocById(quoteId); + + if (!quoteData) { + Alert.alert('Error', 'Quote not found'); + router.back(); + return; + } + + // Check if this quote belongs to the current user + if (quoteData.userId !== userInfo?.uid) { + Alert.alert('Error', 'You do not have permission to edit this quote'); + router.back(); + return; + } + + setQuote(quoteData); + setQuoteText(quoteData.text); + setAuthor(quoteData.author); + setCategories(quoteData.categories || []); + setIsFavorite(quoteData.favorite || false); + } catch (error) { + console.error('Error loading quote:', error); + Alert.alert('Error', 'Failed to load quote data. Please try again.'); + router.back(); + } finally { + setIsLoading(false); + } + }; + + loadQuote(); + }, [quoteId, userInfo?.uid]); + + // Add a category + const addCategory = () => { + if (category.trim() && !categories.includes(category.trim())) { + setCategories([...categories, category.trim()]); + setCategory(''); + } + }; + + // Remove a category + const removeCategory = (index: number) => { + setCategories(categories.filter((_, i) => i !== index)); + }; + + // Toggle favorite status + const toggleFavorite = () => { + setIsFavorite(!isFavorite); + }; + + // Update the quote + const updateQuote = async () => { + if (!quoteText.trim()) { + Alert.alert('Error', 'Please enter the quote text'); + return; + } + + if (!author.trim()) { + Alert.alert('Error', 'Please enter the author name'); + return; + } + + if (!quoteId || !userInfo?.uid) { + Alert.alert('Error', 'Missing quote ID or user information'); + return; + } + + try { + setIsSubmitting(true); + + await quoteService.updateItem(quoteId, { + text: quoteText.trim(), + author: author.trim(), + categories: categories.length > 0 ? categories : ['Uncategorized'], + favorite: isFavorite, + }); + + router.back(); + + } catch (error) { + console.error('Error updating quote:', error); + Alert.alert('Error', 'Failed to update quote. Please try again.'); + } finally { + setIsSubmitting(false); + } + }; + + if (isLoading) { + return ( + + + Loading quote... + + ); + } + + return ( + + + + {/* Quote Text */} + + Quote + + + + {/* Author */} + + Author + + + + {/* Favorite */} + + + + + {isFavorite ? "Favorite" : "Add to favorites"} + + + + + {/* Categories */} + + Categories + + + + + + + + {/* Category chips */} + + {categories.map((cat, index) => ( + + {cat} + removeCategory(index)} + style={styles.removeCategoryButton} + > + + + + ))} + {categories.length === 0 && ( + + No categories added. Quote will be saved as "Uncategorized". + + )} + + + + {/* Submit Button */} + + + {isSubmitting ? 'Saving...' : 'Update Quote'} + + + + {/* Cancel Button */} + router.back()} + disabled={isSubmitting} + > + Cancel + + + + + ); +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#f5f5f5', + }, + scrollView: { + flex: 1, + }, + loadingContainer: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + }, + loadingText: { + marginTop: 16, + fontSize: 16, + color: '#7f8c8d', + }, + formContainer: { + padding: 16, + }, + inputGroup: { + marginBottom: 20, + }, + label: { + fontSize: 16, + fontWeight: 'bold', + marginBottom: 8, + color: '#34495e', + }, + input: { + backgroundColor: '#fff', + borderRadius: 8, + padding: 12, + fontSize: 16, + borderWidth: 1, + borderColor: '#ddd', + }, + textArea: { + backgroundColor: '#fff', + borderRadius: 8, + padding: 12, + fontSize: 16, + minHeight: 120, + borderWidth: 1, + borderColor: '#ddd', + }, + favoriteContainer: { + marginBottom: 20, + }, + favoriteButton: { + flexDirection: 'row', + alignItems: 'center', + padding: 8, + }, + favoriteText: { + marginLeft: 8, + fontSize: 16, + color: '#34495e', + }, + categoryInputContainer: { + flexDirection: 'row', + marginBottom: 8, + }, + categoryInput: { + flex: 1, + backgroundColor: '#fff', + borderTopLeftRadius: 8, + borderBottomLeftRadius: 8, + padding: 12, + fontSize: 16, + borderWidth: 1, + borderColor: '#ddd', + borderRightWidth: 0, + }, + addCategoryButton: { + backgroundColor: '#3498db', + borderTopRightRadius: 8, + borderBottomRightRadius: 8, + padding: 12, + justifyContent: 'center', + alignItems: 'center', + }, + categoriesContainer: { + flexDirection: 'row', + flexWrap: 'wrap', + }, + categoryChip: { + flexDirection: 'row', + alignItems: 'center', + backgroundColor: '#3498db', + borderRadius: 16, + paddingVertical: 6, + paddingHorizontal: 12, + margin: 4, + }, + categoryText: { + color: '#fff', + marginRight: 4, + }, + removeCategoryButton: { + backgroundColor: 'rgba(0,0,0,0.2)', + borderRadius: 12, + width: 20, + height: 20, + justifyContent: 'center', + alignItems: 'center', + }, + noCategoriesText: { + color: '#95a5a6', + fontStyle: 'italic', + padding: 8, + }, + saveButton: { + backgroundColor: '#3498db', + borderRadius: 8, + padding: 16, + alignItems: 'center', + marginBottom: 12, + }, + saveButtonText: { + color: '#fff', + fontSize: 16, + fontWeight: 'bold', + }, + cancelButton: { + backgroundColor: '#ecf0f1', + borderRadius: 8, + padding: 16, + alignItems: 'center', + marginBottom: 24, + }, + cancelButtonText: { + color: '#34495e', + fontSize: 16, + }, +}); \ No newline at end of file diff --git a/components/EmptyState.tsx b/components/EmptyState.tsx new file mode 100644 index 0000000..9c4d055 --- /dev/null +++ b/components/EmptyState.tsx @@ -0,0 +1,70 @@ +// components/EmptyState.tsx +import React from 'react'; +import { View, Text, StyleSheet, TouchableOpacity } from 'react-native'; +import { Ionicons } from '@expo/vector-icons'; + +interface EmptyStateProps { + icon: string; + title: string; + message: string; + actionText?: string; + onAction?: () => void; +} + +const EmptyState: React.FC = ({ + icon, + title, + message, + actionText, + onAction, +}) => { + return ( + + + {title} + {message} + + {actionText && onAction && ( + + {actionText} + + )} + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + padding: 16, + }, + title: { + fontSize: 20, + fontWeight: 'bold', + color: '#34495e', + marginTop: 16, + textAlign: 'center', + }, + message: { + fontSize: 16, + color: '#7f8c8d', + textAlign: 'center', + marginTop: 8, + marginBottom: 24, + }, + actionButton: { + backgroundColor: '#3498db', + paddingVertical: 12, + paddingHorizontal: 24, + borderRadius: 8, + }, + actionText: { + color: 'white', + fontSize: 16, + fontWeight: 'bold', + }, +}); + +export default EmptyState; \ No newline at end of file diff --git a/components/QuoteCard.tsx b/components/QuoteCard.tsx new file mode 100644 index 0000000..50c7920 --- /dev/null +++ b/components/QuoteCard.tsx @@ -0,0 +1,156 @@ +// components/QuoteCard.tsx +import React from 'react'; +import { View, Text, StyleSheet, TouchableOpacity } from 'react-native'; +import { Ionicons } from '@expo/vector-icons'; +import { Quote } from '../models/types'; + +interface QuoteCardProps { + quote: Quote; + onFavorite: () => void; + onEdit: () => void; + onShare: () => void; + onDelete: () => void; +} + +const QuoteCard: React.FC = ({ + quote, + onFavorite, + onEdit, + onShare, + onDelete +}) => { + return ( + + {/* Quote Text */} + + " + {quote.text} + + + {/* Categories */} + {quote.categories && quote.categories.length > 0 && ( + + {quote.categories.map((category, index) => ( + + {category} + + ))} + + )} + + {/* Author */} + {quote.author} + + {/* Action Buttons */} + + + Edit + + + + Share + + + + Delete + + + + {/* Favorite Button */} + + + + + ); +}; + +const styles = StyleSheet.create({ + card: { + backgroundColor: '#fff', + borderRadius: 12, + padding: 16, + marginBottom: 16, + shadowColor: '#000', + shadowOffset: { width: 0, height: 2 }, + shadowOpacity: 0.1, + shadowRadius: 4, + elevation: 3, + }, + quoteContainer: { + position: 'relative', + paddingVertical: 8, + }, + quoteMarks: { + position: 'absolute', + top: -5, + left: -5, + fontSize: 40, + color: '#e0e0e0', + fontFamily: 'serif', + }, + quoteText: { + fontSize: 18, + lineHeight: 26, + color: '#333', + marginLeft: 8, + fontStyle: 'italic', + }, + authorText: { + fontSize: 16, + fontWeight: 'bold', + color: '#555', + textAlign: 'right', + marginTop: 8, + marginBottom: 12, + }, + categoriesContainer: { + flexDirection: 'row', + flexWrap: 'wrap', + marginTop: 8, + marginBottom: 4, + }, + categoryChip: { + backgroundColor: '#f0f0f0', + borderRadius: 16, + paddingVertical: 4, + paddingHorizontal: 12, + marginRight: 8, + marginBottom: 8, + alignSelf: 'flex-start', // Prevent stretching + height: 28, + justifyContent: 'center', + }, + categoryText: { + fontSize: 14, + color: '#3498db', + }, + actionsContainer: { + flexDirection: 'row', + borderTopWidth: 1, + borderTopColor: '#f0f0f0', + paddingTop: 12, + }, + actionButton: { + flex: 1, + alignItems: 'center', + paddingVertical: 8, + }, + actionText: { + color: '#3498db', + fontSize: 15, + }, + favoriteButton: { + position: 'absolute', + top: 12, + right: 12, + }, +}); + +export default QuoteCard; \ No newline at end of file diff --git a/models/types.ts b/models/types.ts index f5c52fd..f0b9bdc 100644 --- a/models/types.ts +++ b/models/types.ts @@ -1,5 +1,5 @@ // models/types.ts -export type CollectionType = 'goals' | 'goodDeeds' | 'reflections' | 'habits'; +export type CollectionType = 'goals' | 'goodDeeds' | 'reflections' | 'habits' | 'quotes'; export interface BaseItem { id: string; @@ -60,4 +60,11 @@ export interface NotificationContextType { // Add this interface for the notification provider props export interface NotificationProviderProps { children: React.ReactNode; -} \ No newline at end of file +} + +export interface Quote extends BaseItem { + text: string; + author: string; + categories: string[]; + favorite: boolean; +} diff --git a/services/authService.ts b/services/authService.ts deleted file mode 100644 index 8d84388..0000000 --- a/services/authService.ts +++ /dev/null @@ -1,363 +0,0 @@ -// // authServiceNative.ts -// // services/authService.ts - -// import { Platform } from 'react-native'; -// import * as Google from 'expo-auth-session/providers/google'; -// import * as WebBrowser from 'expo-web-browser'; -// import { -// GoogleAuthProvider, -// signInWithCredential, -// signOut as firebaseSignOut, -// User -// } from 'firebase/auth'; -// import { auth } from '../config/firebase'; -// import { useState } from 'react'; - -// // Initialize browser completion handling -// WebBrowser.maybeCompleteAuthSession(); - -// // Global promise to track auth completion - outside component lifecycle -// let authPromise: Promise | null = null; - -// export const useGoogleAuth = () => { -// const [isLoading, setIsLoading] = useState(false); - -// // Use your existing auth request -// const [request, response, promptAsync] = Google.useAuthRequest({ -// webClientId: process.env.EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID, -// androidClientId: process.env.EXPO_PUBLIC_GOOGLE_ANDROID_CLIENT_ID, -// scopes: ['profile', 'email', 'openid'], -// redirectUri: Platform.select({ -// android: 'com.hiteshjoshi.tracker:/oauthredirect', -// web: 'https://auth.expo.io/@hiteshjoshi/Tracker', -// ios: 'com.hiteshjoshi.tracker:/oauthredirect' -// }) -// }); - -// async function exchangeCodeForTokens(code: string) { -// const response = await fetch('https://oauth2.googleapis.com/token', { -// method: 'POST', -// headers: { -// 'Content-Type': 'application/x-www-form-urlencoded', -// }, -// body: new URLSearchParams({ -// code, -// client_id: process.env.EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID!, // Use web client ID -// client_secret: process.env.EXPO_PUBLIC_GOOGLE_CLIENT_SECRET!, // DANGER: Don’t store this client-side in production -// redirect_uri: 'com.hiteshjoshi.tracker:/oauthredirect', -// grant_type: 'authorization_code', -// }).toString(), -// }); - -// const data = await response.json(); -// if (!response.ok) { -// throw new Error(`Token exchange failed: ${data.error_description || 'Unknown error'}`); -// } -// return data; // { id_token, access_token, refresh_token, expires_in } -// } - -// const signInWithGoogle = async () => { -// // If an authentication process is already in progress, return the existing promise -// if (authPromise) { -// console.log('Returning existing auth promise'); -// return authPromise; -// } - -// // Set loading state -// setIsLoading(true); -// console.log('Starting Google Sign In'); - -// // Create a new promise chain and store it globally -// authPromise = (async () => { -// try { -// if (!request) { -// console.log('Request not ready'); -// return null; -// } - -// console.log('Starting auth prompt...'); -// const result = await promptAsync(); - -// // This log should now appear even after component remounts -// console.log('Auth prompt completed with result:', JSON.stringify(result)); - -// if (result?.type === 'success') { - - -// try { - -// const { id_token } = result.params; // Use id_token instead of code -// console.log('Got ID token:', id_token); -// const credential = GoogleAuthProvider.credential(id_token); -// console.log('Attempting Firebase sign in...'); -// const userCredential = await signInWithCredential(auth, credential); -// console.log('Firebase sign in successful:', userCredential.user.uid); -// return userCredential.user; -// } catch (firebaseError) { -// console.error('Firebase sign in failed:', firebaseError); -// throw firebaseError; -// } -// } -// else { -// console.log('Auth was not successful:', result); -// throw new Error(`Authentication failed: ${result?.type}`); -// } -// } catch (error) { -// console.error('Auth promise error:', error); -// throw error; -// } finally { -// // Clear the global promise when done (success or failure) -// authPromise = null; -// setIsLoading(false); -// } -// })(); - -// return authPromise; -// }; - -// const handleSignOut = async () => { -// try { -// await firebaseSignOut(auth); -// console.log('Signed out successfully'); -// } catch (error) { -// console.error('Sign out error:', error); -// throw error; -// } -// }; - -// return { -// signInWithGoogle, -// handleSignOut, -// isLoading, -// }; -// }; - - - -// // import { Platform } from 'react-native'; -// // import * as Google from 'expo-auth-session/providers/google'; -// // import * as WebBrowser from 'expo-web-browser'; -// // import { AuthSessionResult } from 'expo-auth-session'; - -// // import { -// // GoogleAuthProvider, -// // signInWithCredential, -// // signOut -// // } from 'firebase/auth'; -// // import { auth } from '../config/firebase'; -// // import { useState } from 'react'; - - - -// // WebBrowser.maybeCompleteAuthSession(); - -// // // Store auth results outside of component to preserve across remounts -// // //test -// // let lastAuthResult: AuthSessionResult | null = null; - - -// // export const useGoogleAuth = () => { -// // const [isLoading, setIsLoading] = useState(false); - -// // // Simplified configuration for Google Auth -// // const [request, response, promptAsync] = Google.useIdTokenAuthRequest({ -// // webClientId: process.env.EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID, -// // androidClientId: process.env.EXPO_PUBLIC_GOOGLE_ANDROID_CLIENT_ID, -// // scopes: [ -// // 'profile','email', 'openid' -// // ], -// // responseType: "code", -// // redirectUri: Platform.select({ -// // web: 'https://auth.expo.io/@hiteshjoshi/Tracker', -// // android: 'com.hiteshjoshi.tracker:/oauthredirect' -// // }) -// // }); - - -// // // Check if we have a response from a previous attempt -// // if (response && !lastAuthResult) { -// // console.log('Found auth response from previous prompt:', response.type); -// // lastAuthResult = response; -// // } - - -// // const signInWithGoogle = async () => { -// // try { -// // setIsLoading(true); -// // console.log('Starting Google Sign In'); - -// // if (!request) { -// // console.log('Request not ready'); -// // return; -// // } - -// // console.log('Starting auth prompt...', new Date().toISOString()); - -// // let result = lastAuthResult; - -// // // If not, prompt the user -// // if (!result) { -// // result = await promptAsync(); -// // console.log('Auth prompt completed'); -// // lastAuthResult = result; // Save for potential remount -// // } - -// // console.log('Processing auth result:', result?.type); - -// // if (result?.type === 'success') { -// // const { code } = result.params; -// // console.log('Got authorization code'); - - -// // try { -// // // Create credential with the code -// // const credential = GoogleAuthProvider.credential(null, code); -// // console.log('Created credential, signing in to Firebase'); -// // const userCredential = await signInWithCredential(auth, credential); - -// // console.log('Firebase sign in successful:', userCredential.user.uid); -// // return userCredential.user; -// // } catch (firebaseError) { -// // console.error('Firebase sign in failed:', firebaseError); -// // throw firebaseError; -// // } -// // } else { -// // console.log('Auth was not successful:', result?.type); -// // throw new Error(`Authentication failed: ${result?.type}`); -// // } -// // } catch (error) { -// // console.error('Top level Google sign in error:', error); -// // throw error; -// // } finally { -// // console.log('Sign in process completed', new Date().toISOString()); -// // setIsLoading(false); -// // } -// // }; - - -// // // Create Firebase credential -// // // const credential = GoogleAuthProvider.credential(null, code); - -// // // try { -// // // const userCredential = await signInWithCredential(auth, credential); -// // // console.log('Firebase auth successful:', userCredential.user.uid); -// // // return userCredential.user; -// // // } catch (firebaseError) { -// // // console.error('Firebase auth error:', firebaseError); -// // // throw firebaseError; -// // // } -// // // } else { -// // // console.log('Authentication failed:', result); -// // // } -// // // } catch (error) { -// // // console.error('Google sign in error:', error); -// // // throw error; -// // // } finally { -// // // setIsLoading(false); -// // // } -// // // }; - -// // const handleSignOut = async () => { -// // try { -// // await signOut(auth); -// // lastAuthResult = null; -// // } catch (error) { -// // console.error('Sign out error:', error); -// // throw error; -// // } -// // }; - -// // return { -// // signInWithGoogle, -// // handleSignOut, -// // isLoading, -// // }; -// // }; - -// // // // // // src/services/authService.ts -// // // // src/services/authService.ts -// // // import { Platform } from 'react-native'; -// // // import * as AuthSession from 'expo-auth-session'; -// // // import { GoogleAuthProvider, signInWithCredential, signOut } from 'firebase/auth'; -// // // import { auth } from '../config/firebase'; -// // // import * as Google from 'expo-auth-session/providers/google'; -// // // import * as WebBrowser from 'expo-web-browser'; -// // // import { useState } from 'react'; - -// // // WebBrowser.maybeCompleteAuthSession(); - - -// // // export const useGoogleAuth = () => { -// // // const [isLoading, setIsLoading] = useState(false); - -// // // const [request, response, promptAsync] = Google.useIdTokenAuthRequest({ -// // // androidClientId: process.env.EXPO_PUBLIC_GOOGLE_ANDROID_CLIENT_ID, -// // // iosClientId: process.env.EXPO_PUBLIC_GOOGLE_IOS_CLIENT_ID, -// // // webClientId: process.env.EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID, -// // // clientId: process.env.EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID, -// // // scopes: [ -// // // 'https://www.googleapis.com/auth/userinfo.profile', -// // // 'https://www.googleapis.com/auth/userinfo.email' -// // // ], -// // // responseType: "id_token", -// // // usePKCE: Platform.select({ -// // // web: false, -// // // default: true -// // // }), -// // // extraParams: { -// // // access_type: 'offline', -// // // prompt: 'consent' -// // // } -// // // }); - -// // // // Add these debug logs -// // // console.log('Auth Request:', request); -// // // console.log('Auth Response:', response); -// // // console.log('Platform:', Platform.OS); -// // // console.log('Redirect URI:', request?.redirectUri); - - -// // // const signInWithGoogle = async () => { -// // // try { -// // // setIsLoading(true); -// // // console.log('Starting Google Sign In'); - -// // // if (!request) { -// // // console.log('Request not ready'); -// // // return; -// // // } - -// // // const result = await promptAsync(); -// // // console.log('Auth Result:', result); - -// // // if (result?.type === 'success') { -// // // const { id_token } = result.params; // Changed from id_token -// // // const credential = GoogleAuthProvider.credential(id_token); -// // // const userCredential = await signInWithCredential(auth, credential); -// // // return userCredential.user; -// // // } else { -// // // console.log('Authentication failed:', result); -// // // } -// // // } catch (error) { -// // // console.error('Google sign in error:', error); -// // // throw error; -// // // } finally { -// // // setIsLoading(false); -// // // } -// // // }; - -// // // const handleSignOut = async () => { -// // // try { -// // // await signOut(auth); -// // // } catch (error) { -// // // console.error('Sign out error:', error); -// // // throw error; -// // // } -// // // }; - -// // // return { -// // // signInWithGoogle, -// // // handleSignOut, -// // // isLoading, -// // // }; -// // // }; diff --git a/services/quoteService.ts b/services/quoteService.ts new file mode 100644 index 0000000..0198149 --- /dev/null +++ b/services/quoteService.ts @@ -0,0 +1,67 @@ + +// services/quoteService.ts +import { db } from '../config/firebase'; +import { + collection, + where, + orderBy, + query, + QueryConstraint +} from 'firebase/firestore'; +import { FirebaseService } from './firebaseService'; +import { Quote } from '../models/types'; + +export class QuoteService extends FirebaseService { + constructor() { + super('quotes'); + } + + // Get user's favorite quotes + async getFavoriteQuotes(userId: string): Promise { + const additionalQueries: QueryConstraint[] = [ + where("favorite", "==", true), + orderBy("createdAt", "desc") + ]; + + return this.getUserItems(userId, additionalQueries); + } + + // Search quotes by text or author + async searchQuotes(userId: string, searchTerm: string): Promise { + // Note: Basic Firestore doesn't support text search + // This is a simple implementation that will need to fetch all quotes and filter client-side + const quotes = await this.getUserItems(userId); + + if (!searchTerm.trim()) { + return quotes; + } + + const lowerSearchTerm = searchTerm.toLowerCase(); + + return quotes.filter(quote => + quote.text.toLowerCase().includes(lowerSearchTerm) || + quote.author.toLowerCase().includes(lowerSearchTerm) + ); + } + + // Toggle favorite status + async toggleFavorite(quoteId: string, favorite: boolean): Promise { + await this.updateItem(quoteId, { favorite }); + } + + // Get quotes by category + async getQuotesByCategory(userId: string, category: string): Promise { + const quotes = await this.getUserItems(userId); + + if (!category.trim()) { + return quotes; + } + + return quotes.filter(quote => + quote.categories.some(cat => cat.toLowerCase() === category.toLowerCase()) + ); + } +} + +// Service instance +export const quoteService = new QuoteService(); \ No newline at end of file