Route with txs table (#14)

* Add react-table dependency * Add shadcn Tasks components * Expose PopoverClose * Add adapted filters for future tags * Add useDebounce hook * Add txs columns * Add filters toolbar * Add txs table * Use new TxsTable * Add catch-all route for diagram * Fix diagram link url * Adapt test
confio · Oct 15, 2024 · ba0bebe · ba0bebe
1 parent f16da3a
commit ba0bebe
Show file tree

Hide file tree

Showing 9 changed files with 40 additions and 553 deletions.
diff --git a/app/@span/(.)[...span]/page.tsx b/app/@span/(.)[...span]/page.tsx
@@ -0,0 +1,17 @@
+import TxData from "@/components/tx-data";
+import { Sheet, SheetContent } from "@/components/ui/sheet";
+
+export default function Tx({ params }: { params: { span: string[] } }) {
+  const [txId, spanId] = params.span;
+
+  return (
+    <Sheet defaultOpen>
+      <SheetContent className="min-w-[80%]">
+        <div>
+          <div>Transaction {txId}</div>
+          <TxData txId={txId} spanId={spanId} />
+        </div>
+      </SheetContent>
+    </Sheet>
+  );
+}
diff --git a/app/@span/default.tsx b/app/@span/default.tsx
@@ -0,0 +1,3 @@
+export default function Default() {
+  return null;
+}
diff --git a/app/txs/[...span]/page.tsx → app/[...span]/page.tsx b/app/txs/[...span]/page.tsx → app/[...span]/page.tsx
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,7 +1,7 @@
 import Providers from "@/providers";
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
-import { PropsWithChildren } from "react";
+import { PropsWithChildren, ReactNode } from "react";
 import "./globals.css";
 
 const inter = Inter({ subsets: ["latin"] });
@@ -11,11 +11,20 @@ export const metadata: Metadata = {
   description: "Generated by create next app",
 };
 
-export default function RootLayout({ children }: PropsWithChildren) {
+type RootLayoutProps = PropsWithChildren & {
+  span: ReactNode;
+};
+
+export default function RootLayout({ children, span }: RootLayoutProps) {
   return (
     <html lang="en">
       <body className={inter.className}>
-        <Providers>{children}</Providers>
+        <Providers>
+          <>
+            {children}
+            {span}
+          </>
+        </Providers>
       </body>
     </html>
   );