resources/js/components/rounds/LoadMore.js

   1 import PropTypes from 'prop-types';
   2 import React from 'react';
   3 import { Button } from 'react-bootstrap';
   4 import { useTranslation } from 'react-i18next';
   5
   6 const LoadMore = ({ loadMore }) => {
   7         const [loading, setLoading] = React.useState(false);
   8
   9         const { t } = useTranslation();
  10
  11         const handleLoadMore = React.useCallback(async () => {
  12                 setLoading(true);
  13                 try {
  14                         await loadMore();
  15                 } finally {
  16                         setLoading(false);
  17                 }
  18         }, [loadMore]);
  19
  20         return <div className="d-grid mt-2">
  21                 <Button disabled={loading} onClick={handleLoadMore} variant="outline-secondary">
  22                 {t('rounds.loadMore')}
  23                 </Button>
  24         </div>;
  25 };
  26
  27 LoadMore.propTypes = {
  28         loadMore: PropTypes.func,
  29 };
  30
  31 export default LoadMore;