Merge pull request #29 from penumbra-zone/#6-cleaning-up-naming

cleaned up project naming conventions (routes, components, endpoints):
- tx -> transaction
- ht -> block
- BlockEvent -> Block
- TransactionEvent -> Transaction

src/app/api/ht/route.ts → src/app/api/block/route.ts

@@ -6,7 +6,7 @@ import { z } from "zod";
 export const dynamic = "force-dynamic";
 
 export async function GET(req: Request) {
-  console.log("Sucess: GET /api/ht");
+  console.log("Sucess: GET /api/block");
   try {
     const url = new URL(req.url);
     const queryParam = url.searchParams.get("q")?.trim() ?? "";

src/app/api/tx/route.ts → src/app/api/transaction/route.ts

@@ -6,7 +6,7 @@ import { z } from "zod";
 export const dynamic = "force-dynamic";
 
 export async function GET(req: Request) {
-  console.log("Success: GET /api/tx");
+  console.log("Success: GET /api/transaction");
   try {
     const url = new URL(req.url);
     const queryParam = url.searchParams.get("q")?.trim() ?? "";

src/app/block/[ht]/page.tsx

@@ -4,7 +4,7 @@ import { type FC } from "react";
 import { useQuery } from "@tanstack/react-query";
 import axios from "axios";
 import { BlockResult } from "@/lib/validators/search";
-import BlockEvent from "@/components/BlockEvent";
+import Block from "@/components/Block";
 
 interface PageProps {
   params: {
@@ -17,8 +17,8 @@ const Page : FC<PageProps> = ({ params }) => {
 
   const { data: blockData , isFetched, isError } = useQuery({
     queryFn: async () => {
-      console.log(`Fetching: GET /api/ht?q=${ht}`);
-      const { data } = await axios.get(`/api/ht?q=${ht}`);
+      console.log(`Fetching: GET /api/block?q=${ht}`);
+      const { data } = await axios.get(`/api/block?q=${ht}`);
       console.log("Fetching result:", data);
       const result = BlockResult.safeParse(data);
       console.log(result);
@@ -51,7 +51,7 @@ const Page : FC<PageProps> = ({ params }) => {
           {blockData ? (
           <div className="flex flex-col justify-center w-full">
             <h1 className="text-3xl mx-auto py-5 font-semibold">Block Summary</h1>
-            <BlockEvent blockPayload={blockData}/>
+            <Block blockPayload={blockData}/>
           </div>
           ) : (
             <div>

src/app/transaction/[hash]/page.tsx

@@ -4,7 +4,7 @@ import { type FC } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { TransactionResult } from "@/lib/validators/search";
 import axios from "axios";
-import TransactionEvent from "@/components/TransactionEvent";
+import Transaction from "@/components/Transaction";
 
 interface PageProps {
   params: {
@@ -18,8 +18,8 @@ const Page : FC<PageProps> = ({ params }) => {
 
   const { data: txData , isFetched, isError } = useQuery({
     queryFn: async () => {
-      console.log(`Fetching: GET /api/tx?q=${hash}`);
-      const { data } = await axios.get(`/api/tx?q=${hash}`);
+      console.log(`Fetching: GET /api/transaction?q=${hash}`);
+      const { data } = await axios.get(`/api/transaction?q=${hash}`);
       console.log("Fetched result:", data);
       const result = TransactionResult.safeParse(data);
       if (result.success) {
@@ -52,7 +52,7 @@ const Page : FC<PageProps> = ({ params }) => {
         {txData ? (
           <div className="flex flex-col justify-center w-full">
             <h1 className="text-3xl mx-auto py-5 font-semibold">Transaction Event Summary</h1>
-            <TransactionEvent txPayload={txData} />
+            <Transaction txPayload={txData} />
           </div>
         ) : (
           <p>No results</p>

src/components/BlockEvent/index.tsx → src/components/Block/index.tsx

@@ -11,7 +11,7 @@ interface BlockEventProps {
 //       re-write the rendering for BlockEvent. What I'm assuming is that there's meaningful info (and lack-of) to tease out from Blocks
 //       and providing for that will eventually happen here; otherwise, just re-using the same component will make sense instead of mostly
 //       duplicate ui code that shows the exact same information.
-const BlockEvent : FC<BlockEventProps> = ({ blockPayload }) => {
+const Block : FC<BlockEventProps> = ({ blockPayload }) => {
   const [blockEvent, penumbraTx] = blockPayload;
 
   return (
@@ -67,4 +67,4 @@ const BlockEvent : FC<BlockEventProps> = ({ blockPayload }) => {
   );
 };
 
-export default BlockEvent;
+export default Block;

src/components/Searchbar/index.tsx

@@ -48,7 +48,7 @@ const SearchBar : FC = () => {
             const hashResult = HashResultValidator.safeParse(input);
             const blockResult = BlockHeightValidator.safeParse(input);
             if (hashResult.success) {
-              searchCmd("tx");
+              searchCmd("transaction");
             } else if (blockResult.success) {
               searchCmd("block");
             } else {

src/components/TransactionEvent/index.tsx → src/components/Transaction/index.tsx

@@ -2,11 +2,11 @@ import { type TransactionResultPayload } from "@/lib/validators/search";
 import ReactJson from "@microlink/react-json-view";
 import { type FC } from "react";
 
-interface TransactionEventProps {
+interface TransactionProps {
   txPayload: TransactionResultPayload
 }
 
-const TransactionEvent : FC<TransactionEventProps> = ({ txPayload }) => {
+const Transaction : FC<TransactionProps> = ({ txPayload }) => {
   const [txEvent, penumbraTx] = txPayload;
   return (
     <div className="bg-white rounded-sm">
@@ -67,4 +67,4 @@ const TransactionEvent : FC<TransactionEventProps> = ({ txPayload }) => {
   );
 };
 
-export default TransactionEvent;
+export default Transaction;

src/components/TransactionsTable/columns.tsx

@@ -35,7 +35,7 @@ export const columns : Array<ColumnDef<EventColumns>> = [
     header: () => <div className="font-semibold text-gray-800 text-center">Hash</div>,
     cell: ({ row }) => {
       const tx : Array<{ tx_hash: string }>= row.getValue("tx_results");
-      return <Link href={`/tx/${tx[0].tx_hash}`} className="underline"><pre className="text-center">{tx[0].tx_hash}</pre></Link>;
+      return <Link href={`/transaction/${tx[0].tx_hash}`} className="underline"><pre className="text-center">{tx[0].tx_hash}</pre></Link>;
     },
   },
 ];

src/components/TransactionsTable/index.tsx

@@ -39,7 +39,7 @@ const TransactionsTable = async () => {
     pageSize: 10,
   };
 
-  const endpoint = "/api/events";
+  const endpoint = "/api/transactions";
   const queryKey: TableQueryKey = ["TransactionsTable", defaultQueryOptions];
 
   await queryClient.prefetchQuery({

src/lib/validators/search.ts

@@ -23,7 +23,7 @@ export const BlockHeightValidator = z.bigint().nonnegative({ message: "Block hei
 export type HashResultQuery = z.infer<typeof HashResultValidator>;
 export type BlockHeightQuery = z.infer<typeof BlockHeightValidator>;
 
-// zod schema equivalent to the /parsed/ JSON data returned by prisma in GET /api/tx?q=<hash>
+// zod schema equivalent to the /parsed/ JSON data returned by prisma in GET /api/transaction?q=<hash>
 export const TransactionResult = z.tuple([
   z.object({
     tx_hash: z.string(),
@@ -47,7 +47,7 @@ export const TransactionResult = z.tuple([
   }),
 ]);
 
-// zod schema equivalent to the /parsed/ JSON data returned by prisma in GET /api/ht?q=<height>
+// zod schema equivalent to the /parsed/ JSON data returned by prisma in GET /api/block?q=<height>
 // NOTE: This definition is meaningfully different from TransactionResult in that the Transaction value may not exist at all.
 export const BlockResult = z.tuple([
   z.object({