Utkarsh

components/analysis/AnalysisPopUp.tsx

@@ -8,9 +8,9 @@ interface props {
     setIsfilteropen: Function
     setIsAddAccountPopupOpen: Function
     bankAccountList: any[]
-
+    SetIsKycPermissionPopUpOpen: Function
 }
-const AnalysisPopUp = ({ isanalysisopen, setIsanalysisopen, setIsAddAccountPopupOpen, setIsfilteropen, bankAccountList }: props) => {
+const AnalysisPopUp = ({ isanalysisopen, setIsanalysisopen, setIsAddAccountPopupOpen, setIsfilteropen, bankAccountList,SetIsKycPermissionPopUpOpen }: props) => {
     const [dropfiles, setDropfiles] = useState(false)
 
     useEffect(() => {
@@ -32,7 +32,7 @@ const AnalysisPopUp = ({ isanalysisopen, setIsanalysisopen, setIsAddAccountPopup
             padding={0}
         >
             {dropfiles ? <AnalysisType setdropfiles={setDropfiles} setIsfilteropen={setIsfilteropen} bankAccountList={bankAccountList}
-                setIsanalysisopen={setIsanalysisopen} setIsAddAccountPopupOpen={setIsAddAccountPopupOpen} /> : <DropFiles setdropfiles={setDropfiles} setIsanalysisOpen={setIsanalysisopen} />}
+                setIsanalysisopen={setIsanalysisopen} setIsAddAccountPopupOpen={setIsAddAccountPopupOpen}  SetIsKycPermissionPopUpOpen={SetIsKycPermissionPopUpOpen} /> : <DropFiles setdropfiles={setDropfiles} setIsanalysisOpen={setIsanalysisopen} />}
         </Modal>
     )
 }

components/analysis/selectType.tsx

@@ -4,7 +4,9 @@ import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useState } from 'react'
 import Heading from '../reusable-components/Heading'
-
+import useStorage from '../../hooks/useStorage'
+import api from '../datams'
+import { useEffect } from 'react'
 const useStyles = createStyles((theme) => ({
   wrapper: {
     backgroundColor: `#EEEEEE`,
@@ -193,14 +195,45 @@ interface props {
   setIsfilteropen: Function
   bankAccountList: any[]
   setIsAddAccountPopupOpen: Function
+  SetIsKycPermissionPopUpOpen: Function
 }
-export function AnalysisType({ setdropfiles, setIsanalysisopen, setIsfilteropen, bankAccountList, setIsAddAccountPopupOpen }: props) {
+export function AnalysisType({ setdropfiles, setIsanalysisopen, setIsfilteropen, bankAccountList, setIsAddAccountPopupOpen,SetIsKycPermissionPopUpOpen }: props) {
   const { classes } = useStyles()
   const [click, setClick] = useState(false)
   const [type, setType] = useState<number | undefined>(undefined)
+  const { getItem } = useStorage()
+  const [result, setResult] = useState(1)
   const [account, setAccount] = useState({
     id: 1,
   })
+  const GetKycStatus = () => {
+    const accessToken = getItem('access_token', 'session')
+    console.log(accessToken)
+    const user_id = getItem('user_id')
+    const accLength = JSON.stringify(getItem('accounts'))?.length
+    const response = api
+      .get(`/user/getkyc/`, {
+        headers: {
+          Authorization: `Bearer ${accessToken}`,
+          'Content-Type': 'application/json',
+        },
+      })
+      .then((response) => {
+        response.data.message === 'KYC done' && setResult(1)
+        console.log(response.data.message);
+
+      })
+      .catch((err) => {
+        err.response.data.message === 'KYC not done' && setResult(0)
+        console.log(err.response.data.message)
+      })
+  }
+
+  useEffect(() => {
+    GetKycStatus()
+    console.log(result)
+    // setResult(0);
+  }, [])
   let fetchedAccount = [
     { id: 1, name: 'Upload Transactions', src: `upi1` },
     { id: 2, name: 'Fetch Transactions', src: `bank-building-white` },
@@ -222,7 +255,10 @@ export function AnalysisType({ setdropfiles, setIsanalysisopen, setIsfilteropen,
         <div className={classes.button1} onClick={() => {
           setdropfiles(true)
           setIsanalysisopen(false)
-          if (bankAccountList.length === 0) {
+          if(result===0){
+            SetIsKycPermissionPopUpOpen(true);
+          }
+          else if (bankAccountList.length === 0) {
             setIsAddAccountPopupOpen(true)
           } else {
             setIsfilteropen(true)
@@ -237,7 +273,7 @@ export function AnalysisType({ setdropfiles, setIsanalysisopen, setIsfilteropen,
       );
     }
   };
-
+  
   return (
     // <div className={classes.wrapper}>
     <div className={classes.form}>

components/dashboard/ExportButton.tsx

@@ -4,7 +4,6 @@ import React, { useState } from 'react'
 import useAccountStore from '../Store/Account'
 // import { useReactToPrint } from 'react-to-print'
 import { CSVLink } from 'react-csv'
-
 const useStyles = createStyles((theme) => ({
   button: {
     width: `120px`,
@@ -90,9 +89,9 @@ export default function ExportButton() {
         <Menu.Item>Send an Email</Menu.Item>
       </Menu.Dropdown>
 
-      <div style={{ display: 'none' }}>
+      {/* <div style={{ display: 'none' }}>
         <ComponentToPrint ref={componentRef} />
-      </div>
+      </div> */}
     </Menu>
   )
 }

components/dashboard/LeftPane.tsx

@@ -7,8 +7,8 @@ import useAccountStore from '../Store/Account'
 import CashCard from './CashLimitCard'
 import EodBalance from './EODBalanceCard'
 import RecentTransactions from './recenttransactions'
-
 const FilterRow = styled.div`
+
   display: flex;
   gap: 12px;
   justify-content: space-between;
@@ -95,8 +95,10 @@ const LeftPane = ({ accountsList, useAccount }: Props) => {
   }, [])
   useEffect(() => {
     console.log('useAccount.Transaction', useAccount.Transaction)
+
     console.log('selectedBankAccount', selectedBankAccount)
   }, [selectedBankAccount])
+  console.log('useAccount',useAccount)
   const [account, setaccount] = useState(0);
   const uploaded = useAccountStore(state => state.uploaded)
 
@@ -170,7 +172,7 @@ const LeftPane = ({ accountsList, useAccount }: Props) => {
           </Group>
         </>}
         {/* <EodBalance balance="$1,23,456" comparision={4.6} /> */}
-
+        
         <RecentTransactions transactions={useAccount.Transaction} />
       </ContainerLeft>
     </>

components/dashboard/RightPane.tsx

@@ -11,6 +11,8 @@ import useAccountStore from '../Store/Account'
 import dayjs from 'dayjs'
 import { useState } from 'react'
 import { useEffect } from 'react'
+import Image from 'next/image'
+import { Card } from '@mantine/core'
 const useStyles = createStyles((theme) => ({
   header: {
     flexDirection: 'row',
@@ -50,7 +52,36 @@ const useStyles = createStyles((theme) => ({
     border: 'none',
   },
 }))
+const Empty=()=>{
+  return (
+    <Card
+    // radius={'lg'}
 
+    style={{
+      boxShadow: '0px 2px 40px rgba(0, 0, 0, 0.1)',
+    }}
+    mr={15}
+  >
+    <Group
+      align={'center'}
+      style={{
+        flex: 1,
+        maxHeight: '53vh',
+        overflow: 'auto',
+        margin: 'auto',
+        alignItems: 'center'
+      }}
+    >
+       <Image
+              src={'/icons/empty.png'}
+              alt="filter-icon"
+              height={300}
+              width={300}
+            />
+    </Group>
+  </Card>
+)
+}
 const RightPane = () => {
   const { getItem } = useStorage()
   const { classes } = useStyles()
@@ -122,12 +153,14 @@ const RightPane = () => {
           </Tabs.List>
 
           <Tabs.Panel value="financial" className={classes.tabsPanel}>
-            <FinancialStatistics />
+            {transactions[0].description==='' && <Empty/>}
+          {transactions[0].description!=='' && <FinancialStatistics />}
           </Tabs.Panel>
 
           <Tabs.Panel value="stocks" className={classes.tabsPanel}>
             {/* <StockStatisticsx /> */}
             <StockStatistics />
+
           </Tabs.Panel>
           {/* {    console.log('rendered6846')} */}
         </Tabs>

components/dashboard/recenttransactions.tsx

@@ -160,6 +160,7 @@ const RecentTransactions = (prop: {
         Recent Transactions
       </Text>
       <div style={{ maxHeight: '64vh', overflow: 'auto' }}>
+
         {prop.transactions?.map((t) => (
           <div key={t.id}>
             <TransactionCard data={t} />

components/dashboard/recenttransactionsRightPane.tsx

@@ -1,5 +1,5 @@
 import { Card, Text, Group, Stack, HoverCard } from '@mantine/core'
-
+import { useEffect } from 'react'
 const palette = ['#D56EEA', '#26DD76', '#FFAA57', '#4198FF']
 
 var transactions = [
@@ -155,13 +155,19 @@ const TransactionCard = (props: {
 }
 
 const RecentTransactions = () => {
+  useEffect(() => {
+    console.log(transactions.length)
+
+  }, [])
+
   return (
     <div>
       <Text ff={'Montserrat'} c="#0062D6" fw={700} fz={22} mt={4} ml={8}>
         Recent Transactions
       </Text>
       <div style={{ maxHeight: '30vh', overflow: 'auto' }}>
-        {transactions?.map((t) => (
+        {transactions.length===0 && <h1>No new transactions</h1>}
+        {transactions.length!==0 && transactions?.map((t) => (
           <div key={t.date}>
             <TransactionCard data={t} />
           </div>

components/home/add-bank-account/AddAccountFormPopup.tsx

@@ -313,7 +313,7 @@ export function AddAccountFormPopup({
                               withCloseButton: true,
                               autoClose: 5000,
                               title: "Unsuccessful",
-                              message: err.response.data?.message,
+                              message: err?.response?.data?.message,
                               color: 'red',
                               icon: <IconX size={"1.1rem"} />,
                               loading: false,
@@ -354,7 +354,7 @@ export function AddAccountFormPopup({
                             withCloseButton: true,
                             autoClose: 5000,
                             title: "Unsuccessful",
-                            message: err.response.data?.message,
+                            message: err?.response?.data?.message,
                             color: 'red',
                             icon: <IconX size={"1.1rem"} />,
                             loading: false,

components/home/add-bank-account/AddBankAccountSection.tsx

@@ -1,12 +1,17 @@
 import styled from '@emotion/styled'
+import { createStyles } from '@mantine/core'
+import { useRouter } from 'next/router'
+import { useState } from 'react'
+import useStorage from '../../../hooks/useStorage'
+import { useEffect } from 'react'
 import {
   Button,
   ButtonProps,
   createPolymorphicComponent,
   Image,
   Loader,
 } from '@mantine/core'
-
+import api from '../../datams'
 const Oflex = styled.div`
   display: flex;
   flex-direction: row;
@@ -130,17 +135,64 @@ interface Props {
   setIsAddAccountPopupOpen: Function
   bankAccountList: any[]
   loading: any
+  SetIsKycPermissionPopUpOpen:Function
 }
 export default function BankAccount({
   bankAccountList,
   setIsAddAccountPopupOpen,
   loading,
+  SetIsKycPermissionPopUpOpen,
 }: Props) {
+
+  const [click, setClick] = useState(false)
+  const [type, setType] = useState<number | undefined>(undefined)
+  const { getItem } = useStorage()
+  const [result, setResult] = useState(1)
+  const [account, setAccount] = useState({
+    id: 1,
+  })
+  const GetKycStatus = () => {
+    const accessToken = getItem('access_token', 'session')
+    console.log(accessToken)
+    const user_id = getItem('user_id')
+    const accLength = JSON.stringify(getItem('accounts'))?.length
+    const response = api
+      .get(`/user/getkyc/`, {
+        headers: {
+          Authorization: `Bearer ${accessToken}`,
+          'Content-Type': 'application/json',
+        },
+      })
+      .then((response) => {
+        response.data.message === 'KYC done' && setResult(1)
+        console.log(response.data.message);
+
+      })
+      .catch((err) => {
+        err.response.data.message === 'KYC not done' && setResult(0)
+        console.log(err.response.data.message)
+      })
+  }
+
+  useEffect(() => {
+    GetKycStatus()
+    console.log(result)
+    // setResult(0);
+  }, [])
   return (
     <Container>
       <Iflex>
         <AddBankAccountText>Add Bank Account</AddBankAccountText>
-        <AddAccountButton onClick={() => setIsAddAccountPopupOpen(true)}>
+
+        <AddAccountButton onClick={() => {
+          if(result===0){
+            SetIsKycPermissionPopUpOpen(true)
+          }
+          else{
+            setIsAddAccountPopupOpen(true)
+          }
+
+        }}>
           Add Account
         </AddAccountButton>
       </Iflex>
@@ -162,7 +214,17 @@ export default function BankAccount({
         })}
 
         <AddAnotherBox>
-          <PlusImageContainer onClick={() => setIsAddAccountPopupOpen(true)}>
+          <PlusImageContainer onClick={() => 
+            {
+              if(result===0){
+                SetIsKycPermissionPopUpOpen(true)
+              }
+              else{
+                setIsAddAccountPopupOpen(true)
+              }
+
+            }
+            }>
             <Image src="images/frame.png" alt="add" />
           </PlusImageContainer>
         </AddAnotherBox>