fix: tabs on the detail layout pages should be responsive to external navigation signals

Author: SeanCassiere

src/routes/_auth/(agreements)/agreements.$agreementId._details.summary.tsx

@@ -163,6 +163,7 @@ function Component() {
     navigate({
       search: (s) => ({ ...s, summary_tab: name }),
       resetScroll: false,
+      replace: true,
     });
   };
 

src/routes/_auth/(agreements)/agreements.$agreementId._details.tsx

@@ -183,7 +183,11 @@ function Component() {
         />
       </Container>
       <Container as="div" className="overflow-hidden">
-        <Tabs defaultValue={currentTab} className="overflow-x-auto">
+        <Tabs
+          key={`details_tab_${currentTab}`}
+          defaultValue={currentTab}
+          className="overflow-x-auto"
+        >
           <TabsList className="mx-2 sm:mx-4">
             <TabsTrigger value="summary" asChild>
               <Link

src/routes/_auth/(customers)/customers.$customerId._details.tsx

@@ -154,7 +154,11 @@ function Component() {
       </Container>
       <Separator />
       <Container as="div" className="overflow-hidden">
-        <Tabs defaultValue={currentTab} className="overflow-x-auto">
+        <Tabs
+          key={`details_tab_${currentTab}`}
+          defaultValue={currentTab}
+          className="overflow-x-auto"
+        >
           <TabsList className="mx-2 sm:mx-4">
             <TabsTrigger value="summary" asChild>
               <Link

src/routes/_auth/(fleet)/fleet.$vehicleId._details.tsx

@@ -152,7 +152,11 @@ function Component() {
         />
       </Container>
       <Container as="div" className="overflow-hidden">
-        <Tabs defaultValue={currentTab} className="overflow-x-auto">
+        <Tabs
+          key={`details_tab_${currentTab}`}
+          defaultValue={currentTab}
+          className="overflow-x-auto"
+        >
           <TabsList className="mx-2 sm:mx-4">
             <TabsTrigger value="summary" asChild>
               <Link from="/fleet/$vehicleId" to="/fleet/$vehicleId/summary">

src/routes/_auth/(reservations)/reservations.$reservationId._details.tsx

@@ -158,7 +158,11 @@ function Component() {
         />
       </Container>
       <Container as="div" className="overflow-hidden">
-        <Tabs defaultValue={currentTab} className="overflow-x-auto">
+        <Tabs
+          key={`details_tab_${currentTab}`}
+          defaultValue={currentTab}
+          className="overflow-x-auto"
+        >
           <TabsList className="mx-2 sm:mx-4">
             <TabsTrigger value="summary" asChild>
               <Link