add "wasRequested" for optional notif permission; update UI

Although the notifs perm is optional, we do want to make sure the user is at least prompted for it. We need to ensure that overallStatus stays false until notif perms have been requested. We keep track of 'wasRequested', overallStatus will only pass if all checks are status=true or they are optional and have already been requested (ie they were explictly denied)

We can also have this reflected in the UI; use 'outline' icons to indicate a check that was not yet prompted and use 'filled in' icons to indicate an explicit choice.
Moved this to a separate function iconAndColorForCheck for tidiness

www/js/appstatus/PermissionItem.tsx

@@ -1,26 +1,23 @@
 import React from 'react';
-import { List, Button } from 'react-native-paper';
+import { List } from 'react-native-paper';
 import { useTranslation } from 'react-i18next';
-import { useAppTheme } from '../appTheme';
+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 { colors } = useAppTheme();
-
-  let icon, color;
-  if (check.status) {
-    icon = 'check-circle';
-    color = colors.success;
-  } else {
-    icon = check.isOptional ? 'minus-circle-off' : 'alert-circle-outline';
-    color = check.isOptional ? colors.warn : colors.error;
-  }
+  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={icon} color={color} />}
       right={() => <List.Icon icon="chevron-right" />}

www/js/usePermissionStatus.ts

@@ -25,6 +25,7 @@ type Check = {
   refresh: () => Promise<any>;
   status?: boolean;
   isOptional?: boolean;
+  wasRequested?: boolean;
 };
 
 const usePermissionStatus = () => {
@@ -36,7 +37,7 @@ const usePermissionStatus = () => {
 
   const overallStatus = useMemo<boolean | undefined>(() => {
     if (!checkList?.length) return undefined; // if checks not loaded yet, status is undetermined
-    return checkList.every((check) => check.status || check.isOptional);
+    return checkList.every((check) => check.status || (check.isOptional && check.wasRequested));
   }, [checkList]);
 
   //using this function to update checks rather than mutate
@@ -226,11 +227,16 @@ const usePermissionStatus = () => {
   function setupNotificationChecks() {
     let fixPerms = () => {
       logDebug('fix and refresh notification permissions');
+      appAndChannelNotificationsCheck.wasRequested = true;
       return checkOrFix(
         appAndChannelNotificationsCheck,
         window['cordova'].plugins.BEMDataCollection.fixShowNotifications,
         true,
-      );
+      ).then((error) => {
+        if (error) {
+          appAndChannelNotificationsCheck.desc = error;
+        }
+      });
     };
     let checkPerms = () => {
       logDebug('refresh notification permissions');
@@ -246,6 +252,7 @@ const usePermissionStatus = () => {
       fix: fixPerms,
       refresh: checkPerms,
       isOptional: true,
+      wasRequested: false,
     };
     let tempChecks = checkList;
     tempChecks.push(appAndChannelNotificationsCheck);