fix android notification not working, fix ui bug

src/app/(tabs)/_layout.tsx

@@ -1,10 +1,14 @@
 import { Tabs } from 'expo-router';
 import { TabBar, type TabItem } from '@/components/TabBar';
+import { colors } from '@/theme';
 
 export default function TabsLayout() {
   return (
     <Tabs
-      screenOptions={{ headerShown: false }}
+      screenOptions={{
+        headerShown: false,
+        sceneStyle: { backgroundColor: colors.bgPrimary },
+      }}
       tabBar={({ state, navigation }) => {
         const items: TabItem[] = state.routes.map((route, index) => ({
           key: route.key,

src/app/+native-intent.ts

@@ -0,0 +1,15 @@
+import {
+  getNotificationClickRedirectPath,
+  isNotificationClickPath,
+} from '@/audio/notificationIntent';
+
+type RedirectSystemPathEvent = {
+  path: string;
+  initial: boolean;
+};
+
+export async function redirectSystemPath({ path }: RedirectSystemPathEvent): Promise<string> {
+  if (!isNotificationClickPath(path)) return path;
+
+  return getNotificationClickRedirectPath();
+}

src/app/notification.click.tsx

@@ -0,0 +1,34 @@
+import { useEffect } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useRouter } from 'expo-router';
+import { getNotificationClickRedirectPath } from '@/audio/notificationIntent';
+import { colors } from '@/theme';
+
+export default function NotificationClickRoute() {
+  const router = useRouter();
+
+  useEffect(() => {
+    let cancelled = false;
+
+    getNotificationClickRedirectPath()
+      .then((href) => {
+        if (!cancelled) router.replace(href);
+      })
+      .catch(() => {
+        if (!cancelled) router.replace('/');
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [router]);
+
+  return <View style={styles.root} />;
+}
+
+const styles = StyleSheet.create({
+  root: {
+    flex: 1,
+    backgroundColor: colors.bgPrimary,
+  },
+});

src/audio/notificationIntent.ts

@@ -0,0 +1,46 @@
+import TrackPlayer from 'react-native-track-player';
+import { usePlayerStore } from '@/stores/playerStore';
+
+const NOTIFICATION_CLICK_TARGETS = new Set([
+  'trackplayer://notification.click',
+  'astra://notification.click',
+  'astra:///notification.click',
+  '/notification.click',
+  'notification.click',
+]);
+
+export type NotificationClickRedirectPath = '/' | '/now-playing';
+
+export function isNotificationClickPath(path: string): boolean {
+  const cleanPath = path.trim();
+  const pathWithoutSuffix = cleanPath.split(/[?#]/, 1)[0];
+
+  if (
+    NOTIFICATION_CLICK_TARGETS.has(cleanPath) ||
+    NOTIFICATION_CLICK_TARGETS.has(pathWithoutSuffix) ||
+    pathWithoutSuffix.replace(/^\/+/, '') === 'notification.click'
+  ) {
+    return true;
+  }
+
+  try {
+    const url = new URL(cleanPath);
+    return url.hostname === 'notification.click' || url.pathname === '/notification.click';
+  } catch {
+    return false;
+  }
+}
+
+export async function getNotificationClickRedirectPath(): Promise<NotificationClickRedirectPath> {
+  return (await hasLoadedTrack()) ? '/now-playing' : '/';
+}
+
+async function hasLoadedTrack(): Promise<boolean> {
+  try {
+    if (await TrackPlayer.getActiveTrack()) return true;
+  } catch {
+    // RNTP may not be initialized if an unexpected notification click arrives.
+  }
+
+  return Boolean(usePlayerStore.getState().currentTrack);
+}