88 lines
2.1 KiB
TypeScript
88 lines
2.1 KiB
TypeScript
import React, { useContext, useEffect } from 'react';
|
||
|
||
import { Queries } from '@/api/queries';
|
||
import { SmsContext } from '@/context/SmsContext';
|
||
import SmsPagination from './smsTable/SmsPagination';
|
||
import SmsTableBody from './smsTable/SmsTableBody';
|
||
import SmsTableHead from './smsTable/SmsTableHead';
|
||
import Loader from './Loader';
|
||
|
||
const SmsTable = () => {
|
||
const smsContext = useContext(SmsContext);
|
||
if (!smsContext) {
|
||
throw new Error('smsContext must be used within an AuthProvider');
|
||
}
|
||
const {
|
||
tableIsLoading,
|
||
smsData,
|
||
smsTableData,
|
||
setSmsTableData,
|
||
setTableIsLoading,
|
||
setCurrentPage,
|
||
setIsError,
|
||
currentPage,
|
||
activeNumber,
|
||
searchFecth,
|
||
activeSort,
|
||
dateValue,
|
||
timeDate,
|
||
} = smsContext;
|
||
|
||
const getMessages = () => {
|
||
if (smsData && activeNumber) {
|
||
setTableIsLoading(true);
|
||
|
||
try {
|
||
Queries.getMessages(activeNumber, currentPage, dateValue, activeSort, searchFecth).then(
|
||
(res) => {
|
||
setSmsTableData(res);
|
||
setTableIsLoading(false);
|
||
|
||
if (!res.data) {
|
||
setTableIsLoading(true);
|
||
|
||
setIsError(true);
|
||
}
|
||
},
|
||
);
|
||
} catch (error) {
|
||
setTableIsLoading(true);
|
||
|
||
setIsError(true);
|
||
}
|
||
}
|
||
};
|
||
|
||
useEffect(() => {
|
||
getMessages();
|
||
}, [smsData, currentPage, activeNumber, searchFecth, activeSort, dateValue]);
|
||
|
||
useEffect(() => {
|
||
setCurrentPage(1);
|
||
}, [activeNumber]);
|
||
|
||
if (tableIsLoading) {
|
||
return (
|
||
<div className="w-full">
|
||
<Loader />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
return smsTableData?.data.length ? (
|
||
<div className="flex flex-col w-full gap-[24px] max-w-[900px]">
|
||
<div className="flex flex-col w-full rounded-[25px] overflow-hidden shadow-tableShadow">
|
||
<SmsTableHead />
|
||
<SmsTableBody />
|
||
</div>
|
||
{smsTableData.meta.last_page > 1 ? <SmsPagination /> : null}
|
||
</div>
|
||
) : (
|
||
<h1 className="mt-[20px] text-[32px] leading-[120%] font-semibold text-textBlack">
|
||
Нет результатов!
|
||
</h1>
|
||
);
|
||
};
|
||
|
||
export default SmsTable;
|