Merge pull request #3921 from RedisInsight/fe/feature/RI-6153-rdi-dry-run-text-changes

RI-6153 renamed and added tooltips to dry-run panel tabs

Author: vlad-dargel

redisinsight/ui/src/pages/rdi/pipeline-management/components/jobs-panel/Panel.tsx

@@ -144,17 +144,37 @@ const DryRunJobPanel = (props: Props) => {
         className={styles.tab}
         data-testid="transformations-tab"
       >
-        <span className={styles.tabName}>Transformations</span>
+        <EuiToolTip
+          content={(
+            <EuiText color="subdued" size="s">
+              Displays the results of the transformations you defined. The data is presented in JSON format.
+              <br />
+              No data is written to the target database.
+            </EuiText>
+          )}
+          data-testid="transformation-output-tooltip"
+        >
+          <span className={styles.tabName}>Transformation output</span>
+        </EuiToolTip>
       </EuiTab>
       <EuiTab
         isSelected={selectedTab === PipelineJobsTabs.Output}
         onClick={() => handleChangeTab(PipelineJobsTabs.Output)}
         className={styles.tab}
         data-testid="output-tab"
       >
-        <>
-          <span className={styles.tabName}>Output</span>
-        </>
+        <EuiToolTip
+          content={(
+            <EuiText color="subdued" size="s">
+              Displays the list of Redis commands that will be generated based on your job details.
+              <br />
+              No data is written to the target database.
+            </EuiText>
+          )}
+          data-testid="job-output-tooltip"
+        >
+          <span className={styles.tabName}>Job output</span>
+        </EuiToolTip>
       </EuiTab>
     </EuiTabs>
   ), [selectedTab, isFullScreen])
@@ -223,7 +243,6 @@ const DryRunJobPanel = (props: Props) => {
             </EuiFlexItem>
           </EuiFlexGroup>
           <div className={cx(styles.tabsWrapper, styles.codeLabel)}>
-            <EuiText>Results</EuiText>
             {isSelectAvailable && (
               <EuiSuperSelect
                 options={targetOptions}

redisinsight/ui/src/pages/rdi/pipeline-management/components/jobs-panel/styles.module.scss

@@ -59,7 +59,7 @@ $animation-duration: 300ms;
 
   .codeLabel {
     display: flex;
-    justify-content: space-between;
+    justify-content: flex-end;
     align-items: center;
     font: normal normal normal 14px/17px Graphik, sans-serif;
     height: 28px;