migrate page routes to app routes

Author: passandscore

components/AvatarSelection.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { User } from "@/data-schema/types";
 import { useAuthStore } from "@/store/auth/authStore";
 import {

components/BackgroundSelection.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { User } from "@/data-schema/types";
 import { useAuthStore } from "@/store/auth/authStore";
 import {

components/BgOpacitySliderThumbWithTooltip.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { useAuthStore } from "@/store/auth/authStore";
 import {
   Slider,

components/CardGroup.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Button,
   Card,

components/CardOpacitySliderThumbWithTooltip.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { useAuthStore } from "@/store/auth/authStore";
 import {
   Slider,

components/CollapsedDashboardMenu.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Avatar, Flex, Heading, Slide, Text } from "@chakra-ui/react";
 import { useAuthStore } from "@/store/auth/authStore";
 import shallow from "zustand/shallow";

components/ComingSoon.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box, Flex, Heading, Text, Image } from "@chakra-ui/react";
 
 const ComingSoon = () => {

components/ConnectButton.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box, Button, Heading } from "@chakra-ui/react";
 import { ConnectButton } from "@rainbow-me/rainbowkit";
 

components/ExpandedDashboardMenu.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 /* eslint-disable react/no-children-prop */
 import {
   QuestionOutlineIcon,

components/FaqAccordian.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Accordion,
   AccordionItem,

pages/index.tsx renamed to components/LandingPage.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { useAuthStore } from "@/store/auth/authStore";
 import { Box } from "@chakra-ui/react";
 import { useEffect } from "react";
@@ -9,7 +11,7 @@ import Earning from "@/components/landingPage/Earning";
 import Staking from "@/components/landingPage/Staking";
 import Investing from "@/components/landingPage/Investing";
 
-export default function Main() {
+export const LandingPage = () => {
   //=============================================================================
   //                               HOOKS
   //=============================================================================
@@ -57,4 +59,4 @@ export default function Main() {
       <SequenceLogin />
     </Box>
   );
-}
+};

components/LoggedInNavbar.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import React, { useState } from "react";
 import { Box, Flex, Heading, Avatar, Text, Slide } from "@chakra-ui/react";
 import { useAuthStore } from "@/store/auth/authStore";

components/MenuPopover.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Popover,
   PopoverArrow,
@@ -11,7 +13,7 @@ import {
   Text,
   useBreakpointValue,
 } from "@chakra-ui/react";
-import { NextRouter, useRouter } from "next/router";
+import { useRouter } from "next/navigation";
 import { menuCards } from "@/data/landingPage/menuCards";
 import { useState } from "react";
 
@@ -28,7 +30,7 @@ const CustomCard = ({
   title: string;
   description: string;
   link: string;
-  router: NextRouter;
+  router: any;
   setShowLearnMore: (value: { [key: number]: boolean }) => void;
   showLearnMore: { [key: number]: boolean };
   index: number;

components/Modals/AddMemberModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   ModalBody,
   ModalCloseButton,

components/Modals/BackgroundDefaults.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/Modals/EtherscanModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/Modals/FaqModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/Modals/InfoModal.tsx

@@ -1,11 +1,12 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,
   ModalContent,
   ModalHeader,
   ModalBody,
   ModalCloseButton,
-  Flex,
   useBreakpointValue,
   CardHeader,
   Heading,
@@ -15,7 +16,7 @@ import {
   Grid,
 } from "@chakra-ui/react";
 import { menuCards } from "@/data/landingPage/menuCards";
-import { NextRouter, useRouter } from "next/router";
+import { useRouter } from "next/navigation";
 import { useState } from "react";
 
 const CustomCard = ({
@@ -31,7 +32,7 @@ const CustomCard = ({
   title: string;
   description: string;
   link: string;
-  router: NextRouter;
+  router: any;
   setShowLearnMore: (value: { [key: number]: boolean }) => void;
   showLearnMore: { [key: number]: boolean };
   index: number;

components/Modals/RegisterModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/Modals/ResourcesModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { useDisclosure, useBreakpointValue } from "@chakra-ui/react";
 import {
   Heading,
@@ -71,21 +73,20 @@ const ResourcesModal = () => {
   return (
     <>
       <Center>
-        <Box mt="7rem" w="50%" p={4} color="white">
+        <Box mt="7rem" p={4} color="white">
           <Heading
             size={isMobileSize ? "2xl" : "xl"}
-            display="flex"
-            alignItems="baseline"
             justifyContent="center"
             mb={5}
             color="#90cdf4"
+            textAlign="center"
           >
             Welcome to resources!
           </Heading>
 
           <Image
             borderRadius={20}
-            src="/images/backgrounds/1.svg"
+            src="/images/backgrounds/urban.svg"
             alt="DefiKids"
           />
 

components/Modals/SandboxModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/Modals/SendFundsModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/Modals/UsernameModal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Modal,
   ModalOverlay,

components/PasswordInput.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Button,
   Container,

components/WalletPopover.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Box,
   Button,

components/animated_number.tsx

@@ -1,3 +1,4 @@
+"use client";
 import React, { useEffect, useRef, useState } from "react";
 
 interface IProps extends React.HTMLAttributes<HTMLParagraphElement> {

components/arrow.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import React from "react";
 import Image, { ImageProps } from "next/image";
 

components/auth.tsx

@@ -1,3 +1,4 @@
+"use client";
 /* eslint-disable react-hooks/exhaustive-deps */
 
 import { useEffect, useState } from "react";
@@ -9,18 +10,13 @@ import { watchAccount } from "@wagmi/core";
 import axios from "axios";
 import { User } from "@/data-schema/types";
 
-const Auth = ({
-  setHasCheckedUserType,
-  hasCheckedUserType,
-}: {
-  setHasCheckedUserType: (hasCheckedUserType: boolean) => void;
-  hasCheckedUserType: boolean;
-}) => {
+const Auth = () => {
   //=============================================================================
   //                               HOOKS
   //=============================================================================
 
   const [selectedAddress, setSelectedAddress] = useState<string | null>(null);
+  const [hasCheckedUserType, setHasCheckedUserType] = useState(false);
 
   watchAccount((account) => {
     const { isConnected, address } = account;

components/button.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import React from "react";
 
 interface IProps extends React.HTMLAttributes<HTMLButtonElement> {

components/drawers/ChildDefiOptionsDrawer.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Button,
   Drawer,

components/drawers/ChildDetailsDrawer.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Button,
   Drawer,

components/drawers/ChildOverviewParentDashboard.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { EtherscanContext } from "@/data-schema/enums";
 import { getEtherscanUrl, trimAddress } from "@/utils/web3";
 import {

components/drawers/ParentDetailsDrawer.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   Button,
   Drawer,

components/email/EmailVerificationRequired.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { ChildDetails, User } from "@/data-schema/types";
 import { Button, Flex, Text, useToast } from "@chakra-ui/react";
 import axios from "axios";

components/explainations/ExplainBlockchain.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box, Button, Heading, Text } from "@chakra-ui/react";
 import { Explaination } from "@/data-schema/enums";
 import { data } from "@/data/explainations/blockchain";

components/explainations/ExplainFamilyId.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box, Button, Heading, Text } from "@chakra-ui/react";
 import { Explaination } from "@/data-schema/enums";
 import { data } from "@/data/explainations/familyId";

components/explainations/ExplainFamilyName.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box, Button, Heading, Text } from "@chakra-ui/react";
 import { Explaination } from "@/data-schema/enums";
 import { data } from "@/data/explainations/familyName";

components/explainations/Sandbox.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box, Button, Heading, Text } from "@chakra-ui/react";
 import { Explaination } from "@/data-schema/enums";
 import { data } from "@/data/explainations/sandbox";

components/footer.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import {
   IconButton,
   Text,

components/forms/EmailForm.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { User } from "@/data-schema/types";
 import { useAuthStore } from "@/store/auth/authStore";
 import {

components/forms/FamilyIdForm.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { User } from "@/data-schema/types";
 import { useAuthStore } from "@/store/auth/authStore";
 import {

components/forms/RegisterChildForm.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import React, { useRef, useState } from "react";
 import {
   Box,

components/forms/RegisterMemberForm.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import React, { useState } from "react";
 import {
   Box,

components/forms/RegisterParentForm.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import React, { useState } from "react";
 import {
   Box,
@@ -147,7 +149,7 @@ export const RegisterParentForm = ({ onClose }: { onClose: () => void }) => {
       });
 
       onClose();
-      router.push("/parent");
+      router.push("/parent-dashboard");
     } catch (e) {
       await axios.delete(`/api/vercel/delete-json-data?key=${address}`);
       const errorDetails = transactionErrors(e);

components/forms/UserNameForm.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { User } from "@/data-schema/types";
 import { useAuthStore } from "@/store/auth/authStore";
 import {

components/landingPage/Earning.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box } from "@chakra-ui/react";
 
 const Earning = () => {

components/landingPage/Investing.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Box } from "@chakra-ui/react";
 
 const Investing = () => {

components/landingPage/RegisterBanner.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Badge, Flex, Text } from "@chakra-ui/react";
 
 export const RegisterBanner = ({