mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Tweak badge image logic for new server responses

Browse source
This commit is contained in:
Evan Hahn 2021-11-18 16:26:38 -06:00 committed by GitHub
parent 834023779e
commit 864f9c8631
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 104 additions and 117 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
ts/badges/getBadgeImageFileLocalPath.ts
View file

@ -1,9 +1,9 @@
// Copyright 2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import { first, last } from 'lodash';
import type { BadgeType, BadgeImageType } from './types';
import type { BadgeImageTheme } from './BadgeImageTheme';
import { find, findLast, first, last } from 'lodash';
import type { BadgeType } from './types';
import { BadgeImageTheme } from './BadgeImageTheme';
export function getBadgeImageFileLocalPath(
badge: Readonly<undefined | BadgeType>,
@ -14,20 +14,23 @@ export function getBadgeImageFileLocalPath(
return undefined;
}
const { images } = badge;
const localPathsForTheme: Array<undefined | string> = badge.images.map(
image => image[theme]?.localPath
);
// We expect this to be defined for valid input, but defend against unexpected array
// lengths.
let idealImage: undefined | BadgeImageType;
if (size < 24) {
idealImage = first(images);
} else if (size < 36) {
idealImage = images[1] || first(images);
} else if (size < 160) {
idealImage = images[2] || first(images);
} else {
idealImage = last(images);
if (theme === BadgeImageTheme.Transparent) {
const search = size < 36 ? find : findLast;
return search(localPathsForTheme, Boolean);
}
return idealImage?.[theme]?.localPath;
if (size < 24) {
return first(localPathsForTheme);
}
if (size < 36) {
return localPathsForTheme[1];
}
if (size < 160) {
return localPathsForTheme[2];
}
return last(localPathsForTheme) || localPathsForTheme[2];
}

57
ts/test-both/badges/getBadgeImageFileLocalPath_test.ts
View file

@ -17,24 +17,27 @@ describe('getBadgeImageFileLocalPath', () => {
category: BadgeCategory.Donor,
descriptionTemplate: 'foo bar',
id: 'foo',
images: ['small', 'medium', 'large', 'huge'].map(size => ({
images: [
...['small', 'medium', 'large'].map(size => ({
[BadgeImageTheme.Dark]: image(`/${size}-dark.svg`),
[BadgeImageTheme.Light]: image(undefined),
[BadgeImageTheme.Transparent]: image(`/${size}-trns.svg`),
})),
{ [BadgeImageTheme.Transparent]: image('/huge-trns.svg') },
],
name: 'Test Badge',
};
it('returns undefined if passed no badge', () => {
const result = getBadgeImageFileLocalPath(
undefined,
123,
BadgeImageTheme.Transparent
assert.isUndefined(
getBadgeImageFileLocalPath(undefined, 123, BadgeImageTheme.Dark)
);
assert.isUndefined(
getBadgeImageFileLocalPath(undefined, 123, BadgeImageTheme.Transparent)
);
assert.isUndefined(result);
});
it('returns the first image if passed a small size', () => {
describe('dark/light themes', () => {
it('returns the first matching image if passed a small size', () => {
const darkResult = getBadgeImageFileLocalPath(
badge,
10,
@ -48,16 +51,9 @@ describe('getBadgeImageFileLocalPath', () => {
BadgeImageTheme.Light
);
assert.isUndefined(lightResult);
const transparentResult = getBadgeImageFileLocalPath(
badge,
12,
BadgeImageTheme.Transparent
);
assert.strictEqual(transparentResult, '/small-trns.svg');
});
it('returns the second image if passed a size between 24 and 36', () => {
it('returns the second matching image if passed a size between 24 and 36', () => {
const darkResult = getBadgeImageFileLocalPath(
badge,
24,
@ -71,16 +67,9 @@ describe('getBadgeImageFileLocalPath', () => {
BadgeImageTheme.Light
);
assert.isUndefined(lightResult);
const transparentResult = getBadgeImageFileLocalPath(
badge,
35,
BadgeImageTheme.Transparent
);
assert.strictEqual(transparentResult, '/medium-trns.svg');
});
it('returns the third image if passed a size between 36 and 160', () => {
it('returns the third matching image if passed a size between 36 and 160', () => {
const darkResult = getBadgeImageFileLocalPath(
badge,
36,
@ -94,22 +83,15 @@ describe('getBadgeImageFileLocalPath', () => {
BadgeImageTheme.Light
);
assert.isUndefined(lightResult);
const transparentResult = getBadgeImageFileLocalPath(
badge,
159,
BadgeImageTheme.Transparent
);
assert.strictEqual(transparentResult, '/large-trns.svg');
});
it('returns the last image if passed a size above 159', () => {
it('returns the last matching image if passed a size above 159', () => {
const darkResult = getBadgeImageFileLocalPath(
badge,
160,
BadgeImageTheme.Dark
);
assert.strictEqual(darkResult, '/huge-dark.svg');
assert.strictEqual(darkResult, '/large-dark.svg');
const lightResult = getBadgeImageFileLocalPath(
badge,
@ -117,12 +99,19 @@ describe('getBadgeImageFileLocalPath', () => {
BadgeImageTheme.Light
);
assert.isUndefined(lightResult);
});
});
describe('transparent themes', () => {
it('returns the transparent image, no matter the size', () => {
[1, 12, 28, 50, 200, 999].forEach(size => {
const transparentResult = getBadgeImageFileLocalPath(
badge,
999,
size,
BadgeImageTheme.Transparent
);
assert.strictEqual(transparentResult, '/huge-trns.svg');
});
});
});
});

5
ts/test-both/badges/parseBadgesFromServer_test.ts
View file

@ -20,7 +20,6 @@ describe('parseBadgesFromServer', () => {
svgs: ['small', 'medium', 'large'].map(size => ({
dark: `${size} badge dark.svg`,
light: `${size} badge light.svg`,
transparent: `${size} badge transparent.svg`,
})),
};
const validBadge = {
@ -36,9 +35,6 @@ describe('parseBadgesFromServer', () => {
[BadgeImageTheme.Light]: {
url: `https://updates2.signal.org/static/badges/${size}%20badge%20light.svg`,
},
[BadgeImageTheme.Transparent]: {
url: `https://updates2.signal.org/static/badges/${size}%20badge%20transparent.svg`,
},
})),
{
[BadgeImageTheme.Transparent]: {
@ -148,7 +144,6 @@ describe('parseBadgesFromServer', () => {
{
dark: 'too.svg',
light: 'many.svg',
transparent: 'badges.svg',
},
],
},