Theme
{
toggleSystemTheme();
updateState({});
}}
/>
}
content={Use light or dark mode based on the system settings.}
/>
{
if (settings.useSystemTheme) toggleSystemTheme();
settings.setTheme(index);
updateState({});
}}
/>
}
/>
setTwitterEmoji(!twitterEmoji)} />
}
content={Use Twitter emoji instead of system emoji.}
/>
%}
/>
}
content={
Change page zoom to scale user interface between 75% to 150%. Default: 100%
}
/>
Room messages
setMessageLayout(index)}
/>
}
/>
s === messageSpacing)}
segments={[
{ text: 'No' },
{ text: 'XXS' },
{ text: 'XS' },
{ text: 'S' },
{ text: 'M' },
{ text: 'L' },
]}
onSelect={(index) => {
setMessageSpacing(spacings[index]);
}}
/>
}
/>
setEnterForNewline(!enterForNewline)}
/>
}
content={
{`Use ${
isMacOS() ? KeySymbol.Command : 'Ctrl'
} + ENTER to send message and ENTER for newline.`}
}
/>
setIsMarkdown(!isMarkdown)} />}
content={Format messages with 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.
}
/>
setUrlPreview(!urlPreview)} />}
content={Show url preview for link in messages.}
/>
setEncUrlPreview(!encUrlPreview)} />
}
content={Show url preview for link in encrypted messages.}
/>
setShowHiddenEvents(!showHiddenEvents)}
/>
}
content={Show hidden state and message events.}
/>
);
}
function NotificationsSection() {
const notifPermission = usePermissionState(
'notifications',
window.Notification?.permission ?? 'denied'
);
const [showNotifications, setShowNotifications] = useSetting(settingsAtom, 'showNotifications');
const [isNotificationSounds, setIsNotificationSounds] = useSetting(
settingsAtom,
'isNotificationSounds'
);
const renderOptions = () => {
if (window.Notification === undefined) {
return (