implementing logic of application

App.tsx

@@ -1,21 +1,24 @@
 import 'react-native-gesture-handler';
 import * as React from 'react';
 
-import { StyleSheet, Platform, LogBox } from 'react-native';
 import { Routes } from './react-native/app/routes/component';
 import { PortalContextContainer } from './react-native/app/contexts/portals/container';
+import { LogBox } from 'react-native';
+import { Bootstrap } from './react-native/bootstrap/start/component';
+
+
+
 
 export default function App() {
-  React.useEffect(()=>{
-    LogBox.ignoreLogs([
-      "[react-native-gesture-handler] Seems like you\'re using an old API with gesture components, check out new Gestures system!",
-    ]);
-  })
+  React.useEffect(()=>{    
+    LogBox.ignoreAllLogs();
+  }, [])
+
   return (
-    <>
-      <PortalContextContainer>
-        <Routes/>
-      </PortalContextContainer>
+    <> 
+      
+        <Bootstrap/>
+      
     </>
-  );
+  ); 
 }

react-native/app/pages/list_portals/component.tsx

@@ -3,15 +3,18 @@ import React, { useRef } from 'react'
 import { ButtonDelete, ButtonOpen, DivButtonDelete, DivDelete, ItemList, TextButtonOpen, TextItem, TextWithoutPortal, WrapperItemListText, WrapperItemListView, WrapperList, WrapperListContainer, WrapperViewAdd } from './styles'
 import { usePortal } from '../../contexts/portals/hook';
 import { Modalize } from 'react-native-modalize';
-import { Alert } from 'react-native';
 import { StorePortals } from '../store_portals/component';
 import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
 import { colors } from '../../styles/colors';
 import { SwipeListView } from 'react-native-swipe-list-view';
 import { IHandles } from 'react-native-modalize/lib/options';
 import { IItem, IItemDelete, IListPortalsDTO } from './types'
