Allow tag, orphan and non-orphan visits to be filtered by domain

Author: acelaya

src/visits/NonOrphanVisits.tsx

@@ -5,13 +5,13 @@ import type { MercureBoundProps } from '../mercure/helpers/boundToMercureHub';
 import { boundToMercureHub } from '../mercure/helpers/boundToMercureHub';
 import { Topics } from '../mercure/helpers/Topics';
 import type { ReportExporter } from '../utils/services/ReportExporter';
-import type { GetVisitsOptions, LoadVisits, VisitsInfo } from './reducers/types';
+import type { GetVisitsOptions, LoadWithDomainVisits, VisitsInfo } from './reducers/types';
 import type { NormalizedVisit, VisitsParams } from './types';
 import { VisitsHeader } from './VisitsHeader';
 import { VisitsStats } from './VisitsStats';
 
 export type NonOrphanVisitsProps = {
-  getNonOrphanVisits: (params: LoadVisits) => void;
+  getNonOrphanVisits: (params: LoadWithDomainVisits) => void;
   nonOrphanVisits: VisitsInfo;
   cancelGetNonOrphanVisits: () => void;
 };
@@ -29,7 +29,11 @@ const NonOrphanVisits: FCWithDeps<MercureBoundProps & NonOrphanVisitsProps, NonO
     [reportExporter],
   );
   const loadVisits = useCallback(
-    (params: VisitsParams, options: GetVisitsOptions) => getNonOrphanVisits({ options, params }),
+    (params: VisitsParams, options: GetVisitsOptions) => getNonOrphanVisits({
+      options,
+      params,
+      domain: params.filter?.domain,
+    }),
     [getNonOrphanVisits],
   );
 

src/visits/OrphanVisits.tsx

@@ -37,6 +37,7 @@ const OrphanVisits: FCWithDeps<MercureBoundProps & OrphanVisitsProps, OrphanVisi
       options,
       params,
       orphanVisitsType: params.filter?.orphanVisitsType,
+      domain: params.filter?.domain,
     }),
     [getOrphanVisits],
   );

src/visits/TagVisits.tsx

