Switched to the <field>-<dir> notation in orderBy param for short URLs list

CHANGELOG.md

@@ -10,6 +10,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### Changed
 * [#534](https://github.com/shlinkio/shlink-web-client/pull/534) Updated axios.
+* [#538](https://github.com/shlinkio/shlink-web-client/pull/538) Switched to the `<field>-<dir>` notation in `orderBy` param for short URLs list, in preparation for Shlink v3.0.0
 
 ### Deprecated
 * *Nothing*

src/api/services/ShlinkApiClient.ts

@@ -16,11 +16,26 @@ import {
   ShlinkEditDomainRedirects,
   ShlinkDomainRedirects,
   ShlinkShortUrlsListParams,
+  ShlinkShortUrlsListNormalizedParams,
 } from '../types';
 import { stringifyQuery } from '../../utils/helpers/query';
 
 const buildShlinkBaseUrl = (url: string, apiVersion: number) => url ? `${url}/rest/v${apiVersion}` : '';
 const rejectNilProps = reject(isNil);
+const normalizeOrderByInParams = (params: ShlinkShortUrlsListParams): ShlinkShortUrlsListNormalizedParams => {
+  if (!params.orderBy) {
+    return params as ShlinkShortUrlsListNormalizedParams;
+  }
+
+  const { orderBy, ...rest } = params;
+  const [ firstKey ] = Object.keys(orderBy);
+  const [ firstValue ] = Object.values(orderBy);
+
+  return !firstValue ? rest : {
+    ...rest,
+    orderBy: `${firstKey}-${firstValue}`,
+  };
+};
 
 export default class ShlinkApiClient {
   private apiVersion: number;
@@ -34,7 +49,7 @@ export default class ShlinkApiClient {
   }
 
   public readonly listShortUrls = async (params: ShlinkShortUrlsListParams = {}): Promise<ShlinkShortUrlsResponse> =>
-    this.performRequest<{ shortUrls: ShlinkShortUrlsResponse }>('/short-urls', 'GET', params)
+    this.performRequest<{ shortUrls: ShlinkShortUrlsResponse }>('/short-urls', 'GET', normalizeOrderByInParams(params))
       .then(({ data }) => data.shortUrls);
 
   public readonly createShortUrl = async (options: ShortUrlData): Promise<ShortUrl> => {

src/api/types/index.ts

@@ -97,6 +97,10 @@ export interface ShlinkShortUrlsListParams {
   orderBy?: OrderBy;
 }
 
+export interface ShlinkShortUrlsListNormalizedParams extends Omit<ShlinkShortUrlsListParams, 'orderBy'> {
+  orderBy?: string;
+}
+
 export interface ProblemDetailsError {
   type: string;
   detail: string;

test/api/services/ShlinkApiClient.test.ts

@@ -5,6 +5,7 @@ import { OptionalString } from '../../../src/utils/utils';
 import { ShlinkDomain, ShlinkVisitsOverview } from '../../../src/api/types';
 import { ShortUrl } from '../../../src/short-urls/data';
 import { Visit } from '../../../src/visits/types';
+import { OrderDir } from '../../../src/utils/helpers/ordering';
 
 describe('ShlinkApiClient', () => {
   const createAxios = (data: AxiosRequestConfig) => (async () => Promise.resolve(data)) as unknown as AxiosInstance;
@@ -17,9 +18,9 @@ describe('ShlinkApiClient', () => {
   ];
 
   describe('listShortUrls', () => {
-    it('properly returns short URLs list', async () => {
     const expectedList = [ 'foo', 'bar' ];
 
+    it('properly returns short URLs list', async () => {
       const { listShortUrls } = createApiClient({
         data: {
           shortUrls: expectedList,
@@ -30,6 +31,23 @@ describe('ShlinkApiClient', () => {
 
       expect(expectedList).toEqual(actualList);
     });
+
+    it.each([
+      [{ visits: 'DESC' as OrderDir }, 'visits-DESC' ],
+      [{ longUrl: 'ASC' as OrderDir }, 'longUrl-ASC' ],
+      [{ longUrl: undefined as OrderDir }, undefined ],
+    ])('parses orderBy in params', async (orderBy, expectedOrderBy) => {
+      const axiosSpy = createAxiosMock({
+        data: expectedList,
+      });
+      const { listShortUrls } = new ShlinkApiClient(axiosSpy, '', '');
+
+      await listShortUrls({ orderBy });
+
+      expect(axiosSpy).toHaveBeenCalledWith(expect.objectContaining({
+        params: { orderBy: expectedOrderBy },
+      }));
+    });
   });
 
   describe('createShortUrl', () => {