Client - replace sports PNG images with SVG

This commit is contained in:
Sam
2021-10-01 16:48:48 +02:00
parent ba0b94de45
commit 5856599377
28 changed files with 461 additions and 118 deletions

View File

@ -1,5 +1,8 @@
import createI18n from '@/i18n'
import { ISport } from '@/types/sports'
import { translateSports } from '@/utils/sports'
const { t } = createI18n.global
export const sports: ISport[] = [
{
has_workouts: false,
@ -23,3 +26,5 @@ export const sports: ISport[] = [
label: 'Hiking',
},
]
export const translatedSports = translateSports(sports, t)

View File

@ -1,6 +1,6 @@
import { assert, expect } from 'chai'
import { sports } from './fixtures'
import { translatedSports } from './fixtures'
import { formatRecord, getRecordsBySports } from '@/utils/records'
@ -157,7 +157,7 @@ describe('getRecordsBySports', () => {
},
expected: {
'Cycling (Sport)': {
img: '/img/sports/cycling-sport.png',
label: 'Cycling (Sport)',
records: [
{
id: 9,
@ -206,7 +206,7 @@ describe('getRecordsBySports', () => {
},
expected: {
'Cycling (Sport)': {
img: '/img/sports/cycling-sport.png',
label: 'Cycling (Sport)',
records: [
{
id: 9,
@ -225,7 +225,7 @@ describe('getRecordsBySports', () => {
],
},
'Cycling (Transport)': {
img: '/img/sports/cycling-transport.png',
label: 'Cycling (Transport)',
records: [
{
id: 10,
@ -244,7 +244,7 @@ describe('getRecordsBySports', () => {
assert.deepEqual(
getRecordsBySports(
testParams.input.records,
sports,
translatedSports,
testParams.input.tz
),
// eslint-disable-next-line @typescript-eslint/ban-ts-comment

View File

@ -16,7 +16,32 @@ describe('sortSports', () => {
locale: 'en',
onlyActive: false,
},
expected: sports,
expected: [
{
has_workouts: false,
id: 1,
img: '/img/sports/cycling-sport.png',
is_active: true,
label: 'Cycling (Sport)',
translatedLabel: 'Cycling (Sport)',
},
{
has_workouts: false,
id: 2,
img: '/img/sports/cycling-transport.png',
is_active: false,
label: 'Cycling (Transport)',
translatedLabel: 'Cycling (Transport)',
},
{
has_workouts: true,
id: 3,
img: '/img/sports/hiking.png',
is_active: true,
label: 'Hiking',
translatedLabel: 'Hiking',
},
],
},
{
description:
@ -33,6 +58,7 @@ describe('sortSports', () => {
img: '/img/sports/cycling-sport.png',
is_active: true,
label: 'Cycling (Sport)',
translatedLabel: 'Cycling (Sport)',
},
{
has_workouts: true,
@ -40,6 +66,7 @@ describe('sortSports', () => {
img: '/img/sports/hiking.png',
is_active: true,
label: 'Hiking',
translatedLabel: 'Hiking',
},
],
},
@ -65,21 +92,24 @@ describe('sortSports', () => {
id: 3,
img: '/img/sports/hiking.png',
is_active: true,
label: 'Randonnée',
label: 'Hiking',
translatedLabel: 'Randonnée',
},
{
has_workouts: false,
id: 1,
img: '/img/sports/cycling-sport.png',
is_active: true,
label: 'Vélo (Sport)',
label: 'Cycling (Sport)',
translatedLabel: 'Vélo (Sport)',
},
{
has_workouts: false,
id: 2,
img: '/img/sports/cycling-transport.png',
is_active: false,
label: 'Vélo (Transport)',
label: 'Cycling (Transport)',
translatedLabel: 'Vélo (Transport)',
},
],
},
@ -97,14 +127,16 @@ describe('sortSports', () => {
id: 3,
img: '/img/sports/hiking.png',
is_active: true,
label: 'Randonnée',
label: 'Hiking',
translatedLabel: 'Randonnée',
},
{
has_workouts: false,
id: 1,
img: '/img/sports/cycling-sport.png',
is_active: true,
label: 'Vélo (Sport)',
label: 'Cycling (Sport)',
translatedLabel: 'Vélo (Sport)',
},
],
},

View File

@ -164,51 +164,51 @@ describe('getDatasets', () => {
nb_workouts: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [],
},
],
total_distance: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [],
},
],
total_duration: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [],
},
],
@ -220,21 +220,21 @@ describe('getDatasets', () => {
nb_workouts: [
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [],
},
],
total_distance: [
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [],
},
],
total_duration: [
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [],
},
],
@ -257,51 +257,51 @@ describe('formatStats', () => {
nb_workouts: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [0, 0, 0],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 0, 0],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [0, 0, 0],
},
],
total_distance: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [0, 0, 0],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 0, 0],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [0, 0, 0],
},
],
total_duration: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [0, 0, 0],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 0, 0],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [0, 0, 0],
},
],
@ -326,21 +326,21 @@ describe('formatStats', () => {
nb_workouts: [
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 0, 0],
},
],
total_distance: [
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 0, 0],
},
],
total_duration: [
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 0, 0],
},
],
@ -392,51 +392,51 @@ describe('formatStats', () => {
nb_workouts: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [1, 1, 0],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 2, 0],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [0, 0, 2],
},
],
total_distance: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [10, 15, 0],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 20, 0],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [0, 0, 12],
},
],
total_duration: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [3000, 3500, 0],
},
{
label: 'Cycling (Transport)',
backgroundColor: ['#98C3A9'],
backgroundColor: ['#88af98'],
data: [0, 3000, 0],
},
{
label: 'Hiking',
backgroundColor: ['#D0838A'],
backgroundColor: ['#bb757c'],
data: [0, 0, 5000],
},
],
@ -488,21 +488,21 @@ describe('formatStats', () => {
nb_workouts: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [1, 1, 0],
},
],
total_distance: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [10, 15, 0],
},
],
total_duration: [
{
label: 'Cycling (Sport)',
backgroundColor: ['#55A8A3'],
backgroundColor: ['#4c9792'],
data: [3000, 3500, 0],
},
],