Skip to content

Commit d614a2b

Browse files
carocao-msftJamesBurnsideprprabhu-msdmceachernmsftgithub-actions[bot]
authored
Add allow access modal to configuration screen (#2463)
* add drawer to mobile * Change files * add drawer to mobile * Change files * Require webpack 5 in our lib. Add minimum webpack and typescript versions to storybook. Update `html-to-parser` version (#2428) Co-authored-by: Prathmesh Prabhu <82062616+prprabhu-ms@users.noreply.github.com> * Fix `dtmfDialpadPlaceHolderText` spelling and restrict it to beta builds (#2439) * Add troubleshooting guide error bar to call composite config screen (#2433) * add error bar * Change files * pr fix * add drawer to mobile * Add troubleshooting guide error bar to call composite config screen (#2433) * add error bar * Change files * pr fix * add drawer to mobile * Add troubleshooting guide error bar to call composite config screen (#2433) * add error bar * Change files * pr fix * add drawer to mobile * pr fix * pr change * add modal to config screen * pr change * Cheery-pick to main: Stable release branch hotfix: Fix camera turning back on when turned off on connecting screen (#2458) (#2460) * Revert breaking API change in `CallEndedListener` callback (#2464) * Only export `DeclarativeCallAgent` in beta builds (#2469) * Chat adapter error update (#2471) * add error emitter to typing indicator * add proxy in stateful client for typingIndicator * add test * Change files * fix name * Update @internal-react-composites-7cc319fa-75a7-4732-b1fb-a9425738de8d.json * update composite test script to build first * add test to stateful suite * fix spelling... * remove auto build * 1.4.0 pre-release branch (#2432) * pr change * pr fix * Add webpack 5 support for treeshaking (#2448) * Add webpack 5 support for treeshaking * Remove webpack plugin * Use not deprecated api Co-authored-by: Nan Jiang <jinan@microsoft.com> * pr fix * Change files * build fix Co-authored-by: James Burnside <2684369+JamesBurnside@users.noreply.github.com> Co-authored-by: Prathmesh Prabhu <82062616+prprabhu-ms@users.noreply.github.com> Co-authored-by: Donald McEachern <94866715+dmceachernmsft@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Porter Nan <jiangnanhello@live.com> Co-authored-by: Nan Jiang <jinan@microsoft.com>
1 parent 3d491b8 commit d614a2b

14 files changed

Lines changed: 145 additions & 56 deletions
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"type": "prerelease",
3+
"comment": "Make components string optional",
4+
"packageName": "@internal/react-components",
5+
"email": "carolinecao@microsoft.com",
6+
"dependentChangeType": "patch"
7+
}
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"type": "prerelease",
3+
"comment": "Add allow access modal to configuration screen",
4+
"packageName": "@internal/react-composites",
5+
"email": "carolinecao@microsoft.com",
6+
"dependentChangeType": "patch"
7+
}

