Merge pull request #21 from fga-eps-mds/163-social-share

163 social share
fga-eps-mds · May 11, 2021 · c08a2ad · c08a2ad
2 parents 573b475 + 51d7461
commit c08a2ad
Show file tree

Hide file tree

Showing 5 changed files with 59 additions and 5 deletions.
diff --git a/projeto-kokama/package.json b/projeto-kokama/package.json
@@ -43,6 +43,7 @@
  "react-native-reanimated": "^2.0.1",
  "react-native-safe-area-context": "^3.2.0",
  "react-native-screens": "^2.18.1",
+ "react-native-share": "^6.0.0",
  "react-native-vector-icons": "^8.1.0",
  "react-native-web": "~0.13.12",
  "react-navigation": "^4.4.4"

diff --git a/projeto-kokama/src/assets/img/share.png b/projeto-kokama/src/assets/img/share.png
diff --git a/projeto-kokama/src/screens/Translation/index.tsx b/projeto-kokama/src/screens/Translation/index.tsx
@@ -5,10 +5,12 @@ import {
  TouchableWithoutFeedback,
  ScrollView,
  SafeAreaView,
+ Share,
 } from "react-native";
 import React, { useState, useEffect } from "react";
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import Icon from "react-native-vector-icons/AntDesign";
+import Icon5 from "react-native-vector-icons/FontAwesome5";
 import HighlightText from "@sanar/react-native-highlight-text";
 import { Dictionary, Phrase, HistoryTuple } from "./interface";
 import {
@@ -30,6 +32,20 @@ const Translation = () => {
  const [destLanguage, setDestLanguage] = useState(KOKAMA);
  const [dictionary, setDictionary] = useState<Dictionary[]>([]);
  const [history, setHistory] = useState<HistoryTuple[]>([]);
+ let shareTranslation: string = "";
+
+ const MyCustomShare = async () => {
+
+ try{
+ await Share.share({
+ title: 'Tadução Kokama',
+ message: translation.concat(" - ", shareTranslation, "\nPara saber mais do aplicativo acesse esse link: \nhttps://fga-eps-mds.github.io/2020.2-Projeto-Kokama-Wiki/"),
+ });
+
+ }catch (error) {
+ console.log('error => ', error);
+ }
+ };
 
  useEffect(() => {
  const getDictionary = async () => {
@@ -182,9 +198,12 @@ const Translation = () => {
 
  // For a given dictionary element(word), return its kokama and portuguese words for presentation
  function getWords(language: string, word: Dictionary) {
+ let stringConcat: string = '';
  if (language == KOKAMA) {
+ shareTranslation = word.translations[0];
  return word.translations;
  } else {
+ shareTranslation = word.word_kokama;
  return [word.word_kokama];
  }
  }
@@ -237,9 +256,18 @@ const Translation = () => {
  {words !== "" && (
  <View style={translationStyle.translationArea}>
  {/* Presentation of the translations words */}
- <Text style={translationStyle.translatedWord}>
- {capitalizeFirstLetter(words)}
- </Text>
+ <View style={translationStyle.ShareTitle}>
+ <Text style={translationStyle.translatedWord}>
+ {capitalizeFirstLetter(words)}
+ </Text>
+ <TouchableWithoutFeedback onPress={MyCustomShare}>
+ <View style={translationStyle.ShareIcon}>
+ <Icon5 name="share-square" size={22} color={Colors.HISTORY_WORD_TEXT}/>
+ </View> 
+ </TouchableWithoutFeedback>
+ </View>
+
+
  {phrases.map((phrase, index) => (
  <View style={translationStyle.exampleArea} key={index}>
  {/* Phrase kokama */}

diff --git a/projeto-kokama/src/screens/Translation/styles.ts b/projeto-kokama/src/screens/Translation/styles.ts
@@ -107,9 +107,8 @@ const styles = StyleSheet.create({
  textAlign: "left",
  fontSize: 28,
  color: Colors.TEXT,
- paddingLeft: 23,
+ paddingLeft: 15,
  marginBottom: 15,
- borderBottomWidth: 1.5,
  borderColor: Colors.DARK_GRAY,
  },
  exampleArea: {
@@ -174,6 +173,27 @@ const styles = StyleSheet.create({
  fontSize: 18,
  color: Colors.HISTORY_WORD_TEXT,
  },
+ ShareTitle: {
+ flexDirection: "row",
+ height: 40,
+ borderBottomWidth: 1.5,
+ marginTop: 10,
+ marginLeft: 40,
+ borderColor: Colors.DARK_GRAY,
+ backgroundColor: Colors.WHITE,
+ alignItems: "center",
+ justifyContent: "space-between",
+ display: "flex",
+ },
+ Title: {
+ textAlign: "left",
+ fontSize: 20,
+ paddingLeft: 23,
+ color: Colors.HISTORY_TEXT,
+ },
+ ShareIcon: {
+ marginBottom: 10,
+ },
 });
 
 export default styles;
diff --git a/projeto-kokama/yarn.lock b/projeto-kokama/yarn.lock
@@ -7946,6 +7946,11 @@ react-native-screens@^2.18.1:
  resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-2.18.1.tgz#47b9991c6f762d00d0ed3233e5283d523e859885"
  integrity sha512-r5WZLpmx2hHjC1RgMdPq5YpSU9tEhBpUaZ5M1SUtNIONyiLqQVxabhRCINdebIk4depJiIl7yw2Q85zJyeX6fw==
 
+react-native-share@^6.0.0:
+ version "6.0.0"
+ resolved "https://registry.yarnpkg.com/react-native-share/-/react-native-share-6.0.0.tgz#00fbd014679f1d6a9d3cfa69fb5f7d3c01d151b4"
+ integrity sha512-6mNDXKt5/d8pQbl56EmxzXSTsW4g/6zwXt8/YfzJL4WFx/Go5YEaKbb/PYyD2XLv2UU8CPEa2bHpnzwLmUnMDg==
+
 react-native-vector-icons@^7.0.0:
  version "7.1.0"
  resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-7.1.0.tgz#145487d617b2a81d395d2cf64e6e065fcab3a454"