@@ -30,7 +30,12 @@ const TagVisits: FCWithDeps<MercureBoundProps & TagVisitsProps, TagVisitsDeps> =
   const { ColorGenerator: colorGenerator, ReportExporter: reportExporter } = useDependencies(TagVisits);
   const { tag = '' } = useParams();
   const loadVisits = useCallback(
-    (params: VisitsParams, options: GetVisitsOptions) => getTagVisits({ tag, params, options }),
+    (params: VisitsParams, options: GetVisitsOptions) => getTagVisits({
+      tag,
+      params,
+      options,
+      domain: params.filter?.domain,
+    }),
     [getTagVisits, tag],
   );
   const exportCsv = useCallback(

src/visits/reducers/nonOrphanVisits.ts

@@ -2,7 +2,7 @@ import type { ShlinkVisitsParams } from '@shlinkio/shlink-js-sdk/api-contract';
 import type { ShlinkApiClient } from '../../api-contract';
 import { isBetween } from '../../utils/dates/helpers/date';
 import { createVisitsAsyncThunk, createVisitsReducer, lastVisitLoaderForLoader } from './common';
-import type { VisitsInfo } from './types';
+import type { LoadWithDomainVisits, VisitsInfo } from './types';
 
 const REDUCER_PREFIX = 'shlink/orphanVisits';
 
@@ -16,11 +16,11 @@ const initialState: VisitsInfo = {
 
 export const getNonOrphanVisits = (apiClientFactory: () => ShlinkApiClient) => createVisitsAsyncThunk({
   typePrefix: `${REDUCER_PREFIX}/getNonOrphanVisits`,
-  createLoaders: ({ options }) => {
+  createLoaders: ({ options, domain }: LoadWithDomainVisits) => {
     const apiClient = apiClientFactory();
     const { doIntervalFallback = false } = options;
 
-    const visitsLoader = async (query: ShlinkVisitsParams) => apiClient.getNonOrphanVisits(query);
+    const visitsLoader = async (query: ShlinkVisitsParams) => apiClient.getNonOrphanVisits({ ...query, domain });
     const lastVisitLoader = lastVisitLoaderForLoader(doIntervalFallback, (q) => apiClient.getNonOrphanVisits(q));
 
     return { visitsLoader, lastVisitLoader };

src/visits/reducers/orphanVisits.ts

@@ -4,11 +4,11 @@ import { isBetween } from '../../utils/dates/helpers/date';
 import { isOrphanVisit } from '../helpers';
 import { createVisitsAsyncThunk, createVisitsReducer, lastVisitLoaderForLoader } from './common';
 import type { deleteOrphanVisits } from './orphanVisitsDeletion';
-import type { LoadVisits, VisitsInfo } from './types';
+import type { LoadWithDomainVisits, VisitsInfo } from './types';
 
 const REDUCER_PREFIX = 'shlink/orphanVisits';
 
-export interface LoadOrphanVisits extends LoadVisits {
+export interface LoadOrphanVisits extends LoadWithDomainVisits {
   orphanVisitsType?: ShlinkOrphanVisitType;
 }
 
@@ -30,13 +30,14 @@ const filterOrphanVisitsByType = ({ data, ...rest }: ShlinkVisitsList, type?: Sh
 
 export const getOrphanVisits = (apiClientFactory: () => ShlinkApiClient) => createVisitsAsyncThunk({
   typePrefix: `${REDUCER_PREFIX}/getOrphanVisits`,
-  createLoaders: ({ orphanVisitsType, options }: LoadOrphanVisits) => {
+  createLoaders: ({ orphanVisitsType, domain, options }: LoadOrphanVisits) => {
     const apiClient = apiClientFactory();
     const { doIntervalFallback = false } = options;
 
     const visitsLoader = async (query: ShlinkVisitsParams) => apiClient.getOrphanVisits({
       ...query,
-      type: orphanVisitsType, // Send type to the server, in case it supports filtering by type
+      type: orphanVisitsType,
+      domain,
     }).then(
       // We still try to filter locally, for Shlink older than 4.0.0
       (resp) => filterOrphanVisitsByType(resp, orphanVisitsType),

src/visits/reducers/tagVisits.ts

@@ -2,7 +2,7 @@ import type { ShlinkVisitsParams } from '@shlinkio/shlink-js-sdk/api-contract';
 import type { ShlinkApiClient } from '../../api-contract';
 import { filterCreatedVisitsByTag } from '../helpers';
 import { createVisitsAsyncThunk, createVisitsReducer, lastVisitLoaderForLoader } from './common';
-import type { LoadVisits, VisitsInfo } from './types';
+import type { LoadWithDomainVisits, VisitsInfo } from './types';
 
 const REDUCER_PREFIX = 'shlink/tagVisits';
 
@@ -21,15 +21,15 @@ const initialState: TagVisits = {
   progress: null,
 };
 
-export type LoadTagVisits = LoadVisits & WithTag;
+export type LoadTagVisits = LoadWithDomainVisits & WithTag;
 
 export const getTagVisits = (apiClientFactory: () => ShlinkApiClient) => createVisitsAsyncThunk({
   typePrefix: `${REDUCER_PREFIX}/getTagVisits`,
-  createLoaders: ({ tag, options }: LoadTagVisits) => {
+  createLoaders: ({ tag, options, domain }: LoadTagVisits) => {
     const apiClient = apiClientFactory();
     const { doIntervalFallback = false } = options;
 
-    const visitsLoader = (query: ShlinkVisitsParams) => apiClient.getTagVisits(tag, query);
+    const visitsLoader = (query: ShlinkVisitsParams) => apiClient.getTagVisits(tag, { ...query, domain });
     const lastVisitLoader = lastVisitLoaderForLoader(doIntervalFallback, async (q) => apiClient.getTagVisits(tag, q));
 
     return { visitsLoader, lastVisitLoader };

src/visits/reducers/types/index.ts

@@ -12,6 +12,10 @@ export type LoadVisits = {
   options: GetVisitsOptions;
 };
 
+export type LoadWithDomainVisits = LoadVisits & {
+  domain?: string;
+};
+
 export type VisitsLoaded = {
   visits: ShlinkVisit[];
   prevVisits?: ShlinkVisit[];

src/visits/types/index.ts

@@ -54,6 +54,7 @@ export interface VisitsStats {
 export interface VisitsFilter {
   orphanVisitsType?: ShlinkOrphanVisitType | undefined;
   excludeBots?: boolean;
+  domain?: string;
 }
 
 export type VisitsParams = {