fix(publications): fix scrolling to top after change page and remove publications number (MIN-278)

Fixed a bug with not scrolling up after changing the page and the number of publications was removed.

Resolves https://minerva-appunite.atlassian.net/browse/MIN-278

project-info-bugs

src/components/FunctionalArea/Modal/PublicationsModal/PublicationsTable/PublicationsTable.component.tsx

@@ -20,7 +20,7 @@ import {
   useReactTable,
   OnChangeFn,
 } from '@tanstack/react-table';
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import { SortByHeader } from './SortByHeader';
 import { DEFAULT_PAGE_SIZE } from './PublicationsTable.constants';
 import { FilterBySubmapHeader } from './FilterBySubmapHeader/FilterBySubmapHeader.component';
@@ -88,6 +88,7 @@ export const PublicationsTable = ({ data }: PublicationsTableProps): JSX.Element
 
   const reduxPagination = useAppSelector(paginationSelector);
   const [pagination, setPagination] = useState(reduxPagination);
+  const tableRef = useRef<HTMLTableElement>(null);
 
   const onPaginationChange: OnChangeFn<PaginationState> = updater => {
     /** updating state this way is forced by table library */
@@ -106,8 +107,13 @@ export const PublicationsTable = ({ data }: PublicationsTableProps): JSX.Element
         },
         modelId: selectedId,
       }),
-    );
-    setPagination(nextState);
+    )
+      .unwrap()
+      .then(() => {
+        setPagination(nextState);
+
+        tableRef.current?.scrollIntoView();
+      });
   };
 
   const table = useReactTable({
@@ -126,7 +132,7 @@ export const PublicationsTable = ({ data }: PublicationsTableProps): JSX.Element
   return (
     <div className="flex max-h-full w-full flex-col items-center justify-center bg-white p-6">
       <div className="w-full overflow-auto">
-        <table className="w-full min-w-[1184px] table-auto overflow-auto text-sm">
+        <table className="w-full min-w-[1184px] table-auto overflow-auto text-sm" ref={tableRef}>
           <thead className="sticky top-0 bg-white-pearl">
             {table.getHeaderGroups().map(headerGroup => (
               <tr key={headerGroup.id} className="border-y ">