From 44a655835b9cd24aea0f5d043d368d944f3688e6 Mon Sep 17 00:00:00 2001
From: Sebastien Marinier <seb@smarinier.net>
Date: Thu, 15 Aug 2024 15:42:55 +0200
Subject: [PATCH] fix: 261 remove some backticks

remove backticks interfering with xgettext translations sentences extraction
---
 ts/Common/ShareSelection.tsx       |  2 +-
 ts/Manager/EditRoomDialog.tsx      | 36 +++++++++++++++---------------
 ts/Manager/RoomRow.tsx             |  6 ++---
 ts/Manager/ShareWith.tsx           |  8 +++----
 ts/Restrictions/RestrictionRow.tsx |  4 ++--
 5 files changed, 28 insertions(+), 28 deletions(-)

diff --git a/ts/Common/ShareSelection.tsx b/ts/Common/ShareSelection.tsx
index 9a5a5d8..cd6a83d 100644
--- a/ts/Common/ShareSelection.tsx
+++ b/ts/Common/ShareSelection.tsx
@@ -78,7 +78,7 @@ const ShareSelection: React.FC<Props> = (props) => {
 					className="suggestion"
 					onMouseDown={preventOnBlurEvent}
 					onClick={() => selectShare(option)}>
-					{option.label}{option.value.shareType === ShareType.Group ? ` (${t('bbb', 'Group')})` : ''}
+					{option.label}{option.value.shareType === ShareType.Group ? ' (' + t('bbb', 'Group') + ')' : ''}
 				</li>);
 		};
 
