#RI-5577 - remove highlighting

Author: rsergeenko

redisinsight/ui/src/components/insights-trigger/InsightsTrigger.spec.tsx

@@ -8,7 +8,6 @@ import { recommendationsSelector, resetRecommendationsHighlighting } from 'uiSrc
 import { InsightsPanelTabs } from 'uiSrc/slices/interfaces/insights'
 import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
 import { Pages } from 'uiSrc/constants'
-import { removeFeatureFromHighlighting } from 'uiSrc/slices/app/features'
 import InsightsTrigger from './InsightsTrigger'
 
 let store: typeof mockedStore
@@ -50,7 +49,7 @@ describe('InsightsTrigger', () => {
 
     fireEvent.click(screen.getByTestId('insights-trigger'))
 
-    expect(store.getActions()).toEqual([toggleInsightsPanel(), removeFeatureFromHighlighting('insights')])
+    expect(store.getActions()).toEqual([toggleInsightsPanel()])
   })
 
   it('should call proper actions after click on the button when there are any recommendations', () => {
@@ -65,7 +64,6 @@ describe('InsightsTrigger', () => {
       resetRecommendationsHighlighting(),
       changeSelectedTab(InsightsPanelTabs.Recommendations),
       toggleInsightsPanel(),
-      removeFeatureFromHighlighting('insights')
     ])
   })
 

redisinsight/ui/src/components/insights-trigger/InsightsTrigger.tsx

@@ -12,10 +12,6 @@ import { recommendationsSelector, resetRecommendationsHighlighting } from 'uiSrc
 import { InsightsPanelTabs } from 'uiSrc/slices/interfaces/insights'
 import { sendEventTelemetry, TELEMETRY_EMPTY_VALUE, TelemetryEvent } from 'uiSrc/telemetry'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances/instances'
-import HighlightedFeature from 'uiSrc/components/hightlighted-feature/HighlightedFeature'
-import { BUILD_FEATURES } from 'uiSrc/constants/featuresHighlighting'
-import { appFeatureHighlightingSelector, removeFeatureFromHighlighting } from 'uiSrc/slices/app/features'
-import { getHighlightingFeatures } from 'uiSrc/utils/highlighting'
 
 import styles from './styles.module.scss'
 
@@ -29,9 +25,6 @@ const InsightsTrigger = (props: Props) => {
   const { isHighlighted, } = useSelector(recommendationsSelector)
   const { provider } = useSelector(connectedInstanceSelector)
 
-  const { features } = useSelector(appFeatureHighlightingSelector)
-  const { insights: insightsHighlighting } = getHighlightingFeatures(features)
-
   const dispatch = useDispatch()
   const { pathname, search } = useLocation()
   const { instanceId } = useParams<{ instanceId: string }>()
@@ -67,45 +60,37 @@ const InsightsTrigger = (props: Props) => {
         tab: isHighlighted ? InsightsPanelTabs.Recommendations : tabSelected,
       },
     })
-
-    dispatch(removeFeatureFromHighlighting('insights'))
   }
 
   return (
     <div
       className={cx(styles.container, { [styles.isOpen]: isInsightsOpen })}
     >
-      <HighlightedFeature
-        isHighlight={insightsHighlighting && !isHighlighted}
-        hideFirstChild={!isHighlighted}
-        {...(BUILD_FEATURES.insights || {})}
+      <EuiToolTip
+        title={isHighlighted && instanceId ? undefined : 'Insights'}
+        content={isHighlighted && instanceId
+          ? 'New tips are available'
+          : 'Open interactive tutorials to learn more about Redis or Redis Stack capabilities, or use tips to improve your database.'}
       >
-        <EuiToolTip
-          title={isHighlighted && instanceId ? undefined : 'Insights'}
-          content={isHighlighted && instanceId
-            ? 'New tips are available'
-            : 'Open interactive tutorials to learn more about Redis or Redis Stack capabilities, or use tips to improve your database.'}
+        <EuiButton
+          fill
+          size="s"
+          color="secondary"
+          className={styles.btn}
+          role="button"
+          iconType={TriggerIcon}
+          onClick={handleClickTrigger}
+          data-testid="insights-trigger"
         >
-          <EuiButton
-            fill
-            size="s"
-            color="secondary"
-            className={styles.btn}
-            role="button"
-            iconType={TriggerIcon}
-            onClick={handleClickTrigger}
-            data-testid="insights-trigger"
+          <EuiText className={cx(
+            styles.triggerText,
+          )}
           >
-            <EuiText className={cx(
-              styles.triggerText,
-            )}
-            >
-              Insights
-            </EuiText>
-            {(isHighlighted && instanceId) && (<span className={styles.highlighting} />)}
-          </EuiButton>
-        </EuiToolTip>
-      </HighlightedFeature>
+            Insights
+          </EuiText>
+          {(isHighlighted && instanceId) && (<span className={styles.highlighting} />)}
+        </EuiButton>
+      </EuiToolTip>
     </div>
   )
 }

redisinsight/ui/src/constants/featuresHighlighting.tsx

@@ -12,9 +12,5 @@ interface BuildHighlightingFeature {
 }
 
 export const BUILD_FEATURES: Record<string, BuildHighlightingFeature> = {
-  insights: {
-    type: 'tooltip',
-    title: 'Try Redis Tutorials',
-    content: 'Try our interactive Tutorials to learn how Redis can solve your use cases.',
-  }
+
 } as const