Skip to content

Commit 93e0a52

Browse files
antonisclaude
antonis
and
claude
authored
refactor(core): Rename FeedbackWidget to FeedbackForm (#5931)
* refactor(core): Rename FeedbackWidget to FeedbackForm Deprecate "widget" term in favor of "form" to align with the broader Sentry SDK ecosystem naming convention. All public APIs are preserved as deprecated aliases: - FeedbackWidget → FeedbackForm - showFeedbackWidget → showFeedbackForm - FeedbackWidgetProps → FeedbackFormProps - FeedbackWidgetStyles → FeedbackFormStyles - FeedbackWidgetState → FeedbackFormState - FeedbackWidgetTheme → FeedbackFormTheme - FeedbackWidgetManager → FeedbackFormManager Closes #5892 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * test(core): Add backward compatibility tests for deprecated FeedbackWidget API Verify that the deprecated FeedbackWidget and showFeedbackWidget exports are identical to their FeedbackForm replacements. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * docs(changelog): Add FeedbackWidget to FeedbackForm rename entry Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent db91e2b commit 93e0a52

24 files changed

+329
-291
lines changed

‎CHANGELOG.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,11 @@
88
99
## Unreleased
1010

11+
### Features
12+
13+
- Rename `FeedbackWidget` to `FeedbackForm` and `showFeedbackWidget` to `showFeedbackForm` ([#5931](https://github.com/getsentry/sentry-react-native/pull/5931))
14+
- The old names are deprecated but still work
15+
1116
### Fixes
1217

1318
- Fix iOS crash (EXC_BAD_ACCESS) in time-to-initial-display when navigating between screens ([#5887](https://github.com/getsentry/sentry-react-native/pull/5887))

‎packages/core/src/js/feedback/FeedbackButton.tsx‎

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,12 @@ import type { NativeEventSubscription } from 'react-native';
33
import * as React from 'react';
44
import { Appearance, Image, Text, TouchableOpacity } from 'react-native';
55

6-
import type {
7-
FeedbackButtonProps,
8-
FeedbackButtonStyles,
9-
FeedbackButtonTextConfiguration,
10-
} from './FeedbackWidget.types';
6+
import type { FeedbackButtonProps, FeedbackButtonStyles, FeedbackButtonTextConfiguration } from './FeedbackForm.types';
117

128
import { defaultButtonConfiguration } from './defaults';
13-
import { defaultButtonStyles } from './FeedbackWidget.styles';
14-
import { getTheme } from './FeedbackWidget.theme';
15-
import { showFeedbackWidget } from './FeedbackWidgetManager';
9+
import { defaultButtonStyles } from './FeedbackForm.styles';
10+
import { getTheme } from './FeedbackForm.theme';
11+
import { showFeedbackForm } from './FeedbackFormManager';
1612
import { feedbackIcon } from './icons';
1713
import { lazyLoadFeedbackIntegration } from './lazy';
1814

@@ -61,7 +57,7 @@ export class FeedbackButton extends React.Component<FeedbackButtonProps> {
6157
return (
6258
<TouchableOpacity
6359
style={styles.triggerButton}
64-
onPress={showFeedbackWidget}
60+
onPress={showFeedbackForm}
6561
accessibilityLabel={text.triggerAriaLabel}
6662
>
6763
<Image source={{ uri: feedbackIcon }} style={styles.triggerIcon} />

packages/core/src/js/feedback/FeedbackWidget.styles.ts renamed to packages/core/src/js/feedback/FeedbackForm.styles.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import type { ViewStyle } from 'react-native';
22

3-
import type { FeedbackWidgetTheme } from './FeedbackWidget.theme';
4-
import type { FeedbackButtonStyles, FeedbackWidgetStyles } from './FeedbackWidget.types';
3+
import type { FeedbackFormTheme } from './FeedbackForm.theme';
4+
import type { FeedbackButtonStyles, FeedbackFormStyles } from './FeedbackForm.types';
55

6-
const defaultStyles = (theme: FeedbackWidgetTheme): FeedbackWidgetStyles => {
6+
const defaultStyles = (theme: FeedbackFormTheme): FeedbackFormStyles => {
77
return {
88
container: {
99
flex: 1,
@@ -112,7 +112,7 @@ const defaultStyles = (theme: FeedbackWidgetTheme): FeedbackWidgetStyles => {
112112
};
113113
};
114114

115-
export const defaultButtonStyles = (theme: FeedbackWidgetTheme): FeedbackButtonStyles => {
115+
export const defaultButtonStyles = (theme: FeedbackFormTheme): FeedbackButtonStyles => {
116116
return {
117117
triggerButton: {
118118
position: 'absolute',
@@ -156,7 +156,7 @@ export const modalWrapper: ViewStyle = {
156156
bottom: 0,
157157
};
158158

159-
export const modalSheetContainer = (theme: FeedbackWidgetTheme): ViewStyle => {
159+
export const modalSheetContainer = (theme: FeedbackFormTheme): ViewStyle => {
160160
return {
161161
backgroundColor: theme.background,
162162
borderTopLeftRadius: 16,

packages/core/src/js/feedback/FeedbackWidget.theme.ts renamed to packages/core/src/js/feedback/FeedbackForm.theme.ts

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,15 @@ import { getColorScheme, getFeedbackDarkTheme, getFeedbackLightTheme } from './i
55
/**
66
* Get the theme for the feedback widget based on the current color scheme
77
*/
8-
export function getTheme(): FeedbackWidgetTheme {
8+
export function getTheme(): FeedbackFormTheme {
99
const userTheme = getColorScheme();
1010
const colorScheme = userTheme === 'system' ? Appearance.getColorScheme() : userTheme;
1111
const lightTheme = { ...LightTheme, ...getFeedbackLightTheme() };
1212
const darkTheme = { ...DarkTheme, ...getFeedbackDarkTheme() };
1313
return colorScheme === 'dark' ? darkTheme : lightTheme;
1414
}
1515

16-
export interface FeedbackWidgetTheme {
16+
export interface FeedbackFormTheme {
1717
/**
1818
* Background color for surfaces
1919
*/
@@ -50,7 +50,7 @@ export interface FeedbackWidgetTheme {
5050
sentryLogo?: string;
5151
}
5252

53-
export const LightTheme: FeedbackWidgetTheme = {
53+
export const LightTheme: FeedbackFormTheme = {
5454
accentBackground: 'rgba(88, 74, 192, 1)',
5555
accentForeground: '#ffffff',
5656
foreground: '#2b2233',
@@ -60,7 +60,7 @@ export const LightTheme: FeedbackWidgetTheme = {
6060
sentryLogo: 'rgba(54, 45, 89, 1)',
6161
};
6262

63-
export const DarkTheme: FeedbackWidgetTheme = {
63+
export const DarkTheme: FeedbackFormTheme = {
6464
accentBackground: 'rgba(88, 74, 192, 1)',
6565
accentForeground: '#ffffff',
6666
foreground: '#ebe6ef',
@@ -69,3 +69,6 @@ export const DarkTheme: FeedbackWidgetTheme = {
6969
feedbackIcon: '#ffffff',
7070
sentryLogo: '#ffffff',
7171
};
72+
73+
/** @deprecated Use `FeedbackFormTheme` instead. */
74+
export type FeedbackWidgetTheme = FeedbackFormTheme;

packages/core/src/js/feedback/FeedbackWidget.tsx renamed to packages/core/src/js/feedback/FeedbackForm.tsx

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -19,19 +19,19 @@ import type { Screenshot } from '../wrapper';
1919
import type {
2020
FeedbackGeneralConfiguration,
2121
FeedbackTextConfiguration,
22-
FeedbackWidgetProps,
23-
FeedbackWidgetState,
24-
FeedbackWidgetStyles,
22+
FeedbackFormProps,
23+
FeedbackFormState,
24+
FeedbackFormStyles,
2525
ImagePickerConfiguration,
26-
} from './FeedbackWidget.types';
26+
} from './FeedbackForm.types';
2727

2828
import { isExpoGo, isWeb, notWeb } from '../utils/environment';
2929
import { getDataFromUri, NATIVE } from '../wrapper';
3030
import { sentryLogo } from './branding';
3131
import { defaultConfiguration } from './defaults';
32-
import defaultStyles from './FeedbackWidget.styles';
33-
import { getTheme } from './FeedbackWidget.theme';
34-
import { hideFeedbackButton, showScreenshotButton } from './FeedbackWidgetManager';
32+
import defaultStyles from './FeedbackForm.styles';
33+
import { getTheme } from './FeedbackForm.theme';
34+
import { hideFeedbackButton, showScreenshotButton } from './FeedbackFormManager';
3535
import { lazyLoadFeedbackIntegration } from './lazy';
3636
import { getCapturedScreenshot } from './ScreenshotButton';
3737
import { base64ToUint8Array, feedbackAlertDialog, isValidEmail } from './utils';
@@ -40,10 +40,10 @@ import { base64ToUint8Array, feedbackAlertDialog, isValidEmail } from './utils';
4040
* @beta
4141
* Implements a feedback form screen that sends feedback to Sentry using Sentry.captureFeedback.
4242
*/
43-
export class FeedbackWidget extends React.Component<FeedbackWidgetProps, FeedbackWidgetState> {
43+
export class FeedbackForm extends React.Component<FeedbackFormProps, FeedbackFormState> {
4444
public static defaultProps = defaultConfiguration;
4545

46-
private static _savedState: Omit<FeedbackWidgetState, 'isVisible'> = {
46+
private static _savedState: Omit<FeedbackFormState, 'isVisible'> = {
4747
name: '',
4848
email: '',
4949
description: '',
@@ -56,7 +56,7 @@ export class FeedbackWidget extends React.Component<FeedbackWidgetProps, Feedbac
5656

5757
private _didSubmitForm: boolean = false;
5858

59-
public constructor(props: FeedbackWidgetProps) {
59+
public constructor(props: FeedbackFormProps) {
6060
super(props);
6161

6262
const currentUser = {
@@ -68,12 +68,12 @@ export class FeedbackWidget extends React.Component<FeedbackWidgetProps, Feedbac
6868

6969
this.state = {
7070
isVisible: true,
71-
name: FeedbackWidget._savedState.name || currentUser.useSentryUser.name,
72-
email: FeedbackWidget._savedState.email || currentUser.useSentryUser.email,
73-
description: FeedbackWidget._savedState.description || '',
74-
filename: FeedbackWidget._savedState.filename || undefined,
75-
attachment: FeedbackWidget._savedState.attachment || undefined,
76-
attachmentUri: FeedbackWidget._savedState.attachmentUri || undefined,
71+
name: FeedbackForm._savedState.name || currentUser.useSentryUser.name,
72+
email: FeedbackForm._savedState.email || currentUser.useSentryUser.email,
73+
description: FeedbackForm._savedState.description || '',
74+
filename: FeedbackForm._savedState.filename || undefined,
75+
attachment: FeedbackForm._savedState.attachment || undefined,
76+
attachmentUri: FeedbackForm._savedState.attachmentUri || undefined,
7777
};
7878

7979
lazyLoadFeedbackIntegration();
@@ -83,7 +83,7 @@ export class FeedbackWidget extends React.Component<FeedbackWidgetProps, Feedbac
8383
* For testing purposes only.
8484
*/
8585
public static reset(): void {
86-
FeedbackWidget._savedState = {
86+
FeedbackForm._savedState = {
8787
name: '',
8888
email: '',
8989
description: '',
@@ -275,7 +275,7 @@ export class FeedbackWidget extends React.Component<FeedbackWidgetProps, Feedbac
275275
const _propStyles = this.props.styles || {};
276276
const autoCorrect = config.autoCorrect !== false;
277277
const spellCheck = config.spellCheck !== false;
278-
const styles = (Object.keys(_defaultStyles) as Array<keyof FeedbackWidgetStyles>).reduce<FeedbackWidgetStyles>(
278+
const styles = (Object.keys(_defaultStyles) as Array<keyof FeedbackFormStyles>).reduce<FeedbackFormStyles>(
279279
(merged, key) => {
280280
(merged as Record<string, unknown>)[key] = {
281281
...(_defaultStyles[key] as object),
@@ -435,11 +435,11 @@ export class FeedbackWidget extends React.Component<FeedbackWidgetProps, Feedbac
435435
};
436436

437437
private _saveFormState = (): void => {
438-
FeedbackWidget._savedState = { ...this.state };
438+
FeedbackForm._savedState = { ...this.state };
439439
};
440440

441441
private _clearFormState = (): void => {
442-
FeedbackWidget._savedState = {
442+
FeedbackForm._savedState = {
443443
name: '',
444444
email: '',
445445
description: '',

packages/core/src/js/feedback/FeedbackWidget.types.ts renamed to packages/core/src/js/feedback/FeedbackForm.types.ts

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@ import type { ImageStyle, TextStyle, ViewStyle } from 'react-native';
44
/**
55
* The props for the feedback form
66
*/
7-
export interface FeedbackWidgetProps
7+
export interface FeedbackFormProps
88
extends FeedbackGeneralConfiguration, FeedbackTextConfiguration, FeedbackCallbacks, ImagePickerConfiguration {
9-
styles?: FeedbackWidgetStyles;
9+
styles?: FeedbackFormStyles;
1010
}
1111

1212
/**
@@ -286,7 +286,7 @@ export interface ImagePicker {
286286
/**
287287
* The styles for the feedback form
288288
*/
289-
export interface FeedbackWidgetStyles {
289+
export interface FeedbackFormStyles {
290290
container?: ViewStyle;
291291
title?: TextStyle;
292292
label?: TextStyle;
@@ -341,7 +341,7 @@ export interface ScreenshotButtonStyles {
341341
/**
342342
* The state of the feedback form
343343
*/
344-
export interface FeedbackWidgetState {
344+
export interface FeedbackFormState {
345345
isVisible: boolean;
346346
name: string;
347347
email: string;
@@ -350,3 +350,12 @@ export interface FeedbackWidgetState {
350350
attachment?: string | Uint8Array;
351351
attachmentUri?: string;
352352
}
353+
354+
/** @deprecated Use `FeedbackFormProps` instead. */
355+
export type FeedbackWidgetProps = FeedbackFormProps;
356+
357+
/** @deprecated Use `FeedbackFormStyles` instead. */
358+
export type FeedbackWidgetStyles = FeedbackFormStyles;
359+
360+
/** @deprecated Use `FeedbackFormState` instead. */
361+
export type FeedbackWidgetState = FeedbackFormState;

packages/core/src/js/feedback/FeedbackWidgetManager.tsx renamed to packages/core/src/js/feedback/FeedbackFormManager.tsx

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -69,17 +69,20 @@ abstract class FeedbackManager {
6969
}
7070

7171
/**
72-
* Provides functionality to show and hide the feedback widget.
72+
* Provides functionality to show and hide the feedback form.
7373
*/
74-
export class FeedbackWidgetManager extends FeedbackManager {
74+
export class FeedbackFormManager extends FeedbackManager {
7575
/**
7676
* Returns the name of the feedback component.
7777
*/
7878
protected static get _feedbackComponentName(): string {
79-
return 'FeedbackWidget';
79+
return 'FeedbackForm';
8080
}
8181
}
8282

83+
/** @deprecated Use `FeedbackFormManager` instead. */
84+
export const FeedbackWidgetManager = FeedbackFormManager;
85+
8386
/**
8487
* Provides functionality to show and hide the feedback button.
8588
*/
@@ -104,15 +107,21 @@ export class ScreenshotButtonManager extends FeedbackManager {
104107
}
105108
}
106109

107-
const showFeedbackWidget = (): void => {
110+
const showFeedbackForm = (): void => {
108111
lazyLoadAutoInjectFeedbackIntegration();
109-
FeedbackWidgetManager.show();
112+
FeedbackFormManager.show();
110113
};
111114

112-
const resetFeedbackWidgetManager = (): void => {
113-
FeedbackWidgetManager.reset();
115+
const resetFeedbackFormManager = (): void => {
116+
FeedbackFormManager.reset();
114117
};
115118

119+
/** @deprecated Use `showFeedbackForm` instead. */
120+
const showFeedbackWidget = showFeedbackForm;
121+
122+
/** @deprecated Use `resetFeedbackFormManager` instead. */
123+
const resetFeedbackWidgetManager = resetFeedbackFormManager;
124+
116125
const showFeedbackButton = (): void => {
117126
lazyLoadAutoInjectFeedbackButtonIntegration();
118127
FeedbackButtonManager.show();
@@ -149,7 +158,7 @@ const enableFeedbackOnShake = (): void => {
149158
lazyLoadAutoInjectFeedbackIntegration();
150159
lazyLoadShakeToReportIntegration();
151160
if (!_imperativeShakeListenerStarted) {
152-
_imperativeShakeListenerStarted = startShakeListener(showFeedbackWidget);
161+
_imperativeShakeListenerStarted = startShakeListener(showFeedbackForm);
153162
}
154163
};
155164

@@ -163,12 +172,14 @@ const disableFeedbackOnShake = (): void => {
163172
export {
164173
showFeedbackButton,
165174
hideFeedbackButton,
175+
showFeedbackForm,
166176
showFeedbackWidget,
167177
enableFeedbackOnShake,
168178
disableFeedbackOnShake,
169179
showScreenshotButton,
170180
hideScreenshotButton,
171181
resetFeedbackButtonManager,
182+
resetFeedbackFormManager,
172183
resetFeedbackWidgetManager,
173184
resetScreenshotButtonManager,
174185
};

0 commit comments

Comments
 (0)