packages/communication-react/review/beta/communication-react.api.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -191,7 +191,7 @@ export interface BaseCustomStyles {
191191
// @beta
192192
export interface BrowserPermissionDeniedIOSProps extends BrowserPermissionDeniedProps {
193193
imageSource?: string;
194-
strings: BrowserPermissionDeniedIOSStrings;
194+
strings?: BrowserPermissionDeniedIOSStrings;
195195
}
196196

197197
// @beta
@@ -211,9 +211,9 @@ export interface BrowserPermissionDeniedIOSStrings extends BrowserPermissionDeni
211211

212212
// @beta
213213
export interface BrowserPermissionDeniedProps {
214-
onTroubleshootingClick: () => void;
215-
onTryAgainClick: () => void;
216-
strings: BrowserPermissionDeniedStrings;
214+
onTroubleshootingClick?: () => void;
215+
onTryAgainClick?: () => void;
216+
strings?: BrowserPermissionDeniedStrings;
217217
styles?: BrowserPermissionDeniedStyles;
218218
}
219219

@@ -1792,6 +1792,7 @@ export interface _DevicePermissionDropdownProps {
17921792
askDevicePermission?(constrain: _PermissionConstraints): Promise<void>;
17931793
constrain?: _PermissionConstraints;
17941794
icon?: JSX.Element;
1795+
onClick?: () => void;
17951796
options?: IDropdownOption[];
17961797
strings?: _DevicePermissionDropdownStrings;
17971798
styles?: Partial<IDropdownStyles>;

packages/react-components/review/beta/react-components.api.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ export const BrowserPermissionDeniedIOS: (props: BrowserPermissionDeniedIOSProps
7676
// @beta
7777
export interface BrowserPermissionDeniedIOSProps extends BrowserPermissionDeniedProps {
7878
imageSource?: string;
79-
strings: BrowserPermissionDeniedIOSStrings;
79+
strings?: BrowserPermissionDeniedIOSStrings;
8080
}
8181

8282
// @beta
@@ -96,9 +96,9 @@ export interface BrowserPermissionDeniedIOSStrings extends BrowserPermissionDeni
9696

9797
// @beta
9898
export interface BrowserPermissionDeniedProps {
99-
onTroubleshootingClick: () => void;
100-
onTryAgainClick: () => void;
101-
strings: BrowserPermissionDeniedStrings;
99+
onTroubleshootingClick?: () => void;
100+
onTryAgainClick?: () => void;
101+
strings?: BrowserPermissionDeniedStrings;
102102
styles?: BrowserPermissionDeniedStyles;
103103
}
104104

@@ -487,6 +487,7 @@ export interface _DevicePermissionDropdownProps {
487487
askDevicePermission?(constrain: _PermissionConstraints): Promise<void>;
488488
constrain?: _PermissionConstraints;
489489
icon?: JSX.Element;
490+
onClick?: () => void;
490491
options?: IDropdownOption[];
491492
strings?: _DevicePermissionDropdownStrings;
492493
styles?: Partial<IDropdownStyles>;

packages/react-components/review/stable/react-components.api.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -398,6 +398,7 @@ export interface _DevicePermissionDropdownProps {
398398
askDevicePermission?(constrain: _PermissionConstraints): Promise<void>;
399399
constrain?: _PermissionConstraints;
400400
icon?: JSX.Element;
401+
onClick?: () => void;
401402
options?: IDropdownOption[];
402403
strings?: _DevicePermissionDropdownStrings;
403404
styles?: Partial<IDropdownStyles>;

packages/react-components/src/components/BrowserPermissionDenied.tsx

Lines changed: 21 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ import {
2020
textContainerStyles
2121
} from './styles/BrowserPermissionDenied.styles';
2222
import { BaseCustomStyles } from '../types';
23+
/* @conditional-compile-remove(call-readiness) */
24+
import { isValidString } from './utils';
2325

2426
/**
2527
* @beta
@@ -29,15 +31,15 @@ export interface BrowserPermissionDeniedProps {
2931
/**
3032
* Action to be taken by the more help link. Possible to send to external page or show other modal.
3133
*/
32-
onTroubleshootingClick: () => void;
34+
onTroubleshootingClick?: () => void;
3335
/**
3436
* Action to be taken by the try again primary button.
3537
*/
36-
onTryAgainClick: () => void;
38+
onTryAgainClick?: () => void;
3739
/**
3840
* Localization strings for BrowserPermissionDenied component.
3941
*/
40-
strings: BrowserPermissionDeniedStrings;
42+
strings?: BrowserPermissionDeniedStrings;
4143
/**
4244
* Allows users to pass in an object contains custom CSS styles.
4345
* @Example
@@ -94,16 +96,22 @@ const BrowserPermissionDeniedContainer = (props: BrowserPermissionDeniedProps):
9496
</Stack>
9597
</Stack>
9698
<Stack styles={textContainerStyles}>
97-
<Text styles={primaryTextStyles}>{strings.primaryText}</Text>
98-
<Text styles={secondaryTextStyles}>{strings.secondaryText}</Text>
99-
<PrimaryButton
100-
styles={mergeStyleSets(primaryButtonStyles, styles?.primaryButton)}
101-
text={strings.primaryButtonText}
102-
onClick={onTryAgainClick}
103-
/>
104-
<Link styles={mergeStyleSets(linkTextStyles, styles?.troubleshootingLink)} onClick={onTroubleshootingClick}>
105-
{strings.linkText}
106-
</Link>
99+
{isValidString(strings?.primaryText) && <Text styles={primaryTextStyles}>{strings?.primaryText}</Text>}
100+
{isValidString(strings?.secondaryText) && <Text styles={secondaryTextStyles}>{strings?.secondaryText}</Text>}
101+
102+
{onTryAgainClick && isValidString(strings?.primaryButtonText) && (
103+
<PrimaryButton
104+
styles={mergeStyleSets(primaryButtonStyles, styles?.primaryButton)}
105+
text={strings?.primaryButtonText}
106+
onClick={onTryAgainClick}
107+
/>
108+
)}
109+
110+
{onTroubleshootingClick && isValidString(strings?.linkText) && (
111+
<Link styles={mergeStyleSets(linkTextStyles, styles?.troubleshootingLink)} onClick={onTroubleshootingClick}>
112+
{strings?.linkText}
113+
</Link>
114+
)}
107115
</Stack>
108116
</Stack>
109117
);

packages/react-components/src/components/BrowserPermissionDeniedIOS.tsx

Lines changed: 37 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,8 @@ import {
2525
textContainerStyles
2626
} from './styles/BrowserPermissionDenied.styles';
2727
import { BrowserPermissionDeniedProps, BrowserPermissionDeniedStrings } from './BrowserPermissionDenied';
28+
/* @conditional-compile-remove(call-readiness) */
29+
import { isValidString } from './utils';
2830

2931
/**
3032
* @beta
@@ -34,7 +36,7 @@ export interface BrowserPermissionDeniedIOSProps extends BrowserPermissionDenied
3436
/**
3537
* Localization strings for BrowserPermissionDeniedIOS component.
3638
*/
37-
strings: BrowserPermissionDeniedIOSStrings;
39+
strings?: BrowserPermissionDeniedIOSStrings;
3840
/**
3941
* Link to image source.
4042
*
@@ -107,58 +109,64 @@ const BrowserPermissionDeniedIOSContainer = (props: BrowserPermissionDeniedIOSPr
107109
<Stack styles={browserPermissionContainerStyles}>
108110
{imageSource && (
109111
<Stack styles={mergeStyleSets(iOSImageContainer, { root: { background: theme.palette.neutralLighter } })}>
110-
<Image
111-
src={imageSource ?? ''}
112-
alt={strings.imageAltText}
113-
imageFit={ImageFit.centerContain}
114-
style={{ padding: '1.5rem' }}
115-
/>
112+
{isValidString(strings?.imageAltText) && (
113+
<Image
114+
src={imageSource ?? ''}
115+
alt={strings?.imageAltText}
116+
imageFit={ImageFit.centerContain}
117+
style={{ padding: '1.5rem' }}
118+
/>
119+
)}
116120
</Stack>
117121
)}
118122
<Stack style={{ padding: '1rem', paddingBottom: '1.25rem' }}>
119123
<Stack styles={textContainerStyles}>
120-
<Text styles={primaryTextStyles}>{strings.primaryText}</Text>
121-
<Text styles={secondaryTextStyles}>{strings.secondaryText}</Text>
122-
{strings.step1Text && (
124+
{isValidString(strings?.primaryText) && <Text styles={primaryTextStyles}>{strings?.primaryText}</Text>}
125+
{isValidString(strings?.secondaryText) && <Text styles={secondaryTextStyles}>{strings?.secondaryText}</Text>}
126+
{isValidString(strings?.step1Text) && (
123127
<Stack styles={iOSStepsContainerStyles}>
124128
<Stack horizontalAlign={'center'} styles={stepsCircleStyle}>
125-
<Text styles={iOSStepsDigitTextStyles}>{strings.step1DigitText}</Text>
129+
<Text styles={iOSStepsDigitTextStyles}>{strings?.step1DigitText}</Text>
126130
</Stack>
127-
<Text styles={iOSStepsTextStyles}>{strings.step1Text}</Text>
131+
<Text styles={iOSStepsTextStyles}>{strings?.step1Text}</Text>
128132
</Stack>
129133
)}
130-
{strings.step2Text && (
134+
{isValidString(strings?.step2Text) && (
131135
<Stack styles={iOSStepsContainerStyles}>
132136
<Stack horizontalAlign={'center'} styles={stepsCircleStyle}>
133-
<Text styles={iOSStepsDigitTextStyles}>{strings.step2DigitText}</Text>
137+
<Text styles={iOSStepsDigitTextStyles}>{strings?.step2DigitText}</Text>
134138
</Stack>
135-
<Text styles={iOSStepsTextStyles}>{strings.step2Text}</Text>
139+
<Text styles={iOSStepsTextStyles}>{strings?.step2Text}</Text>
136140
</Stack>
137141
)}
138-
{strings.step3Text && (
142+
{isValidString(strings?.step3Text) && (
139143
<Stack styles={iOSStepsContainerStyles}>
140144
<Stack horizontalAlign={'center'} styles={stepsCircleStyle}>
141-
<Text styles={iOSStepsDigitTextStyles}>{strings.step3DigitText}</Text>
145+
<Text styles={iOSStepsDigitTextStyles}>{strings?.step3DigitText}</Text>
142146
</Stack>
143-
<Text styles={iOSStepsTextStyles}>{strings.step3Text}</Text>
147+
<Text styles={iOSStepsTextStyles}>{strings?.step3Text}</Text>
144148
</Stack>
145149
)}
146-
{strings.step4Text && (
150+
{isValidString(strings?.step4Text) && (
147151
<Stack styles={mergeStyleSets(iOSStepsContainerStyles, { root: { paddingBottom: '1.5rem' } })}>
148152
<Stack horizontalAlign={'center'} styles={stepsCircleStyle}>
149-
<Text styles={iOSStepsDigitTextStyles}>{strings.step4DigitText}</Text>
153+
<Text styles={iOSStepsDigitTextStyles}>{strings?.step4DigitText}</Text>
150154
</Stack>
151-
<Text styles={iOSStepsTextStyles}>{strings.step4Text}</Text>
155+
<Text styles={iOSStepsTextStyles}>{strings?.step4Text}</Text>
152156
</Stack>
153157
)}
154-
<PrimaryButton
155-
styles={mergeStyleSets(primaryButtonStyles, styles?.primaryButton)}
156-
text={strings.primaryButtonText}
157-
onClick={onTryAgainClick}
158-
/>
159-
<Link styles={mergeStyleSets(linkTextStyles, styles?.troubleshootingLink)} onClick={onTroubleshootingClick}>
160-
{strings.linkText}
161-
</Link>
158+
{isValidString(strings?.primaryButtonText) && (
159+
<PrimaryButton
160+
styles={mergeStyleSets(primaryButtonStyles, styles?.primaryButton)}
161+
text={strings?.primaryButtonText}
162+
onClick={onTryAgainClick}
163+
/>
164+
)}
165+
{isValidString(strings?.linkText) && (
166+
<Link styles={mergeStyleSets(linkTextStyles, styles?.troubleshootingLink)} onClick={onTroubleshootingClick}>
167+
{strings?.linkText}
168+
</Link>
169+
)}
162170
</Stack>
163171
</Stack>
164172
</Stack>

packages/react-components/src/components/DevicePermissionDropdown.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,10 @@ export interface _DevicePermissionDropdownProps {
4646
* @param constrain - Define constraints for accessing local devices {@link @azure/communication-calling#PermissionConstraints }
4747
*/
4848
askDevicePermission?(constrain: _PermissionConstraints): Promise<void>;
49+
/**
50+
* Optional callback when component is clicked
51+
*/
52+
onClick?: () => void;
4953
/**
5054
* Define constraints for accessing local devices {@link @azure/communication-calling#PermissionConstraints }
5155
*/
@@ -66,7 +70,7 @@ export interface _DevicePermissionDropdownProps {
6670
* @internal
6771
*/
6872
export const _DevicePermissionDropdown = (props: _DevicePermissionDropdownProps): JSX.Element => {
69-
const { icon, askDevicePermission, constrain, strings, options, styles } = props;
73+
const { icon, askDevicePermission, onClick, constrain, strings, options, styles } = props;
7074

7175
const onRenderPlaceholder = (): JSX.Element => {
7276
return (
@@ -91,6 +95,7 @@ export const _DevicePermissionDropdown = (props: _DevicePermissionDropdownProps)
9195
if (askDevicePermission) {
9296
askDevicePermission(constrain ?? { video: true, audio: true });
9397
}
98+
onClick?.();
9499
}}
95100
options={options ?? []}
96101
styles={styles}

packages/react-components/src/components/DomainPermissions.tsx

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@ import {
1919
sparkleIconBackdropStyles,
2020
textContainerStyles
2121
} from './styles/DomainPermissions.styles';
22+
/* @conditional-compile-remove(call-readiness) */
23+
import { isValidString } from './utils';
2224

2325
/**
2426
* @beta
@@ -121,8 +123,3 @@ export const DomainPermissions = (props: DomainPermissionsProps): JSX.Element =>
121123
return <DomainPermissionsContainer {...props} strings={props.strings ? props.strings : locale} />;
122124
return <></>;
123125
};
124-
125-
/* @conditional-compile-remove(call-readiness) */
126-
const isValidString = (string: string | undefined): boolean => {
127-
return !!string && string.length > 0;
128-
};

packages/react-components/src/components/utils.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -177,3 +177,11 @@ export const customIconName: Partial<{ [key in ErrorType]: string }> = {
177177
callVideoRecoveredBySystem: 'ErrorBarCallVideoRecoveredBySystem',
178178
callMacOsCameraAccessDenied: 'ErrorBarCallMacOsCameraAccessDenied'
179179
};
180+
181+
/* @conditional-compile-remove(call-readiness) */
182+
/**
183+
* @private
184+
*/
185+
export const isValidString = (string: string | undefined): boolean => {
186+
return !!string && string.length > 0;
187+
};

0 commit comments

Comments
 (0)