Fix: Resolve category display and form reset issues
- Fix infinite loading: properly reset loading state in both success and error cases - Fix form not resetting: clear all fields including selectedCategory after submission - Improve category display: smaller icons (24px), better sizing, no movement on selection - Remove colorful borders: use neutral colors for better readability - Remove scale/shadow effects that caused layout shifts - Use consistent styling: minHeight instead of aspectRatio for stable layout - Apply fixes to both TransactionScreen and SubscriptionScreen
This commit is contained in:
@@ -110,15 +110,16 @@ export const TransactionScreen = ({ route, navigation }: any) => {
|
||||
|
||||
// Réinitialiser le formulaire
|
||||
setAmount('');
|
||||
setSelectedCategory('');
|
||||
setNote('');
|
||||
setDate(new Date());
|
||||
setLoading(false);
|
||||
setModalVisible(false);
|
||||
|
||||
Alert.alert('Succès', 'Transaction ajoutée avec succès');
|
||||
} catch (error: any) {
|
||||
Alert.alert('Erreur', error.message);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
Alert.alert('Erreur', error.message);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -250,8 +251,7 @@ export const TransactionScreen = ({ route, navigation }: any) => {
|
||||
key={category.id}
|
||||
style={[
|
||||
styles.categoryItem,
|
||||
selectedCategory === category.name && styles.categoryItemActive,
|
||||
{ borderColor: category.color }
|
||||
selectedCategory === category.name && styles.categoryItemActive
|
||||
]}
|
||||
onPress={() => setSelectedCategory(category.name)}
|
||||
>
|
||||
@@ -404,37 +404,33 @@ const styles = StyleSheet.create({
|
||||
categoryGrid: {
|
||||
flexDirection: 'row',
|
||||
flexWrap: 'wrap',
|
||||
gap: 12,
|
||||
gap: 8,
|
||||
marginBottom: 24
|
||||
},
|
||||
categoryItem: {
|
||||
width: '30%',
|
||||
aspectRatio: 1,
|
||||
borderRadius: 12,
|
||||
borderWidth: 2,
|
||||
width: '31%',
|
||||
paddingVertical: 12,
|
||||
borderRadius: 8,
|
||||
borderWidth: 1.5,
|
||||
borderColor: '#E0E0E0',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#F8F9FA'
|
||||
backgroundColor: '#FFF',
|
||||
minHeight: 70
|
||||
},
|
||||
categoryItemActive: {
|
||||
backgroundColor: '#FFF',
|
||||
borderWidth: 3,
|
||||
transform: [{ scale: 1.05 }],
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 2 },
|
||||
shadowOpacity: 0.2,
|
||||
shadowRadius: 4,
|
||||
elevation: 4
|
||||
backgroundColor: '#F0F7FF',
|
||||
borderWidth: 2,
|
||||
borderColor: '#4A90E2'
|
||||
},
|
||||
categoryIcon: {
|
||||
fontSize: 28,
|
||||
fontSize: 24,
|
||||
marginBottom: 4
|
||||
},
|
||||
categoryName: {
|
||||
fontSize: 11,
|
||||
fontSize: 10,
|
||||
color: '#666',
|
||||
fontWeight: '600',
|
||||
fontWeight: '500',
|
||||
textAlign: 'center'
|
||||
},
|
||||
submitButton: {
|
||||
|
||||
Reference in New Issue
Block a user