Skip to content

Commit ae524d9

Browse files
georgewrmarshallgeorgewrmarshall
committed
revert: remove unrelated ramp utils/hooks changes
1 parent abb86f3 commit ae524d9

6 files changed

Lines changed: 11 additions & 255 deletions

File tree

‎app/components/UI/Ramp/Aggregator/Views/Checkout/Checkout.styles.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
import { StyleSheet } from 'react-native';
22
import { Theme } from '../../../../../../util/theme/models';
3-
import { getElevatedSurfaceColor } from '../../../../../../util/theme/themeUtils';
43

54
const styleSheet = (params: { theme: Theme }) =>
65
StyleSheet.create({
76
headerWithoutPadding: {
87
paddingVertical: 0,
98
},
109
webview: {
11-
backgroundColor: getElevatedSurfaceColor(params.theme),
10+
backgroundColor: params.theme.colors.background.default,
1211
},
1312
});
1413

‎app/components/UI/Ramp/hooks/useContinueWithQuote.ts‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,9 @@ import { strings } from '../../../../../locales/i18n';
99
import { FIAT_ORDER_PROVIDERS } from '../../../../constants/on-ramp';
1010
import { selectHasAgreedTransakNativePolicy } from '../../../../reducers/fiatOrders';
1111
import Device from '../../../../util/device';
12-
import { useTheme } from '../../../../util/theme';
1312

