fluxerapp/fluxer
1
0
Fork 0
mirror of https://github.com/fluxerapp/fluxer.git synced 2026-09-03 05:10:25 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(app): only animate stickers that actually have animation (#1963)

Browse Source
This commit is contained in:
Hampus
2026-08-24 12:54:08 +02:00
committed by GitHub
parent a3ffe963c3
commit 987768e8dc
2 changed files with 19 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
fluxer_app/src/features/channel/components/ChannelStickersArea.tsx
+2 -1
View File
@@ -31,8 +31,8 @@ interface ChannelStickersAreaProps {
export const ChannelStickersArea: React.FC<ChannelStickersAreaProps> = observer(({channelId, hasAttachments}) => {
const {i18n} = useLingui();
const {shouldAnimate, interactionHandlers} = useStickerAnimation();
const sticker = ChannelSticker.getPendingSticker(channelId);
const {shouldAnimate, interactionHandlers} = useStickerAnimation({isAnimated: sticker?.animated ?? false});
const [previousSticker, setPreviousSticker] = useState(sticker);
useEffect(() => {
if (previousSticker && !sticker) {
@@ -62,6 +62,7 @@ export const ChannelStickersArea: React.FC<ChannelStickersAreaProps> = observer(
const stickerUrl = AvatarUtils.getStickerURL({
id: sticker.id,
animated: shouldAnimate,
isAnimatable: sticker.animated,
size: 320,
});
return (
fluxer_app/src/features/channel/components/sticker_picker/StickerPickerInspector.tsx
+17 -1
View File
@@ -1,16 +1,32 @@
// SPDX-License-Identifier: AGPL-3.0-or-later
import styles from '@app/features/channel/components/EmojiPicker.module.css';
import {useStickerAnimation} from '@app/features/emoji/hooks/useStickerAnimation';
import type {GuildSticker} from '@app/features/expressions/models/GuildSticker';
import * as AvatarUtils from '@app/features/user/utils/AvatarUtils';
import {observer} from 'mobx-react-lite';
import type React from 'react';
const INSPECTOR_PREVIEW_SIZE = 320;
interface StickerPickerInspectorProps {
hoveredSticker: GuildSticker | null;
style?: React.CSSProperties;
}
export const StickerPickerInspector = observer(({hoveredSticker, style}: StickerPickerInspectorProps) => {
const {shouldAnimate} = useStickerAnimation({
respectUserSettings: false,
isAnimated: hoveredSticker?.animated ?? false,
});
const previewUrl = hoveredSticker
? AvatarUtils.getStickerURL({
id: hoveredSticker.id,
animated: shouldAnimate,
isAnimatable: hoveredSticker.animated,
size: INSPECTOR_PREVIEW_SIZE,
})
: '';
return (
<div
className={styles.inspector}
@@ -20,7 +36,7 @@ export const StickerPickerInspector = observer(({hoveredSticker, style}: Sticker
{hoveredSticker && (
<>
<img
src={hoveredSticker.url}
src={previewUrl}
alt={hoveredSticker.name}
className={styles.inspectorEmoji}
data-flx="channel.sticker-picker.sticker-picker-inspector.inspector-emoji"