chore: generating and storing referral code

next.config.mjs

@@ -2,9 +2,9 @@
 const nextConfig = {
   // output: 'export',
   compiler: {
-    removeConsole: {
-      exclude: ['error'],
-    },
+    // removeConsole: {
+    //   exclude: ['error'],
+    // },
   },
   async rewrites() {
     return [

prisma/migrations/20240824114901_updated_user_model/migration.sql

@@ -0,0 +1,14 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[referralCode]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+  - Added the required column `referralCode` to the `User` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "referralCode" TEXT NOT NULL,
+ALTER COLUMN "message" DROP NOT NULL,
+ALTER COLUMN "tncDocVersion" DROP NOT NULL;
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_referralCode_key" ON "User"("referralCode");

prisma/migrations/20240824115758_updated_user_model/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "isTncSigned" BOOLEAN NOT NULL DEFAULT false;

prisma/migrations/20240824121027_updated_user_model/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "User" ALTER COLUMN "isTncSigned" DROP NOT NULL;

prisma/schema.prisma

@@ -8,10 +8,12 @@ generator client {
 }
 
 model User {
-  id            Int    @id @default(autoincrement())
-  address       String @unique
-  message       String
-  tncDocVersion String @default("1.0")
+  id            Int      @id @default(autoincrement())
+  address       String   @unique
+  isTncSigned   Boolean? @default(false)
+  message       String?
+  tncDocVersion String?  @default("1.0")
+  referralCode  String   @unique
 
   createdAt DateTime @default(now())
 }

src/app/api/referral/createUser/route.ts

@@ -0,0 +1,25 @@
+import { db } from '@/db';
+import { NextResponse } from 'next/server';
+
+export async function POST(req: Request) {
+  const { address, referralCode } = await req.json();
+
+  const user = await db.user.create({
+    data: {
+      address,
+      referralCode,
+    },
+  });
+
+  if (!user) {
+    return NextResponse.json({
+      success: false,
+      user: null,
+    });
+  }
+
+  return NextResponse.json({
+    success: true,
+    user,
+  });
+}

src/app/api/tnc/getAllSignedUsers/route.ts → src/app/api/tnc/getAllUsers/route.ts

@@ -1,5 +1,5 @@
+import { db } from '@/db';
 import { NextResponse } from 'next/server';
-import { db } from '../../../../../db';
 
 export async function GET(_req: Request) {
   const users = await db.user.findMany({

src/app/api/tnc/getSignedUser/route.ts → src/app/api/tnc/getUser/route.ts

@@ -1,5 +1,5 @@
+import { db } from '@/db';
 import { NextResponse } from 'next/server';
-import { db } from '../../../../../db';
 
 export async function POST(req: Request) {
   const { address } = await req.json();

src/app/api/tnc/signUser/route.ts

@@ -1,13 +1,12 @@
+import { db } from '@/db';
 import { NextResponse } from 'next/server';
-import { db } from '../../../../../db';
 
 export async function POST(req: Request) {
   const { address, message } = await req.json();
 
-  const user = await db.user.create({
-    data: {
+  const user = await db.user.findFirst({
+    where: {
       address,
-      message,
     },
   });
 
@@ -18,8 +17,18 @@ export async function POST(req: Request) {
     });
   }
 
+  const updatedUser = await db.user.update({
+    where: {
+      address,
+    },
+    data: {
+      message,
+      isTncSigned: true,
+    },
+  });
+
   return NextResponse.json({
     success: true,
-    user,
+    user: updatedUser,
   });
 }

src/app/page.tsx

@@ -5,6 +5,7 @@ import { useDotButton } from '@/components/EmblaCarouselDotButton';
 import Pools from '@/components/Pools';
 import Strategies from '@/components/Strategies';
 import CONSTANTS from '@/constants';
+import { generateReferralCode } from '@/utils';
 import { useWindowSize } from '@/utils/useWindowSize';
 
 import {
@@ -21,6 +22,8 @@ import {
   Tabs,
   Text,
 } from '@chakra-ui/react';
+import { useAccount } from '@starknet-react/core';
+import axios from 'axios';
 import Autoplay from 'embla-carousel-autoplay';
 import useEmblaCarousel from 'embla-carousel-react';
 import mixpanel from 'mixpanel-browser';
@@ -29,6 +32,9 @@ import { useEffect, useState } from 'react';
 import { isMobile } from 'react-device-detect';
 
 export default function Home() {
+  const [referralCode, setReferralCode] = useState('');
+  const { address } = useAccount();
+
   useEffect(() => {
     mixpanel.track('Page open');
   }, []);
@@ -84,6 +90,39 @@ export default function Home() {
     },
   ];
 
+  useEffect(() => {
+    (async () => {
+      if (address) {
+        try {
+          const { data } = await axios.post('/api/tnc/getUser', {
+            address,
+          });
+
+          if (data.success && data.user) {
+            setReferralCode(data.user.referralCode);
+          }
+
+          if (!data.success) {
+            try {
+              const res = await axios.post('/api/referral/createUser', {
+                address,
+                referralCode: generateReferralCode(),
+              });
+
+              if (res.data.success && res.data.user) {
+                setReferralCode(res.data.user.referralCode);
+              }
+            } catch (error) {
+              console.error('Error while creating user', error);
+            }
+          }
+        } catch (error) {
+          console.error('Error while getting signed user', error);
+        }
+      }
+    })();
+  }, [address]);
+
   return (
     <Container maxWidth={'1000px'} margin={'0 auto'}>
       <Box padding={'15px 30px'} borderRadius="10px" margin={'20px 0px 10px'}>
@@ -95,6 +134,7 @@ export default function Home() {
           textAlign={'center'}
         >
           <b>{"Starknet's"} Yield Powerhouse🚀</b>
+          {referralCode}
         </Text>
         <Text
           color="color2"
@@ -203,7 +243,7 @@ export default function Home() {
         />
         <TabPanels>
           <TabPanel bg="highlight" width={'100%'} float={'left'}>
-            <Strategies></Strategies>
+            <Strategies referralCode={referralCode} />
           </TabPanel>
           <TabPanel bg="highlight" float={'left'} width={'100%'}>
             <Pools />

src/app/r/[referralCode]/page.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+
+interface RefferalPageProps {
+  params: {
+    referralCode: string;
+  };
+}
+
+const RefferalPage: React.FC<RefferalPageProps> = ({ params }) => {
+  return <div>{params.referralCode}</div>;
+};
+
+export default RefferalPage;

src/components/Strategies.tsx

@@ -37,7 +37,11 @@ import mixpanel from 'mixpanel-browser';
 import React from 'react';
 import TVL from './TVL';
 
-export default function Strategies() {
+interface StrategiesProps {
+  referralCode: string;
+}
+
+const Strategies: React.FC<StrategiesProps> = ({ referralCode }) => {
   const allPools = useAtomValue(allPoolsAtomUnSorted);
   const strategies = useAtomValue(strategiesAtom);
 
@@ -254,7 +258,7 @@ export default function Strategies() {
 
   return (
     <Container width="100%" float={'left'} padding={'0px'} marginTop={'10px'}>
-      <TVL />
+      <TVL referralCode={referralCode} />
       <Text
         marginTop={'15px'}
         color="light_grey"
@@ -340,4 +344,6 @@ export default function Strategies() {
       </Text>
     </Container>
   );
-}
+};
+
+export default Strategies;

src/components/TVL.tsx

@@ -1,6 +1,8 @@
 import { strategiesAtom } from '@/store/strategies.atoms';
 import { dAppStatsAtom, userStatsAtom } from '@/store/utils.atoms';
+import { CopyIcon } from '@chakra-ui/icons';
 import {
+  Box,
   Card,
   Grid,
   GridItem,
@@ -10,16 +12,21 @@ import {
   StatNumber,
 } from '@chakra-ui/react';
 import { useAtomValue } from 'jotai';
+import React from 'react';
 
-export default function TVL() {
-  const strategies = useAtomValue(strategiesAtom);
+interface TVLProps {
+  referralCode: string;
+}
+
+const TVL: React.FC<TVLProps> = ({ referralCode }) => {
+  const _strategies = useAtomValue(strategiesAtom);
   const { data, isPending } = useAtomValue(dAppStatsAtom);
   const { data: userData, isPending: userStatsPending } =
     useAtomValue(userStatsAtom);
 
   return (
     <Grid
-      templateColumns={{ base: 'repeat(1, 1fr)', md: 'repeat(2, 1fr)' }}
+      templateColumns={{ base: 'repeat(1, 1, 1fr)', md: 'repeat(3, 1fr)' }}
       gap="6"
       width="100%"
     >
@@ -38,6 +45,7 @@ export default function TVL() {
           </Stat>
         </Card>
       </GridItem>
+
       <GridItem display="flex">
         <Card width="100%" padding={'15px 30px'} color="white" bg="bg">
           <Stat>
@@ -55,6 +63,34 @@ export default function TVL() {
           </Stat>
         </Card>
       </GridItem>
+
+      <GridItem display="flex">
+        <Card width="100%" padding={'15px 30px'} color="white" bg="purple">
+          <Stat>
+            <StatLabel>Your referral link (?)</StatLabel>
+            <Box
+              display="flex"
+              justifyContent="space-between"
+              alignItems="center"
+            >
+              <StatNumber
+                fontSize="1.5rem"
+                textDecoration="underline"
+                fontWeight="600"
+              >
+                {referralCode}
+              </StatNumber>
+
+              <CopyIcon
+                cursor="pointer"
+                onClick={() => navigator.clipboard.writeText(referralCode)}
+              />
+            </Box>
+          </Stat>
+        </Card>
+      </GridItem>
     </Grid>
   );
-}
+};
+
+export default TVL;

src/components/TxButton.tsx

@@ -1,4 +1,4 @@
-import CONSTANTS, { TNC_DOC_VERSION } from '@/constants';
+import CONSTANTS, { LATEST_TNC_DOC_VERSION } from '@/constants';
 import { StrategyTxProps, monitorNewTxAtom } from '@/store/transactions.atom';
 import { TokenInfo } from '@/strategies/IStrategy';
 import {
@@ -121,15 +121,16 @@ export default function TxButton(props: TxButtonProps) {
     );
   }
 
-  const getSignedUser = async () => {
+  const getUser = async () => {
     if (props.buttonText === 'Deposit') {
-      const data = await axios.post('/api/tnc/getSignedUser', {
+      const data = await axios.post('/api/tnc/getUser', {
         address,
       });
 
       if (
-        (data.data.user && data.data.user.tncDocVersion !== TNC_DOC_VERSION) ||
-        !data.data.user
+        (data.data.user.isTncSigned &&
+          data.data.user.tncDocVersion !== LATEST_TNC_DOC_VERSION) ||
+        !data.data.user.isTncSigned
       ) {
         setShowTncModal(true);
         return true;
@@ -236,7 +237,7 @@ export default function TxButton(props: TxButtonProps) {
               address,
             });
 
-            const res = await getSignedUser();
+            const res = await getUser();
 
             if (!res) {
               writeAsync().then((tx) => {

src/constants.ts

@@ -166,6 +166,6 @@ export const NFTS: NFTInfo[] = [
   },
 ];
 
-export const TNC_DOC_VERSION = '1.0';
+export const LATEST_TNC_DOC_VERSION = '1.0';
 
 export default CONSTANTS;

src/utils.ts

@@ -77,3 +77,8 @@ export function getTokenInfoFromName(tokenName: string) {
   }
   return info;
 }
+
+export function generateReferralCode() {
+  const code = Math.random().toString(36).slice(2, 8);
+  return code;
+}