Add a second paging block on the Channels tab

src/controllers/livetv.html

@@ -64,6 +64,9 @@
                 <button is="paper-icon-button-light" class="btnFilter sectionTitleButton" title="${Filter}"><span class="material-icons filter_list"></span></button>
             </div>
             <div is="emby-itemscontainer" id="items" class="itemsContainer vertical-wrap padded-left padded-right"></div>
+            <div class="flex align-items-center justify-content-center flex-wrap-wrap padded-top padded-left padded-right padded-bottom focuscontainer-x">
+                <div class="paging"></div>
+            </div>
         </div>
         <div class="pageTabContent" id="recordingsTab" data-index="3">
             <div id="latestRecordings" class="verticalSection hide">

src/controllers/livetv/livetvchannels.js

@@ -65,14 +65,18 @@ export default function (view, params, tabContent) {
         }
 
         const query = getQuery();
-        context.querySelector('.paging').innerHTML = libraryBrowser.getQueryPagingHtml({
+
-            startIndex: query.StartIndex,
+        for (const elem of context.querySelectorAll('.paging')) {
-            limit: query.Limit,
+            elem.innerHTML = libraryBrowser.getQueryPagingHtml({
-            totalRecordCount: result.TotalRecordCount,
+                startIndex: query.StartIndex,
-            showLimit: false,
+                limit: query.Limit,
-            updatePageSizeSetting: false,
+                totalRecordCount: result.TotalRecordCount,
-            filterButton: false
+                showLimit: false,
-        });
+                updatePageSizeSetting: false,
+                filterButton: false
+            });
+        }
+
         const html = getChannelsHtml(result.Items);
         const elem = context.querySelector('#items');
         elem.innerHTML = html;