Merge branch 'dev' into pr/482

CHANGELOG.md

@@ -2,6 +2,49 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [12.3.1](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.3.0...v12.3.1) (2022-04-03)
+
+
+### Bug fixes
+
+* Ability to login and logout offline ([ffd54d4](https://github.com/hopetambala/puente-reactnative-collect/commit/ffd54d40bf0cad8813fd0359bf244cc0524ff93a))
+
+## [12.3.0](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.2.1...v12.3.0) (2022-04-03)
+
+
+### Bug fixes
+
+* Issue where the app wasn't able to be navigated due to blocked resources ([59ac648](https://github.com/hopetambala/puente-reactnative-collect/commit/59ac6489b6c4488e9b2fd9b6018049aa59df6719))
+
+
+### New Features
+
+* Add ability to populate the resident's cache from the header ([1c70680](https://github.com/hopetambala/puente-reactnative-collect/commit/1c70680ce6c06fc830381d72bc985fbd65cceaf9))
+
+### [12.2.1](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.2.0...v12.2.1) (2022-03-30)
+
+
+### Bug fixes
+
+* custom forms not loading in form gallery ([68f1991](https://github.com/hopetambala/puente-reactnative-collect/commit/68f19912d3b0740a1b0ee7bcac64f29930fdbd1c))
+
+## [12.2.0](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.1.6...v12.2.0) (2022-03-28)
+
+### [12.1.6](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.1.5...v12.1.6) (2022-03-26)
+
+
+### Bug fixes
+
+* add borderRadius to Autofill and make text black ([8532701](https://github.com/hopetambala/puente-reactnative-collect/commit/85327017907f6f09a29b892ffe18cb5d476dc609))
+* autofill space ([6995b62](https://github.com/hopetambala/puente-reactnative-collect/commit/6995b62929c5bab692a3559e7035dd4787d83921))
+
+
+### New Features
+
+* add cache populating when user exists ([d149216](https://github.com/hopetambala/puente-reactnative-collect/commit/d1492166026b07658a5f2e870b6eea29a4613579))
+* initial setup to deactivate surveyData form ([2f7e7f8](https://github.com/hopetambala/puente-reactnative-collect/commit/2f7e7f8440cf1bc01aedc7827018f7d873493379))
+* **puente-forms:** add disabled inputs for sup forms ([cedad83](https://github.com/hopetambala/puente-reactnative-collect/commit/cedad83b5d7477063fd6b3513c18e491fd8c5b81))
+
 ### [12.1.5](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.1.4...v12.1.5) (2022-02-12)
 
 ### [12.1.4](https://github.com/hopetambala/puente-reactnative-collect/compare/v12.1.3...v12.1.4) (2022-02-12)

README.md

@@ -4,6 +4,7 @@
 [![Build Status](https://travis-ci.com/hopetambala/puente-reactnative-collect.svg?branch=master)](https://travis-ci.com/hopetambala/puente-reactnative-collect)
 [![Codacy Badge](https://api.codacy.com/project/badge/Grade/490748505d184028b66bbdaf9c83f887)](https://app.codacy.com/manual/hopetambala/puente-reactnative-collect?utm_source=github.com&utm_medium=referral&utm_content=hopetambala/puente-reactnative-collect&utm_campaign=Badge_Grade_Dashboard)
 [![codecov](https://codecov.io/gh/hopetambala/puente-reactnative-collect/branch/master/graph/badge.svg)](https://codecov.io/gh/hopetambala/puente-reactnative-collect)
+[![Tuple](https://img.shields.io/badge/Pairing%20with-Tuple-5A67D8)](https://tuple.app)
 
 Here are some quick npm commands to get started:
 - `npm install`: Install Node dependencies

app.json

@@ -7,7 +7,7 @@
       "android",
       "web"
     ],
-    "version": "12.1.5",
+    "version": "12.3.1",
     "orientation": "portrait",
     "icon": "./assets/images/icon.png",
     "scheme": "myapp",
@@ -23,7 +23,7 @@
     ],
     "ios": {
       "supportsTablet": true,
-      "buildNumber": "12.1.5",
+      "buildNumber": "12.3.1",
       "infoPlist": {
         "NSLocationWhenInUseUsageDescription": "This app uses your location to geo-tag surveys accurately.",
         "NSCameraUsageDescription": "This app uses photos to identify residents more accurately.",
@@ -36,7 +36,7 @@
       "favicon": "./assets/images/favicon.png"
     },
     "android": {
-      "versionCode": 420120105,
+      "versionCode": 420120301,
       "permissions": [
         "ACCESS_COARSE_LOCATION",
         "ACCESS_FINE_LOCATION",

components/Button/index.js

@@ -1,25 +1,49 @@
+import PropTypes from 'prop-types';
 import * as React from 'react';
-import { Button } from 'react-native-paper';
+import { Button as PaperButton } from 'react-native-paper';
 
 import { layout, theme } from '../../modules/theme';
 
-export default function PaperButton({
-  onPressEvent, buttonText,
-  mode, compact, icon, disabled, loading,
+const colorStyle = {
+  primary: theme.colors.primary,
+  accent: theme.colors.accent,
+  empty: theme.colors.placeholder,
+  black: theme.colors.black
+};
+
+const Button = ({
+  onPress, buttonText,
+  mode, compact, icon, disabled, loading, color,
   style
-}) {
-  return (
-    <Button
-      icon={icon || ''}
-      mode={mode || 'contained'}
-      disabled={!!disabled}
-      theme={theme}
-      style={[layout.button, style]}
-      onPress={onPressEvent}
-      compact={!!compact}
-      loading={!!loading}
-    >
-      {buttonText}
-    </Button>
-  );
-}
+}) => (
+  <PaperButton
+    icon={icon || ''}
+    mode={mode || 'contained'}
+    disabled={!!disabled}
+    theme={theme}
+    style={[layout.button, style]}
+    onPress={onPress}
+    compact={!!compact}
+    loading={!!loading}
+    color={colorStyle[color]}
+  >
+    {buttonText}
+  </PaperButton>
+);
+
+Button.defaultProps = {
+  color: 'primary',
+  icon: '',
+  disabled: false,
+  loading: false
+};
+
+Button.propTypes = {
+  color: PropTypes.oneOf(['primary', 'accent', 'empty', 'black']),
+  icon: PropTypes.string,
+  disabled: PropTypes.bool,
+  loading: PropTypes.bool,
+  onPress: PropTypes.func.isRequired
+};
+
+export default Button;

components/FormikFields/PaperInputPicker/AutoFill/index.js

@@ -88,6 +88,7 @@ export default class AutoFill extends Component {
                 formikProps.setFieldValue(formikKey, text);
               }}
               placeholder={placeholder}
+              placeholderTextColor="black"
               listStyle={styles.listContainer}
               keyExtractor={(item,) => item.key}
               onStartShouldSetResponderCapture={() => {
@@ -101,7 +102,9 @@ export default class AutoFill extends Component {
               }}
               renderItem={({ item }) => (
                 // you can change the view you want to show in suggestion from here
+
                 <TouchableOpacity
+                  style={styles.itemText}
                   key={`${item}`}
                   onPress={() => {
                     this.setState({ query: item });
@@ -134,6 +137,7 @@ export default class AutoFill extends Component {
                 formikProps.setFieldValue(formikKey, text);
               }}
               placeholder={placeholder}
+              placeholderTextColor="black"
               listStyle={styles.listContainer}
               keyExtractor={(item,) => item.key}
               renderItem={({ item }) => (
@@ -164,20 +168,27 @@ const styles = StyleSheet.create({
     paddingLeft: 15,
     paddingRight: 15,
     paddingTop: 10,
-    marginBottom: 75,
+    marginBottom: 75
   },
   textInputContainer: {
     borderColor: theme.colors.primary,
     borderWidth: 1,
+    borderRadius: 4,
+    paddingBottom: 8,
+    paddingTop: 8,
+    paddingLeft: 10,
+    backgroundColor: '#FFFFFF'
   },
   itemText: {
     fontSize: 15,
-    paddingTop: 5,
-    paddingBottom: 5,
     margin: 2,
-    flex: 1
+    flex: 1,
+    padding: 5,
+    color: '#000000'
   },
   listContainer: {
     height: 80,
+    borderBottomRightRadius: 4,
+    borderBottomLeftRadius: 4
   }
 });

components/FormikFields/PaperInputPicker/AutoFillMS/index.js

@@ -92,6 +92,7 @@ const AutoFillMS = (props) => {
               setQuery(text);
             }}
             placeholder={placeholder}
+            placeholderTextColor="black"
             listStyle={styles.listContainer}
             keyExtractor={() => uuid.v4()}
             onStartShouldSetResponderCapture={() => {
@@ -133,6 +134,7 @@ const AutoFillMS = (props) => {
               setQuery(text);
             }}
             placeholder={placeholder}
+            placeholderTextColor="black"
             listStyle={styles.listContainer}
             keyExtractor={() => uuid.v4()}
             renderItem={({ item }) => (
@@ -164,28 +166,28 @@ const styles = StyleSheet.create({
     paddingLeft: 15,
     paddingRight: 15,
     paddingTop: 10,
-    marginBottom: 75,
-  },
-  chipRow: {
-    flexDirection: 'row',
-    flexWrap: 'wrap',
-  },
-  chip: {
-    padding: 5
+    marginBottom: 75
   },
   textInputContainer: {
     borderColor: theme.colors.primary,
     borderWidth: 1,
+    borderRadius: 4,
+    paddingBottom: 8,
+    paddingTop: 8,
+    paddingLeft: 10,
+    backgroundColor: '#FFFFFF'
   },
   itemText: {
     fontSize: 15,
-    paddingTop: 5,
-    paddingBottom: 5,
     margin: 2,
-    flex: 1
+    flex: 1,
+    padding: 5,
+    color: '#000000'
   },
   listContainer: {
     height: 80,
+    borderBottomRightRadius: 4,
+    borderBottomLeftRadius: 4
   }
 });
 

components/FormikFields/PaperInputPicker/Geolocation/index.js

@@ -48,14 +48,14 @@ const Geolocation = ({ errors, formikKey, setFieldValue }) => {
     <View key={formikKey}>
       {location === null && (
       <PaperButton
-        onPressEvent={handleLocation}
+        onPress={handleLocation}
         buttonText={I18n.t('paperButton.getLocation')}
       />
       )}
       {location !== null && (
       <View>
         <PaperButton
-          onPressEvent={handleLocation}
+          onPress={handleLocation}
           buttonText={I18n.t('paperButton.getLocationAgain')}
         />
         <View style={{ marginLeft: 'auto', marginRight: 'auto', flexDirection: 'row' }}>

components/Header/index.js

@@ -1,11 +1,13 @@
-import React, { useState } from 'react';
+import { Spinner } from 'native-base';
+import React, { useContext, useState } from 'react';
 import { Platform, View } from 'react-native';
 import Emoji from 'react-native-emoji';
 import {
   Button,
   Headline, IconButton, Text,
 } from 'react-native-paper';
 
+import { OfflineContext } from '../../context/offline.context';
 import surveyingUserFailsafe from '../../domains/DataCollection/Forms/utils';
 import { deleteData, getData } from '../../modules/async-storage';
 import handleParseError from '../../modules/cached-resources/error-handling';
@@ -27,6 +29,7 @@ const Header = ({
   const [offlineFormCount, setOfflineFormCount] = useState(0);
   const [submission, setSubmission] = useState(null);
   const [showCounts, setShowCounts] = useState(false);
+  const { populateResidentDataCache, isLoading: isOfflineLoading } = useContext(OfflineContext);
 
   const volunteerLength = (object) => {
     const date = new Date(object.createdAt);
@@ -162,6 +165,12 @@ const Header = ({
     });
   };
 
+  const cacheOfflineData = async () => {
+    checkOnlineStatus().then(async (connected) => {
+      if (connected) await populateResidentDataCache();
+    });
+  };
+
   const navToSettings = () => {
     setDrawerOpen(false);
     setSettings(true);
@@ -209,6 +218,11 @@ const Header = ({
                 ) : (
                   <Button disabled>{I18n.t('header.submitOffline')}</Button>
                 )}
+                {isOfflineLoading ? (
+                  <Spinner color="blue" />
+                ) : (
+                  <Button onPress={cacheOfflineData}>{I18n.t('header.populateOffline')}</Button>
+                )}
                 {submission === false && (
                   <View>
                     <Text style={styles.calculationText}>{I18n.t('header.failedAttempt')}</Text>