From 5682ae9f2b95d939159812ce00f427f36fcf6d7a Mon Sep 17 00:00:00 2001
From: Felix Hallenberg <feqwin@gmail.com>
Date: Sun, 6 Oct 2024 11:52:01 +0300
Subject: [PATCH] WIP Show modal if version not big enough

- Use storeurl as a build config
---
 README.md                              | 23 ++++-----
 appcenter-pre-build.sh                 |  1 +
 config.template.android.json           |  1 +
 config.template.ios.json               |  1 +
 src/Screens/Main/Tabs.tsx              | 19 ++++++--
 src/Screens/components/Modal/index.tsx | 65 ++++++++++++--------------
 src/api/config.ts                      |  1 +
 src/localization/en.ts                 |  5 ++
 src/localization/fi.ts                 |  5 ++
 9 files changed, 72 insertions(+), 49 deletions(-)

diff --git a/README.md b/README.md
index 1812dae7..bfdd5809 100644
--- a/README.md
+++ b/README.md
@@ -23,17 +23,18 @@ cp config.template.ios.json config.json
 
 You can edit the config file as suited:
 
-| Parameter          | Description                      |
-| --------------     | ---------------------------------|
-| `baseUrl`          | Ylitse API base URL              |
-| `loginUrl`         | Ylitse service login URL         |
-| `feedBackUrl`      | Feedback form URL                |
-| `termsUrl`         | Terms and conditions URL         |
-| `userGuideUrl`     | User's manual URL                |
-| `apuuUrl`          | Apuu-chat URL                    |
-| `sekasinUrl`       | Sekasin-chat URL                 |
-| `saferSpaceUrl`    | Principals of a safer space URL  |
-| `messageFetchDelay`| Delay between polling            |
+| Parameter          | Description                            |
+| -----------------  | ---------------------------------------|
+| `baseUrl`          | Ylitse API base URL                    |
+| `loginUrl`         | Ylitse service login URL               |
+| `feedBackUrl`      | Feedback form URL                      |
+| `termsUrl`         | Terms and conditions URL               |
+| `userGuideUrl`     | User's manual URL                      |
+| `apuuUrl`          | Apuu-chat URL                          |
+| `sekasinUrl`       | Sekasin-chat URL                       |
+| `saferSpaceUrl`    | Principals of a safer space URL        |
+| `storeUrl`         | App marketplace URL (build specific)   |
+| `messageFetchDelay`| Delay between polling                  |
 
 
 ### Running on iOS
diff --git a/appcenter-pre-build.sh b/appcenter-pre-build.sh
index 76d8e472..8bf5ee48 100644
--- a/appcenter-pre-build.sh
+++ b/appcenter-pre-build.sh
@@ -12,6 +12,7 @@ tee config.json > /dev/null <<EOF
     "userGuideUrl": "$YLITSE_USERGUIDEURL",
     "apuuUrl": "$YLITSE_APUUURL",
     "sekasinUrl": "$YLITSE_SEKASINURL",
+    "storeUrl": "$YLITSE_STOREURL",
     "saferSpaceUrl": "$YLITSE_SAFERSPACEURL",
     "messageFetchDelay": $YLITSE_MESSAGEFETCHDELAY
 }
diff --git a/config.template.android.json b/config.template.android.json
index 02095475..4c309c6d 100644
--- a/config.template.android.json
+++ b/config.template.android.json
@@ -7,5 +7,6 @@
   "apuuUrl": "http://10.0.2.2:3000",
   "sekasinUrl": "http://10.0.2.2:3000",
   "saferSpaceUrl": "http://10.0.2.2:3000",
+  "storeUrl":"http://localhost:3000", 
   "messageFetchDelay": 2000
 }
diff --git a/config.template.ios.json b/config.template.ios.json
index db3a1ec4..08b01d78 100644
--- a/config.template.ios.json
+++ b/config.template.ios.json
@@ -6,6 +6,7 @@
   "userGuideUrl": "http://localhost:3000",
   "apuuUrl": "http://localhost:3000",
   "sekasinUrl": "http://localhost:3000",
