Merge pull request #30 from fga-eps-mds/develop

Final Release

Author: micaellagouveia

app.config.js

@@ -1,14 +1,14 @@
 export default {
   expo: {
-    name: 'multilind-frontend',
-    slug: 'multilind-frontend',
+    name: 'Multilind',
+    slug: 'Multilind',
     version: '1.0.0',
     orientation: 'portrait',
-    icon: './assets/icon.png',
+    icon: './src/assets/images/icon.png',
     splash: {
-      image: './assets/splash.png',
+      image: './src/assets/images/splash.png',
       resizeMode: 'contain',
-      backgroundColor: '#ffffff',
+      backgroundColor: '#338BAE',
     },
     updates: {
       fallbackToCacheTimeout: 0,
@@ -20,8 +20,8 @@ export default {
     android: {
       permissions: ['ACCESS_BACKGROUND_LOCATION'],
       adaptiveIcon: {
-        foregroundImage: './assets/adaptive-icon.png',
-        backgroundColor: '#FFFFFF',
+        foregroundImage: './src/assets/images/adaptive-icon.png',
+        backgroundColor: '#338BAE',
       },
       package: 'com.gabrieldvpereira.multilindfrontend',
     },

src/assets/images/adaptive-icon.png

@@ -0,0 +1,49 @@
+import React, { useState, useEffect } from 'react';
+import { View, Text } from 'react-native';
+import { Ionicons } from '@expo/vector-icons';
+import { DialetoService } from '../../services';
+import styles from './styles';
+
+export function LanguageInfo({ language, style }) {
+  const [dialeto, setDialeto] = useState([]);
+
+  useEffect(() => {
+    async function getDialetos() {
+      const response = await DialetoService.getAllDialetos({
+        idLingua: language.id_lingua,
+      });
+      setDialeto(response);
+    }
+    getDialetos();
+  }, []);
+
+  const list = () =>
+    dialeto.map((etnia) => (
+      <View key={etnia.etnia.id_etnia} style={styles.scrollView}>
+        <Text style={styles.thirdtext}>Etnias Falantes: </Text>
+
+        <View style={styles.textlist}>
+          <View>
+            <Text style={styles.text}>
+              <Ionicons name="ios-people" size={20} color="gray" />
+              {'  '}
+              {etnia.etnia.nome}
+            </Text>
+          </View>
+        </View>
+      </View>
+    ));
+  return (
+    <View style={[styles.textcontainer, style]}>
+      {language?.nomes_alternativos && (
+        <Text style={styles.firsttext}>
+          Nome(s) Alternativos: {language?.nomes_alternativos}
+        </Text>
+      )}
+      <Text style={styles.firsttext}>
+        Família Linguística: {language?.tronco?.nome ?? 'Isolada'}
+      </Text>
+      <View style={{ top: '2%' }}>{list()}</View>
+    </View>
+  );
+}

src/assets/images/icon.png

@@ -0,0 +1,52 @@
+import { StyleSheet } from 'react-native';
+import { MONTSERRAT_SEMIBOLD, GRAY } from '../../constants';
+
+const styles = StyleSheet.create({
+  textcontainer: {
+    display: 'flex',
+    flexDirection: 'column',
+    justifyContent: 'space-around',
+    width: '90%',
+  },
+  firsttext: {
+    fontFamily: MONTSERRAT_SEMIBOLD,
+    fontSize: 16,
+    color: GRAY,
+    paddingTop: '2%',
+  },
+  textlist: {
+    fontSize: 20,
+    fontFamily: MONTSERRAT_SEMIBOLD,
+    color: GRAY,
+    display: 'flex',
+    justifyContent: 'space-between',
+  },
+  text: {
+    marginLeft: 5,
+    fontFamily: MONTSERRAT_SEMIBOLD,
+    fontSize: 16,
+    color: GRAY,
+  },
+  thirdtext: {
+    fontFamily: MONTSERRAT_SEMIBOLD,
+    fontSize: 16,
+    color: GRAY,
+    paddingTop: '2%',
+    paddingBottom: '2%',
+  },
+  greypercentage: {
+    fontFamily: MONTSERRAT_SEMIBOLD,
+    backgroundColor: '#E5E5E5',
+    width: 277,
+    height: 27,
+    borderRadius: 13.5,
+  },
+  yellowpercentage: {
+    fontFamily: MONTSERRAT_SEMIBOLD,
+    backgroundColor: '#FFC100',
+    width: 75,
+    height: '100%',
+    borderRadius: 13.5,
+  },
+});
+export default styles;

src/assets/images/splash.png

@@ -11,6 +11,7 @@ export { Loading } from './Loading';
 export { SearchBar } from './SearchBar';
 export { GoBack } from './GoBack';
 export { ImageContainer } from './ImageContainer';
+export { LanguageInfo } from './LanguageInformation';
 export { Filter } from './Filter';
 export { DictOrImage } from './DictOrImage';
 export { WordMeaning } from './WordMeaning';

src/components/LanguageInformation/index.jsx

@@ -1,5 +1,6 @@
 import React, { createContext, useState, useEffect, useContext } from 'react';
 import { LanguageService } from '../services';
+import { sortName } from '../utils';
 
 const LanguageContext = createContext();
 
@@ -10,7 +11,7 @@ export function LanguageContextProvider({ children }) {
   async function getAllLanguages() {
     const response = await LanguageService.getAllLanguages();
     setLoadingLanguages(false);
-    setLanguages(response);
+    setLanguages(sortName(response));
   }
 
   useEffect(() => {

src/components/LanguageInformation/styles.js

@@ -5,7 +5,7 @@ import { useRoute } from '@react-navigation/native';
 import styles from './styles';
 import { useLanguage } from '../../contexts';
 import { portraitImage, dicionaryImage } from '../../assets/images';
-import { GoBack, TopBar, DictOrImage } from '../../components';
+import { GoBack, TopBar, LanguageInfo, DictOrImage } from '../../components';
 
 export function LanguageInitialScreen() {
   const route = useRoute();
@@ -19,6 +19,8 @@ export function LanguageInitialScreen() {
         <GoBack />
         <TopBar>{language.nome}</TopBar>
         <View style={styles.container}>
+          <LanguageInfo language={language} style={styles.LanguageInfo} />
+
           <View style={styles.Dict}>
             <DictOrImage
               style={styles.dictChildren}

src/components/index.js

@@ -23,7 +23,6 @@ export function LanguagePerFamily() {
   const list = () =>
     FilterListSearch(listFamily, familySearch).map((tronco, index) => (
       <View key={tronco.id_tronco} style={styles.listcontainer}>
-        {console.log(tronco)}
         <TouchableOpacity
           style={styles.list}
           onPress={() => setExpanded(expanded === index ? null : index)}

src/contexts/LanguageContext.jsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import { View, FlatList } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import { useLanguage } from '../../contexts';
-import { FilterListSearch, sortName } from '../../utils';
+import { FilterListSearch } from '../../utils';
 import {
   Language,
   ModalMod,
@@ -39,6 +39,7 @@ export function LanguageScreen() {
         </View>
 
         <FlatList
+          contentContainerStyle={{ paddingBottom: '90%' }}
           ListEmptyComponent={
             <View style={styles.loadingOrEmptyContainer}>
               <LoadingOrEmptyMessage
@@ -52,7 +53,7 @@ export function LanguageScreen() {
               />
             </View>
           }
-          data={sortName(filteredList)}
+          data={filteredList}
           keyExtractor={(item) => String(item.id_lingua)}
           renderItem={({ item }) => <Language language={item} />}
         />

src/screens/LanguageInitialScreen/index.jsx

@@ -1,16 +1,11 @@
 import React, { useState, useCallback } from 'react';
 import { View } from 'react-native';
-import { Entypo } from '@expo/vector-icons';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useLocation, useIdiom } from '../../contexts';
-import { Input, GoogleMap, ContentBottomModal } from '../../components';
+import { GoogleMap, ContentBottomModal } from '../../components';
 
 import styles from './styles';
-import { DARK_GRAY } from '../../constants';
 
 export function MapScreen() {
-  const insets = useSafeAreaInsets();
-
   const { location, hasLocation } = useLocation();
   const { idioms } = useIdiom();
   const [bottomModalVisible, setBottomModalVisible] = useState(false);
@@ -23,15 +18,6 @@ export function MapScreen() {
 
   return (
     <View style={styles.container}>
-      <Input
-        icon={<Entypo name="magnifying-glass" size={30} color={DARK_GRAY} />}
-        inputContainerStyle={[
-          styles.searchBar,
-          {
-            top: insets.top + 20,
-          },
-        ]}
-      />
       {hasLocation && (
         <GoogleMap
           initialRegion={location}

src/screens/LanguagePerFamily/index.jsx

@@ -10,7 +10,7 @@ import {
   SearchBar,
   LoadingOrEmptyMessage,
 } from '../../components';
-import { FilterListSearch, sortMeaning } from '../../utils';
+import { FilterListSearchWord, sortMeaning } from '../../utils';
 import styles from './styles';
 
 export function WordsScreen() {
@@ -29,11 +29,11 @@ export function WordsScreen() {
     getWords();
   }, []);
 
-  const filteredWords = FilterListSearch(words, wordSearch);
+  const filteredWords = FilterListSearchWord(words, wordSearch);
 
   return (
     <SafeAreaView>
-      <View>
+      <View style={{ marginBottom: 20 }}>
         <GoBack />
         <TopBar>Palavras</TopBar>
         <SearchBar
@@ -42,7 +42,7 @@ export function WordsScreen() {
         />
       </View>
       <FlatList
-        style={styles.listcontainer}
+        contentContainerStyle={styles.listcontainer}
         ListEmptyComponent={
           <View style={styles.loadingOrEmptyContainer}>
             <LoadingOrEmptyMessage

src/screens/LanguageScreen/index.jsx

@@ -1,7 +1,7 @@
 import { StyleSheet } from 'react-native';
 
 const styles = StyleSheet.create({
-  listcontainer: { marginTop: 20 },
+  listcontainer: { paddingBottom: '40%' },
   loadingOrEmptyContainer: { paddingHorizontal: 10 },
 });
 

src/screens/MapScreen/index.jsx

@@ -0,0 +1,10 @@
+export const FilterListSearchWord = (list, search) =>
+  list.filter((item) =>
+    search === '' ||
+    item.nome.toLowerCase().substring(0, search.length) ===
+      search.toLowerCase() ||
+    item.significado.toLowerCase().substring(0, search.length) ===
+      search.toLowerCase()
+      ? item
+      : false
+  );

src/screens/WordScreen/index.jsx

@@ -1,3 +1,4 @@
 export { sortName, inverseSortName, sortMeaning } from './sortByName';
 export { FilterListSearch } from './FilterListSearch';
 export { removeAccent } from './removeAccent';
+export { FilterListSearchWord } from './FilterWordSearch';