Fix: Prevent context menu on images in settings.

Revert mobile change.
Messages: Add channel id matching.
This commit is contained in:
Paul 2021-07-10 17:35:18 +01:00
parent 4f6d2de75f
commit 3351674c21
5 changed files with 41 additions and 33 deletions

View file

@ -82,6 +82,9 @@ md.renderer.rules.emoji = function (token, idx) {
const RE_TWEMOJI = /:(\w+):/g;
// ! FIXME: Move to library
const RE_CHANNELS = /<#([A-z0-9]{26})>/g;
export default function Renderer({ content, disallowBigEmoji }: MarkdownProps) {
const client = useContext(AppContext);
if (typeof content === "undefined") return null;
@ -99,6 +102,18 @@ export default function Renderer({ content, disallowBigEmoji }: MarkdownProps) {
return `[@${user.username}](/@${id})`;
}
return sub;
},
).replace(
RE_CHANNELS,
(sub: string, ...args: any[]) => {
const id = args[0],
channel = client.channels.get(id);
if (channel?.channel_type === 'TextChannel') {
return `[#${channel.name}](/server/${channel.server}/channel/${id})`;
}
return sub;
},
);

View file

@ -233,30 +233,21 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
to={lastOpened.home ? `/channel/${lastOpened.home}` : "/"}>
<ServerEntry home active={homeActive}>
<Swoosh />
{isTouchscreenDevice ? (
<Icon size={42} unread={homeUnread}>
<img
style={{ width: 32, height: 32 }}
src={logoSVG}
/>
</Icon>
) : (
<div
onContextMenu={attachContextMenu("Status")}
onClick={() =>
homeActive && openContextMenu("Status")
}>
<UserHover user={self}>
<Icon size={42} unread={homeUnread}>
<UserIcon
target={self}
size={32}
status
/>
</Icon>
</UserHover>
</div>
)}
<div
onContextMenu={attachContextMenu("Status")}
onClick={() =>
homeActive && openContextMenu("Status")
}>
<UserHover user={self}>
<Icon size={42} unread={homeUnread}>
<UserIcon
target={self}
size={32}
status
/>
</Icon>
</UserHover>
</div>
</ServerEntry>
</ConditionalLink>
<LineDivider />

View file

@ -1,6 +1,6 @@
// @ts-ignore
import { Reset, Import } from "@styled-icons/boxicons-regular";
import { Pencil } from "@styled-icons/boxicons-solid";
// @ts-ignore
import pSBC from "shade-blend-color";
import styles from "./Panes.module.scss";
@ -103,6 +103,7 @@ export function Component(props: Props) {
selected !== "light" &&
setTheme({ preset: "light" })
}
onContextMenu={e => e.preventDefault()}
/>
<h4>
<Text id="app.settings.pages.appearance.color.light" />
@ -116,6 +117,7 @@ export function Component(props: Props) {
onClick={() =>
selected !== "dark" && setTheme({ preset: "dark" })
}
onContextMenu={e => e.preventDefault()}
/>
<h4>
<Text id="app.settings.pages.appearance.color.dark" />
@ -199,7 +201,7 @@ export function Component(props: Props) {
className={styles.button}
onClick={() => setEmojiPack("mutant")}
data-active={emojiPack === "mutant"}>
<img src={mutantSVG} draggable={false} />
<img src={mutantSVG} draggable={false} onContextMenu={e => e.preventDefault()} />
</div>
<h4>
Mutant Remix{" "}
@ -216,7 +218,7 @@ export function Component(props: Props) {
className={styles.button}
onClick={() => setEmojiPack("twemoji")}
data-active={emojiPack === "twemoji"}>
<img src={twemojiSVG} draggable={false} />
<img src={twemojiSVG} draggable={false} onContextMenu={e => e.preventDefault()} />
</div>
<h4>Twemoji</h4>
</div>
@ -227,7 +229,7 @@ export function Component(props: Props) {
className={styles.button}
onClick={() => setEmojiPack("openmoji")}
data-active={emojiPack === "openmoji"}>
<img src={openmojiSVG} draggable={false} />
<img src={openmojiSVG} draggable={false} onContextMenu={e => e.preventDefault()} />
</div>
<h4>Openmoji</h4>
</div>
@ -236,7 +238,7 @@ export function Component(props: Props) {
className={styles.button}
onClick={() => setEmojiPack("noto")}
data-active={emojiPack === "noto"}>
<img src={notoSVG} draggable={false} />
<img src={notoSVG} draggable={false} onContextMenu={e => e.preventDefault()} />
</div>
<h4>Noto Emoji</h4>
</div>

View file

@ -500,12 +500,12 @@
flex-direction: column;
}
.experiments { /* TOFIX: Center the "No new experiments available at this time" text without having a scrollbar */
height: 100%;
.experiments {
height: calc(100% - 40px);
.empty {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
}

View file

@ -1,5 +1,5 @@
export type Experiments = "search";
export const AVAILABLE_EXPERIMENTS: Experiments[] = ["search"];
export const AVAILABLE_EXPERIMENTS: Experiments[] = ['search'];
export const EXPERIMENTS: {
[key in Experiments]: { title: string; description: string };
} = {