+import i18next from 'i18next'
+import { initTranslation } from '../../translations/index';
 
 export const ListPortals = ({ navigation }: IListPortalsDTO)=>{
+
+    initTranslation()
     const icon = <FontAwesome5 color={colors.white} solid size={18} name={'plus'} />;
     const {portals, setPortals} = usePortal()
     async function getPortals(){
@@ -22,9 +25,9 @@ export const ListPortals = ({ navigation }: IListPortalsDTO)=>{
                 let portalsStorage = await AsyncStorage.getItem('portal')
                 portalsStorage = JSON.parse(portalsStorage as string)
                 setPortals(portalsStorage)
-                console.log('portals', portals)
+                
             } else {
-                console.log('Dont Have Portals Storage')
+                console.log('Error: Dont Have Portals Storage')
             }
         } catch(e){
             console.log('error',e)
@@ -52,7 +55,7 @@ export const ListPortals = ({ navigation }: IListPortalsDTO)=>{
                 await AsyncStorage.setItem('portal', JSON.stringify(newPortalStorage))
                 setPortals(newPortalStorage)                                           
             } else {
-                Alert.alert('Portals', 'Dont have Portals in Storage')
+                console.log('Error: Dont have Portals in Storage')
             }
         } catch(e){
             console.log('error',e)
@@ -72,7 +75,7 @@ export const ListPortals = ({ navigation }: IListPortalsDTO)=>{
         <WrapperListContainer>
 
             <ButtonOpen onPress={onOpen}>
-                <TextButtonOpen>New Portal {icon}</TextButtonOpen>
+                <TextButtonOpen>{i18next.t("mobileApp.portals.list.add.button.label")} {icon}</TextButtonOpen>
             </ButtonOpen>
             
             <Modalize ref={modalizeRef} adjustToContentHeight={true}>
@@ -99,8 +102,8 @@ export const ListPortals = ({ navigation }: IListPortalsDTO)=>{
                     leftOpenValue={0}
                     rightOpenValue={-80}
                     disableRightSwipe={true}
-                    closeOnRowPress={true}    
-                    closeOnRowOpen={true}                                 
+                    closeOnRowPress={true}     
+                    closeOnRowOpen={true}                                   
                     onRowOpen={(rowKey, rowMap) => {
                         //This timeout is recommended https://github.com/jemise111/react-native-swipe-list-view/blob/master/docs/migrating-to-flatlist.md
                         setTimeout(() => {
@@ -109,8 +112,8 @@ export const ListPortals = ({ navigation }: IListPortalsDTO)=>{
                             }
                         }, 3000)                                                    
                     }}
-                />
-                : <TextWithoutPortal>There aren't Portals</TextWithoutPortal>
+                /> 
+                : <TextWithoutPortal>{i18next.t("mobileApp.portals.list.empty.label")}</TextWithoutPortal>
             }
         </WrapperListContainer>
     )

react-native/app/pages/list_portals/styles.ts

@@ -97,8 +97,6 @@ export const ButtonDelete = styled.TouchableOpacity`
     margin: 3% auto;
     width: 100%;
     height: 80px;
-    //left: 20px;
-
     
     justify-content: center;
     align-items: center;

react-native/app/pages/store_portals/component.tsx

@@ -6,29 +6,42 @@ import { ButtonApp } from '../../components/button/component';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import { usePortal } from '../../contexts/portals/hook';
 import { IStore } from './types';
+import { initTranslation } from '../../translations/index';
+import i18next from 'i18next';
 
 export const StorePortals = ({navigation, modalizeRef}:IStore)=>{
+    initTranslation()
     const {portals, setPortals} = usePortal()
     const [name, setName] = React.useState('');
     const [url, setUrl] = React.useState('');
     const [emptyFields, setEmptyFields] = React.useState(false);
+    const [nameAlreadyUsed, setNameAlreadyUsed] = React.useState(false);
 
     async function newPortal(name:string, url:string){
         let portalsStorage;
         portalsStorage = await AsyncStorage.getItem('portal')            
         portalsStorage = portalsStorage ? JSON.parse(portalsStorage) : null            
-        portalsStorage.push({name, url})            
-        AsyncStorage.setItem('portal', JSON.stringify(portalsStorage))            
+        portalsStorage.push({name, url})
+        AsyncStorage.setItem('portal', JSON.stringify(portalsStorage))
         setPortals(portalsStorage)
         modalizeRef?.current?.close();
         navigation.navigate(name)
     }
 
     async function onPress(){
-
+        //return false;
         if(!name || !url) return setEmptyFields(true)
         try{
+            let portalsFilter = portals.filter((portal: {name: string, url: string})=>{
+                if(portal.name != name ) return false
+                return portal                  
+            })
+            if(portalsFilter.length >= 1){
+                setNameAlreadyUsed(true)
+                return false;
+            }
             await newPortal(name, url )
+
         } catch(e){
             console.log('error', e)
             await AsyncStorage.setItem('portal', JSON.stringify([]))
@@ -41,7 +54,12 @@ export const StorePortals = ({navigation, modalizeRef}:IStore)=>{
         <>
             {   
                 emptyFields ?
-                <TextEmptyFileds>Empty Fields</TextEmptyFileds>
+                <TextEmptyFileds>{i18next.t("mobileApp.portals.addPortalPopup.validation.emptyFilds")}</TextEmptyFileds>
+                : null
+            }
+            {   
+                nameAlreadyUsed ?
+                <TextEmptyFileds>{i18next.t("mobileApp.portals.addPortalPopup.validation.portalNameAlreadyExists")}</TextEmptyFileds>
                 : null
             }
         </>
@@ -53,13 +71,13 @@ export const StorePortals = ({navigation, modalizeRef}:IStore)=>{
                 <WrapperStore>
                     {textEmptyFields()}
                     <WrapperInput>
-                        <InputText value={name} onChangeText={(e:any)=>setName(e)} placeholder='Demo Server' label='Portal Name'/>                       
+                        <InputText value={name} onChangeText={(e:any)=>setName(e)} placeholder={i18next.t("mobileApp.portals.fields.name.placeholder")} label={i18next.t("mobileApp.portals.fields.name.label")}/>                       
                     </WrapperInput>
                     <WrapperInput>
-                        <InputText value={url} onChangeText={(e:any)=>setUrl(e)} placeholder='https://bigbluebutton.org/' label='Server URL'/>                       
+                        <InputText value={url} onChangeText={(e:any)=>setUrl(e)} placeholder={i18next.t("mobileApp.portals.fields.url.placeholder")} label={i18next.t("mobileApp.portals.fields.url.label")}/>                       
                     </WrapperInput>
                     <WrapperInput>
-                        <ButtonApp onPress={onPress}><Text>Add</Text></ButtonApp>
+                        <ButtonApp onPress={onPress}><Text>{i18next.t("mobileApp.portals.addPortalPopup.confirm.button.label")}</Text></ButtonApp>
                     </WrapperInput>
                 </WrapperStore>
             </WrapperStoreContainer>   

react-native/app/routes/component.js

@@ -1,18 +1,19 @@
 import * as React from 'react';
-import { Alert } from 'react-native';
 import { NavigationContainer } from '@react-navigation/native';
 import { ListPortals } from '../pages/list_portals/component';
 import { usePortal } from '../contexts/portals/hook';
 import AsyncStorage from '@react-native-async-storage/async-storage';
+import i18next from 'i18next';
 
 import {
   createDrawerNavigator,
 } from '@react-navigation/drawer';
 import SdkContainer from '../../bootstrap/sdk/container';
+import { initTranslation } from '../translations/index';
 
 const Drawer = createDrawerNavigator();
 export const Routes = ()=>{
-
+  initTranslation()
   
   const {portals, setPortals} = usePortal()
   async function getPortals(){
@@ -22,8 +23,6 @@ export const Routes = ()=>{
               let portalsStorage = await AsyncStorage.getItem('portal')
               portalsStorage = JSON.parse(portalsStorage)
               setPortals(portalsStorage)
-          } else {
-              Alert.alert('Portals', 'Dont have Portals in Storage')
           }
       } catch(e){
           console.log('error', e)
@@ -45,7 +44,7 @@ export const Routes = ()=>{
           }}
         >
           
-          <Drawer.Screen name="Portals" component={ListPortals} />         
+          <Drawer.Screen name={i18next.t("mobileApp.portals.drawerNavigation.button.label")} component={ListPortals} />         
           { 
             portals || portals != 0 ?
             portals.map((item)=>{
@@ -56,15 +55,4 @@ export const Routes = ()=>{
         </Drawer.Navigator>
       </NavigationContainer>
   );
-}
-
-
-export const RoutesContainer = ()=>{
-
-  return(
-
-    <>
-        <Routes/>
-    </>
-  )
 }

react-native/bootstrap/start/component.js

@@ -1,15 +1,13 @@
 import React from 'react'
-import { GestureHandlerRootView } from 'react-native-gesture-handler'
 import { Routes } from '../../app/routes/component';
+import { PortalContextContainer } from '../../app/contexts/portals/container';
 
 
-//This archive is used to envolve app in contexts, libs, etc..
+//This file is used to envolve app in contexts, libs, etc..
 export const Bootstrap = ()=>{
-    return (
-        <>            
-            <GestureHandlerRootView>                    
-                    <Routes/>                    
-            </GestureHandlerRootView>           
-        </>
+    return (  
+        <PortalContextContainer>
+            <Routes/>
+        </PortalContextContainer>                    
     )
 }