openreplay/frontend/app/components/ui/LoadMoreButton/LoadMoreButton.js
2021-05-01 15:12:01 +05:30

26 lines
778 B
JavaScript

import React from 'react'
import cn from 'classnames'
function LoadMoreButton({className = '', totalCount, displayedCount, onClick, loading, description = false}) {
return (
<div className={ cn("flex flex-col items-center", className)}>
<div className="color-gray-medium text-sm">
Showing <span className="font-bold">{ displayedCount }</span> of <span className="font-bold">{ totalCount }</span>
</div>
{ totalCount > displayedCount &&
<a
className="color-teal uppercase mt-1 cursor-pointer"
onClick={ onClick }
disabled={ loading }
>
{ 'Load more' }
</a>
}
{ description && (
<div>{ description }</div>
)}
</div>
)
}
export default LoadMoreButton