diff --git a/src/api/types/messages.ts b/src/api/types/messages.ts index 3ee850cae..88f5e5f53 100644 --- a/src/api/types/messages.ts +++ b/src/api/types/messages.ts @@ -731,6 +731,7 @@ export interface ApiReactionCount { reaction: ApiReactionWithPaid; localAmount?: number; localIsPrivate?: boolean; + localPreviousChosenOrder?: number; } export interface ApiAvailableReaction { diff --git a/src/assets/fonts/Numbers-Rounded.woff2 b/src/assets/fonts/Numbers-Rounded.woff2 new file mode 100644 index 000000000..d2c534733 Binary files /dev/null and b/src/assets/fonts/Numbers-Rounded.woff2 differ diff --git a/src/assets/fonts/Roboto-Round-Regular.woff2 b/src/assets/fonts/Roboto-Round-Regular.woff2 deleted file mode 100644 index 0a8478d2d..000000000 Binary files a/src/assets/fonts/Roboto-Round-Regular.woff2 and /dev/null differ diff --git a/src/assets/fonts/roboto.css b/src/assets/fonts/roboto.css index d65175aea..1eda1a2b7 100644 --- a/src/assets/fonts/roboto.css +++ b/src/assets/fonts/roboto.css @@ -147,9 +147,9 @@ } @font-face { - font-family: 'Roboto Round'; - src: url('Roboto-Round-Regular.woff2') format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; + font-family: 'Numbers Rounded'; + src: url('Numbers-Rounded.woff2') format('woff2'); + unicode-range: U+0030-0039, U+002B, U+002D; } @font-face { diff --git a/src/global/actions/api/reactions.ts b/src/global/actions/api/reactions.ts index 461ef8f10..1101149bd 100644 --- a/src/global/actions/api/reactions.ts +++ b/src/global/actions/api/reactions.ts @@ -1,11 +1,11 @@ -import type { ApiError, ApiReactionEmoji } from '../../../api/types'; +import type { ApiError, ApiReaction, ApiReactionEmoji } from '../../../api/types'; import type { ActionReturnType } from '../../types'; import { ApiMediaFormat } from '../../../api/types'; import { GENERAL_REFETCH_INTERVAL } from '../../../config'; import { getCurrentTabId } from '../../../util/establishMultitabRole'; import { - buildCollectionByCallback, buildCollectionByKey, omit, unique, + buildCollectionByCallback, buildCollectionByKey, omit, partition, unique, } from '../../../util/iteratees'; import { getMessageKey } from '../../../util/keys/messageKey'; import * as mediaLoader from '../../../util/mediaLoader'; @@ -210,7 +210,9 @@ addActionHandler('toggleReaction', async (global, actions, payload): Promise !isSameReaction(userReaction, reaction)) : [...userReactions, reaction]; const limit = selectMaxUserReactions(global); - const reactions = newUserReactions.slice(-limit); + const [paidReactions, regularReactions] = partition(newUserReactions, (r) => r.type === 'paid'); + const trimmedRegularReactions = regularReactions.slice(-limit) as ApiReaction[]; + const localReactions = [...paidReactions, ...trimmedRegularReactions]; const messageKey = getMessageKey(message); if (selectPerformanceSettingsValue(global, 'reactionEffects')) { @@ -221,14 +223,14 @@ addActionHandler('toggleReaction', async (global, actions, payload): Promise => isReactionChosen(r)) .sort((a, b) => a.chosenOrder - b.chosenOrder) - .map((r) => r.reaction) - .filter((r): r is ApiReaction => r.type !== 'paid') || []; + .map((r) => r.reaction) || []; } export function isReactionChosen(reaction: ApiReactionCount) { return reaction.chosenOrder !== undefined; } -export function updateReactionCount(reactionCount: ApiReactionCount[], newReactions: ApiReaction[]) { +export function updateReactionCount(reactionCount: ApiReactionCount[], newReactions: ApiReactionWithPaid[]) { const results = reactionCount.map((current) => ( isReactionChosen(current) ? { ...current, @@ -136,6 +134,7 @@ export function addPaidReaction( localAmount: (current.localAmount || 0) + count, chosenOrder: -1, localIsPrivate: isAnonymous !== undefined ? isAnonymous : current.localIsPrivate, + localPreviousChosenOrder: current.chosenOrder, }); return; } diff --git a/src/global/reducers/reactions.ts b/src/global/reducers/reactions.ts index 297c1751b..176cb9cee 100644 --- a/src/global/reducers/reactions.ts +++ b/src/global/reducers/reactions.ts @@ -1,4 +1,4 @@ -import type { ApiChat, ApiMessage, ApiReaction } from '../../api/types'; +import type { ApiChat, ApiMessage, ApiReactionWithPaid } from '../../api/types'; import type { GlobalState } from '../types'; import { MIN_SCREEN_WIDTH_FOR_STATIC_LEFT_COLUMN, MIN_SCREEN_WIDTH_FOR_STATIC_RIGHT_COLUMN } from '../../config'; @@ -40,7 +40,7 @@ export function subtractXForEmojiInteraction(global: GlobalState, x: number) { } export function addMessageReaction( - global: T, message: ApiMessage, userReactions: ApiReaction[], + global: T, message: ApiMessage, userReactions: ApiReactionWithPaid[], ): T { const isInSavedMessages = selectIsChatWithSelf(global, message.chatId); const currentReactions = message.reactions || { results: [], areTags: isInSavedMessages }; @@ -57,6 +57,7 @@ export function addMessageReaction( userReactions.forEach((reaction) => { const { currentUserId } = global; + if (reaction.type === 'paid') return; recentReactions.unshift({ peerId: currentSendAs?.id || currentUserId!, reaction, diff --git a/src/styles/index.scss b/src/styles/index.scss index 7171008bb..2ceb50387 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -33,8 +33,8 @@ body { Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; --font-family-monospace: "Cascadia Mono", "Roboto Mono", "Droid Sans Mono", 'SF Mono', "Menlo", "Ubuntu Mono", "Consolas", monospace; - --font-family-rounded: -ui-rounded, "Roboto Round"; - --font-family-condensed: -ui-rounded, "Roboto Condensed"; + --font-family-rounded: -ui-rounded, "Numbers Rounded", "Roboto", "Helvetica Neue", sans-serif; + --font-family-condensed: "Roboto Condensed", "Roboto", "Helvetica Neue", sans-serif; @media (max-width: 600px) { height: calc(var(--vh, 1vh) * 100);