+  "storeUrl":"http://localhost:3000", 
   "saferSpaceUrl": "http://10.0.2.2:3000",
   "messageFetchDelay": 2000
 }
diff --git a/src/Screens/Main/Tabs.tsx b/src/Screens/Main/Tabs.tsx
index 50e50ef7..117077a0 100644
--- a/src/Screens/Main/Tabs.tsx
+++ b/src/Screens/Main/Tabs.tsx
@@ -1,10 +1,12 @@
 import React from 'react';
+import * as RN from 'react-native';
 
 import * as ReactRedux from 'react-redux';
 import * as redux from 'redux';
 import { selectFirstQuestion } from '../../state/reducers/questions';
 
 import { selectIsVersionBigEnough } from '../../state/reducers/minimumVersion';
+import { storeUrl } from '../../api/config';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import * as actions from '../../state/actions';
 
@@ -21,6 +23,7 @@ import Settings, { SettingsRoute } from './Settings';
 import QuestionModal from '../components/QuestionModal';
 import { Answer } from '../../api/feedback';
 import { TabBar } from './TabBar';
+import Modal from '../components/Modal';
 
 export type TabsRoute = {
   'Main/Tabs': {
@@ -37,9 +40,10 @@ type Props = {} & StackScreenProps<StackRoutes, 'Main/Tabs'>;
 const Main = ({ navigation, route }: Props) => {
   const dispatch = ReactRedux.useDispatch<redux.Dispatch<actions.Action>>();
   const initialRouteName = route.params?.initial;
+  const appClient = getClient();
 
   const isAppVersionBigEnough = ReactRedux.useSelector(
-    selectIsVersionBigEnough(getClient()),
+    selectIsVersionBigEnough(appClient),
   );
 
   const handleRefetchData = () => {
@@ -61,6 +65,8 @@ const Main = ({ navigation, route }: Props) => {
     callback: handleRefetchData,
   });
 
+  const openStore = () => RN.Linking.openURL(storeUrl);
+
   React.useEffect(() => {
     navigation.dispatch(state => {
       const routes = state.routes.filter(r => !r.name.includes('Onboarding'));
@@ -77,8 +83,6 @@ const Main = ({ navigation, route }: Props) => {
     dispatch({ type: 'minimumVersion/get/start', payload: undefined });
   }, []);
 
-  console.log('is app version is big enough:', isAppVersionBigEnough);
-
   return (
     <>
       <Tab.Navigator
@@ -97,6 +101,15 @@ const Main = ({ navigation, route }: Props) => {
           onAnswer={handleAnswer}
         />
       )}
+      {isAppVersionBigEnough && (
+        <Modal
+          modalType="danger"
+          title="main.version.not.big.enough.title"
+          messageId="main.version.not.big.enough.text"
+          primaryButtonMessage="main.version.not.big.enough.button"
+          onPrimaryPress={openStore}
+        />
+      )}
     </>
   );
 };
diff --git a/src/Screens/components/Modal/index.tsx b/src/Screens/components/Modal/index.tsx
index 39a8e4d2..fd0bba4b 100644
--- a/src/Screens/components/Modal/index.tsx
+++ b/src/Screens/components/Modal/index.tsx
@@ -36,49 +36,44 @@ const Modal: React.FC<Props> = props => {
   } as const;
 
   return (
-    <RN.View style={styles.container}>
-      <RN.Modal animationType="fade" transparent={true} visible={true}>
-        <RN.View style={styles.background}>
-          <RN.View style={[props.style, styles.modalContainer]}>
-            <RN.View style={[styles.titleContainer, { backgroundColor }]}>
-              <RN.Image style={styles.image} source={icon} />
-              <Message id={props.title} style={styles.title} />
-            </RN.View>
+    <RN.Modal animationType="fade" transparent={true} visible={true}>
+      <RN.View style={styles.background}>
+        <RN.View style={[props.style, styles.modalContainer]}>
+          <RN.View style={[styles.titleContainer, { backgroundColor }]}>
+            <RN.Image style={styles.image} source={icon} />
+            <Message id={props.title} style={styles.title} />
+          </RN.View>
 
-            <RN.View style={styles.textContainer}>
-              <Message id={props.messageId} style={styles.text} />
-            </RN.View>
+          <RN.View style={styles.textContainer}>
+            <Message id={props.messageId} style={styles.text} />
+          </RN.View>
 
-            <RN.View style={[styles.buttonContainer, justifyButtons]}>
-              {props.onSecondaryPress && (
-                <Button
-                  onPress={props.onSecondaryPress}
-                  messageId={props.secondaryButtonMessage ?? 'meta.ok'}
-                  style={[styles.button, styles.secondaryButton]}
-                  emphasis="medium"
-                />
-              )}
-              {props.onPrimaryPress && (
-                <Button
-                  onPress={props.onPrimaryPress}
-                  messageId={
-                    props.primaryButtonMessage ?? 'components.remoteData.retry'
-                  }
-                  style={[styles.button, styles.primaryButton]}
-                />
-              )}
-            </RN.View>
+          <RN.View style={[styles.buttonContainer, justifyButtons]}>
+            {props.onSecondaryPress && (
+              <Button
+                onPress={props.onSecondaryPress}
+                messageId={props.secondaryButtonMessage ?? 'meta.ok'}
+                style={[styles.button, styles.secondaryButton]}
+                emphasis="medium"
+              />
+            )}
+            {props.onPrimaryPress && (
+              <Button
+                onPress={props.onPrimaryPress}
+                messageId={
+                  props.primaryButtonMessage ?? 'components.remoteData.retry'
+                }
+                style={[styles.button, styles.primaryButton]}
+              />
+            )}
           </RN.View>
         </RN.View>
-      </RN.Modal>
-    </RN.View>
+      </RN.View>
+    </RN.Modal>
   );
 };
 
 const styles = RN.StyleSheet.create({
-  container: {
-    flex: 1,
-  },
   background: {
     backgroundColor: colors.transparentBlack,
     position: 'absolute',
diff --git a/src/api/config.ts b/src/api/config.ts
index b1dd0e50..7b79370d 100644
--- a/src/api/config.ts
+++ b/src/api/config.ts
@@ -9,3 +9,4 @@ export const apuuUrl = config.apuuUrl;
 export const sekasinUrl = config.sekasinUrl;
 export const saferSpaceUrl = config.saferSpaceUrl;
 export const messageFetchDelay = config.messageFetchDelay;
+export const storeUrl = config.storeUrl;
diff --git a/src/localization/en.ts b/src/localization/en.ts
index 3ac01472..0d466528 100644
--- a/src/localization/en.ts
+++ b/src/localization/en.ts
@@ -159,6 +159,11 @@ export const messages: { [key in MessageId]: string } = {
     'SOS-Lapsikylä representative will contact you after the investigation.',
   'main.userreport.title': 'Report',
 
+  'main.version.not.big.enough.button': 'Update',
+  'main.version.not.big.enough.text':
+    'An update is necessary to continue using the app. Click below to download the latest version.',
+  'main.version.not.big.enough.title': 'Update required',
+
   'meta.back': 'Back',
   'meta.blank': ' ',
   'meta.cancel': 'Cancel',
diff --git a/src/localization/fi.ts b/src/localization/fi.ts
index 3565f01d..ec71396d 100644
--- a/src/localization/fi.ts
+++ b/src/localization/fi.ts
@@ -159,6 +159,11 @@ export const messages = {
     'SOS-Lapsikylän työntekijä selvittää tilanteen ja ottaa sinuun yhteyttä.',
   'main.userreport.title': 'Ilmianna',
 
+  'main.version.not.big.enough.button': 'Päivitä nyt',
+  'main.version.not.big.enough.text':
+    'Päivitys on tarpeen sovelluksen käytön jatkamiseksi. Napsauta alla olevaa painiketta ladataksesi uusimman version',
+  'main.version.not.big.enough.title': 'Päivitys saatavilla',
+
   'meta.back': 'Takaisin',
   'meta.blank': ' ',
   'meta.cancel': 'Peru',