Skip to content
Snippets Groups Projects
Commit b4050aa2 authored by mateusz-winiarczyk's avatar mateusz-winiarczyk
Browse files

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

parent 6193d688
No related branches found
No related tags found
2 merge requests!223reset the pin numbers before search results are fetch (so the results will be...,!138fix(publications): fix scrolling to top after change page and remove publications number (MIN-278)
......@@ -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 ">
......
......@@ -50,7 +50,7 @@ export const ProjectInfoDrawer = (): JSX.Element => {
<ul className="list-disc pl-6 ">
<li className="mt-2 text-hyperlink-blue">
<button type="button" onClick={onPublicationsClick} className="text-sm font-semibold">
(21) publications
Publications
</button>
</li>
<li className="mt-2 text-hyperlink-blue">
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment