Path based routing for index

app/components/navigation/TaskNavigationBar.tsx

@@ -0,0 +1,28 @@
+import { router, useGlobalSearchParams } from "expo-router";
+import type { NativeStackHeaderProps } from "@react-navigation/native-stack";
+import { Appbar } from "react-native-paper";
+import { getHeaderTitle } from "@react-navigation/elements";
+
+export default function TaskNavigationBar({
+  options,
+  route,
+}: NativeStackHeaderProps) {
+  const { taskId, taskName } = useGlobalSearchParams<{
+    taskId: string;
+    taskName?: string;
+  }>();
+  const title = getHeaderTitle(options, taskName || route.name);
+
+  return (
+    <Appbar.Header elevated>
+      <Appbar.BackAction
+        onPress={() =>
+          router.canGoBack() ? router.back() : router.replace("/")
+        }
+      />
+      <Appbar.Content title={title} />
+      {/*<Appbar.Action icon="run-fast" onPress={() => {}} />*/}
+      {/*<Appbar.Action icon="square-edit-outline" onPress={() => {}} />*/}
+    </Appbar.Header>
+  );
+}