v0.2.4: fix countdown notification not appearing + wrong time-remaining

Countdown notification "nothing appears" on session start:
- The small icon was the adaptive launcher mipmap (applicationInfo.icon),
  which Android 13+/GrapheneOS rejects as an invalid notification small icon
  and drops the post silently. Ship a proper white-on-transparent vector
  small icon (bbp_stat_parking) inside the module and use it.
- showCountdown now returns a diagnostic string (posted / notifications
  disabled / exception) instead of swallowing failures; JS logs the branch,
  permission result, and native outcome to the in-app diagnostics log.
- Log the raw active-session payload in refreshSessionStatus (element shape
  was previously unconfirmed).

Time remaining showed "7694 min":
- API's TimeRemaining is SECONDS, not minutes. Format it as hours+minutes
  in SessionDetail; annotate the type.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

app/app.json

@@ -3,14 +3,14 @@
     "name": "BigBrainParking",
     "slug": "bigbrainparking",
     "scheme": "bigbrainparking",
-    "version": "0.2.3",
+    "version": "0.2.4",
     "orientation": "portrait",
     "userInterfaceStyle": "automatic",
     "newArchEnabled": true,
     "icon": "./assets/icon.png",
     "android": {
       "package": "top.mowden.bigbrainparking",
-      "versionCode": 13,
+      "versionCode": 14,
       "edgeToEdgeEnabled": true,
       "adaptiveIcon": {
         "foregroundImage": "./assets/adaptive-icon.png",

app/modules/bbp-notify/android/src/main/java/expo/modules/bbpnotify/BbpNotifyModule.kt

@@ -21,14 +21,21 @@ class BbpNotifyModule : Module() {
   override fun definition() = ModuleDefinition {
     Name("BbpNotify")
 
+    // Returns a short diagnostic string so the JS layer can log exactly what
+    // happened (posted / notifications-disabled / exception). "Nothing appears"
+    // bugs are otherwise invisible because notify() fails silently.
     AsyncFunction("showCountdown") { title: String, body: String, endTimeMillis: Double ->
-      val ctx = appContext.reactContext ?: return@AsyncFunction
+      val ctx = appContext.reactContext
+        ?: return@AsyncFunction "no-context"
       ensureChannel(ctx)
 
+      val mgr = NotificationManagerCompat.from(ctx)
+      val enabled = mgr.areNotificationsEnabled()
+
       val builder = NotificationCompat.Builder(ctx, CHANNEL_ID)
         .setContentTitle(title)
         .setContentText(body)
-        .setSmallIcon(ctx.applicationInfo.icon)
+        .setSmallIcon(R.drawable.bbp_stat_parking)
         .setOngoing(true)
         .setOnlyAlertOnce(true)
         .setShowWhen(true)
@@ -52,10 +59,14 @@ class BbpNotifyModule : Module() {
         )
       }
 
-      try {
-        NotificationManagerCompat.from(ctx).notify(NOTIF_ID, builder.build())
-      } catch (_: SecurityException) {
-        // POST_NOTIFICATIONS not granted yet; caller requests it separately.
+      return@AsyncFunction try {
+        mgr.notify(NOTIF_ID, builder.build())
+        "posted enabled=$enabled sdk=${Build.VERSION.SDK_INT}"
+      } catch (e: SecurityException) {
+        // POST_NOTIFICATIONS not granted.
+        "security-exception enabled=$enabled msg=${e.message}"
+      } catch (e: Exception) {
+        "exception enabled=$enabled ${e.javaClass.simpleName}=${e.message}"
       }
     }
 

app/modules/bbp-notify/android/src/main/res/drawable/bbp_stat_parking.xml

@@ -0,0 +1,15 @@
+<!--
+  Notification small icon: a white-on-transparent timer glyph (Material "timer").
+  Small icons MUST be a simple monochrome drawable — the app launcher mipmap
+  (applicationInfo.icon) is an adaptive/full-colour icon and is dropped as an
+  invalid small icon on Android 13+/GrapheneOS, so we ship our own here.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+    <path
+        android:fillColor="#FFFFFFFF"
+        android:pathData="M15,1L9,1L9,3L15,3L15,1ZM11,14L13,14L13,8L11,8L11,14ZM19.03,7.39L20.45,5.97C20.02,5.46 19.55,4.98 19.04,4.56L17.62,5.98C16.07,4.74 14.12,4 12,4C7.03,4 3,8.03 3,13C3,17.97 7.02,22 12,22C16.98,22 21,17.97 21,13C21,10.88 20.26,8.93 19.03,7.39ZM12,20C8.13,20 5,16.87 5,13C5,9.13 8.13,6 12,6C15.87,6 19,9.13 19,13C19,16.87 15.87,20 12,20Z" />
+</vector>

app/modules/bbp-notify/index.ts

@@ -2,8 +2,11 @@ import { Platform } from 'react-native';
 import { requireOptionalNativeModule } from 'expo-modules-core';
 
 interface BbpNotifyNative {
-  /** Post/replace an ongoing notification with a native chronometer counting down to endTimeMillis. */
-  showCountdown(title: string, body: string, endTimeMillis: number): Promise<void>;
+  /**
+   * Post/replace an ongoing notification with a native chronometer counting down
+   * to endTimeMillis. Returns a short diagnostic string (e.g. "posted enabled=true").
+   */
+  showCountdown(title: string, body: string, endTimeMillis: number): Promise<string>;
   /** Remove the countdown notification. */
   clear(): Promise<void>;
 }
@@ -22,8 +25,9 @@ export async function showCountdown(
   title: string,
   body: string,
   endTimeMillis: number,
-): Promise<void> {
-  await native?.showCountdown(title, body, endTimeMillis);
+): Promise<string> {
+  if (!native) return 'no-native-module';
+  return native.showCountdown(title, body, endTimeMillis);
 }
 
 export async function clearCountdown(): Promise<void> {

app/src/notifications/sessionStatus.ts

@@ -53,13 +53,28 @@ function fmtLeft(min: number): string {
 
 /** Post (or replace) the ongoing status notification for a session end time. */
 export async function showSessionStatus(args: { zoneName: string; endTime: Date }): Promise<void> {
-  if (!(await getCountdownEnabled())) return;
-  await ensureNotificationPermission();
+  if (!(await getCountdownEnabled())) {
+    logLine('[STATUS] skip: countdown disabled');
+    return;
+  }
+  const granted = await ensureNotificationPermission();
   const ends = args.endTime.toLocaleTimeString([], { hour: 'numeric', minute: '2-digit' });
+  logLine(
+    `[STATUS] show native=${hasNativeCountdown} perm=${granted} end=${args.endTime.toISOString()}`,
+  );
 
   if (hasNativeCountdown) {
     // Native chronometer: a live ticking countdown, updated by the OS.
-    await showCountdown(`Parking · ${args.zoneName}`, `Expires ${ends}`, args.endTime.getTime());
+    try {
+      const diag = await showCountdown(
+        `Parking · ${args.zoneName}`,
+        `Expires ${ends}`,
+        args.endTime.getTime(),
+      );
+      logLine(`[STATUS] native result: ${diag}`);
+    } catch (e: any) {
+      logLine(`[STATUS] native threw: ${e?.message ?? e}`);
+    }
     return;
   }
 
@@ -103,6 +118,7 @@ export async function refreshSessionStatus(): Promise<void> {
   }
   try {
     const res = await ps.getActiveParkingSessions();
+    logLine(`[STATUS] active sessions raw: ${JSON.stringify(res.ParkingSession ?? [])}`);
     const withEnd = (res.ParkingSession ?? [])
       .map((s: any) => ({ s, end: parseApiTime(s.EndTime ?? s.EndTimeDisplay) }))
       .filter((x) => x.end != null && x.end.getTime() > Date.now())

app/src/screens/SessionDetailScreen.tsx

@@ -21,6 +21,16 @@ type DetailRoute = RouteProp<RootStackParamList, 'SessionDetail'>;
 const show = (v: unknown) => (v == null || v === '' ? '—' : String(v));
 const dollars = (v: unknown) => (v == null || v === '' ? undefined : `$${v}`);
 
+/** API's TimeRemaining is in SECONDS — render it as a human "Xh Ym". */
+const fmtRemaining = (secs: unknown): string | undefined => {
+  const n = Number(secs);
+  if (!Number.isFinite(n) || n <= 0) return undefined;
+  const total = Math.round(n / 60);
+  const h = Math.floor(total / 60);
+  const m = total % 60;
+  return h ? (m ? `${h}h ${m}m` : `${h}h`) : `${m}m`;
+};
+
 export function SessionDetailScreen() {
   const { colors } = useTheme();
   const { session, kind } = useRoute<DetailRoute>().params;
@@ -90,7 +100,7 @@ export function SessionDetailScreen() {
           ['Space', s.SpaceName ?? s.Space],
           ['Started', s.StartTimeDisplay ?? s.StartTime],
           ['Ends', s.EndTimeDisplay ?? s.EndTime],
-          ['Time remaining', s.TimeRemaining != null ? `${s.TimeRemaining} min` : undefined],
+          ['Time remaining', fmtRemaining(s.TimeRemaining)],
           ['Amount', dollars(s.Amount)],
         ];