SME-Web/src/components/process/processStepTwo/ProcessStepTwo.tsx

51 lines
1.8 KiB
TypeScript

import { useEffect, useState } from 'react'
import NavTwo from './NavTwo';
import LeftSideBar from './LeftSideBar';
import DocumentContainer from './DocumentContainer';
import { useDispatch, useSelector } from 'react-redux';
import { RootState } from '../../../store/store';
import Loader from '../../dashboard/Loader';
import { hideLoader } from '../../../store/slices/loaderSlice';
import { useNavigate } from 'react-router-dom';
export interface IsSendInterface {
send: boolean | null;
save: boolean;
}
const ProcessStepTwo = () => {
const [isFields, setIsFields] = useState(true);
const [selectedRecipient, setSelectedRecipient] = useState(0);
const [transactionSaving, setTransactionSaving] = useState<boolean>(false);
const [isSend, setIsSend] = useState<boolean | null>(null);
const globalLoader = useSelector((state: RootState) => state.loader)
const dispatch = useDispatch();
const navigate = useNavigate();
useEffect(() => {
setTimeout(() => {
dispatch(hideLoader());
}, 800)
}, [])
return (
<div className={`min-w-full relative h-screen bg-slate-100 overflow-hidden ${(globalLoader.isLoading) ? 'pointer-events-none' : ''}`}>
<NavTwo transactionSaving={transactionSaving} isFields={isFields} setIsFields={setIsFields} isSend={isSend} setIsSend={setIsSend} />
<div className='grid grid-cols-12 gap-1 mt-1 h-[calc(100vh-46px)] overflow-hidden'>
<LeftSideBar isFields={isFields} selectedRecipientIndx={selectedRecipient} setSelectedRecipient={setSelectedRecipient} />
<DocumentContainer transactionSaving={transactionSaving} setTransactionSaving={setTransactionSaving} isSend={isSend} setIsSend={setIsSend} />
</div>
{globalLoader.isLoading && <Loader />}
</div>
)
}
export default ProcessStepTwo