slide animation

src/features/core/utils/nav-direction.ts

@@ -0,0 +1,52 @@
+import type { ParsedLocation } from "@tanstack/react-router";
+
+export type NavDirection = "forward" | "back" | "none";
+
+const tabRank = (pathname: string): number | null => {
+  if (pathname === "/") return 0;
+  if (pathname.startsWith("/stats")) return 1;
+  if (pathname.startsWith("/tournaments")) return 2;
+  if (pathname.startsWith("/profile") || pathname.startsWith("/settings")) return 3;
+  if (pathname.startsWith("/admin")) return 4;
+  return null;
+};
+
+const depth = (pathname: string) => pathname.split("/").filter(Boolean).length;
+
+// Keep in sync with route loaders that set header.collapsed
+const headerHidden = (pathname: string) => {
+  const segs = pathname.split("/").filter(Boolean);
+  return segs.length === 2 && ["profile", "teams", "tournaments"].includes(segs[0]);
+};
+
+export function headerChange(
+  from: ParsedLocation | undefined,
+  to: ParsedLocation
+): "exit" | "enter" | "none" {
+  if (!from) return "none";
+  const fromHidden = headerHidden(from.pathname);
+  const toHidden = headerHidden(to.pathname);
+  if (fromHidden === toHidden) return "none";
+  return toHidden ? "exit" : "enter";
+}
+
+export function navDirection(
+  from: ParsedLocation | undefined,
+  to: ParsedLocation
+): NavDirection {
+  if (!from || from.pathname === to.pathname) return "none";
+
+  const fromRank = tabRank(from.pathname);
+  const toRank = tabRank(to.pathname);
+  if (fromRank !== null && toRank !== null && fromRank !== toRank) {
+    return toRank > fromRank ? "forward" : "back";
+  }
+
+  const fromIndex = from.state.__TSR_index;
+  const toIndex = to.state.__TSR_index;
+  if (Number.isFinite(fromIndex) && Number.isFinite(toIndex) && fromIndex !== toIndex) {
+    return toIndex > fromIndex ? "forward" : "back";
+  }
+
+  return depth(to.pathname) >= depth(from.pathname) ? "forward" : "back";
+}