From 1ce7080348b44e419113ce72cfba107c21626f11 Mon Sep 17 00:00:00 2001 From: olehp Date: Thu, 14 Mar 2024 14:25:03 +0200 Subject: [PATCH 1/8] Add new bubble for recalculate --- .../InsightCard/InsightHeader/index.tsx | 9 +++ .../InsightCard/InsightHeader/styles.ts | 12 +++- .../common/InsightCard/InsightHeader/types.ts | 1 + .../ProductionAffectionBar/styles.ts | 2 +- .../RecalculateBar/RecalculateBar.stories.tsx | 20 ++++++ .../InsightCard/RecalculateBar/index.tsx | 14 ++++ .../InsightCard/RecalculateBar/styles.ts | 37 ++++++++++ .../Insights/common/InsightCard/index.tsx | 70 +++++-------------- src/components/common/App/typographies.ts | 6 ++ .../icons/16px/RecalculateStartedIcon.tsx | 26 +++++++ 10 files changed, 143 insertions(+), 54 deletions(-) create mode 100644 src/components/Insights/common/InsightCard/RecalculateBar/RecalculateBar.stories.tsx create mode 100644 src/components/Insights/common/InsightCard/RecalculateBar/index.tsx create mode 100644 src/components/Insights/common/InsightCard/RecalculateBar/styles.ts create mode 100644 src/components/common/icons/16px/RecalculateStartedIcon.tsx diff --git a/src/components/Insights/common/InsightCard/InsightHeader/index.tsx b/src/components/Insights/common/InsightCard/InsightHeader/index.tsx index 39dbf884b..45a74a4da 100644 --- a/src/components/Insights/common/InsightCard/InsightHeader/index.tsx +++ b/src/components/Insights/common/InsightCard/InsightHeader/index.tsx @@ -1,4 +1,5 @@ import { useContext } from "react"; +import { formatTimeDistance } from "../../../../../utils/formatTimeDistance"; import { InsightTypeInfo, getInsightTypeInfo @@ -74,6 +75,14 @@ export const InsightHeader = (props: InsightHeaderProps) => { )} + {props.latUpdateTimer && ( + + Updated: + + {formatTimeDistance(props.latUpdateTimer)} + + + )} {props.isAsync && } diff --git a/src/components/Insights/common/InsightCard/InsightHeader/styles.ts b/src/components/Insights/common/InsightCard/InsightHeader/styles.ts index d29632416..d62823ff6 100644 --- a/src/components/Insights/common/InsightCard/InsightHeader/styles.ts +++ b/src/components/Insights/common/InsightCard/InsightHeader/styles.ts @@ -1,5 +1,8 @@ import styled from "styled-components"; -import { bodySemiboldTypography } from "../../../../common/App/typographies"; +import { + bodySemiboldTypography, + footnoteRegularTypography +} from "../../../../common/App/typographies"; export const Container = styled.div` display: flex; @@ -41,3 +44,10 @@ export const BadgeContainer = styled.div` gap: 8px; height: 24px; `; + +export const Description = styled.div` + ${footnoteRegularTypography} + gap:4px; + display: flex; + color: ${({ theme }) => theme.colors.v3.text.secondary}; +`; diff --git a/src/components/Insights/common/InsightCard/InsightHeader/types.ts b/src/components/Insights/common/InsightCard/InsightHeader/types.ts index 537e2d317..0fed5ad20 100644 --- a/src/components/Insights/common/InsightCard/InsightHeader/types.ts +++ b/src/components/Insights/common/InsightCard/InsightHeader/types.ts @@ -11,4 +11,5 @@ export interface InsightHeaderProps { spanInfo?: SpanInfo | null; onSpanLinkClick: (spanCodeObjectId: string) => void; status?: InsightStatus; + latUpdateTimer?: string | null; } diff --git a/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts b/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts index 749f192fc..4448c5647 100644 --- a/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts +++ b/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts @@ -13,7 +13,7 @@ export const Container = styled.div` : theme.colors.v3.pieChart.darkRed}; display: flex; align-items: center; - padding: 6px 8px; + padding: 4px 8px; gap: 4px; `; diff --git a/src/components/Insights/common/InsightCard/RecalculateBar/RecalculateBar.stories.tsx b/src/components/Insights/common/InsightCard/RecalculateBar/RecalculateBar.stories.tsx new file mode 100644 index 000000000..d05b62ae7 --- /dev/null +++ b/src/components/Insights/common/InsightCard/RecalculateBar/RecalculateBar.stories.tsx @@ -0,0 +1,20 @@ +import { Meta, StoryObj } from "@storybook/react"; +import { RecalculateBar } from "."; + +// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction +const meta: Meta = { + title: "Insights/common/InsightCard/RecalculateBar", + component: RecalculateBar, + parameters: { + // More on how to position stories at: https://storybook.js.org/docs/react/configure/story-layout + layout: "fullscreen" + } +}; + +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + args: {} +}; diff --git a/src/components/Insights/common/InsightCard/RecalculateBar/index.tsx b/src/components/Insights/common/InsightCard/RecalculateBar/index.tsx new file mode 100644 index 000000000..e8142eefb --- /dev/null +++ b/src/components/Insights/common/InsightCard/RecalculateBar/index.tsx @@ -0,0 +1,14 @@ +import { RecalculateStartedIcon } from "../../../../common/icons/16px/RecalculateStartedIcon"; +import * as s from "./styles"; + +export const RecalculateBar = () => { + return ( + + + + + Rechecking insight + Check here for updates + + ); +}; diff --git a/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts b/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts new file mode 100644 index 000000000..c4a4ebec6 --- /dev/null +++ b/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts @@ -0,0 +1,37 @@ +import styled from "styled-components"; +import { + caption1RegularTypography, + footnoteBoldTypography +} from "../../../../common/App/typographies"; + +export const Container = styled.div` + ${footnoteBoldTypography} + + border-radius: 4px; + border: 1px solid ${({ theme }) => theme.colors.v3.status.low}; + background: ${({ theme }) => theme.colors.v3.status.backgroundLow}; + display: flex; + align-items: center; + padding: 4px 8px; + gap: 4px; +`; + +export const IconContainer = styled.div` + color: ${({ theme }) => theme.colors.v3.status.low}; + display: flex; +`; + +export const Title = styled.span` + color: ${({ theme }) => theme.colors.v3.text.primary}; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; +`; + +export const TicketStatus = styled.div` + color: ${({ theme }) => theme.colors.v3.text.secondary}; +`; + +export const Info = styled.span` + ${caption1RegularTypography} +`; diff --git a/src/components/Insights/common/InsightCard/index.tsx b/src/components/Insights/common/InsightCard/index.tsx index b3aef582d..120f40ca7 100644 --- a/src/components/Insights/common/InsightCard/index.tsx +++ b/src/components/Insights/common/InsightCard/index.tsx @@ -1,6 +1,5 @@ import React, { useEffect, useState } from "react"; import { isString } from "../../../../typeGuards/isString"; -import { formatTimeDistance } from "../../../../utils/formatTimeDistance"; import { TraceIcon } from "../../../common/icons/12px/TraceIcon"; import { HistogramIcon } from "../../../common/icons/16px/HistogramIcon"; import { LiveIcon } from "../../../common/icons/16px/LiveIcon"; @@ -10,7 +9,6 @@ import { CrossIcon } from "../../../common/icons/CrossIcon"; import { Button } from "../../../common/v3/Button"; import { BaseButtonProps } from "../../../common/v3/Button/types"; import { JiraButton } from "../../../common/v3/JiraButton"; -import { Link } from "../../../common/v3/Link"; import { Tooltip } from "../../../common/v3/Tooltip"; import { isEndpointInsight, isSpanInsight } from "../../typeGuards"; import { InsightHeader } from "./InsightHeader"; @@ -22,6 +20,7 @@ import { sendTrackingEvent } from "../../../../utils/sendTrackingEvent"; import { Spinner } from "../../../Navigation/CodeButtonMenu/Spinner"; import { trackingEvents } from "../../tracking"; import { ProductionAffectionBar } from "./ProductionAffectionBar"; +import { RecalculateBar } from "./RecalculateBar"; import { useDismissalHandler } from "./useDismissalHandler"; const IS_NEW_TIME_LIMIT = 1000 * 60 * 10; // in milliseconds @@ -74,50 +73,6 @@ export const InsightCard = (props: InsightCardProps) => { } }; - const renderRecalculationBlock = ( - actualStartTime: string, - customStartTime: string | null, - isRecalculatingStarted: boolean - ) => { - if (!props.insight.customStartTime && !isRecalculatingStarted) { - return; - } - - if ( - isRecalculatingStarted || - (customStartTime && customStartTime > actualStartTime) - ) { - return ( - - - Applying the new time filter. Wait a few minutes and then refresh. - - - Refresh - - - ); - } - - const areStartTimesEqual = - customStartTime && - new Date(actualStartTime).valueOf() - - new Date(customStartTime).valueOf() === - 0; - - if (areStartTimesEqual) { - const title = new Date(actualStartTime).toString(); - return ( - - Data from:{" "} - - {formatTimeDistance(actualStartTime)} - - - ); - } - }; - const handleDismissClick = () => { sendTrackingEvent(trackingEvents.INSIGHT_CARD_DISMISS_BUTTON_CLICKED, { insightType: props.insight.type @@ -257,6 +212,17 @@ export const InsightCard = (props: InsightCardProps) => { ); }; + const hideRecalculateStatus = + (!props.insight.customStartTime && !isRecalculatingStarted) || + !props.insight.actualStartTime; + + const areStartTimesEqual = + props.insight.customStartTime && + props.insight.actualStartTime && + new Date(props.insight.actualStartTime).valueOf() - + new Date(props.insight.customStartTime).valueOf() === + 0; + const isNew = isString(props.insight.firstDetected) ? Date.now() - new Date(props.insight.firstDetected).valueOf() < IS_NEW_TIME_LIMIT @@ -278,6 +244,11 @@ export const InsightCard = (props: InsightCardProps) => { importance={props.insight.importance} criticality={props.insight.criticality} onSpanLinkClick={handleSpanLinkClick} + latUpdateTimer={ + areStartTimesEqual && !hideRecalculateStatus + ? props.insight.actualStartTime + : null + } /> } content={ @@ -288,12 +259,7 @@ export const InsightCard = (props: InsightCardProps) => { onCreateTicket={handleCreateTicketLinkClick} /> )} - {props.insight.actualStartTime && - renderRecalculationBlock( - props.insight.actualStartTime, - props.insight.customStartTime, - isRecalculatingStarted - )} + {!hideRecalculateStatus && !areStartTimesEqual && } {props.content} } diff --git a/src/components/common/App/typographies.ts b/src/components/common/App/typographies.ts index e6f1850e8..bf71ff7d0 100644 --- a/src/components/common/App/typographies.ts +++ b/src/components/common/App/typographies.ts @@ -100,3 +100,9 @@ export const bodySemiboldTypography = css` font-weight: ${typographies.body.fontWeight.medium}; line-height: ${typographies.body.lineHeight}px; `; + +export const footnoteBoldTypography = css` + font-size: ${typographies.footNote.fontSize}px; + font-weight: ${typographies.footNote.fontWeight.bold}; + line-height: ${typographies.footNote.lineHeight}px; +`; diff --git a/src/components/common/icons/16px/RecalculateStartedIcon.tsx b/src/components/common/icons/16px/RecalculateStartedIcon.tsx new file mode 100644 index 000000000..4e4fb1029 --- /dev/null +++ b/src/components/common/icons/16px/RecalculateStartedIcon.tsx @@ -0,0 +1,26 @@ +import React from "react"; +import { useIconProps } from "../hooks"; +import { IconProps } from "../types"; + +const RecalculateStartedIconComponent = (props: IconProps) => { + const { size, color } = useIconProps(props); + + return ( + + + + + + + ); +}; + +export const RecalculateStartedIcon = React.memo( + RecalculateStartedIconComponent +); From 0c1d04461ec006efaa91dde05db234298f40c59e Mon Sep 17 00:00:00 2001 From: olehp Date: Thu, 14 Mar 2024 17:48:29 +0200 Subject: [PATCH 2/8] Added new flow for handling evaluation --- .../InsightCard/InsightCard.stories.tsx | 25 ++++++++ .../ProductionAffectionBar/styles.ts | 2 +- .../InsightCard/RecalculateBar/styles.ts | 2 +- .../Insights/common/InsightCard/index.tsx | 64 ++++++++++++------- src/components/common/App/ConfigContext.ts | 6 +- .../icons/16px/RecalculateStartedIcon.tsx | 15 +++-- src/featureFlags.ts | 3 +- src/types.ts | 3 +- 8 files changed, 87 insertions(+), 33 deletions(-) diff --git a/src/components/Insights/common/InsightCard/InsightCard.stories.tsx b/src/components/Insights/common/InsightCard/InsightCard.stories.tsx index 9483ed449..20ff494b9 100644 --- a/src/components/Insights/common/InsightCard/InsightCard.stories.tsx +++ b/src/components/Insights/common/InsightCard/InsightCard.stories.tsx @@ -1,5 +1,7 @@ import { Meta, StoryObj } from "@storybook/react"; import { InsightCard } from "."; +import { ConfigContext, InitialData } from "../../../common/App/ConfigContext"; +import { DeploymentType } from "../../../common/App/types"; import { mockedEndpointNPlusOneInsight } from "../../EndpointNPlusOneInsight/mockData"; // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction @@ -69,3 +71,26 @@ export const Dismissed: Story = { onOpenHistogram: undefined } }; + +export const WithNewVersion: Story = { + decorators: [ + (Story) => ( + + {/* 👇 Decorators in Storybook also accept a function. Replace with Story() to enable it */} + + + ) + ], + args: { + isAsync: true, + insight: { ...mockedEndpointNPlusOneInsight, criticality: 0.9 } + } +}; diff --git a/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts b/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts index 4448c5647..749f192fc 100644 --- a/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts +++ b/src/components/Insights/common/InsightCard/ProductionAffectionBar/styles.ts @@ -13,7 +13,7 @@ export const Container = styled.div` : theme.colors.v3.pieChart.darkRed}; display: flex; align-items: center; - padding: 4px 8px; + padding: 6px 8px; gap: 4px; `; diff --git a/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts b/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts index c4a4ebec6..f93a177f4 100644 --- a/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts +++ b/src/components/Insights/common/InsightCard/RecalculateBar/styles.ts @@ -12,7 +12,7 @@ export const Container = styled.div` background: ${({ theme }) => theme.colors.v3.status.backgroundLow}; display: flex; align-items: center; - padding: 4px 8px; + padding: 6px 8px; gap: 4px; `; diff --git a/src/components/Insights/common/InsightCard/index.tsx b/src/components/Insights/common/InsightCard/index.tsx index 120f40ca7..c1746085d 100644 --- a/src/components/Insights/common/InsightCard/index.tsx +++ b/src/components/Insights/common/InsightCard/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { useContext, useEffect, useState } from "react"; import { isString } from "../../../../typeGuards/isString"; import { TraceIcon } from "../../../common/icons/12px/TraceIcon"; import { HistogramIcon } from "../../../common/icons/16px/HistogramIcon"; @@ -15,10 +15,14 @@ import { InsightHeader } from "./InsightHeader"; import * as s from "./styles"; import { InsightCardProps } from "./types"; +import { getFeatureFlagValue } from "../../../../featureFlags"; import { usePrevious } from "../../../../hooks/usePrevious"; +import { FeatureFlag } from "../../../../types"; import { sendTrackingEvent } from "../../../../utils/sendTrackingEvent"; import { Spinner } from "../../../Navigation/CodeButtonMenu/Spinner"; +import { ConfigContext } from "../../../common/App/ConfigContext"; import { trackingEvents } from "../../tracking"; +import { InsightStatus } from "../../types"; import { ProductionAffectionBar } from "./ProductionAffectionBar"; import { RecalculateBar } from "./RecalculateBar"; import { useDismissalHandler } from "./useDismissalHandler"; @@ -32,24 +36,27 @@ export const InsightCard = (props: InsightCardProps) => { useState(false); const { isLoading, dismiss, show } = useDismissalHandler(props.insight.id); const previousLoading = usePrevious(isLoading); + const config = useContext(ConfigContext); + const [insightStatus, setInsightStatus] = useState(props.insight.status); const isCritical = props.insight.criticality > HIGH_CRITICALITY_THRESHOLD; + useEffect(() => { + setInsightStatus(props.insight.status); + }, [props.insight.status]); + useEffect(() => { if (previousLoading && !isLoading) { props.onRefresh(props.insight.type); } }, [isLoading, previousLoading, props.onRefresh]); - const handleRefreshLinkClick = () => { - props.onRefresh(props.insight.type); - }; - const handleRecheckButtonClick = () => { props.insight.prefixedCodeObjectId && props.onRecalculate && props.onRecalculate(props.insight.id); setIsRecalculatingStarted(true); + setInsightStatus(InsightStatus.InEvaluation); }; const handleHistogramButtonClick = () => { @@ -64,6 +71,32 @@ export const InsightCard = (props: InsightCardProps) => { ); }; + const getRecalculateVisibilityParams = () => { + const areStartTimesEqual = + props.insight.customStartTime && + props.insight.actualStartTime && + new Date(props.insight.actualStartTime).valueOf() - + new Date(props.insight.customStartTime).valueOf() === + 0; + + if ( + getFeatureFlagValue(config, FeatureFlag.IS_RECALCULATE_BUBBLE_ENABLED) + ) { + return { + showTimer: areStartTimesEqual, + showBanner: insightStatus === InsightStatus.InEvaluation + }; + } + + return { + showTimer: areStartTimesEqual, + showBanner: + !areStartTimesEqual && + props.insight.actualStartTime && + (props.insight.customStartTime || isRecalculatingStarted) + }; + }; + const handleSpanLinkClick = () => { if ( (isSpanInsight(props.insight) || isEndpointInsight(props.insight)) && @@ -212,16 +245,7 @@ export const InsightCard = (props: InsightCardProps) => { ); }; - const hideRecalculateStatus = - (!props.insight.customStartTime && !isRecalculatingStarted) || - !props.insight.actualStartTime; - - const areStartTimesEqual = - props.insight.customStartTime && - props.insight.actualStartTime && - new Date(props.insight.actualStartTime).valueOf() - - new Date(props.insight.customStartTime).valueOf() === - 0; + const { showBanner, showTimer } = getRecalculateVisibilityParams(); const isNew = isString(props.insight.firstDetected) ? Date.now() - new Date(props.insight.firstDetected).valueOf() < @@ -237,18 +261,14 @@ export const InsightCard = (props: InsightCardProps) => { ? props.insight.spanInfo : undefined } - status={props.insight.status} + status={insightStatus} isNew={isNew} isAsync={props.isAsync} insightType={props.insight.type} importance={props.insight.importance} criticality={props.insight.criticality} onSpanLinkClick={handleSpanLinkClick} - latUpdateTimer={ - areStartTimesEqual && !hideRecalculateStatus - ? props.insight.actualStartTime - : null - } + latUpdateTimer={showTimer ? props.insight.actualStartTime : null} /> } content={ @@ -259,7 +279,7 @@ export const InsightCard = (props: InsightCardProps) => { onCreateTicket={handleCreateTicketLinkClick} /> )} - {!hideRecalculateStatus && !areStartTimesEqual && } + {showBanner && } {props.content} } diff --git a/src/components/common/App/ConfigContext.ts b/src/components/common/App/ConfigContext.ts index c7ff5e312..79df96b8f 100644 --- a/src/components/common/App/ConfigContext.ts +++ b/src/components/common/App/ConfigContext.ts @@ -3,7 +3,7 @@ import { isEnvironment } from "../../../typeGuards/isEnvironment"; import { isString } from "../../../typeGuards/isString"; import { ConfigContextData } from "./types"; -export const ConfigContext = createContext({ +export const InitialData = { digmaApiUrl: isString(window.digmaApiUrl) ? window.digmaApiUrl : "", digmaApiProxyPrefix: isString(window.digmaApiProxyPrefix) ? window.digmaApiProxyPrefix @@ -28,4 +28,6 @@ export const ConfigContext = createContext({ scope: undefined, isMicrometerProject: window.isMicrometerProject === true, state: undefined -}); +}; + +export const ConfigContext = createContext(InitialData); diff --git a/src/components/common/icons/16px/RecalculateStartedIcon.tsx b/src/components/common/icons/16px/RecalculateStartedIcon.tsx index 4e4fb1029..f42a0fb0a 100644 --- a/src/components/common/icons/16px/RecalculateStartedIcon.tsx +++ b/src/components/common/icons/16px/RecalculateStartedIcon.tsx @@ -11,12 +11,17 @@ const RecalculateStartedIconComponent = (props: IconProps) => { width={size} height={size} fill="none" - viewBox="0 0 16 16" > - - - - + + ); }; diff --git a/src/featureFlags.ts b/src/featureFlags.ts index da3553bea..c61bbcae9 100644 --- a/src/featureFlags.ts +++ b/src/featureFlags.ts @@ -9,7 +9,8 @@ export const featureFlagMinBackendVersions: Record = { [FeatureFlag.IS_ASSETS_OVERALL_IMPACT_HIDDEN]: "v0.2.181-alpha.1", [FeatureFlag.IS_INSIGHT_TICKET_LINKAGE_ENABLED]: "v0.2.200", [FeatureFlag.IS_ASSETS_COMPLEX_FILTER_ENABLED]: "v0.2.215", - [FeatureFlag.IS_INSIGHT_DISMISSAL_ENABLED]: "v0.2.238" + [FeatureFlag.IS_INSIGHT_DISMISSAL_ENABLED]: "v0.2.238", + [FeatureFlag.IS_RECALCULATE_BUBBLE_ENABLED]: "v0.2.244" }; export const getFeatureFlagValue = ( diff --git a/src/types.ts b/src/types.ts index abb7885ca..da17095ea 100644 --- a/src/types.ts +++ b/src/types.ts @@ -6,7 +6,8 @@ export enum FeatureFlag { IS_ASSETS_OVERALL_IMPACT_HIDDEN, IS_INSIGHT_TICKET_LINKAGE_ENABLED, IS_ASSETS_COMPLEX_FILTER_ENABLED, - IS_INSIGHT_DISMISSAL_ENABLED + IS_INSIGHT_DISMISSAL_ENABLED, + IS_RECALCULATE_BUBBLE_ENABLED } export enum InsightType { From fa9f3ab98e1924fd70e30e66c224cba7c5cab251 Mon Sep 17 00:00:00 2001 From: olehp Date: Thu, 14 Mar 2024 17:55:50 +0200 Subject: [PATCH 3/8] Fixed typo --- .../Insights/common/InsightCard/InsightHeader/index.tsx | 6 +++--- .../Insights/common/InsightCard/InsightHeader/types.ts | 2 +- src/components/Insights/common/InsightCard/index.tsx | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/Insights/common/InsightCard/InsightHeader/index.tsx b/src/components/Insights/common/InsightCard/InsightHeader/index.tsx index 45a74a4da..495556a4d 100644 --- a/src/components/Insights/common/InsightCard/InsightHeader/index.tsx +++ b/src/components/Insights/common/InsightCard/InsightHeader/index.tsx @@ -75,11 +75,11 @@ export const InsightHeader = (props: InsightHeaderProps) => { )} - {props.latUpdateTimer && ( + {props.lastUpdateTimer && ( Updated: - - {formatTimeDistance(props.latUpdateTimer)} + + {formatTimeDistance(props.lastUpdateTimer)} )} diff --git a/src/components/Insights/common/InsightCard/InsightHeader/types.ts b/src/components/Insights/common/InsightCard/InsightHeader/types.ts index 0fed5ad20..a0eba2b0e 100644 --- a/src/components/Insights/common/InsightCard/InsightHeader/types.ts +++ b/src/components/Insights/common/InsightCard/InsightHeader/types.ts @@ -11,5 +11,5 @@ export interface InsightHeaderProps { spanInfo?: SpanInfo | null; onSpanLinkClick: (spanCodeObjectId: string) => void; status?: InsightStatus; - latUpdateTimer?: string | null; + lastUpdateTimer?: string | null; } diff --git a/src/components/Insights/common/InsightCard/index.tsx b/src/components/Insights/common/InsightCard/index.tsx index c1746085d..e9f60998a 100644 --- a/src/components/Insights/common/InsightCard/index.tsx +++ b/src/components/Insights/common/InsightCard/index.tsx @@ -268,7 +268,7 @@ export const InsightCard = (props: InsightCardProps) => { importance={props.insight.importance} criticality={props.insight.criticality} onSpanLinkClick={handleSpanLinkClick} - latUpdateTimer={showTimer ? props.insight.actualStartTime : null} + lastUpdateTimer={showTimer ? props.insight.actualStartTime : null} /> } content={ From f34ccc1dfd7111c0e897a1f9a6c81f9fe88b3660 Mon Sep 17 00:00:00 2001 From: olehp Date: Thu, 14 Mar 2024 17:59:34 +0200 Subject: [PATCH 4/8] removed comments --- .../Insights/common/InsightCard/InsightCard.stories.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Insights/common/InsightCard/InsightCard.stories.tsx b/src/components/Insights/common/InsightCard/InsightCard.stories.tsx index 20ff494b9..0c4f0c930 100644 --- a/src/components/Insights/common/InsightCard/InsightCard.stories.tsx +++ b/src/components/Insights/common/InsightCard/InsightCard.stories.tsx @@ -84,7 +84,6 @@ export const WithNewVersion: Story = { } }} > - {/* 👇 Decorators in Storybook also accept a function. Replace with Story() to enable it */} ) From c806c5e99fc01682533e4bc2f67a6a67d630c4a2 Mon Sep 17 00:00:00 2001 From: Kyrylo Shmidt <119138536+kshmidt-digma@users.noreply.github.com> Date: Thu, 14 Mar 2024 17:06:40 +0100 Subject: [PATCH 5/8] Update src/components/Insights/common/InsightCard/InsightHeader/styles.ts --- .../Insights/common/InsightCard/InsightHeader/styles.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Insights/common/InsightCard/InsightHeader/styles.ts b/src/components/Insights/common/InsightCard/InsightHeader/styles.ts index d62823ff6..91e20e933 100644 --- a/src/components/Insights/common/InsightCard/InsightHeader/styles.ts +++ b/src/components/Insights/common/InsightCard/InsightHeader/styles.ts @@ -47,7 +47,7 @@ export const BadgeContainer = styled.div` export const Description = styled.div` ${footnoteRegularTypography} - gap:4px; + gap: 4px; display: flex; color: ${({ theme }) => theme.colors.v3.text.secondary}; `; From 4417ac3037a2c17a8c0b4d65bf3ecf05116f3052 Mon Sep 17 00:00:00 2001 From: Kyrylo Shmidt <119138536+kshmidt-digma@users.noreply.github.com> Date: Thu, 14 Mar 2024 17:06:50 +0100 Subject: [PATCH 6/8] Update src/components/Insights/common/InsightCard/index.tsx --- src/components/Insights/common/InsightCard/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Insights/common/InsightCard/index.tsx b/src/components/Insights/common/InsightCard/index.tsx index e9f60998a..f96c8ed70 100644 --- a/src/components/Insights/common/InsightCard/index.tsx +++ b/src/components/Insights/common/InsightCard/index.tsx @@ -40,7 +40,7 @@ export const InsightCard = (props: InsightCardProps) => { const [insightStatus, setInsightStatus] = useState(props.insight.status); const isCritical = props.insight.criticality > HIGH_CRITICALITY_THRESHOLD; - + // TODO: remove and refresh the insight data useEffect(() => { setInsightStatus(props.insight.status); }, [props.insight.status]); From f8ed20da27b9bc9c881842bd51d7ca61efedbb35 Mon Sep 17 00:00:00 2001 From: Kyrylo Shmidt <119138536+kshmidt-digma@users.noreply.github.com> Date: Thu, 14 Mar 2024 17:07:03 +0100 Subject: [PATCH 7/8] Update src/components/Insights/common/InsightCard/index.tsx --- src/components/Insights/common/InsightCard/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Insights/common/InsightCard/index.tsx b/src/components/Insights/common/InsightCard/index.tsx index f96c8ed70..118e22a3b 100644 --- a/src/components/Insights/common/InsightCard/index.tsx +++ b/src/components/Insights/common/InsightCard/index.tsx @@ -56,6 +56,7 @@ export const InsightCard = (props: InsightCardProps) => { props.onRecalculate && props.onRecalculate(props.insight.id); setIsRecalculatingStarted(true); + // TODO: handle Recheck response and refresh the insight data setInsightStatus(InsightStatus.InEvaluation); }; From 5048887da5df71049cca6eecf693530e832d0431 Mon Sep 17 00:00:00 2001 From: olehp Date: Thu, 14 Mar 2024 18:15:45 +0200 Subject: [PATCH 8/8] Downgrade version --- src/featureFlags.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/featureFlags.ts b/src/featureFlags.ts index 1ca60499e..acf1eb7e4 100644 --- a/src/featureFlags.ts +++ b/src/featureFlags.ts @@ -10,7 +10,7 @@ export const featureFlagMinBackendVersions: Record = { [FeatureFlag.IS_INSIGHT_TICKET_LINKAGE_ENABLED]: "v0.2.200", [FeatureFlag.IS_ASSETS_COMPLEX_FILTER_ENABLED]: "v0.2.215", [FeatureFlag.IS_INSIGHT_DISMISSAL_ENABLED]: "v0.2.238", - [FeatureFlag.IS_RECALCULATE_BUBBLE_ENABLED]: "v0.2.244", + [FeatureFlag.IS_RECALCULATE_BUBBLE_ENABLED]: "v0.2.238", [FeatureFlag.IS_ANALYTICS_TAB_VISIBLE]: "v0.2.244" };