1413
import {
15-
buildQuoteWithWidgetTheme,
14+
buildQuoteWithRedirectUrl,
1615
getCheckoutContext,
1716
getWidgetRedirectConfig,
1817
} from '../utils/buildQuoteWithRedirectUrl';
@@ -124,7 +123,6 @@ export function useContinueWithQuote(
124123
const hasAgreedTransakNativePolicy = useSelector(
125124
selectHasAgreedTransakNativePolicy,
126125
);
127-
const theme = useTheme();
128126

129127
const currency = userRegion?.country?.currency || 'USD';
130128

@@ -254,11 +252,7 @@ export function useContinueWithQuote(
254252
);
255253
useExternalBrowser = redirectConfig.useExternalBrowser;
256254
redirectUrl = redirectConfig.redirectUrl;
257-
const quoteForWidget = buildQuoteWithWidgetTheme(
258-
quote,
259-
redirectUrl,
260-
theme,
261-
);
255+
const quoteForWidget = buildQuoteWithRedirectUrl(quote, redirectUrl);
262256
buyWidget = await getBuyWidgetData(quoteForWidget);
263257
} catch (error) {
264258
throw new Error(
@@ -376,7 +370,6 @@ export function useContinueWithQuote(
376370
getBuyWidgetData,
377371
addPrecreatedOrder,
378372
navigateAfterExternalBrowser,
379-
theme,
380373
],
381374
);
382375

‎app/components/UI/Ramp/utils/buildQuoteWithRedirectUrl.test.ts‎

Lines changed: 2 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,17 @@
11
import type { Quote } from '@metamask/ramps-controller';
2-
import { brandColor, darkTheme, lightTheme } from '@metamask/design-tokens';
32
import {
4-
appendWidgetThemeToBuyUrl,
5-
buildQuoteWithWidgetTheme,
63
getCheckoutContext,
74
getAggregatorRedirectConfig,
85
getWidgetRedirectConfig,
96
} from './buildQuoteWithRedirectUrl';
10-
import { AppThemeKey, type Theme } from '../../../../util/theme/models';
11-
12-
let mockIsPureBlackEnabled = false;
137

148
jest.mock('./getRampCallbackBaseUrl', () => ({
159
getRampCallbackBaseUrl: () => 'https://callback.example/base',
1610
}));
1711

18-
jest.mock('../../../../util/theme/themeUtils', () => ({
19-
get isPureBlackEnabled() {
20-
return mockIsPureBlackEnabled;
21-
},
22-
}));
23-
24-
const createTheme = (
25-
themeAppearance: AppThemeKey.light | AppThemeKey.dark,
26-
): Theme => {
27-
const base = themeAppearance === AppThemeKey.dark ? darkTheme : lightTheme;
28-
return {
29-
colors: base.colors,
30-
themeAppearance,
31-
typography: base.typography,
32-
shadows: base.shadows,
33-
brandColors: brandColor,
34-
};
35-
};
36-
37-
const makeQuote = (
38-
browser?: 'APP_BROWSER' | 'IN_APP_OS_BROWSER',
39-
buyURL = 'https://on-ramp.example/providers/transak/buy',
40-
): Quote =>
12+
const makeQuote = (browser?: 'APP_BROWSER' | 'IN_APP_OS_BROWSER'): Quote =>
4113
({
42-
quote: {
43-
...(browser ? { buyWidget: { browser } } : {}),
44-
buyURL,
45-
},
14+
quote: browser ? { buyWidget: { browser } } : {},
4615
}) as unknown as Quote;
4716

4817
describe('getCheckoutContext', () => {
@@ -121,64 +90,3 @@ describe('getWidgetRedirectConfig', () => {
12190
expect(result.redirectUrl).toBe('https://callback.example/base');
12291
});
12392
});
124-
125-
describe('appendWidgetThemeToBuyUrl', () => {
126-
beforeEach(() => {
127-
mockIsPureBlackEnabled = false;
128-
});
129-
130-
it('returns the original buy URL when pure black is disabled', () => {
131-
const buyURL = 'https://on-ramp.example/providers/transak/buy';
132-
133-
expect(
134-
appendWidgetThemeToBuyUrl(buyURL, createTheme(AppThemeKey.dark)),
135-
).toBe(buyURL);
136-
});
137-
138-
it('appends widget theme params when pure black is enabled', () => {
139-
mockIsPureBlackEnabled = true;
140-
const theme = createTheme(AppThemeKey.dark);
141-
const result = appendWidgetThemeToBuyUrl(
142-
'https://on-ramp.example/providers/transak/buy',
143-
theme,
144-
);
145-
const parsed = new URL(result);
146-
147-
expect(parsed.searchParams.get('colorMode')).toBe('DARK');
148-
expect(parsed.searchParams.get('widgetBackgroundFillColor')).toBe(
149-
theme.colors.background.alternative,
150-
);
151-
expect(parsed.searchParams.get('backgroundColors')).toBe(
152-
[
153-
theme.colors.background.alternative,
154-
theme.colors.background.alternative,
155-
theme.colors.background.muted,
156-
].join(','),
157-
);
158-
});
159-
});
160-
161-
describe('buildQuoteWithWidgetTheme', () => {
162-
beforeEach(() => {
163-
mockIsPureBlackEnabled = false;
164-
});
165-
166-
it('rewrites redirect and theme params on the quote buy URL', () => {
167-
mockIsPureBlackEnabled = true;
168-
const theme = createTheme(AppThemeKey.dark);
169-
const quote = makeQuote('APP_BROWSER');
170-
const result = buildQuoteWithWidgetTheme(
171-
quote,
172-
'https://callback.example/base',
173-
theme,
174-
);
175-
const parsed = new URL(result.quote?.buyURL ?? '');
176-
177-
expect(parsed.searchParams.get('redirectUrl')).toBe(
178-
'https://callback.example/base',
179-
);
180-
expect(parsed.searchParams.get('widgetBackgroundFillColor')).toBe(
181-
theme.colors.background.alternative,
182-
);
183-
});
184-
});

‎app/components/UI/Ramp/utils/buildQuoteWithRedirectUrl.ts‎

Lines changed: 0 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
11
import { isExternalBrowserQuote, type Quote } from '@metamask/ramps-controller';
2-
import type { Theme } from '../../../../util/theme/models';
3-
import { isPureBlackEnabled } from '../../../../util/theme/themeUtils';
4-
import { generateThemeParameters } from './depositUtils';
52
import { getRampCallbackBaseUrl } from './getRampCallbackBaseUrl';
63

74
/**
@@ -27,54 +24,6 @@ export function buildQuoteWithRedirectUrl(
2724
};
2825
}
2926

30-
/**
31-
* Appends Transak widget theme query params to a buy URL when pure black is
32-
* enabled so provider-hosted checkout surfaces match the elevated BottomSheet.
33-
*/
34-
export function appendWidgetThemeToBuyUrl(
35-
buyURL: string,
36-
theme: Theme,
37-
): string {
38-
if (!isPureBlackEnabled) {
39-
return buyURL;
40-
}
41-
42-
const buyUrl = new URL(buyURL);
43-
const themeParams = generateThemeParameters(
44-
theme.themeAppearance,
45-
theme.colors,
46-
);
47-
48-
Object.entries(themeParams).forEach(([key, value]) => {
49-
buyUrl.searchParams.set(key, value);
50-
});
51-
52-
return buyUrl.toString();
53-
}
54-
55-
/**
56-
* Rewrites a quote's buy URL with redirect + optional pure-black widget theme.
57-
*/
58-
export function buildQuoteWithWidgetTheme(
59-
quote: Quote,
60-
redirectUrl: string,
61-
theme: Theme,
62-
): Quote {
63-
const quoteWithRedirect = buildQuoteWithRedirectUrl(quote, redirectUrl);
64-
const buyURL = quoteWithRedirect.quote?.buyURL;
65-
if (!buyURL) {
66-
return quoteWithRedirect;
67-
}
68-
69-
return {
70-
...quoteWithRedirect,
71-
quote: {
72-
...quoteWithRedirect.quote,
73-
buyURL: appendWidgetThemeToBuyUrl(buyURL, theme),
74-
},
75-
};
76-
}
77-
7827
function getProviderDeeplinkRedirectUrl(providerCode: string): string {
7928
return `metamask://on-ramp/providers/${providerCode}`;
8029
}

‎app/components/UI/Ramp/utils/depositUtils.test.ts‎

Lines changed: 0 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,6 @@ import { mockTheme } from '../../../../util/theme';
1616
import { AppThemeKey } from '../../../../util/theme/models';
1717
import { MOCK_ETH_TOKEN } from '../testUtils/constants';
1818

19-
let mockIsPureBlackEnabled = false;
20-
21-
jest.mock('../../../../util/theme/themeUtils', () => ({
22-
get isPureBlackEnabled() {
23-
return mockIsPureBlackEnabled;
24-
},
25-
}));
26-
2719
jest.mock('../../../../../locales/i18n', () => ({
2820
strings: jest.fn(),
2921
}));
@@ -227,10 +219,6 @@ describe('generateThemeParameters', () => {
227219
themeAppearance: AppThemeKey.dark,
228220
};
229221

230-
beforeEach(() => {
231-
mockIsPureBlackEnabled = false;
232-
});
233-
234222
it('should generate correct theme parameters for light mode', () => {
235223
const themeAppearance = AppThemeKey.light;
236224
const colors = mockTheme.colors;
@@ -286,66 +274,6 @@ describe('generateThemeParameters', () => {
286274
surfaceFillColor: colors.background.muted,
287275
});
288276
});
289-
290-
it('adds elevated widget background for pure black dark mode', () => {
291-
mockIsPureBlackEnabled = true;
292-
const colors = mockDarkTheme.colors;
293-
const result = generateThemeParameters(AppThemeKey.dark, colors);
294-
295-
expect(result).toEqual({
296-
themeColor: colors.primary.default,
297-
colorMode: 'DARK',
298-
backgroundColors: [
299-
colors.background.alternative,
300-
colors.background.alternative,
301-
colors.background.muted,
302-
].join(','),
303-
textColors: [
304-
colors.text.default,
305-
colors.text.default,
306-
colors.text.alternative,
307-
].join(','),
308-
borderColors: [
309-
colors.border.default,
310-
colors.border.muted,
311-
colors.border.muted,
312-
].join(','),
313-
primaryButtonFillColor: colors.icon.default,
314-
primaryButtonTextColor: colors.icon.inverse,
315-
surfaceFillColor: colors.background.muted,
316-
widgetBackgroundFillColor: colors.background.alternative,
317-
});
318-
});
319-
320-
it('keeps default widget background for pure black light mode', () => {
321-
mockIsPureBlackEnabled = true;
322-
const colors = mockTheme.colors;
323-
const result = generateThemeParameters(AppThemeKey.light, colors);
324-
325-
expect(result).toEqual({
326-
themeColor: colors.primary.default,
327-
colorMode: 'LIGHT',
328-
backgroundColors: [
329-
colors.background.default,
330-
colors.background.default,
331-
colors.background.muted,
332-
].join(','),
333-
textColors: [
334-
colors.text.default,
335-
colors.text.default,
336-
colors.text.alternative,
337-
].join(','),
338-
borderColors: [
339-
colors.border.default,
340-
colors.border.muted,
341-
colors.border.muted,
342-
].join(','),
343-
primaryButtonFillColor: colors.icon.default,
344-
primaryButtonTextColor: colors.icon.inverse,
345-
surfaceFillColor: colors.background.muted,
346-
widgetBackgroundFillColor: colors.background.default,
347-
});
348-
});
349277
});
350278

