Theme
{ toggleSystemTheme(); updateState({}); }}
/>
)}
content={Use light or dark mode based on the system settings.}
/>
{
if (settings.useSystemTheme) toggleSystemTheme();
settings.setTheme(index);
updateState({});
}}
/>
)}
/>
setUseSystemEmoji(!useSystemEmoji)}
/>
)}
content={Use system emoji instead of Twitter emojis.}
/>
Room messages
setMessageLayout(index)}
/>
}
/>
s === messageSpacing)}
segments={[
{ text: 'No' },
{ text: 'XXS' },
{ text: 'XS' },
{ text: 'S' },
{ text: 'M' },
{ text: 'L' },
]}
onSelect={(index) => {
setMessageSpacing(spacings[index])
}}
/>
}
/>
setIsMarkdown(!isMarkdown) }
/>
)}
content={Format messages with inline markdown syntax before sending.}
/>
setHideMembershipEvents(!hideMembershipEvents)}
/>
)}
content={Hide membership change messages from room timeline. (Join, Leave, Invite, Kick and Ban)}
/>
setHideNickAvatarEvents(!hideNickAvatarEvents)}
/>
)}
content={Hide nick and avatar change messages from room timeline.}
/>
setMediaAutoLoad(!mediaAutoLoad)}
/>
)}
content={Prevent images and videos from auto loading to save bandwidth.}
/>
setShowHiddenEvents(!showHiddenEvents)}
/>
)}
content={Show hidden state and message events.}
/>
);
}
function NotificationsSection() {
const [permission, setPermission] = usePermission('notifications', window.Notification?.permission);
const [, updateState] = useState({});
const renderOptions = () => {
if (window.Notification === undefined) {
return