diff --git a/redisinsight/ui/src/constants/durationUnits.tsx b/redisinsight/ui/src/constants/durationUnits.tsx index 92853bc053..29522deadb 100644 --- a/redisinsight/ui/src/constants/durationUnits.tsx +++ b/redisinsight/ui/src/constants/durationUnits.tsx @@ -3,6 +3,7 @@ import { EuiSuperSelectOption } from '@elastic/eui' export enum DurationUnits { microSeconds = 'µs', milliSeconds = 'ms', + mSeconds = 'msec', } export const DURATION_UNITS: EuiSuperSelectOption[] = [ diff --git a/redisinsight/ui/src/mocks/data/oauth.ts b/redisinsight/ui/src/mocks/data/oauth.ts new file mode 100644 index 0000000000..a86b1eadcf --- /dev/null +++ b/redisinsight/ui/src/mocks/data/oauth.ts @@ -0,0 +1,9 @@ +export const OAUTH_CLOUD_CAPI_KEYS_DATA = [ + { + id: '1', + name: 'RedisInsight-f4868252-a128-4a02-af75-bd3c99898267-2020-11-01T-123', + createdAt: '2023-08-02T09:07:41.680Z', + lastUsed: '2023-08-02T09:07:41.680Z', + valid: true, + } +] diff --git a/redisinsight/ui/src/mocks/handlers/index.ts b/redisinsight/ui/src/mocks/handlers/index.ts index d4321d2112..4fbf6d0bb8 100644 --- a/redisinsight/ui/src/mocks/handlers/index.ts +++ b/redisinsight/ui/src/mocks/handlers/index.ts @@ -6,6 +6,7 @@ import analytics from './analytics' import browser from './browser' import recommendations from './recommendations' import triggeredFunctions from './triggeredFunctions' +import cloud from './oauth' // @ts-ignore export const handlers: RestHandler[] = [].concat( @@ -16,4 +17,5 @@ export const handlers: RestHandler[] = [].concat( browser, recommendations, triggeredFunctions, + cloud, ) diff --git a/redisinsight/ui/src/mocks/handlers/oauth/cloud.ts b/redisinsight/ui/src/mocks/handlers/oauth/cloud.ts new file mode 100644 index 0000000000..d7ed475833 --- /dev/null +++ b/redisinsight/ui/src/mocks/handlers/oauth/cloud.ts @@ -0,0 +1,17 @@ +import { rest, RestHandler } from 'msw' +import { getMswURL } from 'uiSrc/utils/test-utils' +import { ApiEndpoints } from 'uiSrc/constants' +import { OAUTH_CLOUD_CAPI_KEYS_DATA } from 'uiSrc/mocks/data/oauth' + +const handlers: RestHandler[] = [ + // fetch cloud capi keys + rest.get( + getMswURL(ApiEndpoints.CLOUD_CAPI_KEYS), + async (_req, res, ctx) => res( + ctx.status(200), + ctx.json(OAUTH_CLOUD_CAPI_KEYS_DATA), + ) + ), +] + +export default handlers diff --git a/redisinsight/ui/src/mocks/handlers/oauth/index.ts b/redisinsight/ui/src/mocks/handlers/oauth/index.ts new file mode 100644 index 0000000000..5f7f4b401f --- /dev/null +++ b/redisinsight/ui/src/mocks/handlers/oauth/index.ts @@ -0,0 +1,6 @@ +import { DefaultBodyType, MockedRequest, RestHandler } from 'msw' + +import cloud from './cloud' + +const handlers: RestHandler>[] = [].concat(cloud) +export default handlers diff --git a/redisinsight/ui/src/pages/settings/components/cloud-settings/CloudSettings.spec.tsx b/redisinsight/ui/src/pages/settings/components/cloud-settings/CloudSettings.spec.tsx index 697f95291d..a65a930653 100644 --- a/redisinsight/ui/src/pages/settings/components/cloud-settings/CloudSettings.spec.tsx +++ b/redisinsight/ui/src/pages/settings/components/cloud-settings/CloudSettings.spec.tsx @@ -2,9 +2,10 @@ import React from 'react' import { cloneDeep } from 'lodash' import { act, cleanup, fireEvent, mockedStore, render, screen, waitForEuiPopoverVisible } from 'uiSrc/utils/test-utils' -import { getCapiKeys, oauthCapiKeysSelector, removeAllCapiKeys } from 'uiSrc/slices/oauth/cloud' +import { getCapiKeys, getCapiKeysSuccess, oauthCapiKeysSelector, removeAllCapiKeys } from 'uiSrc/slices/oauth/cloud' import { apiService } from 'uiSrc/services' import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry' +import { OAUTH_CLOUD_CAPI_KEYS_DATA } from 'uiSrc/mocks/data/oauth' import CloudSettings from './CloudSettings' @@ -29,6 +30,22 @@ jest.mock('uiSrc/telemetry', () => ({ })) describe('CloudSettings', () => { + it('should show delete popover and call proper action on delete', async () => { + (oauthCapiKeysSelector as jest.Mock).mockReturnValue({ + data: OAUTH_CLOUD_CAPI_KEYS_DATA, + loading: false + }) + render() + + fireEvent.click(screen.getByTestId('delete-key-btn')) + await waitForEuiPopoverVisible() + + fireEvent.click(screen.getByTestId('delete-key-confirm-btn')) + + expect(store.getActions()) + .toEqual([getCapiKeys(), getCapiKeysSuccess(OAUTH_CLOUD_CAPI_KEYS_DATA), removeAllCapiKeys()]) + }) + it('should render', () => { expect(render()).toBeTruthy() }) @@ -40,32 +57,14 @@ describe('CloudSettings', () => { }) it('should be disabled delete all button', () => { - render() - - expect(screen.getByTestId('delete-key-btn')).toBeDisabled() - }) - - it('should show delete popover and call proper action on delete', async () => { (oauthCapiKeysSelector as jest.Mock).mockReturnValue({ - data: [ - { - id: '1', - name: 'RedisInsight-f4868252-a128-4a02-af75-bd3c99898267-2020-11-01T-123', - createdAt: '2023-08-02T09:07:41.680Z', - lastUsed: '2023-08-02T09:07:41.680Z', - valid: true, - } - ], + data: [], loading: false }) - render() - fireEvent.click(screen.getByTestId('delete-key-btn')) - await waitForEuiPopoverVisible() - - fireEvent.click(screen.getByTestId('delete-key-confirm-btn')) + render() - expect(store.getActions()).toEqual([getCapiKeys(), removeAllCapiKeys()]) + expect(screen.getByTestId('delete-key-btn')).toBeDisabled() }) it('should call proper telemetry events', async () => { @@ -74,15 +73,7 @@ describe('CloudSettings', () => { sendEventTelemetry.mockImplementation(() => sendEventTelemetryMock); (oauthCapiKeysSelector as jest.Mock).mockReturnValue({ - data: [ - { - id: '1', - name: 'RedisInsight-f4868252-a128-4a02-af75-bd3c99898267-2020-11-01T-123', - createdAt: '2023-08-02T09:07:41.680Z', - lastUsed: '2023-08-02T09:07:41.680Z', - valid: true, - } - ], + data: OAUTH_CLOUD_CAPI_KEYS_DATA, loading: false }) render() diff --git a/redisinsight/ui/src/pages/slowLog/SlowLogPage.tsx b/redisinsight/ui/src/pages/slowLog/SlowLogPage.tsx index 20edd3f27c..4c6a52e065 100644 --- a/redisinsight/ui/src/pages/slowLog/SlowLogPage.tsx +++ b/redisinsight/ui/src/pages/slowLog/SlowLogPage.tsx @@ -12,7 +12,7 @@ import { useDispatch, useSelector } from 'react-redux' import { useParams } from 'react-router-dom' import { AutoSizer } from 'react-virtualized' -import { DEFAULT_SLOWLOG_MAX_LEN } from 'uiSrc/constants' +import { DEFAULT_SLOWLOG_MAX_LEN, DurationUnits } from 'uiSrc/constants' import { DATE_FORMAT } from 'uiSrc/pages/slowLog/components/SlowLogTable/SlowLogTable' import { convertNumberByUnits } from 'uiSrc/pages/slowLog/utils' import { appContextDbConfig } from 'uiSrc/slices/app/context' @@ -140,7 +140,7 @@ const SlowLogPage = () => { Execution time: {numberWithSpaces(convertNumberByUnits(slowlogLogSlowerThan, durationUnit))}   - {durationUnit}, + {durationUnit === DurationUnits.milliSeconds ? DurationUnits.mSeconds : DurationUnits.microSeconds}, Max length: {numberWithSpaces(slowlogMaxLen)} )} diff --git a/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx b/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx index 05420e1d69..12294ac592 100644 --- a/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx +++ b/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx @@ -129,16 +129,16 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => { const unitConverter = () => { if (Number.isNaN(toNumber(slowerThan))) { - return `- ${DurationUnits.milliSeconds}` + return `- ${DurationUnits.mSeconds}` } if (slowerThan === `${MINUS_ONE}`) { - return `-1 ${DurationUnits.milliSeconds}` + return `-1 ${DurationUnits.mSeconds}` } if (durationUnit === DurationUnits.microSeconds) { const value = numberWithSpaces(convertNumberByUnits(toNumber(slowerThan), DurationUnits.milliSeconds)) - return `${value} ${DurationUnits.milliSeconds}` + return `${value} ${DurationUnits.mSeconds}` } if (durationUnit === DurationUnits.milliSeconds) {