k1nq/TREK
1
0
Fork 0
mirror of https://github.com/mauriceboe/TREK.git synced 2026-11-12 23:31:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(journey): a folded Duo on its side gets the compact cards in the wide size class too

Browse Source 
The folded Duo on its side is over 500px high and so in the wide size
class, whose large cards won over the short window's compact ones. Short
is now asked first.
This commit is contained in:
Maurice
2026-11-08 00:10:57 +00:00
parent b9d0d3397e
commit 41752887dc
2 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/mobile/screens/journey/MJourneyDetail.tsx
+2 -1
View File
@@ -593,7 +593,8 @@ export default function MJourneyDetail({ journeyId, embedded = false }: JourneyD
showMood={current.show_mood !== 0}
showWeather={current.show_weather !== 0}
tone="mobile"
size={wide ? 'large' : short ? 'compact' : 'regular'}
// Short before wide: a folded Duo on its side is wide (over 500px high) and short.
size={short ? 'compact' : wide ? 'large' : 'regular'}
/>
</div>
))}
client/tests/unit/mobile/journey/MJourneyDetail.test.tsx
+5 -2
View File
@@ -1,7 +1,7 @@
// FE-MOB-JDET-001 to FE-MOB-JDET-048
// FE-MOB-JDET-001 to FE-MOB-JDET-049
import { describe, it, expect, beforeEach, afterEach, onTestFinished, vi } from 'vitest';
import { render, screen, fireEvent, waitFor, act } from '../../../helpers/render';
import { setSizeClass } from '../../../helpers/sizeClass';
import { render, screen, fireEvent, waitFor, act } from '../../../helpers/render';
import MJourneyDetail from '../../../../src/mobile/screens/journey/MJourneyDetail';
import { addonsApi, journeyApi, memoriesApi } from '../../../../src/api/client';
import { useJourneyStore } from '../../../../src/store/journeyStore';
@@ -256,9 +256,12 @@ describe('MJourneyDetail', () => {
};
window.matchMedia = tall;
onTestFinished(() => { window.matchMedia = real; });
// At 720 by 540 it is the wide size class too, whose large cards must not win.
setSizeClass('wide');
setup();
expect(document.querySelector('.h-\\[112px\\]')).toBeInTheDocument();
expect(document.querySelector('.h-\\[152px\\]')).not.toBeInTheDocument();
expect(document.querySelector('.h-\\[196px\\]')).not.toBeInTheDocument();
});
it('FE-MOB-JDET-001: shows a spinner while the journey is loading', () => {