🍎 Adjust Permissions UI to Comply with iOS Guidelines

package.cordovabuild.json

@@ -36,6 +36,7 @@
     "expose-loader": "^4.1.0",
     "file-loader": "^6.2.0",
     "phonegap": "9.0.0+cordova.9.0.0",
+    "prettier": "3.1.0",
     "process": "^0.11.10",
     "sass": "^1.62.1",
     "sass-loader": "^13.3.1",
@@ -57,6 +58,7 @@
         "FCM_VERSION": "23.+",
         "IOS_FIREBASE_MESSAGING_VERSION": "~> 8.1.1"
       },
+      "com.unarin.cordova.beacon": {},
       "cordova-plugin-ionic-keyboard": {},
       "cordova-plugin-app-version": {},
       "cordova-plugin-file": {},
@@ -97,8 +99,7 @@
         "ANDROID_SUPPORT_V4_VERSION": "27.+"
       },
       "cordova-plugin-bluetooth-classic-serial-port": {},
-      "cordova-custom-config": {},
-      "com.unarin.cordova.beacon": {}
+      "cordova-custom-config": {}
     }
   },
   "dependencies": {
@@ -113,14 +114,15 @@
     "chart.js": "^4.3.0",
     "chartjs-adapter-luxon": "^1.3.1",
     "chartjs-plugin-annotation": "^3.0.1",
+    "com.unarin.cordova.beacon": "github:e-mission/cordova-plugin-ibeacon",
     "cordova-android": "13.0.0",
     "cordova-ios": "7.1.1",
     "cordova-plugin-advanced-http": "3.3.1",
     "cordova-plugin-androidx-adapter": "1.1.3",
     "cordova-plugin-app-version": "0.1.14",
     "cordova-plugin-customurlscheme": "5.0.2",
     "cordova-plugin-device": "2.1.0",
-    "cordova-plugin-em-datacollection": "git+https://github.com/e-mission/e-mission-data-collection.git#v1.9.1",
+    "cordova-plugin-em-datacollection": "git+https://github.com/e-mission/e-mission-data-collection.git#v1.9.2",
     "cordova-plugin-em-opcodeauth": "git+https://github.com/e-mission/cordova-jwt-auth.git#v1.7.2",
     "cordova-plugin-em-server-communication": "git+https://github.com/e-mission/cordova-server-communication.git#v1.2.7",
     "cordova-plugin-em-serversync": "git+https://github.com/e-mission/cordova-server-sync.git#v1.3.3",
@@ -135,7 +137,6 @@
     "cordova-plugin-x-socialsharing": "6.0.4",
     "cordova-plugin-bluetooth-classic-serial-port": "git+https://github.com/e-mission/cordova-plugin-bluetooth-classic-serial-port.git",
     "cordova-custom-config": "^5.1.1",
-    "com.unarin.cordova.beacon": "github:e-mission/cordova-plugin-ibeacon",
     "core-js": "^2.5.7",
     "e-mission-common": "github:JGreenlee/e-mission-common#semver:0.6.2",
     "enketo-core": "^6.1.7",

www/i18n/en.json

@@ -296,7 +296,7 @@
         "description": {
           "android-lt-9": "Location services should be enabled and set to High Accuracy. This allows us to accurately record the trajectory of the travel",
           "android-gte-9": "Location services should be enabled. This allows us to access location data and generate the trip log",
-          "ios": "Location services should be enabled. This allows us to access location data and generate the trip log"
+          "ios": "Turn on location services to enable location tracking"
         }
       },
       "locperms": {
@@ -307,27 +307,28 @@
           "android-10": "Please select 'Allow all the time'",
           "android-11": "On the app settings page, choose the 'Location' permission and set it to 'Allow all the time'",
           "android-gte-12": "On the app settings page, choose the 'Location' permission and set it to 'Allow all the time' and 'Precise'",
-          "ios-lt-13": "Please select 'Always allow'",
-          "ios-gte-13": "On the app settings page, please select 'Always' and 'Precise' and return here to continue"
+          "ios-lt-13": "Select 'Always Allow' to enable location tracking",
+          "ios-13-13.3": "Select 'Always' location permissions on the next screen to enable location tracking, then return here to continue",
+          "ios-gte-13.4": "Select 'Precise' and 'Allow While Using App' on the next screen, then 'Change to Always Allow' to enable location tracking"
         }
       },
       "overall-fitness-name-android": "Physical activity",
       "overall-fitness-name-ios": "Motion and Fitness",
