switch to pages router

web-portal/frontend/app/dashboard/createAppModal.tsx → web-portal/frontend/components/dashboard/createAppModal.tsx

@@ -1,9 +1,8 @@
 "use client";
 import { useSearchParams } from "next/navigation";
 import { Modal, Button, TextInput, Textarea } from "@mantine/core";
-import { useCreateAppMutation } from "./hooks";
 import { useForm } from "@mantine/form";
-import { useSession } from "@frontend/utils/hooks";
+import { useSession, useCreateAppMutation } from "@frontend/utils/hooks";
 
 export default function CreateAppModal() {
   const searchParams = useSearchParams();

web-portal/frontend/app/dashboard/insights.tsx → web-portal/frontend/components/dashboard/insights.tsx

@@ -1,7 +1,9 @@
 import { Stack, Flex, Title, SegmentedControl, Card } from "@mantine/core";
-import React, { useState } from "react";
-import classes from "./insight.module.css";
+import React from "react";
+import classes from "@frontend/styles/insight.module.css";
 import { AreaChart } from "@mantine/charts";
+import { useRouter, useSearchParams } from "next/navigation";
+
 const timeOptions = ["24h", "7d", "30d", "All"];
 
 export const data = [
@@ -77,8 +79,9 @@ const RingCard: React.FC<{ title: string }> = ({ title }) => {
 };
 
 const Insights: React.FC = () => {
-  const [value, setValue] = useState(timeOptions[0]);
-
+  // const [value, setValue] = useState(timeOptions[0]);
+  const params = useSearchParams();
+  const router = useRouter();
   return (
     <Stack>
       <Flex justify={"space-between"}>
@@ -87,8 +90,8 @@ const Insights: React.FC = () => {
           bg="#fff"
           color="umbra.1"
           withItemsBorders={false}
-          value={value}
-          onChange={setValue}
+          value={params.get("t") || timeOptions[0]}
+          onChange={(value) => router.push("?t=" + value)}
           data={timeOptions.map((value) => ({ value, label: value }))}
         />
       </Flex>

web-portal/frontend/app/dashboard/layout.tsx → web-portal/frontend/components/dashboard/layout.tsx

@@ -1,4 +1,3 @@
-"use client";
 import {
   AppShell,
   Burger,
@@ -21,7 +20,7 @@ import {
 } from "@tabler/icons-react";
 import { usePathname, useRouter } from "next/navigation";
 import Image from "next/image";
-import LogoutButton from "./logout";
+import LogoutButton from "@frontend/components/dashboard/logout";
 import { useSession } from "@frontend/utils/hooks";
 const topTabs = [
   {

web-portal/frontend/app/dashboard/logout.tsx → web-portal/frontend/components/dashboard/logout.tsx

@@ -1,12 +1,16 @@
-"use client";
 import { Button } from "@mantine/core";
+import { signOut } from "@frontend/utils/siwe";
 import { useDisconnect } from "wagmi";
-
 export default function LogoutButton() {
   const { disconnect } = useDisconnect();
   return (
     <>
-      <form onSubmit={() => disconnect()}>
+      <form
+        onSubmit={async () => {
+          disconnect();
+          signOut();
+        }}
+      >
         <Button type="submit" variant="outline" color="umbra.1">
           Logout
         </Button>

web-portal/frontend/app/login/modal.component.tsx → web-portal/frontend/components/login/modal.tsx

@@ -1,4 +1,3 @@
-"use client";
 import {
   Modal,
   Button,
@@ -9,7 +8,7 @@ import {
   TextInput,
 } from "@mantine/core";
 import { useForm } from "@mantine/form";
-import useRecoverTenant from "./hooks";
+import { useRecoverTenant } from "@frontend/utils/hooks";
 import { IconCopy, IconClipboardCheck } from "@tabler/icons-react";
 import { useSearchParams, useRouter } from "next/navigation";
 import { useState } from "react";

web-portal/frontend/next.config.js

@@ -3,9 +3,17 @@ const nextConfig = {
   output: "standalone",
   webpack: (config) => {
     config.externals.push("pino-pretty", "lokijs", "encoding");
-    config.resolve.fallback = { fs: false, net: false, tls: false };
     return config;
   },
+  images: {
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "api.web3modal.com",
+        port: "",
+      },
+    ],
+  },
   async rewrites() {
     return [
       {

web-portal/frontend/package.json

@@ -28,7 +28,7 @@
     "iron-session": "^8.0.1",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
-    "next": "14.0.4",
+    "next": "14.1",
     "react": "^18",
     "react-dom": "^18",
     "recharts": "2",

web-portal/frontend/pages/_app.tsx

@@ -0,0 +1,34 @@
+import "@mantine/core/styles.css";
+import type { AppProps } from "next/app";
+import Head from "next/head";
+import { siweConfig } from "@frontend/utils/siwe";
+import { MantineProvider } from "@mantine/core";
+import Web3Provider, { config, projectId } from "@frontend/utils/Web3Provider";
+import { theme } from "@frontend/utils/theme";
+import { createWeb3Modal } from "@web3modal/wagmi/react";
+
+createWeb3Modal({
+  siweConfig,
+  wagmiConfig: config,
+  projectId,
+  enableAnalytics: false,
+  enableOnramp: false,
+});
+
+export default function App({ Component, pageProps }: AppProps) {
+  return (
+    <MantineProvider theme={theme}>
+      <Head>
+        <title>Porters RPC SDK</title>
+        <meta
+          name="viewport"
+          content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no"
+        />
+        <link rel="fav icon" href="/favicon.ico" />
+      </Head>
+      <Web3Provider>
+        <Component {...pageProps} />
+      </Web3Provider>
+    </MantineProvider>
+  );
+}