Remove div container when action buttons is empty (#1124)

Co-authored-by: Timur Zhigmytov <timur.zhigmytov@mediamonks.com>
This commit is contained in:
Timur Zhigmytov 2021-06-20 07:12:28 +06:00 committed by GitHub
parent 2bc9b4b7e7
commit 1b5f8b9f1d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -550,21 +550,22 @@ export default class App extends Component {
: html` <${VideoPoster} offlineImage=${logo} active=${streamOnline} /> `; : html` <${VideoPoster} offlineImage=${logo} active=${streamOnline} /> `;
const externalActionButtons = const externalActionButtons =
externalActions && externalActions && externalActions.length > 0
html`<div ? html`<div
id="external-actions-container" id="external-actions-container"
class="flex flex-row align-center" class="flex flex-row align-center"
> >
${externalActions.map( ${externalActions.map(
function (action, index) { function (action, index) {
return html`<${ExternalActionButton} return html`<${ExternalActionButton}
onClick=${this.displayExternalAction} onClick=${this.displayExternalAction}
action=${action} action=${action}
index=${index} index=${index}
/>`; />`;
}.bind(this) }.bind(this)
)} )}
</div>`; </div>`
: null;
const externalActionModal = externalAction const externalActionModal = externalAction
? html`<${ExternalActionModal} ? html`<${ExternalActionModal}
@ -667,7 +668,7 @@ export default class App extends Component {
<h2 class="font-semibold text-5xl"> <h2 class="font-semibold text-5xl">
<span class="streamer-name text-indigo-600">${name}</span> <span class="streamer-name text-indigo-600">${name}</span>
</h2> </h2>
<div>${externalActionButtons}</div> ${externalActionButtons && html`<div>${externalActionButtons}</div>`}
<h3 class="font-semibold text-3xl"> <h3 class="font-semibold text-3xl">
${streamOnline && streamTitle} ${streamOnline && streamTitle}
</h3> </h3>