351279
describe('timestampToTransakFormat', () => {

‎app/components/UI/Ramp/utils/depositUtils.ts‎

Lines changed: 6 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { FIAT_ORDER_STATES } from '../../../../constants/on-ramp';
44
import { renderNumber } from '../../../../util/number';
55
import { strings } from '../../../../../locales/i18n';
66
import { AppThemeKey, Colors } from '../../../../util/theme/models';
7-
import { isPureBlackEnabled } from '../../../../util/theme/themeUtils';
87

98
const emailRegex =
109
/^[-!#$%&'*+/0-9=?A-Z^_a-z`{|}~](\.?[-!#$%&'*+/0-9=?A-Z^_a-z`{|}~])*@[a-zA-Z0-9](-*\.?[a-zA-Z0-9])*\.[a-zA-Z](-?[a-zA-Z0-9])+$/;
@@ -106,22 +105,11 @@ export const generateThemeParameters = (
106105
themeAppearance: AppThemeKey,
107106
colors: Colors,
108107
) => {
109-
const widgetBackgroundFillColor =
110-
isPureBlackEnabled && themeAppearance === AppThemeKey.dark
111-
? colors.background.alternative
112-
: colors.background.default;
113-
114-
const backgroundColors = isPureBlackEnabled
115-
? [
116-
widgetBackgroundFillColor,
117-
widgetBackgroundFillColor,
118-
colors.background.muted,
119-
].join(',')
120-
: [
121-
colors.background.default,
122-
colors.background.default,
123-
colors.background.alternative,
124-
].join(',');
108+
const backgroundColors = [
109+
colors.background.default,
110+
colors.background.default,
111+
colors.background.alternative,
112+
].join(',');
125113

126114
const textColors = [
127115
colors.text.default,
@@ -135,7 +123,7 @@ export const generateThemeParameters = (
135123
colors.border.muted,
136124
].join(',');
137125

138-
const themeParameters = {
126+
return {
139127
themeColor: colors.primary.default,
140128
colorMode: themeAppearance === AppThemeKey.light ? 'LIGHT' : 'DARK',
141129
backgroundColors,
@@ -145,15 +133,6 @@ export const generateThemeParameters = (
145133
primaryButtonTextColor: colors.icon.inverse,
146134
surfaceFillColor: colors.background.muted,
147135
};
148-
149-
if (!isPureBlackEnabled) {
150-
return themeParameters;
151-
}
152-
153-
return {
154-
...themeParameters,
155-
widgetBackgroundFillColor,
156-
};
157136
};
158137

159138
/**

0 commit comments

Comments
 (0)