Organized settings, made Embed compontent more logical

This commit is contained in:
ayes-web 2022-11-17 16:47:35 +02:00
parent 618602dc4f
commit d36a6f6022
3 changed files with 38 additions and 42 deletions

View file

@ -440,28 +440,27 @@ function Embed({ link }) {
});
if (urlPreviewInfo != null) {
const imageURL = urlPreviewInfo['og:image'] || urlPreviewInfo['og:image:secure_url'];
const image = (imageURL != null) ? (
<Image
link={mx.mxcUrlToHttp(imageURL)}
height={urlPreviewInfo['og:image:height'] != null ? parseInt(urlPreviewInfo['og:image:height'], 10) : null}
width={urlPreviewInfo['og:image:width'] != null ? parseInt(urlPreviewInfo['og:image:width'], 10) : null}
name={urlPreviewInfo['og:image:alt'] || urlPreviewInfo['og:site_name'] || ''}
type={urlPreviewInfo['og:image:type'] != null ? urlPreviewInfo['og:image:type'] : null}
/>
) : null;
// Image only embed
if (urlPreviewInfo['og:image'] != null && urlPreviewInfo['og:image:width'] != null && urlPreviewInfo['og:image:height'] != null && urlPreviewInfo['og:title'] == null && urlPreviewInfo['og:description'] == null) {
if (image != null && urlPreviewInfo['og:title'] == null && urlPreviewInfo['og:description'] == null) {
return (
<div className="file-container">
<Image
link={mx.mxcUrlToHttp(urlPreviewInfo['og:image'])}
height={parseInt(urlPreviewInfo['og:image:height'], 10)}
width={parseInt(urlPreviewInfo['og:image:width'], 10)}
name={urlPreviewInfo['og:image:alt'] || urlPreviewInfo['og:title'] || urlPreviewInfo['og:site_name'] || ''}
type={urlPreviewInfo['og:image:type']}
/>
{image}
</div>
);
}
let embedTitle;
if (urlPreviewInfo['og:site_name'] != null && urlPreviewInfo['og:title'] != null) {
embedTitle = `${urlPreviewInfo['og:site_name']} - ${urlPreviewInfo['og:title']}`;
} else {
embedTitle = urlPreviewInfo['og:title'] || urlPreviewInfo['og:site_name'];
}
const embedTitle = urlPreviewInfo['og:title'] || urlPreviewInfo['og:site_name'];
return (
<div className="file-container">
@ -480,15 +479,9 @@ function Embed({ link }) {
)}
</div>
{urlPreviewInfo['og:image'] != null && urlPreviewInfo['og:image:width'] != null && urlPreviewInfo['og:image:height'] != null && (
<Image
link={mx.mxcUrlToHttp(urlPreviewInfo['og:image'])}
height={parseInt(urlPreviewInfo['og:image:height'], 10)}
width={parseInt(urlPreviewInfo['og:image:width'], 10)}
name={urlPreviewInfo['og:image:alt'] || urlPreviewInfo['og:title'] || urlPreviewInfo['og:site_name'] || ''}
type={urlPreviewInfo['og:image:type']}
/>
)}
<div className="embed-media">
{image}
</div>
</div>
</div>
);

View file

@ -70,23 +70,22 @@ function RoomSelector({
isUnread={isUnread}
content={(
<>
{!settings.showRoomListAvatar && (
<Avatar
text={name}
bgColor={colorMXID(roomId)}
imageSrc={imageSrc}
iconColor="var(--ic-surface-low)"
iconSrc={iconSrc}
size="extra-small"
/>
)}
{settings.showRoomListAvatar && (
<Avatar
text={name}
bgColor={colorMXID(roomId)}
imageSrc={avatarSrc}
size="extra-small"
/>
{settings.showRoomListAvatar ? (
<Avatar
text={name}
bgColor={colorMXID(roomId)}
imageSrc={avatarSrc}
size="extra-small"
/>
) : (
<Avatar
text={name}
bgColor={colorMXID(roomId)}
imageSrc={imageSrc}
iconColor="var(--ic-surface-low)"
iconSrc={iconSrc}
size="extra-small"
/>
)}
<Text variant="b1" weight={isUnread ? 'medium' : 'normal'}>
{twemojify(name)}

View file

@ -91,6 +91,9 @@ function AppearanceSection() {
)}
content={<Text variant="b3">Will show room avatars in the room list.</Text>}
/>
</div>
<div className="settings-appearance__card">
<MenuHeader>URL Previews</MenuHeader>
<SettingTile
title="Show URL previews"
options={(
@ -107,9 +110,10 @@ function AppearanceSection() {
<Toggle
isActive={settings.showYoutubeEmbedPlayer}
onToggle={() => { toggleShowYoutubeEmbedPlayer(); updateState({}); }}
disabled={!settings.showUrlPreview}
/>
)}
content={<Text variant="b3">Will show a youtube embed player for youtube links. (You need to enable url previews for this)</Text>}
content={<Text variant="b3">Will show a youtube embed player for youtube links.</Text>}
/>
</div>
<div className="settings-appearance__card">