Skip to content

[bugfix widget] Remove side pane button container when neither button enabled #2969

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

Merged
dmceachernmsft merged 12 commits into from
May 9, 2023
Merged

[bugfix widget] Remove side pane button container when neither button enabled #2969

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
20920d8
hide side bar div when people and chat hidden
dmceachernmsft Apr 21, 2023
f5fca7a
use isEnabled util
dmceachernmsft Apr 21, 2023
e29e005
Change files
dmceachernmsft Apr 21, 2023
f7949f0
Duplicate change files for beta release
dmceachernmsft Apr 21, 2023
6b216c4
add logic for custom buttons
dmceachernmsft Apr 21, 2023
4c42acd
Merge branch 'main' into dmceachernmsft/commoncontrolshidesidebar
dmceachernmsft Apr 21, 2023
59412e6
fix cc
dmceachernmsft Apr 21, 2023
b19e525
Merge branch 'main' into dmceachernmsft/commoncontrolshidesidebar
dmceachernmsft Apr 24, 2023
a9d751a
Merge branch 'main' into dmceachernmsft/commoncontrolshidesidebar
dmceachernmsft Apr 27, 2023
b915f75
Merge branch 'main' into dmceachernmsft/commoncontrolshidesidebar
dmceachernmsft May 1, 2023
6f70136
Merge branch 'main' of https://github.com/Azure/communication-ui-libr…
dmceachernmsft May 8, 2023
6429e17
Merge branch 'main' into dmceachernmsft/commoncontrolshidesidebar
dmceachernmsft May 9, 2023
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
7 changes: 7 additions & 0 deletions change-beta/@azure-communication-react-bd530d9e-3ef2-4521-b399-b00e6ff2ceba.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"type": "patch",
"comment": "Remove side pane control button container if no controls are present to be used",
"packageName": "@azure/communication-react",
"email": "94866715+dmceachernmsft@users.noreply.github.com",
"dependentChangeType": "patch"
}
7 changes: 7 additions & 0 deletions change/@azure-communication-react-bd530d9e-3ef2-4521-b399-b00e6ff2ceba.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"type": "patch",
"comment": "Remove side pane control button container if no controls are present to be used",
"packageName": "@azure/communication-react",
"email": "94866715+dmceachernmsft@users.noreply.github.com",
"dependentChangeType": "patch"
}
74 changes: 39 additions & 35 deletions packages/react-composites/src/composites/common/ControlBar/CommonCallControlBar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -377,41 +377,45 @@ export const CommonCallControlBar = (props: CommonCallControlBarProps & Containe
</Stack>
</CallAdapterProvider>
</Stack.Item>
{!props.mobileView && (
<Stack.Item>
<div ref={sidepaneControlsRef}>
<Stack horizontal className={!props.mobileView ? mergeStyles(desktopButtonContainerStyle) : undefined}>
{
/* @conditional-compile-remove(control-bar-button-injection) */
customButtons['secondary']
?.slice(0, CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS)
.map((CustomButton, i) => {
return (
<CustomButton
key={`secondary-custom-button-${i}`}
styles={commonButtonStyles}
showLabel={options.displayType !== 'compact'}
/>
);
})
}
{isEnabled(options?.peopleButton) && (
<PeopleButton
checked={props.peopleButtonChecked}
ariaLabel={peopleButtonStrings?.label}
showLabel={options.displayType !== 'compact'}
onClick={props.onPeopleButtonClicked}
data-ui-id="common-call-composite-people-button"
disabled={props.disableButtonsForLobbyPage || isDisabled(options.peopleButton)}
strings={peopleButtonStrings}
styles={commonButtonStyles}
/>
)}
{isEnabled(options?.chatButton) && chatButton}
</Stack>
</div>
</Stack.Item>
)}
{!props.mobileView &&
(isEnabled(options.peopleButton) ||
Copy link
Copy Markdown
Member

@JamesBurnside JamesBurnside May 8, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

consider making this a bool above to reduce the amount to parse here

const secondaryButtonsExist = !props.mobileView && (isEnabled(options.peopleButton) || isEnabled(options.chatButton) || customButtons['secondary'] !== undefined)

isEnabled(options.chatButton) ||
/* @conditional-compile-remove(control-bar-button-injection) */ customButtons['secondary'] !==
Copy link
Copy Markdown
Member

@JamesBurnside JamesBurnside May 8, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remove conditional compile, callwithchat uses this

undefined) && (
<Stack.Item>
<div ref={sidepaneControlsRef}>
<Stack horizontal className={!props.mobileView ? mergeStyles(desktopButtonContainerStyle) : undefined}>
{
/* @conditional-compile-remove(control-bar-button-injection) */
customButtons['secondary']
?.slice(0, CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS)
.map((CustomButton, i) => {
return (
<CustomButton
key={`secondary-custom-button-${i}`}
styles={commonButtonStyles}
showLabel={options.displayType !== 'compact'}
/>
);
})
}
{isEnabled(options?.peopleButton) && (
<PeopleButton
checked={props.peopleButtonChecked}
ariaLabel={peopleButtonStrings?.label}
showLabel={options.displayType !== 'compact'}
onClick={props.onPeopleButtonClicked}
data-ui-id="common-call-composite-people-button"
disabled={props.disableButtonsForLobbyPage || isDisabled(options.peopleButton)}
strings={peopleButtonStrings}
styles={commonButtonStyles}
/>
)}
{isEnabled(options?.chatButton) && chatButton}
</Stack>
</div>
</Stack.Item>
)}
</Stack>
</div>
);
Expand Down
⚡