Reaction Selector: Update thumb sprite (#2193)

This commit is contained in:
Alexander Zinchuk 2022-12-07 17:38:26 +01:00
parent a29802266e
commit b712f9dcb2
7 changed files with 7 additions and 20 deletions

View File

@ -464,7 +464,7 @@ export function buildApiChatReactions(availableReactions?: GramJs.TypeChatReacti
if (availableReactions instanceof GramJs.ChatReactionsAll) {
// TODO Hack before custom reactions are implemented
// eslint-disable-next-line max-len
return ['👍', '👎', '❤', '🔥', '🥰', '👏', '😁', '🤔', '🤯', '😱', '🤬', '😢', '🎉', '🤩', '🤮', '💩', '🙏', '👌', '🕊', '🤡', '🥱', '🥴', '😍', '🐳', '❤‍🔥', '🌚', '🌭', '💯', '🤣', '⚡', '🍌', '🏆', '💔', '🤨', '😐', '🍓', '🍾', '💋', '🖕', '😈', '😴', '😭', '🤓', '👻', '👨‍💻', '👀', '🎃'];
return ['👍', '👎', '❤', '🔥', '🥰', '👏', '😁', '🤔', '🤯', '😱', '🤬', '😢', '🎉', '🤩', '🤮', '💩', '🙏', '👌', '🕊', '🤡', '🥱', '🥴', '😍', '🐳', '❤‍🔥', '🌚', '🌭', '💯', '🤣', '⚡', '🍌', '🏆', '💔', '🤨', '😐', '🍓', '🍾', '💋', '🖕', '😈', '😴', '😭', '🤓', '👻', '👨‍💻', '👀', '🎃', '🙈', '😇', '😨', '🤝', '✍️', '🤗', '🫡'];
}
if (availableReactions instanceof GramJs.ChatReactionsSome) {
return availableReactions.reactions.map(buildApiReaction).filter(Boolean);

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 62 KiB

View File

@ -7,7 +7,7 @@ import type { ThemeKey } from '../../types';
import type { FC } from '../../lib/teact/teact';
import { getChatAvatarHash } from '../../global/helpers/chats'; // Direct import for better module splitting
import { selectIsRightColumnShown, selectTheme, selectIsCurrentUserPremium } from '../../global/selectors';
import { selectIsRightColumnShown, selectTheme } from '../../global/selectors';
import { DARK_THEME_BG_COLOR, LIGHT_THEME_BG_COLOR } from '../../config';
import useFlag from '../../hooks/useFlag';
import useShowTransition from '../../hooks/useShowTransition';
@ -22,7 +22,6 @@ import styles from './UiLoader.module.scss';
import telegramLogoPath from '../../assets/telegram-logo.svg';
import reactionThumbsPath from '../../assets/reaction-thumbs.png';
import premiumReactionThumbsPath from '../../assets/reaction-thumbs-premium.png';
import lockPreviewPath from '../../assets/lock.png';
import monkeyPath from '../../assets/monkey.svg';
@ -44,7 +43,6 @@ type StateProps = Pick<GlobalState, 'uiReadyState' | 'shouldSkipHistoryAnimation
isRightColumnShown?: boolean;
leftColumnWidth?: number;
theme: ThemeKey;
isCurrentUserPremium?: boolean;
};
const MAX_PRELOAD_DELAY = 700;
@ -73,11 +71,11 @@ function preloadAvatars() {
}
const preloadTasks = {
main: (isCurrentUserPremium: boolean) => Promise.all([
main: () => Promise.all([
loadModule(Bundles.Main, 'Main')
.then(preloadFonts),
preloadAvatars(),
preloadImage(isCurrentUserPremium ? premiumReactionThumbsPath : reactionThumbsPath),
preloadImage(reactionThumbsPath),
]),
authPhoneNumber: () => Promise.all([
preloadFonts(),
@ -101,7 +99,6 @@ const UiLoader: FC<OwnProps & StateProps> = ({
shouldSkipHistoryAnimations,
leftColumnWidth,
theme,
isCurrentUserPremium,
}) => {
const { setIsUiReady } = getActions();
@ -115,7 +112,7 @@ const UiLoader: FC<OwnProps & StateProps> = ({
const safePreload = async () => {
try {
await preloadTasks[page!](isCurrentUserPremium!);
await preloadTasks[page!]();
} catch (err) {
// Do nothing
}
@ -183,7 +180,6 @@ export default withGlobal<OwnProps>(
isRightColumnShown: selectIsRightColumnShown(global),
leftColumnWidth: global.leftColumnWidth,
theme,
isCurrentUserPremium: selectIsCurrentUserPremium(global),
};
},
)(UiLoader);

View File

@ -73,7 +73,6 @@ const ReactionSelector: FC<OwnProps> = ({
isReady={isReady}
onSendReaction={onSendReaction}
reaction={reaction}
isCurrentUserPremium={isCurrentUserPremium}
/>
);
})}

View File

@ -17,10 +17,6 @@
background-image: url('../../../assets/reaction-thumbs.png');
background-repeat: no-repeat;
background-size: auto 100%;
&--premium {
background-image: url('../../../assets/reaction-thumbs-premium.png');
}
}
.AnimatedSticker {

View File

@ -19,13 +19,12 @@ type OwnProps = {
previewIndex: number;
isReady?: boolean;
onSendReaction: (reaction: string, x: number, y: number) => void;
isCurrentUserPremium?: boolean;
};
const cn = createClassNameBuilder('ReactionSelectorReaction');
const ReactionSelectorReaction: FC<OwnProps> = ({
reaction, previewIndex, onSendReaction, isReady, isCurrentUserPremium,
reaction, previewIndex, onSendReaction, isReady,
}) => {
// eslint-disable-next-line no-null/no-null
const containerRef = useRef<HTMLDivElement>(null);
@ -54,10 +53,7 @@ const ReactionSelectorReaction: FC<OwnProps> = ({
>
{shouldRenderStatic && (
<div
className={cn(
'static',
isCurrentUserPremium && 'premium',
)}
className={cn('static')}
style={`background-position-x: ${previewIndex * -REACTION_SIZE}px;`}
/>
)}