diff --git a/ts/Manager/EditRoomDialog.tsx b/ts/Manager/EditRoomDialog.tsx
index a0b1bde..e0a6377 100644
--- a/ts/Manager/EditRoomDialog.tsx
+++ b/ts/Manager/EditRoomDialog.tsx
@@ -65,7 +65,7 @@ const EditRoomDialog: React.FC<Props> = ({ room, restriction, updateProperty, op
 	function inputElement(label: string, field: string, type: 'text' | 'number' = 'text') {
 		return (
 			<div className="bbb-form-element">
-				<label htmlFor={`bbb-${field}`}>
+				<label htmlFor={'bbb-' + field}>
 					<h3>{label}</h3>
 				</label>
 
@@ -78,7 +78,7 @@ const EditRoomDialog: React.FC<Props> = ({ room, restriction, updateProperty, op
 	function selectElement(label: string, field: string, value: string, options: { [key: string]: string }, onChange: (value: string) => void) {
 		return (
 			<div className="bbb-form-element">
-				<label htmlFor={`bbb-${field}`}>
+				<label htmlFor={'bbb-' + field}>
 					<h3>{label}</h3>
 				</label>
 
@@ -136,22 +136,22 @@ const EditRoomDialog: React.FC<Props> = ({ room, restriction, updateProperty, op
 				{!room.everyoneIsModerator && <ShareWith permission={Permission.Moderator} room={room} shares={shares} setShares={setShares} />}
 
 				<div className="bbb-mt-1">
-					<input id={`bbb-everyoneIsModerator-${room.id}`}
+					<input id={'bbb-everyoneIsModerator-' + room.id}
 						type="checkbox"
 						className="checkbox"
 						checked={room.everyoneIsModerator}
 						onChange={(event) => updateProperty('everyoneIsModerator', event.target.checked)} />
-					<label htmlFor={`bbb-everyoneIsModerator-${room.id}`}>{t('bbb', 'Every participant is moderator')}</label>
+					<label htmlFor={'bbb-everyoneIsModerator-' + room.id}>{t('bbb', 'Every participant is moderator')}</label>
 				</div>
 				<em>{descriptions.moderator}</em>
 
 				<div className="bbb-mt-1">
-					<input id={`bbb-moderatorToken-${room.id}`}
+					<input id={'bbb-moderatorToken-' + room.id}
 						type="checkbox"
 						className="checkbox"
 						checked={!!room.moderatorToken}
 						onChange={(event) => updateProperty('moderatorToken', event.target.checked ? 'true' : null)} />
-					<label htmlFor={`bbb-moderatorToken-${room.id}`}>{t('bbb', 'Moderator access via URL')}</label>
+					<label htmlFor={'bbb-moderatorToken-' + room.id}>{t('bbb', 'Moderator access via URL')}</label>
 				</div>
 				{!!room.moderatorToken && <CopyToClipboard text={api.getRoomUrl(room, true)}><input type="text" readOnly={true} className="icon-clippy" value={api.getRoomUrl(room, true)} /></CopyToClipboard>}
 				<em>{descriptions.moderatorToken}</em>
@@ -161,68 +161,68 @@ const EditRoomDialog: React.FC<Props> = ({ room, restriction, updateProperty, op
 				<h3>{t('bbb', 'Miscellaneous')}</h3>
 				<div>
 					<div>
-						<input id={`bbb-record-${room.id}`}
+						<input id={'bbb-record-' + room.id}
 							type="checkbox"
 							className="checkbox"
 							checked={room.record}
 							disabled={!restriction?.allowRecording}
 							onChange={(event) => updateProperty('record', event.target.checked)} />
-						<label htmlFor={`bbb-record-${room.id}`}>{t('bbb', 'Recording')}</label>
+						<label htmlFor={'bbb-record-' + room.id}>{t('bbb', 'Recording')}</label>
 					</div>
 					<p><em>{descriptions.recording}</em></p>
 				</div>
 				<div>
 					<div>
-						<input id={`bbb-requireModerator-${room.id}`}
+						<input id={'bbb-requireModerator-' + room.id}
 							type="checkbox"
 							className="checkbox"
 							checked={room.requireModerator}
 							onChange={(event) => updateProperty('requireModerator', event.target.checked)} />
-						<label htmlFor={`bbb-requireModerator-${room.id}`}>{t('bbb', 'Require moderator to start room')}</label>
+						<label htmlFor={'bbb-requireModerator-' + room.id}>{t('bbb', 'Require moderator to start room')}</label>
 					</div>
 					<p><em>{descriptions.requireModerator}</em></p>
 				</div>
 				<div>
 					<div>
-						<input id={`bbb-listenOnly-${room.id}`}
+						<input id={'bbb-listenOnly-' + room.id}
 							type="checkbox"
 							className="checkbox"
 							checked={room.listenOnly}
 							onChange={(event) => updateProperty('listenOnly', event.target.checked)} />
-						<label htmlFor={`bbb-listenOnly-${room.id}`}>{t('bbb', 'Listen only option')}</label>
+						<label htmlFor={'bbb-listenOnly-' + room.id}>{t('bbb', 'Listen only option')}</label>
 					</div>
 					<p><em>{descriptions.listenOnly}</em></p>
 				</div>
 				<div>
 					<div>
-						<input id={`bbb-mediaCheck-${room.id}`}
+						<input id={'bbb-mediaCheck-' + room.id}
 							type="checkbox"
 							className="checkbox"
 							checked={!room.mediaCheck}
 							onChange={(event) => updateProperty('mediaCheck', !event.target.checked)} />
-						<label htmlFor={`bbb-mediaCheck-${room.id}`}>{t('bbb', 'Skip media check before usage')}</label>
+						<label htmlFor={'bbb-mediaCheck-' + room.id}>{t('bbb', 'Skip media check before usage')}</label>
 					</div>
 					<p><em>{descriptions.mediaCheck}</em></p>
 				</div>
 				<div>
 					<div>
-						<input id={`bbb-cleanLayout-${room.id}`}
+						<input id={'bbb-cleanLayout-' + room.id}
 							type="checkbox"
 							className="checkbox"
 							checked={room.cleanLayout}
 							onChange={(event) => updateProperty('cleanLayout', event.target.checked)} />
-						<label htmlFor={`bbb-cleanLayout-${room.id}`}>{t('bbb', 'Clean layout')}</label>
+						<label htmlFor={'bbb-cleanLayout-' + room.id}>{t('bbb', 'Clean layout')}</label>
 					</div>
 					<p><em>{descriptions.cleanLayout}</em></p>
 				</div>
 				<div>
 					<div>
-						<input id={`bbb-joinMuted-${room.id}`}
+						<input id={'bbb-joinMuted-' + room.id}
 							type="checkbox"
 							className="checkbox"
 							checked={room.joinMuted}
 							onChange={(event) => updateProperty('joinMuted', event.target.checked)} />
-						<label htmlFor={`bbb-joinMuted-${room.id}`}>{t('bbb', 'Join meeting muted')}</label>
+						<label htmlFor={'bbb-joinMuted-' + room.id}>{t('bbb', 'Join meeting muted')}</label>
 					</div>
 					<p><em>{descriptions.joinMuted}</em></p>
 				</div>
diff --git a/ts/Manager/RoomRow.tsx b/ts/Manager/RoomRow.tsx
index 5db1c7e..5b6977d 100644
--- a/ts/Manager/RoomRow.tsx
+++ b/ts/Manager/RoomRow.tsx
@@ -194,7 +194,7 @@ const RoomRow: React.FC<Props> = (props) => {
 			<tr className={showRecordings ? 'selected-row' : ''}>
 				<td className="start">
 					<a href={api.getRoomUrl(room)}
-						className={`button ${room.running ? 'success' : 'primary'}`}
+						className={'button ' + (room.running ? 'success' : 'primary')}
 						target="_blank"
 						rel="noopener noreferrer"
 						title={t('bbb', 'Open room')}>
@@ -227,8 +227,8 @@ const RoomRow: React.FC<Props> = (props) => {
 					{edit('maxParticipants', 'number', {min: minParticipantsLimit, max: maxParticipantsLimit < 0 ? undefined : maxParticipantsLimit})}
 				</td>
 				<td className="record bbb-shrink">
-					<input id={`bbb-record-${room.id}`} type="checkbox" className="checkbox" disabled={!props.restriction?.allowRecording} checked={room.record} onChange={(event) => updateRoom('record', event.target.checked)} />
-					<label htmlFor={`bbb-record-${room.id}`}></label>
+					<input id={'bbb-record-' + room.id} type="checkbox" className="checkbox" disabled={!props.restriction?.allowRecording} checked={room.record} onChange={(event) => updateRoom('record', event.target.checked)} />
+					<label htmlFor={'bbb-record-' + room.id}></label>
 				</td>
 				<td className="bbb-shrink"><RecordingsNumber recordings={recordings} showRecordings={showRecordings} setShowRecordings={setShowRecordings} /></td>
 				<td className="edit icon-col">
diff --git a/ts/Manager/ShareWith.tsx b/ts/Manager/ShareWith.tsx
index 7ba623b..232c6c9 100644
--- a/ts/Manager/ShareWith.tsx
+++ b/ts/Manager/ShareWith.tsx
@@ -79,14 +79,14 @@ const ShareWith: React.FC<Props> = ({ room, permission, shares: allShares, setSh
 					return (
 						<li key={share.id} className="bbb-shareWith__item">
 							<div className="avatardiv">
-								{avatarUrl && <img src={avatarUrl} alt={`Avatar from ${displayName}`} />}
+								{avatarUrl && <img src={avatarUrl} alt={'Avatar from ' + displayName} />}
 								{share.shareType === ShareType.Group && <span className="icon-group-white"></span>}
 								{share.shareType === ShareType.Circle && <span className="icon-circle-white"></span>}
 							</div>
 							<div className="bbb-shareWith__item__label">
 								<h5>{displayName}
-									{(share.permission === Permission.Moderator && permission === Permission.User) && ` (${t('bbb', 'moderator')})`}
-									{(share.permission === Permission.Admin) && ` (${t('bbb', 'admin')})`}</h5>
+									{(share.permission === Permission.Moderator && permission === Permission.User) && (' (' + t('bbb', 'moderator') + ')')}
+									{(share.permission === Permission.Admin) && (' (' + t('bbb', 'admin') + ')')}</h5>
 							</div>
 							{(share.id > -1 && permission === Permission.Moderator && isOwner) && <div className="bbb-shareWith__item__action">
 								<button className="action-item"
@@ -95,7 +95,7 @@ const ShareWith: React.FC<Props> = ({ room, permission, shares: allShares, setSh
 										toggleAdminShare(share);
 									}}
 									title={t('bbb', 'Share')}>
-									<span className={`icon icon-shared icon-visible ${share.permission === Permission.Admin ? 'bbb-icon-selected' : 'bbb-icon-unselected'}`}></span>
+									<span className={'icon icon-shared icon-visible ' + (share.permission === Permission.Admin ? 'bbb-icon-selected' : 'bbb-icon-unselected')}></span>
 								</button>
 							</div>}
 							{(share.id > -1 && isOwner) && <div className="bbb-shareWith__item__action">
diff --git a/ts/Restrictions/RestrictionRow.tsx b/ts/Restrictions/RestrictionRow.tsx
index 3c5c899..39642a9 100644
--- a/ts/Restrictions/RestrictionRow.tsx
+++ b/ts/Restrictions/RestrictionRow.tsx
@@ -63,12 +63,12 @@ const RestrictionRoom: React.FC<Props> = (props) => {
 
 			<td className="record bbb-shrink">
 				<input
-					id={`bbb-record-${restriction.id}`}
+					id={'bbb-record-' + restriction.id}
 					type="checkbox"
 					className="checkbox"
 					checked={restriction.allowRecording}
 					onChange={(event) => updateRestriction('allowRecording', event.target.checked)} />
-				<label htmlFor={`bbb-record-${restriction.id}`}></label>
+				<label htmlFor={'bbb-record-' + restriction.id}></label>
 			</td>
 
 			<td className="remove icon-col">