2020-11-14 00:44:26 +03:00
|
|
|
import { useEffect } from 'react';
|
2020-09-04 20:05:41 +03:00
|
|
|
import qs from 'qs';
|
|
|
|
import { RouteComponentProps } from 'react-router';
|
2020-09-06 20:41:15 +03:00
|
|
|
import { boundToMercureHub } from '../mercure/helpers/boundToMercureHub';
|
2020-09-04 20:05:41 +03:00
|
|
|
import { ShlinkVisitsParams } from '../utils/services/types';
|
|
|
|
import { ShortUrlVisits as ShortUrlVisitsState } from './reducers/shortUrlVisits';
|
|
|
|
import ShortUrlVisitsHeader from './ShortUrlVisitsHeader';
|
|
|
|
import { ShortUrlDetail } from './reducers/shortUrlDetail';
|
2020-09-05 09:49:18 +03:00
|
|
|
import VisitsStats from './VisitsStats';
|
2020-09-04 20:05:41 +03:00
|
|
|
|
2020-09-06 20:41:15 +03:00
|
|
|
export interface ShortUrlVisitsProps extends RouteComponentProps<{ shortCode: string }> {
|
2020-09-04 20:05:41 +03:00
|
|
|
getShortUrlVisits: (shortCode: string, query?: ShlinkVisitsParams) => void;
|
|
|
|
shortUrlVisits: ShortUrlVisitsState;
|
|
|
|
getShortUrlDetail: Function;
|
|
|
|
shortUrlDetail: ShortUrlDetail;
|
2020-09-05 09:49:18 +03:00
|
|
|
cancelGetShortUrlVisits: () => void;
|
2020-09-04 20:05:41 +03:00
|
|
|
}
|
|
|
|
|
2020-09-06 20:41:15 +03:00
|
|
|
const ShortUrlVisits = boundToMercureHub(({
|
2020-09-04 20:05:41 +03:00
|
|
|
history: { goBack },
|
|
|
|
match,
|
|
|
|
location: { search },
|
|
|
|
shortUrlVisits,
|
|
|
|
shortUrlDetail,
|
|
|
|
getShortUrlVisits,
|
|
|
|
getShortUrlDetail,
|
|
|
|
cancelGetShortUrlVisits,
|
|
|
|
}: ShortUrlVisitsProps) => {
|
|
|
|
const { params } = match;
|
|
|
|
const { shortCode } = params;
|
|
|
|
const { domain } = qs.parse(search, { ignoreQueryPrefix: true }) as { domain?: string };
|
|
|
|
|
2020-09-05 09:49:18 +03:00
|
|
|
const loadVisits = (params: Partial<ShlinkVisitsParams>) => getShortUrlVisits(shortCode, { ...params, domain });
|
2020-09-04 20:05:41 +03:00
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
getShortUrlDetail(shortCode, domain);
|
|
|
|
}, []);
|
|
|
|
|
|
|
|
return (
|
|
|
|
<VisitsStats getVisits={loadVisits} cancelGetVisits={cancelGetShortUrlVisits} visitsInfo={shortUrlVisits}>
|
|
|
|
<ShortUrlVisitsHeader shortUrlDetail={shortUrlDetail} shortUrlVisits={shortUrlVisits} goBack={goBack} />
|
|
|
|
</VisitsStats>
|
|
|
|
);
|
2020-09-06 20:41:15 +03:00
|
|
|
}, ({ match }) => `https://shlink.io/new-visit/${match.params.shortCode}`);
|
2020-09-04 20:05:41 +03:00
|
|
|
|
|
|
|
export default ShortUrlVisits;
|