Merge branch 'beta-testers' of https://github.com/PeruibeTEC/Mobile i…

…nto beta-testers
PeruibeTEC · Nov 20, 2021 · 132e701 · 132e701
2 parents 14e94e4 + ce74ae9
commit 132e701
Show file tree

Hide file tree

Showing 14 changed files with 347 additions and 279 deletions.
diff --git a/package.json b/package.json
@@ -32,9 +32,9 @@
     "@react-native-community/datetimepicker": "^3.5.2",
     "@react-native-community/masked-view": "0.1.10",
     "@react-native-community/picker": "^1.8.1",
-    "@react-navigation/drawer": "^5.12.9",
+    "@react-navigation/drawer": "^5.x",
     "@react-navigation/material-bottom-tabs": "^5.3.15",
-    "@react-navigation/native": "^5.9.4",
+    "@react-navigation/native": "^5.x",
     "@react-navigation/stack": "^5.14.5",
     "@typescript-eslint/parser": "^4.28.5",
     "@unform/core": "^1.9.8",

diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
@@ -16,7 +16,7 @@ const Header: React.FC = () => {
       <TouchableOpacity
         activeOpacity={0.8}
         onPress={() => {
-          navigation.dispatch(DrawerActions.openDrawer);
+          navigation.dispatch(DrawerActions.openDrawer());
         }}
       >
         <MenuIcon name="menu" />

diff --git a/src/components/SecondaryHeader/index.tsx b/src/components/SecondaryHeader/index.tsx
@@ -16,10 +16,10 @@ const SecondaryHeader: React.FC<IProps> = ({ title }) => {
       <TouchableOpacity
         activeOpacity={0.8}
         onPress={() => {
-          navigation.dispatch(DrawerActions.openDrawer);
+          navigation.goBack();
         }}
       >
-        <MenuIcon name="menu" />
+        <MenuIcon name="chevron-left" />
       </TouchableOpacity>
 
       <Title>{title}</Title>

diff --git a/src/routes/tab.routes.tsx b/src/routes/tab.routes.tsx
@@ -75,23 +75,21 @@ function HomeTabs() {
 
 const AppRoutes: React.FC = () => {
   return (
-    <NavigationContainer independent>
-      <StackRoutes.Navigator
-        headerMode="none"
-        screenOptions={{
-          cardStyle: {
-            backgroundColor: colors.light.background,
-          },
-        }}
-      >
-        <StackRoutes.Screen name="HomeTabs" component={HomeTabs} />
-        <StackRoutes.Screen name="Project" component={Project} />
-        <StackRoutes.Screen
-          name="DetailRestaurant"
-          component={DetailRestaurant}
-        />
-      </StackRoutes.Navigator>
-    </NavigationContainer>
+    <StackRoutes.Navigator
+      headerMode="none"
+      screenOptions={{
+        cardStyle: {
+          backgroundColor: colors.light.background,
+        },
+      }}
+    >
+      <StackRoutes.Screen name="HomeTabs" component={HomeTabs} />
+      <StackRoutes.Screen name="Project" component={Project} />
+      <StackRoutes.Screen
+        name="DetailRestaurant"
+        component={DetailRestaurant}
+      />
+    </StackRoutes.Navigator>
   );
 };
 

diff --git a/src/screens/DetailRestaurant/components/ActionButton/index.tsx b/src/screens/DetailRestaurant/components/ActionButton/index.tsx
@@ -1,12 +1,9 @@
 import React, { ReactElement } from 'react';
-import {
-  SafeAreaView,
-  TouchableOpacity,
-  TouchableOpacityProps,
-} from 'react-native';
-
+import { TouchableOpacity, TouchableOpacityProps } from 'react-native';
 import FontAwesome from '@expo/vector-icons/FontAwesome';
 
+import normalize from '../../../../utils/normalizeSize';
+
 import { ContainerBox, Text } from './styles';
 
 interface IProps extends TouchableOpacityProps {
@@ -24,13 +21,11 @@ export function ActionButton({
   ...rest
 }: IProps): ReactElement {
   return (
-    <SafeAreaView style={{ paddingHorizontal: 12 }}>
-      <TouchableOpacity activeOpacity={0.6} {...rest}>
-        <ContainerBox borderColor={borderColor} bgc={backgroundColor}>
-          <FontAwesome name={iconName} size={30} color="#fff" />
-          <Text>{text}</Text>
-        </ContainerBox>
-      </TouchableOpacity>
-    </SafeAreaView>
+    <TouchableOpacity activeOpacity={0.6} {...rest}>
+      <ContainerBox borderColor={borderColor} bgc={backgroundColor}>
+        <FontAwesome name={iconName} size={normalize(32)} color="#fff" />
+        <Text>{text}</Text>
+      </ContainerBox>
+    </TouchableOpacity>
   );
 }
diff --git a/src/screens/DetailRestaurant/components/ActionButton/styles.ts b/src/screens/DetailRestaurant/components/ActionButton/styles.ts
@@ -1,4 +1,7 @@
 import styled, { css } from 'styled-components/native';
+import fonts from '../../../../styles/fonts';
+import normalize from '../../../../utils/normalizeSize';
+import pixelToDP from '../../../../utils/pixelToDP';
 
 interface ContainerProps {
   bgc: string;
@@ -14,15 +17,17 @@ export const ContainerBox = styled.View<ContainerProps>`
       border-color: ${props.borderColor};
     `}
 
+  width: ${pixelToDP.width(80)}px;
+  height: ${pixelToDP.height(80)}px;
+
   align-items: center;
   justify-content: center;
-  width: 80px;
-  height: 70px;
-  border-radius: 16px;
+
+  border-radius: ${normalize(16)}px;
 `;
 
 export const Text = styled.Text`
-  font-size: 12px;
-  font-family: 'Roboto_500Medium';
+  font-size: ${normalize(12)}px;
+  font-family: ${fonts.robotoMedium};
   color: #fff;
 `;
diff --git a/src/screens/DetailRestaurant/components/AvaliationCard/index.tsx b/src/screens/DetailRestaurant/components/AvaliationCard/index.tsx
diff --git a/src/screens/DetailRestaurant/components/AvaliationCard/styles.ts b/src/screens/DetailRestaurant/components/AvaliationCard/styles.ts
diff --git a/src/screens/DetailRestaurant/components/EvaluationCard/index.tsx b/src/screens/DetailRestaurant/components/EvaluationCard/index.tsx
@@ -0,0 +1,63 @@
+import React from 'react';
+import MaterialIcons from '@expo/vector-icons/MaterialIcons';
+
+import { Text } from 'react-native';
+import normalize from '../../../../utils/normalizeSize';
+
+import {
+  ContainerCard,
+  BoxRating,
+  Rating,
+  RatingText,
+  EvaluationContainer,
+  LinkToEvaluations,
+  EvaluationNow,
+  Footer,
+  Header,
+  Divider,
+} from './styles';
+
+interface IProps {
+  numberOfStars: number;
+  totalEvaluations: number;
+}
+
+const EvaluationCard: React.FC<IProps> = ({
+  numberOfStars,
+  totalEvaluations,
+}) => {
+  return (
+    <ContainerCard>
+      <Header>
+        <BoxRating>
+          <Rating>{numberOfStars}</Rating>
+          <MaterialIcons name="star" color="#fff" size={normalize(24)} />
+        </BoxRating>
+
+        <EvaluationContainer>
+          <RatingText>4.5 de 5 estrelas</RatingText>
+
+          <LinkToEvaluations>
+            {`(${totalEvaluations} Avaliações)`}
+          </LinkToEvaluations>
+        </EvaluationContainer>
+      </Header>
+
+      <Divider />
+
+      <Footer>
+        <EvaluationNow>Avalie agora!</EvaluationNow>
+
+        <Text style={{ marginHorizontal: 8, color: '#fff' }}>•</Text>
+
+        <MaterialIcons name="star-border" color="#D4F5FF" size={24} />
+        <MaterialIcons name="star-border" color="#D4F5FF" size={24} />
+        <MaterialIcons name="star-border" color="#D4F5FF" size={24} />
+        <MaterialIcons name="star-border" color="#D4F5FF" size={24} />
+        <MaterialIcons name="star-border" color="#D4F5FF" size={24} />
+      </Footer>
+    </ContainerCard>
+  );
+};
+
+export default EvaluationCard;