Merge pull request #3877 from RedisInsight/release/2.58.0

Release/2.58.0 to latest

Author: vlad-dargel

redisinsight/ui/src/pages/rdi/instance/components/header/RdiPipelineHeader.tsx

@@ -2,7 +2,7 @@ import {
   EuiFlexGroup,
   EuiFlexItem,
 } from '@elastic/eui'
-import React, { useEffect } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import { useParams } from 'react-router-dom'
 
@@ -14,6 +14,7 @@ import PipelineActions from './components/pipeline-actions'
 import styles from './styles.module.scss'
 
 const RdiPipelineHeader = () => {
+  const [headerLoading, setHeaderLoading] = useState(true)
   const { rdiInstanceId } = useParams<{ rdiInstanceId: string }>()
   const { data: statusData, error: statusError } = useSelector(rdiPipelineStatusSelector)
   const dispatch = useDispatch()
@@ -22,7 +23,7 @@ const RdiPipelineHeader = () => {
 
   useEffect(() => {
     if (!intervalId) {
-      dispatch(getPipelineStatusAction(rdiInstanceId))
+      dispatch(getPipelineStatusAction(rdiInstanceId, () => setHeaderLoading(false), () => setHeaderLoading(false)))
       intervalId = setInterval(() => {
         dispatch(getPipelineStatusAction(rdiInstanceId))
       }, 10000)
@@ -40,6 +41,7 @@ const RdiPipelineHeader = () => {
         <CurrentPipelineStatus
           pipelineState={pipelineState}
           statusError={statusError}
+          headerLoading={headerLoading}
         />
       </EuiFlexItem>
       <PipelineActions

redisinsight/ui/src/pages/rdi/instance/components/header/components/current-pipeline-status/CurrentPipelineStatus.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { EuiIcon, EuiTitle, EuiToolTip } from '@elastic/eui'
+import { EuiIcon, EuiLoadingSpinner, EuiTitle, EuiToolTip } from '@elastic/eui'
 import initialSyncIcon from 'uiSrc/assets/img/rdi/pipelineStatuses/initial_sync.svg?react'
 import streamingIcon from 'uiSrc/assets/img/rdi/pipelineStatuses/streaming.svg?react'
 import notRunningIcon from 'uiSrc/assets/img/rdi/pipelineStatuses/not_running.svg?react'
@@ -11,9 +11,10 @@ import styles from './styles.module.scss'
 export interface Props {
   pipelineState?: PipelineState
   statusError?: string
+  headerLoading: boolean
 }
 
-const CurrentPipelineStatus = ({ pipelineState, statusError }: Props) => {
+const CurrentPipelineStatus = ({ pipelineState, statusError, headerLoading }: Props) => {
   const getPipelineStateIconAndLabel = (pipelineState: Maybe<PipelineState>) => {
     switch (pipelineState) {
       case PipelineState.InitialSync:
@@ -34,17 +35,21 @@ const CurrentPipelineStatus = ({ pipelineState, statusError }: Props) => {
       <EuiTitle size="xxs">
         <h6>Pipeline State: </h6>
       </EuiTitle>
-      <EuiToolTip
-        content={errorTooltipContent}
-        anchorClassName={statusError && styles.tooltip}
-      >
-        <div className={styles.stateBadge} data-testid="pipeline-state-badge">
-          <EuiIcon
-            type={stateInfo.icon}
-          />
-          <span>{stateInfo.label}</span>
-        </div>
-      </EuiToolTip>
+      {headerLoading ? (
+        <EuiLoadingSpinner size="m" style={{ marginLeft: '8px' }} />
+      ) : (
+        <EuiToolTip
+          content={errorTooltipContent}
+          anchorClassName={statusError && styles.tooltip}
+        >
+          <div className={styles.stateBadge} data-testid="pipeline-state-badge">
+            <EuiIcon
+              type={stateInfo.icon}
+            />
+            <span>{stateInfo.label}</span>
+          </div>
+        </EuiToolTip>
+      )}
     </div>
   )
 }

redisinsight/ui/src/slices/rdi/pipeline.ts

@@ -378,6 +378,8 @@ export function deletePipelineJob(
 
 export function getPipelineStatusAction(
   rdiInstanceId: string,
+  onSuccessAction?: () => void,
+  onFailAction?: () => void,
 ) {
   return async (dispatch: AppDispatch) => {
     try {
@@ -388,11 +390,13 @@ export function getPipelineStatusAction(
 
       if (isStatusSuccessful(status)) {
         dispatch(getPipelineStatusSuccess(data))
+        onSuccessAction?.()
       }
     } catch (_err) {
       const error = _err as AxiosError
       const errorMessage = getApiErrorMessage(error)
       dispatch(getPipelineStatusFailure(errorMessage))
+      onFailAction?.()
     }
   }
 }

tests/e2e/tests/web/critical-path/url-handling/url-handling.e2e.ts

@@ -1,4 +1,5 @@
 import { commonUrl, ossStandaloneRedisGears } from '../../../../helpers/conf';
+import { ClientFunction } from 'testcafe';
 import { ExploreTabs, rte } from '../../../../helpers/constants';
 import { DatabaseAPIRequests } from '../../../../helpers/api/api-database';
 import { Common } from '../../../../helpers/common';
@@ -18,13 +19,14 @@ const { host, port, databaseName, databaseUsername = '', databasePassword = '' }
 const username = 'alice&&';
 const password = 'p1pp0@&';
 
-function generateLink(params: Record<string, any>): string {
+function generateLink(params: Record<string, any>, connectType: string, url: string ): string {
     const params1 = Common.generateUrlTParams(params);
-    const from = encodeURIComponent(`${redisConnect}?${params1}`);
-    return (new URL(`?from=${from}`, commonUrl)).toString();
+    const from = encodeURIComponent(`${connectType}?${params1}`);
+    return (new URL(`?from=${from}`, url)).toString();
 }
 
 const redisConnect = 'redisinsight://databases/connect';
+const redisOpen = 'redisinsight://open';
 
 fixture `Add DB from SM`
     .meta({ type: 'critical_path', rte: rte.none })
@@ -42,7 +44,7 @@ test
             databaseAlias: databaseName,
             redirect: 'workbench'
         };
-        await t.navigateTo(generateLink(connectUrlParams));
+        await t.navigateTo(generateLink(connectUrlParams, redisConnect,commonUrl));
         await t.expect(myRedisDatabasePage.AddRedisDatabase.disabledDatabaseInfo.nth(0).getAttribute('title')).contains(host, 'Wrong host value');
         await t.expect(myRedisDatabasePage.AddRedisDatabase.disabledDatabaseInfo.nth(1).getAttribute('title')).contains(port, 'Wrong port value');
         await t.wait(5_000);
@@ -76,25 +78,36 @@ test
             subscriptionType: 'fixed',
             planMemoryLimit: '30',
             memoryLimitMeasurementUnit: 'mb',
-            free: 'true',
-            onboarding: 'true'
+            free: 'true'
         };
 
-        await t.navigateTo(generateLink(connectUrlParams));
+        const connectUrlParams2 = {
+            redirect: '/_',
+            onboarding: 'true',
+            copilot: 'false'
+        };
+
+        await t.navigateTo(generateLink(connectUrlParams, redisConnect,commonUrl));
         await t.wait(10_000);
         await t.expect(workbenchPage.submitCommandButton.exists).ok('Redirection to Workbench is not correct');
         const tab = await workbenchPage.InsightsPanel.setActiveTab(ExploreTabs.Tutorials);
         await t.expect(tab.preselectArea.textContent).contains('INTRODUCTION', 'the tutorial page is incorrect');
         await t.expect(tab.preselectArea.textContent).contains('JSON', 'the tutorial is incorrect');
 
-        //Verify that the same db is not added
-        await t.navigateTo(generateLink(connectUrlParams));
+        const getPageUrl = ClientFunction(() => window.location.href);
+        const url = await getPageUrl();
+
+        await t.navigateTo(generateLink(connectUrlParams2, redisOpen, url));
         await t.wait(10_000);
+        await t.expect(workbenchPage.submitCommandButton.exists).ok('Redirection to the same page is not correct');
         await t.click(workbenchPage.NavigationPanel.browserButton);
         await t.expect(onboardingCardsDialog.showMeAroundButton.exists).ok('onboarding is nor reset');
         await t.click(onboardingCardsDialog.skipTourButton);
+
+        //Verify that the same db is not added
+        await t.navigateTo(generateLink(connectUrlParams, redisConnect,commonUrl));
+        await t.wait(10_000);
         await t.click(workbenchPage.NavigationPanel.myRedisDBButton);
         await t.expect(browserPage.notification.exists).notOk({ timeout: 10000 });
         await t.expect(myRedisDatabasePage.dbNameList.child('span').withExactText(databaseName).count).eql(2, 'the same db is added twice');
-
     });