diff --git a/src/api/services/ShlinkApiClient.ts b/src/api/services/ShlinkApiClient.ts index f724b43a..6c783531 100644 --- a/src/api/services/ShlinkApiClient.ts +++ b/src/api/services/ShlinkApiClient.ts @@ -1,6 +1,5 @@ import { isEmpty, isNil, reject } from 'ramda'; import { AxiosInstance, AxiosResponse, Method } from 'axios'; -import { ShortUrlsListParams } from '../../short-urls/reducers/shortUrlsListParams'; import { ShortUrl, ShortUrlData } from '../../short-urls/data'; import { OptionalString } from '../../utils/utils'; import { @@ -17,6 +16,7 @@ import { ShlinkVisitsOverview, ShlinkEditDomainRedirects, ShlinkDomainRedirects, + ShlinkShortUrlsListParams, } from '../types'; import { stringifyQuery } from '../../utils/helpers/query'; @@ -34,7 +34,7 @@ export default class ShlinkApiClient { this.apiVersion = 2; } - public readonly listShortUrls = async (params: ShortUrlsListParams = {}): Promise => + public readonly listShortUrls = async (params: ShlinkShortUrlsListParams = {}): Promise => this.performRequest<{ shortUrls: ShlinkShortUrlsResponse }>('/short-urls', 'GET', params) .then(({ data }) => data.shortUrls); diff --git a/src/api/types/index.ts b/src/api/types/index.ts index b16111b9..478194fc 100644 --- a/src/api/types/index.ts +++ b/src/api/types/index.ts @@ -1,6 +1,7 @@ import { Visit } from '../../visits/types'; import { OptionalString } from '../../utils/utils'; import { ShortUrl, ShortUrlMeta } from '../../short-urls/data'; +import { OrderBy } from '../../short-urls/reducers/shortUrlsListParams'; export interface ShlinkShortUrlsResponse { data: ShortUrl[]; @@ -85,6 +86,16 @@ export interface ShlinkDomainsResponse { data: ShlinkDomain[]; } +export interface ShlinkShortUrlsListParams { + page?: string; + itemsPerPage?: number; + tags?: string[]; + searchTerm?: string; + startDate?: string; + endDate?: string; + orderBy?: OrderBy; +} + export interface ProblemDetailsError { type: string; detail: string; diff --git a/src/common/services/provideServices.ts b/src/common/services/provideServices.ts index b714c8d5..9d51ccdb 100644 --- a/src/common/services/provideServices.ts +++ b/src/common/services/provideServices.ts @@ -46,7 +46,7 @@ const provideServices = (bottle: Bottle, connect: ConnectDecorator, withRouter: 'EditShortUrl', 'ManageDomains', ); - bottle.decorator('MenuLayout', connect([ 'selectedServer', 'shortUrlsListParams' ], [ 'selectServer' ])); + bottle.decorator('MenuLayout', connect([ 'selectedServer' ], [ 'selectServer' ])); bottle.decorator('MenuLayout', withRouter); bottle.serviceFactory('AsideMenu', AsideMenu, 'DeleteServerButton'); diff --git a/src/servers/Overview.tsx b/src/servers/Overview.tsx index f85ed23f..9b99cc6f 100644 --- a/src/servers/Overview.tsx +++ b/src/servers/Overview.tsx @@ -1,7 +1,6 @@ import { FC, useEffect } from 'react'; import { Card, CardBody, CardHeader, CardText, CardTitle, Row } from 'reactstrap'; import { Link, useHistory } from 'react-router-dom'; -import { ShortUrlsListParams } from '../short-urls/reducers/shortUrlsListParams'; import { ShortUrlsList as ShortUrlsListState } from '../short-urls/reducers/shortUrlsList'; import { prettify } from '../utils/helpers/numbers'; import { TagsList } from '../tags/reducers/tagsList'; @@ -11,12 +10,13 @@ import { CreateShortUrlProps } from '../short-urls/CreateShortUrl'; import { VisitsOverview } from '../visits/reducers/visitsOverview'; import { Versions } from '../utils/helpers/version'; import { Topics } from '../mercure/helpers/Topics'; +import { ShlinkShortUrlsListParams } from '../api/types'; import { getServerId, SelectedServer } from './data'; import './Overview.scss'; interface OverviewConnectProps { shortUrlsList: ShortUrlsListState; - listShortUrls: (params: ShortUrlsListParams) => void; + listShortUrls: (params: ShlinkShortUrlsListParams) => void; listTags: Function; tagsList: TagsList; selectedServer: SelectedServer; diff --git a/src/short-urls/SearchBar.tsx b/src/short-urls/SearchBar.tsx index 3397c55c..be650422 100644 --- a/src/short-urls/SearchBar.tsx +++ b/src/short-urls/SearchBar.tsx @@ -9,18 +9,15 @@ import { DateRangeSelector } from '../utils/dates/DateRangeSelector'; import { formatIsoDate } from '../utils/helpers/date'; import ColorGenerator from '../utils/services/ColorGenerator'; import { DateRange } from '../utils/dates/types'; -import { ShortUrlsListParams } from './reducers/shortUrlsListParams'; import { ShortUrlListRouteParams, useShortUrlsQuery } from './helpers/hooks'; import './SearchBar.scss'; -export interface SearchBarProps extends RouteChildrenProps { - shortUrlsListParams: ShortUrlsListParams; -} +export type SearchBarProps = RouteChildrenProps; const dateOrNull = (date?: string) => date ? parseISO(date) : null; -const SearchBar = (colorGenerator: ColorGenerator) => ({ shortUrlsListParams, ...rest }: SearchBarProps) => { - const [{ search, tags, startDate, endDate }, toFirstPage ] = useShortUrlsQuery(rest); +const SearchBar = (colorGenerator: ColorGenerator) => (props: SearchBarProps) => { + const [{ search, tags, startDate, endDate }, toFirstPage ] = useShortUrlsQuery(props); const selectedTags = tags?.split(',') ?? []; const setDates = pipe( ({ startDate, endDate }: DateRange) => ({ diff --git a/src/short-urls/ShortUrlsList.tsx b/src/short-urls/ShortUrlsList.tsx index 1fc22f1e..b5fd5250 100644 --- a/src/short-urls/ShortUrlsList.tsx +++ b/src/short-urls/ShortUrlsList.tsx @@ -8,6 +8,7 @@ import { getServerId, SelectedServer } from '../servers/data'; import { boundToMercureHub } from '../mercure/helpers/boundToMercureHub'; import { Topics } from '../mercure/helpers/Topics'; import { TableOrderIcon } from '../utils/table/TableOrderIcon'; +import { ShlinkShortUrlsListParams } from '../api/types'; import { ShortUrlsList as ShortUrlsListState } from './reducers/shortUrlsList'; import { OrderableFields, ShortUrlsListParams, SORTABLE_FIELDS } from './reducers/shortUrlsListParams'; import { ShortUrlsTableProps } from './ShortUrlsTable'; @@ -44,7 +45,9 @@ const ShortUrlsList = (ShortUrlsTable: FC, SearchBar: FC) = const selectedTags = useMemo(() => tags?.split(',') ?? [], [ tags ]); const { pagination } = shortUrlsList?.shortUrls ?? {}; - const refreshList = (extraParams: ShortUrlsListParams) => listShortUrls({ ...shortUrlsListParams, ...extraParams }); + const refreshList = (extraParams: ShlinkShortUrlsListParams) => listShortUrls( + { ...shortUrlsListParams, ...extraParams }, + ); const handleOrderBy = (field?: OrderableFields, dir?: OrderDir) => { setOrder({ field, dir }); refreshList({ orderBy: field ? { [field]: dir } : undefined }); diff --git a/src/short-urls/reducers/shortUrlsList.ts b/src/short-urls/reducers/shortUrlsList.ts index 9fa4b2fa..72290bea 100644 --- a/src/short-urls/reducers/shortUrlsList.ts +++ b/src/short-urls/reducers/shortUrlsList.ts @@ -5,7 +5,7 @@ import { CREATE_VISITS, CreateVisitsAction } from '../../visits/reducers/visitCr import { buildReducer } from '../../utils/helpers/redux'; import { GetState } from '../../container/types'; import { ShlinkApiClientBuilder } from '../../api/services/ShlinkApiClientBuilder'; -import { ShlinkShortUrlsResponse } from '../../api/types'; +import { ShlinkShortUrlsListParams, ShlinkShortUrlsResponse } from '../../api/types'; import { DeleteShortUrlAction, SHORT_URL_DELETED } from './shortUrlDeletion'; import { ShortUrlsListParams } from './shortUrlsListParams'; import { CREATE_SHORT_URL, CreateShortUrlAction } from './shortUrlCreation'; @@ -101,7 +101,7 @@ export default buildReducer({ }, initialState); export const listShortUrls = (buildShlinkApiClient: ShlinkApiClientBuilder) => ( - params: ShortUrlsListParams = {}, + params: ShlinkShortUrlsListParams = {}, ) => async (dispatch: Dispatch, getState: GetState) => { dispatch({ type: LIST_SHORT_URLS_START }); const { listShortUrls } = buildShlinkApiClient(getState); diff --git a/src/short-urls/reducers/shortUrlsListParams.ts b/src/short-urls/reducers/shortUrlsListParams.ts index 1f16e562..c05d0ccc 100644 --- a/src/short-urls/reducers/shortUrlsListParams.ts +++ b/src/short-urls/reducers/shortUrlsListParams.ts @@ -19,10 +19,6 @@ export type OrderBy = Partial>; export interface ShortUrlsListParams { page?: string; itemsPerPage?: number; - tags?: string[]; - searchTerm?: string; - startDate?: string; - endDate?: string; orderBy?: OrderBy; } diff --git a/src/short-urls/services/provideServices.ts b/src/short-urls/services/provideServices.ts index 6f1b70dc..bd7c7daf 100644 --- a/src/short-urls/services/provideServices.ts +++ b/src/short-urls/services/provideServices.ts @@ -52,7 +52,6 @@ const provideServices = (bottle: Bottle, connect: ConnectDecorator, withRouter: // Services bottle.serviceFactory('SearchBar', SearchBar, 'ColorGenerator'); - bottle.decorator('SearchBar', connect([ 'shortUrlsListParams' ])); bottle.decorator('SearchBar', withRouter); // Actions