Merge pull request #4201 from h3llrais3r/show-library-count

Show total count when no pagination is applied
This commit is contained in:
Bill Thornton 2023-01-20 00:02:02 -05:00 committed by GitHub
commit 0cdde28c5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 27 deletions

View File

@ -15,7 +15,8 @@ const Pagination: FC<PaginationProps> = ({ viewQuerySettings, setViewQuerySettin
const limit = userSettings.libraryPageSize(undefined); const limit = userSettings.libraryPageSize(undefined);
const totalRecordCount = itemsResult.TotalRecordCount || 0; const totalRecordCount = itemsResult.TotalRecordCount || 0;
const startIndex = viewQuerySettings.StartIndex || 0; const startIndex = viewQuerySettings.StartIndex || 0;
const recordsEnd = Math.min(startIndex + limit, totalRecordCount); const recordsStart = totalRecordCount ? startIndex + 1 : 0;
const recordsEnd = limit ? Math.min(startIndex + limit, totalRecordCount) : totalRecordCount;
const showControls = limit > 0 && limit < totalRecordCount; const showControls = limit > 0 && limit < totalRecordCount;
const element = useRef<HTMLDivElement>(null); const element = useRef<HTMLDivElement>(null);
@ -69,25 +70,25 @@ const Pagination: FC<PaginationProps> = ({ viewQuerySettings, setViewQuerySettin
return ( return (
<div ref={element}> <div ref={element}>
<div className='paging'> <div className='paging'>
{showControls && ( <div className='listPaging' style={{ display: 'flex', alignItems: 'center' }}>
<div className='listPaging' style={{ display: 'flex', alignItems: 'center' }}> <span>
{globalize.translate('ListPaging', recordsStart, recordsEnd, totalRecordCount)}
<span> </span>
{globalize.translate('ListPaging', (totalRecordCount ? startIndex + 1 : 0), recordsEnd, totalRecordCount)} {showControls && (
</span> <>
<IconButtonElement
<IconButtonElement is='paper-icon-button-light'
is='paper-icon-button-light' className='btnPreviousPage autoSize'
className='btnPreviousPage autoSize' icon='material-icons arrow_back'
icon='material-icons arrow_back' />
/> <IconButtonElement
<IconButtonElement is='paper-icon-button-light'
is='paper-icon-button-light' className='btnNextPage autoSize'
className='btnNextPage autoSize' icon='material-icons arrow_forward'
icon='material-icons arrow_forward' />
/> </>
</div> )}
)} </div>
</div> </div>
</div> </div>
); );

View File

@ -81,16 +81,15 @@ export function getQueryPagingHtml (options) {
const limit = options.limit; const limit = options.limit;
const totalRecordCount = options.totalRecordCount; const totalRecordCount = options.totalRecordCount;
let html = ''; let html = '';
const recordsEnd = Math.min(startIndex + limit, totalRecordCount); const recordsStart = totalRecordCount ? startIndex + 1 : 0;
const showControls = limit < totalRecordCount; const recordsEnd = limit ? Math.min(startIndex + limit, totalRecordCount) : totalRecordCount;
const showControls = limit > 0 && limit < totalRecordCount;
html += '<div class="listPaging">'; html += '<div class="listPaging">';
if (showControls) { html += '<span style="vertical-align:middle;">';
html += '<span style="vertical-align:middle;">'; html += globalize.translate('ListPaging', recordsStart, recordsEnd, totalRecordCount);
html += globalize.translate('ListPaging', totalRecordCount ? startIndex + 1 : 0, recordsEnd, totalRecordCount); html += '</span>';
html += '</span>';
}
if (showControls || options.viewButton || options.filterButton || options.sortButton || options.addLayoutButton) { if (showControls || options.viewButton || options.filterButton || options.sortButton || options.addLayoutButton) {
html += '<div style="display:inline-block;">'; html += '<div style="display:inline-block;">';