diff --git a/package.json b/package.json
index 5d72d8e..fa2bd12 100644
--- a/package.json
+++ b/package.json
@@ -43,8 +43,10 @@
"@octokit/rest": "^18.0.4",
"archiver": "^5.0.0",
"colors": "^1.4.0",
+ "dompurify": "^3.2.5",
"dotenv": "^16.0.0",
"execa": "^6.1.0",
+ "html-react-parser": "^5.2.5",
"libxmljs": "^1.0.11",
"qrcode.react": "^2.0.0",
"react-copy-to-clipboard": "^5.0.2",
diff --git a/ts/Common/Translation.ts b/ts/Common/Translation.ts
index 8d78cf7..38b5939 100644
--- a/ts/Common/Translation.ts
+++ b/ts/Common/Translation.ts
@@ -1,4 +1,6 @@
import { Access, Permission } from './Api';
+import parse from 'html-react-parser';
+import DOMPurify from 'dompurify';
export const AccessOptions = {
[Access.Public]: t('bbb', 'Public'),
@@ -14,3 +16,7 @@ export const PermissionsOptions = {
[Permission.Moderator]: t('bbb', 'moderator'),
[Permission.User]: t('bbb', 'user'),
};
+
+export function html_sanitize_and_parse(str: string): string {
+ return parse(DOMPurify.sanitize(str, { USE_PROFILES: { html: true } }));
+}
diff --git a/ts/Manager/EditRoomDialog.tsx b/ts/Manager/EditRoomDialog.tsx
index ddf184f..d7307d5 100644
--- a/ts/Manager/EditRoomDialog.tsx
+++ b/ts/Manager/EditRoomDialog.tsx
@@ -5,14 +5,14 @@ import { Access, Room, Permission, RoomShare, api, Restriction } from '../Common
import Dialog from './Dialog';
import ShareWith from './ShareWith';
import { SubmitInput } from './SubmitInput';
-import { AccessOptions } from '../Common/Translation';
+import { AccessOptions, html_sanitize_and_parse } from '../Common/Translation';
const descriptions: { [key: string]: string } = {
name: t('bbb', 'Descriptive name of this room.'),
welcome: t('bbb', 'This message is shown to all users in the chat area after they joined.'),
maxParticipants: t('bbb', 'Sets a limit on the number of participants for this room. Zero means there is no limit.'),
recording: t('bbb', 'If enabled, the moderator is able to start the recording.'),
- access: t('bbb', 'Explanation of the different concepts that constitute access options : - Public: Anyone who has the link can join.- Internal: Only Nextcloud users can join.- Password: Only guests who have the password can join..- Waiting room: A moderator must accept each guest before they can join.- Restricted : Only selected users and groups can access this room.'),
+ access: t('bbb', 'Explanation of the different concepts that constitute access options : - Public: Anyone who has the link can join. - Internal: Only Nextcloud users can join. - Password: Only guests who have the password can join. - Waiting room: A moderator must accept each guest before they can join. - Restricted : Only selected users and groups can access this room.'),
moderator: t('bbb', 'A moderator is able to manage all participants in a meeting including kicking, muting or selecting a presenter. Users with the role moderator are also able to close a meeting or change the default settings.'),
requireModerator: t('bbb', 'If enabled, normal users have to wait until a moderator is in the room.'),
moderatorToken: t('bbb', 'If enabled, a moderator URL is generated which allows access with moderator permission.'),
@@ -70,7 +70,7 @@ const EditRoomDialog: React.FC = ({ room, restriction, updateProperty, op
updateProperty(field, value)} min={minParticipantsLimit} max={maxParticipantsLimit} />
- {descriptions[field] && {descriptions[field]}}
+ {descriptions[field] && {html_sanitize_and_parse(descriptions[field])}}
);
}
@@ -90,7 +90,7 @@ const EditRoomDialog: React.FC = ({ room, restriction, updateProperty, op
})}
{(value === Access.Password && room.password) && }
- {descriptions[field] && {descriptions[field]}}
+ {descriptions[field] && {html_sanitize_and_parse(descriptions[field])}}
);
}
@@ -103,7 +103,7 @@ const EditRoomDialog: React.FC = ({ room, restriction, updateProperty, op
}
return (
-