1
0
mirror of https://gitlab.nic.cz/turris/reforis/foris-js.git synced 2024-12-26 00:21:36 +01:00

Compare commits

..

3 Commits

Author SHA1 Message Date
Aleksandr Gumroian
a63b5bfa4e Merge branch 'refactor-modal' into 'dev'
Add optional close button to ModalHeader component

See merge request turris/reforis/foris-js!257
2024-12-04 15:12:07 +01:00
Aleksandr Gumroian
4b2e47f8f9
Refactor pagination condition in RichTable component 2024-12-04 14:02:52 +01:00
Aleksandr Gumroian
66f83b24bd
Add optional close button to ModalHeader component 2024-12-04 14:02:35 +01:00
2 changed files with 13 additions and 8 deletions

View File

@ -88,18 +88,21 @@ export function Modal({ shown, setShown, scrollable, size, children }) {
ModalHeader.propTypes = { ModalHeader.propTypes = {
setShown: PropTypes.func.isRequired, setShown: PropTypes.func.isRequired,
title: PropTypes.string.isRequired, title: PropTypes.string.isRequired,
showCloseButton: PropTypes.bool,
}; };
export function ModalHeader({ setShown, title }) { export function ModalHeader({ setShown, title, showCloseButton = true }) {
return ( return (
<div className="modal-header"> <div className="modal-header">
<h1 className="modal-title fs-5">{title}</h1> <h1 className="modal-title fs-5">{title}</h1>
<button {showCloseButton && (
type="button" <button
className="btn-close" type="button"
onClick={() => setShown(false)} className="btn-close"
aria-label={_("Close")} onClick={() => setShown(false)}
/> aria-label={_("Close")}
/>
)}
</div> </div>
); );
} }

View File

@ -64,13 +64,15 @@ function RichTable({
}, },
}); });
const paginationIsNeeded = tableData.length > pageSize && withPagination;
return ( return (
<div className="table-responsive"> <div className="table-responsive">
<table className="table table-hover text-nowrap"> <table className="table table-hover text-nowrap">
<RichTableHeader table={table} flexRender={flexRender} /> <RichTableHeader table={table} flexRender={flexRender} />
<RichTableBody table={table} flexRender={flexRender} /> <RichTableBody table={table} flexRender={flexRender} />
</table> </table>
{withPagination && ( {paginationIsNeeded && (
<RichTablePagination <RichTablePagination
table={table} table={table}
tablePageSize={pageSize} tablePageSize={pageSize}