Organized settings, made Embed compontent more logical
This commit is contained in:
parent
618602dc4f
commit
d36a6f6022
3 changed files with 38 additions and 42 deletions
|
@ -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>
|
||||
);
|
||||
|
|
|
@ -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)}
|
||||
|
|
|
@ -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">
|
||||
|
|
Loading…
Reference in a new issue