chore: make the localhost port in the trpc Provider dynamic to work on ports other than 3000

lib/trpc/Provider.tsx

@@ -3,7 +3,7 @@
 import { useState } from "react"
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
 import { httpBatchLink } from "@trpc/client"
-
+import { env } from "@/env/client"
 import { api } from "./client"
 import { transformer } from "@/server/transformer"
 
@@ -15,7 +15,7 @@ function initializeTrpcClient() {
         /**
          * This is locally in Next.js
          */
-        url: "http://localhost:3000/api/trpc",
+        url: `http://localhost:${env.NEXT_PUBLIC_PORT}/api/trpc`,
       }),
     ],
   })