Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bugfix: Click on MarketWidget under FF #8754

Merged
merged 1 commit into from
Dec 23, 2024
+45 −12
Merged

bugfix: Click on MarketWidget under FF #8754

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/afraid-actors-fry.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"ledger-live-desktop": minor
---

Update analytics + click under FF
1 change: 1 addition & 0 deletions apps/ledger-live-desktop/src/renderer/analytics/segment.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@ const getMarketWidgetAnalytics = (state: State) => {

return {
hasMarketWidget: !marketWidget?.enabled ? "Null" : hasMarketWidgetActivated ? "Yes" : "No",
hasSeenWidgetImprovements: marketWidget?.params?.enableNewFeature ? "Yes" : "No",
};
};

Expand Down
9 changes: 8 additions & 1 deletion ...e-desktop/src/renderer/screens/dashboard/MarketPerformanceWidget/components/Container.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ export function MarketPerformanceWidgetContainer({
isLoading,
hasError,
top,
enableNewFeature,
}: Props) {
const Body = BodyByMode[variant];

Expand Down Expand Up @@ -50,7 +51,13 @@ export function MarketPerformanceWidgetContainer({
range={range}
/>
) : (
<Body data={list} order={order} range={range} top={top} />
<Body
data={list}
order={order}
range={range}
top={top}
enableNewFeature={enableNewFeature}
/>
)}
</Flex>

Expand Down
38 changes: 27 additions & 11 deletions ...-desktop/src/renderer/screens/dashboard/MarketPerformanceWidget/components/WidgetList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { getChangePercentage } from "~/renderer/screens/dashboard/MarketPerforma
import { useHistory } from "react-router-dom";
import { track } from "~/renderer/analytics/segment";

export function WidgetList({ data, order, range, top }: PropsBody) {
export function WidgetList({ data, order, range, top, enableNewFeature }: PropsBody) {
const noData = data.length === 0;

return (
Expand All @@ -21,14 +21,21 @@ export function WidgetList({ data, order, range, top }: PropsBody) {
<MissingData order={order} range={range} top={top} />
) : (
data.map((elem, i) => (
<WidgetRow key={i} index={i + 1} data={elem} isFirst={i === 0} range={range} />
<WidgetRow
key={i}
index={i + 1}
data={elem}
isFirst={i === 0}
range={range}
enableNewFeature={enableNewFeature}
/>
))
)}
</Flex>
);
}

function WidgetRow({ data, index, range }: PropsBodyElem) {
function WidgetRow({ data, index, range, enableNewFeature }: PropsBodyElem) {
const counterValueCurrency = useSelector(counterValueCurrencySelector);
const locale = useSelector(localeSelector);
const history = useHistory();
Expand All @@ -45,7 +52,12 @@ function WidgetRow({ data, index, range }: PropsBodyElem) {
}, [data, history]);

return (
<MainContainer justifyContent="space-between" py="6px" onClick={onCurrencyClick}>
<MainContainer
justifyContent="space-between"
py="6px"
onClick={enableNewFeature ? onCurrencyClick : undefined}
featureFlagEnabled={enableNewFeature}
>
<Flex alignItems="center" flex={1}>
<Text color="neutral.c80" variant="h5Inter" mr={2}>
{index}
Expand Down Expand Up @@ -116,18 +128,22 @@ function WidgetRow({ data, index, range }: PropsBodyElem) {
);
}

const MainContainer = styled(Flex)`
const MainContainer = styled(Flex)<{ featureFlagEnabled?: boolean }>`
transition:
background-color 0.35s ease,
padding 0.35s ease;
border-radius: 12px;

&:hover {
transition-delay: 0.15s;
background-color: ${p => p.theme.colors.opacityDefault.c05};
padding: 6px 12px;
cursor: pointer;
}
${({ featureFlagEnabled, theme }) =>
featureFlagEnabled &&
`
&:hover {
transition-delay: 0.15s;
background-color: ${theme.colors.opacityDefault.c05};
padding: 6px 12px;
cursor: pointer;
}
`}
`;

const CryptoCurrencyIconWrapper = styled(Flex)<{
Expand Down
3 changes: 3 additions & 0 deletions apps/ledger-live-desktop/src/renderer/screens/dashboard/MarketPerformanceWidget/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export type Props = {
isLoading: boolean;
hasError: boolean;
top: number;
enableNewFeature?: boolean;
};

/**
Expand All @@ -33,13 +34,15 @@ export type PropsBody = {
order: Order;
range: PortfolioRange;
top: number;
enableNewFeature?: boolean;
};

export type PropsBodyElem = {
data: MarketItemPerformer;
index: number;
isFirst: boolean;
range: PortfolioRange;
enableNewFeature?: boolean;
};

/**
Expand Down
1 change: 1 addition & 0 deletions ...ktop/src/renderer/screens/dashboard/MarketPerformanceWidget/useMarketPerformanceWidget.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,5 +88,6 @@ export function useMarketPerformanceWidget() {
hasError: isError,
range: timeRange,
top,
enableNewFeature,
};
}
Loading