import { FC, useEffect, useState } from 'react'; import { ShlinkShortUrlsResponse } from '../utils/services/types'; import Paginator from './Paginator'; import { ShortUrlsListProps, WithList } from './ShortUrlsList'; interface ShortUrlsProps extends ShortUrlsListProps { shortUrlsList?: ShlinkShortUrlsResponse; } const ShortUrls = (SearchBar: FC, ShortUrlsList: FC) => (props: ShortUrlsProps) => { const { match, shortUrlsList } = props; const { page = '1', serverId = '' } = match?.params ?? {}; const { data = [], pagination } = shortUrlsList ?? {}; const [ urlsListKey, setUrlsListKey ] = useState(`${serverId}_${page}`); // Using a key on a component makes react to create a new instance every time the key changes // Without it, pagination on the URL will not make the component to be refreshed useEffect(() => { setUrlsListKey(`${serverId}_${page}`); }, [ serverId, page ]); return ( <>
); }; export default ShortUrls;