Added a share screen and share image

App/Screens/ShareScreen/ShareImage/ShareImage.tsx

@@ -0,0 +1,64 @@
+// Sh**t! I Smoke
+// Copyright (C) 2018-2019 Marcelo S. Coelho, Amaury Martiny
+
+// Sh**t! I Smoke is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Sh**t! I Smoke is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Sh**t! I Smoke. If not, see <http:https://www.gnu.org/licenses/>.
+
+import React, { useContext } from 'react';
+import {
+ StyleSheet,
+ Text,
+ View
+} from 'react-native';
+
+import { CigaretteBlock, CurrentLocation } from '../../../components';
+import { ApiContext, CurrentLocationContext, FrequencyContext } from '../../../stores';
+import * as theme from '../../../util/theme';
+
+export function ShareImage () {
+ const { api } = useContext(ApiContext)!;
+ const { currentLocation } = useContext(CurrentLocationContext);
+ const { currentFrequency } = useContext(FrequencyContext);
+
+ const cigarettesPerDay = api!.shootISmoke.cigarettes;
+
+ return (
+ <View style={styles.container}>
+ <CigaretteBlock cigarettesPerDay={cigarettesPerDay} frequency={currentFrequency} displayFrequency style={{ paddingHorizontal: 0 }} />
+ <View>
+ <CurrentLocation api={api!} currentLocation={currentLocation!} numberOfLines={2} />
+ </View>
+
+ <Text style={styles.urlText}>https://shootismoke.github.io/</Text>
+
+ </View>
+ );
+}
+
+const styles = StyleSheet.create({
+ container: {
+ ...theme.withPadding,
+ alignItems: 'flex-start',
+ flexDirection: 'column',
+ paddingTop: theme.spacing.normal,
+ paddingBottom: theme.spacing.normal,
+ width: 400,
+ backgroundColor: 'white'
+ },
+
+ urlText: {
+ ...theme.text,
+ alignSelf: 'center',
+ marginTop: theme.spacing.mini
+ }
+});

App/Screens/ShareScreen/ShareImage/index.ts

@@ -0,0 +1,17 @@
+// Sh**t! I Smoke
+// Copyright (C) 2018-2019 Marcelo S. Coelho, Amaury Martiny
+
+// Sh**t! I Smoke is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Sh**t! I Smoke is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Sh**t! I Smoke. If not, see <http:https://www.gnu.org/licenses/>.
+
+export * from './ShareImage';

App/Screens/ShareScreen/ShareScreen.tsx

@@ -0,0 +1,92 @@
+// Sh**t! I Smoke
+// Copyright (C) 2018-2019 Marcelo S. Coelho, Amaury Martiny
+
+// Sh**t! I Smoke is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Sh**t! I Smoke is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Sh**t! I Smoke. If not, see <http:https://www.gnu.org/licenses/>.
+
+import React, { useEffect, createRef } from 'react';
+import { Share, StyleSheet, View } from 'react-native';
+import { NavigationInjectedProps } from 'react-navigation';
+import { captureRef } from 'react-native-view-shot';
+import { ShareImage } from './ShareImage';
+import { i18n } from '../../localization';
+import { Button } from '../../components';
+import * as theme from '../../util/theme';
+
+interface ShareScreenProps extends NavigationInjectedProps { }
+
+export function ShareScreen (props: ShareScreenProps) {
+ const refViewShot = createRef();
+
+ useEffect(() => {
+ setTimeout(async () => {
+ try {
+ const uri = await captureRef(refViewShot, {
+ format: 'png',
+ quality: 1
+ });
+
+ await Share.share({
+ title: 'Text title',
+ message: 'Text message',
+ url: uri
+ });
+ } catch (error) {
+ }
+
+ handleDismiss();
+ }, 750);
+ });
+
+ const handleDismiss = () => {
+ props.navigation.goBack();
+ };
+ return (
+ <View style={styles.container}>
+ <View style={styles.imageContainer}>
+ <View ref={refViewShot} collapsable={false}>
+ <ShareImage />
+ </View>
+ <View style={styles.buttonContainer}>
+ <Button onPress={handleDismiss} style={styles.button}>{i18n.t('close_button').toUpperCase()}</Button>
+ </View>
+ </View>
+ </View>
+ );
+}
+
+const styles = StyleSheet.create({
+ container: {
+ ...theme.fullScreen,
+ ...theme.withPadding,
+ flexGrow: 1,
+ flexDirection: 'column',
+ backgroundColor: 'rgba(0,0,0,0.8)'
+ },
+
+ buttonContainer: {
+ paddingVertical: 20
+ },
+
+ button: {
+ paddingHorizontal: 10
+ },
+
+ imageContainer: {
+ alignItems: 'center',
+ justifyContent: 'center',
+ transform: [
+ { scale: 0.8 }
+ ]
+ }
+});

App/Screens/ShareScreen/index.ts

@@ -0,0 +1,17 @@
+// Sh**t! I Smoke
+// Copyright (C) 2018-2019 Marcelo S. Coelho, Amaury Martiny
+
+// Sh**t! I Smoke is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Sh**t! I Smoke is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Sh**t! I Smoke. If not, see <http:https://www.gnu.org/licenses/>.
+
+export * from './ShareScreen';

package.json

@@ -40,6 +40,7 @@
  "react-native-reanimated": "~1.2.0",
  "react-native-scroll-into-view": "^1.0.3",
  "react-native-size-matters": "^0.2.1",
+ "react-native-view-shot": "~2.6.0",
  "react-navigation": "^4.0.10",
  "react-navigation-stack": "^1.8.1",
  "retry-ts": "^0.1.0",

yarn.lock

@@ -6496,7 +6496,7 @@ react-native-svg@*:
  resolved "https://registry.yarnpkg.com/react-native-svg/-/react-native-svg-9.5.3.tgz#2389f3ffd700c6441166496a1aeade31ead89c59"
  integrity sha512-VUOe4TLz7RFdmm/XT9EH87VSwlRykx49qbwJMA+dh9eFM7KPY1qH3kEyN7uRCqJD2eE8toxt9NpjR6ByvtPNlA==
 
-[email protected]:
+[email protected], react-native-view-shot@~2.6.0:
  version "2.6.0"
  resolved "https://registry.yarnpkg.com/react-native-view-shot/-/react-native-view-shot-2.6.0.tgz#3b23675826f67658366352c4b97b59a6aded2f43"
  integrity sha512-yO9vWi/11m2hEJl8FrW1SMeVzFfPtMKh20MUInGqlsL0H8Ya2JGGlFfrBzx1KiFR2hFb5OdsTLYNtcVZtJ6pLQ==