Feature/2023 07 16 altering project structure

src/screens/AddBankAccount/AddBankAccount.js → src/components/Forms/AddAccount.js

@@ -3,9 +3,9 @@ import { View, Text, TextInput, Button, Alert } from "react-native";
 
 import { addAccounts } from "../../utils/storageAccounts.js";
 
-import styles from "./styles.js";
+import styles from "../../styles/styles";
 
-function AddBankAccount({ navigation }) {
+function AddAccount({ navigation }) {
   const [name, setName] = useState("");
   const [bank, setbank] = useState("");
   const [balance, setbalance] = useState(0.0);
@@ -77,16 +77,9 @@ function AddBankAccount({ navigation }) {
 
       <View style={styles.buttonsView}>
         <Button title="Add" onPress={handleAddAccount} />
-        <Button
-          color="#757de8"
-          title="Back"
-          onPress={() => {
-            navigation.goBack();
-          }}
-        ></Button>
       </View>
     </View>
   );
 }
 
-export default AddBankAccount;
+export default AddAccount;

src/screens/Add/TransactionForm.js → src/components/Forms/AddTransaction.js

@@ -3,7 +3,7 @@ import { View, Text, TextInput, TouchableOpacity, Alert } from "react-native";
 import DateTimePicker from "@react-native-community/datetimepicker";
 import { Picker } from "@react-native-picker/picker";
 
-import styles from "./styles.js";
+import styles from "../../styles/AddTransactionStyle";
 import { addRevenuesAndExpenses } from "../../utils/storage.js";
 import { useAccountsCardStore } from "../../stores/CardsStore.js";
 

src/screens/EditBankAccount/EditBankAccount.js → src/components/Forms/EditAccount.js

@@ -1,11 +1,10 @@
 import React, { useState } from "react";
 import { View, Text, TextInput, Button } from "react-native";
 
+import styles from "../../styles/EditFormsStyle";
 import {updateAccounts} from "../../utils/storageAccounts";
 
-import styles from "./styles";
-
-const EditBankAccount = ({ route, navigation }) => {
+const EditAccount = ({ route, navigation }) => {
   const { index, account } = route.params;
   const [name, setName] = useState(account.name);
   const [bank, setBank] = useState(account.bank);
@@ -84,4 +83,4 @@ const EditBankAccount = ({ route, navigation }) => {
     </View>
   );
 };
-export default EditBankAccount;
+export default EditAccount;

src/screens/ExtractDetail/formEdit.js → src/components/Forms/EditTransaction.js

@@ -9,10 +9,10 @@ import {
 } from "react-native";
 import DateTimePicker from '@react-native-community/datetimepicker';
 
-import styles from "./stylesForms.js";
+import styles from "../../styles/EditFormsStyle.js"
 import { updateRevenuesAndExpenses } from "../../utils/storage.js";
 
-export default function EditForm({ route, navigation }) {
+export default function EditTransaction({ route, navigation }) {
   const { transaction, index } = route.params;
   const [name, setName] = useState(transaction.name);
   const [value, setValue] = useState(transaction.value.toString());

src/routes/ExtractRoute.js

@@ -2,17 +2,19 @@ import React from "react";
 import { createStackNavigator } from "@react-navigation/stack";
 
 import ExtractS from "../screens/Extract/Extract";
-import ExtractDetail from "../screens/ExtractDetail/ExtractDetail";
-import EditForm from "../screens/ExtractDetail/formEdit";
+import DetailTransaction from "../screens/DetailTransaction/DetailTransaction";
+import EditTransaction from "../components/Forms/EditTransaction";
+import FormsScreen from "../screens/FormsScreen/FormsScreen";
 
 const Stack = createStackNavigator();
 
 export function ExtractRoute() {
   return (
     <Stack.Navigator screenOptions={{ headerShown: false }}>
       <Stack.Screen name="ExtractS" component={ExtractS} />
-      <Stack.Screen name="ExtractDetail" component={ExtractDetail} />
-      <Stack.Screen name="EditForm" component={EditForm} />
+      <Stack.Screen name="DetailTransaction" component={DetailTransaction} />
+      <Stack.Screen name="EditTransaction" component={EditTransaction} />
+      <Stack.Screen name="FormsScreen" component={FormsScreen} />
     </Stack.Navigator>
   );
 }

src/routes/Main.js

@@ -3,16 +3,14 @@ import { NavigationContainer } from "@react-navigation/native";
 import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
 
 import Home from "../screens/Home/Home.js";
-import { AddRoute } from "./AddAccount.js";
+import { AddRoute } from "./RouteAccounts.js";
 import { ExtractRoute } from "./ExtractRoute.js";
 
-import Add from "../screens/Add/Add";
 import { LogoTitle } from "../components/LogoTitle.js";
 
 import HomeIcon from "../assets/home.svg";
 import ExtratoIcon from "../assets/extract.svg";
 import ContasIcon from "../assets/accounts.svg";
-import AddIcon from "../assets/add.svg";
 
 const Tab = createBottomTabNavigator();
 
@@ -42,8 +40,6 @@ export function MainRoute() {
                 return <ExtratoIcon width={24} height={24} />;
               case "Accounts":
                 return <ContasIcon width={24} height={24} />;
-              case "Add":
-                return <AddIcon width={24} height={24} />;
               default:
                 return null;
             }
@@ -68,24 +64,22 @@ export function MainRoute() {
         >
           {(props) => <Home visibleBalance={visibleBalance} {...props} />}
         </Tab.Screen>
-        <Tab.Screen name="Extract" 
-          options={{
-              headerStyle:{backgroundColor:"#2196f3"},
-              headerTintColor: "#fff"
-              }}
-          component={ExtractRoute} />
-        <Tab.Screen name="Accounts"
+        <Tab.Screen
+          name="Extract"
           options={{
-            headerStyle:{backgroundColor:"#2196f3"},
-            headerTintColor: "#fff"
-            }}
-          component={AddRoute} />
-        <Tab.Screen name="Add" 
+            headerStyle: { backgroundColor: "#2196f3" },
+            headerTintColor: "#fff",
+          }}
+          component={ExtractRoute}
+        />
+        <Tab.Screen
+          name="Accounts"
           options={{
-            headerStyle:{backgroundColor:"#2196f3"},
-            headerTintColor: "#fff"
-            }}
-          component={Add} />
+            headerStyle: { backgroundColor: "#2196f3" },
+            headerTintColor: "#fff",
+          }}
+          component={AddRoute}
+        />
       </Tab.Navigator>
     </NavigationContainer>
   );

src/routes/RouteAccounts.js

@@ -0,0 +1,23 @@
+import React from "react";
+
+import { createStackNavigator } from "@react-navigation/stack";
+
+import Accounts from "../screens/Accounts/Accounts";
+import FormsScreen from "../screens/FormsScreen/FormsScreen";
+import AddAccount from "../components/Forms/AddAccount";
+import DetailAccount from "../screens/DetailAccount/DetailAccount";
+import EditAccount from "../components/Forms/EditAccount";
+
+const Stack = createStackNavigator();
+
+export function AddRoute() {
+  return (
+    <Stack.Navigator screenOptions={{ headerShown: false }}>
+      <Stack.Screen name="MainCounts" component={Accounts} />
+      <Stack.Screen name="FormsScreen" component={FormsScreen} />
+      <Stack.Screen name="AddAccount" component={AddAccount} />
+      <Stack.Screen name="DetailAccount" component={DetailAccount} />
+      <Stack.Screen name="EditAccount" component={EditAccount} />
+    </Stack.Navigator>
+  );
+}