jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

change(ui) - live session list pagination count

Browse source
This commit is contained in:
Shekar Siri 2022-08-23 18:11:36 +02:00
parent 795cef61e9
commit b17a3ba13a
2 changed files with 9 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx
View file

@ -89,7 +89,7 @@ function LiveSessionList(props: Props) {
<div className="flex items-baseline">
<h3 className="text-2xl capitalize">
<span>Live Sessions</span>
<span className="ml-2 font-normal color-gray-medium">{numberWithCommas(total)}</span>
{/* <span className="ml-2 font-normal color-gray-medium">{numberWithCommas(total)}</span> */}
</h3>
<LiveSessionReloadButton onClick={() => props.applyFilter({ ...filter })} />
@ -152,8 +152,12 @@ function LiveSessionList(props: Props) {
</>
))}
</div>
<div className={cn('w-full flex items-center justify-center py-6', { disabled: loading })}>
<div className={cn("flex items-center justify-between p-5", { disabled: loading })}>
<div>
Showing <span className="font-medium">{(currentPage - 1) * PER_PAGE + 1}</span> to{' '}
<span className="font-medium">{(currentPage - 1) * PER_PAGE + list.size}</span> of{' '}
<span className="font-medium">{numberWithCommas(total)}</span> sessions.
</div>
<Pagination
page={currentPage}
totalPages={Math.ceil(total / PER_PAGE)}

5
frontend/app/components/shared/SessionListContainer/components/SessionList/SessionList.tsx
View file

@ -6,6 +6,7 @@ import { NoContent, Loader, Pagination, Button } from 'UI';
import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG';
import { fetchSessions, addFilterByKeyAndValue, updateCurrentPage, setScrollPosition } from 'Duck/search';
import useTimeout from 'App/hooks/useTimeout';
import { numberWithCommas } from 'App/utils';
const AUTOREFRESH_INTERVAL = 5 * 60 * 1000;
const PER_PAGE = 10;
@ -115,13 +116,11 @@ function SessionList(props: Props) {
</NoContent>
{total > 0 && (
// <div className="w-full flex items-center justify-center py-6 px-4">
<div className="flex items-center justify-between p-5">
<div>
{/* showing x to x of total sessions */}
Showing <span className="font-medium">{(currentPage - 1) * PER_PAGE + 1}</span> to{' '}
<span className="font-medium">{(currentPage - 1) * PER_PAGE + list.size}</span> of{' '}
<span className="font-medium">{total}</span> sessions.
<span className="font-medium">{numberWithCommas(total)}</span> sessions.
</div>
<Pagination
page={currentPage}