-      "overall-fitness-description": "The fitness sensors distinguish between walking, bicycling and motorized modes.  We use this data in order to separate the parts of multi-modal travel such as transit. We also use it to as a cross-check potentially spurious trips - if the location sensor jumps across town but the fitness sensor is stationary, we can guess that the trip was invalid.",
+      "overall-fitness-description": "The fitness sensors distinguish between walking, bicycling and motorized modes. We use this data in order to separate the parts of multi-modal travel such as transit. We also use it to as a cross-check potentially spurious trips - if the location sensor jumps across town but the fitness sensor is stationary, we can guess that the trip was invalid.",
       "fitnessperms": {
         "name": "Fitness Permission",
         "description": {
-          "android": "Please allow.",
-          "ios": "Please allow."
+          "android": "Allow motion and fitness tracking to enable mode detection",
+          "ios": "Allow motion and fitness tracking to enable mode detection"
         }
       },
       "overall-notification-name": "Notifications",
-      "overall-notification-description": "We need to use notifications to inform you if the settings are incorrect. We also use hourly invisible push notifications to wake up the app and allow it to upload data and check app status. We also use notifications to remind you to label your trips.",
+      "overall-notification-description": "We use notifications to alert you if settings are incorrect and to remind you to label your trips.",
       "notificationperms": {
         "app-enabled-name": "App Notifications",
         "description": {
-          "android-enable": "On the app settings page, ensure that all notifications and channels are enabled.",
-          "ios-enable": "Please allow, on the popup or the app settings page if necessary"
+          "android-enable": "On the app settings page, enable notifications for reminders and app status alerts.",
+          "ios-enable": "Allow notifications for reminders and app status alerts"
         }
       },
       "overall-background-restrictions-name": "Background restrictions",

www/js/appTheme.ts

@@ -31,7 +31,7 @@ const AppTheme = {
       level5: '#e1e9f1', // lch(92% 5 250)
     },
     success: '#00a665', // lch(60% 55 155)
-    warn: '#f8cf53', //lch(85% 65 85)
+    warn: '#ebac3e', // lch(75% 65 75)
     danger: '#f23934', // lch(55% 85 35),
     silver: '#d9d9d9',
     skyblue: '#7fcaea',

www/js/appstatus/PermissionItem.tsx

@@ -1,17 +1,28 @@
 import React from 'react';
-import { List, Button } from 'react-native-paper';
+import { List } from 'react-native-paper';
 import { useTranslation } from 'react-i18next';
+import { colors } from '../appTheme';
+
+function iconAndColorForCheck(check) {
+  if (check.status) return ['check-circle', colors.success];
+  if (!check.isOptional) return ['alert-circle', colors.error];
+  return [check.wasRequested ? 'minus-circle-off' : 'minus-circle-off-outline', colors.warn];
+}
 
 const PermissionItem = ({ check }) => {
   const { t } = useTranslation();
+  const [icon, color] = iconAndColorForCheck(check);
 
   return (
     <List.Item
+      onPress={() => check.fix()}
       title={t(check.name)}
-      description={t(check.desc)}
+      description={!check.status ? t(check.desc) : null}
       descriptionNumberOfLines={5}
-      left={() => <List.Icon icon={check.statusIcon} color={check.statusColor} />}
-      right={() => <Button onPress={() => check.fix()}>{t('intro.appstatus.fix')}</Button>}
+      left={() => <List.Icon icon={icon} color={color} />}
+      right={() => <List.Icon icon="chevron-right" />}
+      style={{ paddingHorizontal: 0 }}
+      contentStyle={{ paddingHorizontal: 16 }}
     />
   );
 };

www/js/appstatus/PermissionsControls.tsx

@@ -13,14 +13,7 @@ const PermissionsControls = ({ onAccept }) => {
   const { t } = useTranslation();
   const [explainVis, setExplainVis] = useState<boolean>(false);
   const { permissionStatus } = useContext(AppContext);
-  const { checkList, overallStatus, error, explanationList } = permissionStatus;
-
-  useEffect(() => {
-    if (!error) return;
-    AlertManager.addMessage({
-      text: error,
-    });
-  }, [error]);
+  const { checkList, overallStatus, explanationList } = permissionStatus;
 
   return (
     <>