mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-24 16:03:02 +00:00
feat(atlas): sum up the tours you have done, by period and type (STA-02)
With the Tours addon on, the Atlas panel gets a third tab, Tours, beside
Stats and Bucket List: what you have done on your tours across all your
trips. A period (all time, this year, the last 12 months or an earlier year)
and a tour type narrow it; the tab shows the distance large with the number
of tours at its corner, the ascent and descent, and the types with their
distance. "Show tours" opens every tour of the period in a dialog with the
same filters, the sums, the split by type and one row per tour.
What counts is said, never guessed. A tour counts once the day it is on is
over, with the values of the planning, badged "Planned" and explained as
not measured. A linked actual track (ACT-01) replaces those values for its
execution, badged "Recorded" and named, and is never added on top nor
counted as a tour of its own. A tour on several days counts once, a whole
route does not count beside the stages planned from it, a paddle tour sums
no heights, and a value nobody knows stays out of the sum, which then reads
"at least". Only the user's own part counts: a day names them among its
participants, or names nobody on a trip of their own; being able to open
somebody else's trip makes none of its tours theirs. Tours still ahead, on
no day or only on undated days are named as not counting. A tour that fell
through can be left out of the sums ("Leave out"): it stays in the plan
and in the list, dimmed, and "Count again" brings it back. Only the user's
own numbers change.
Server: GET /api/tours/activity-stats answers the user's activity entries
across every trip they can open, and PUT /api/tours/activity-stats/exclusions
leaves a tour out or counts it again (the tour must be in such a trip, else
404). A tour_activity_exclusions table keeps the exclusions per user and
tour. The sums are added up by a shared summary in @trek/shared, so the
Atlas and the assistant say the same numbers. MCP: get_tour_activity_stats
and set_tour_activity_excluded over the same service. The tab reads live
and needs a connection, like the rest of the Atlas statistics.
This commit is contained in:
@@ -8,6 +8,7 @@ import { resetAllStores, seedStore } from '../../tests/helpers/store';
|
||||
import { buildUser, buildSettings } from '../../tests/helpers/factories';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { useSettingsStore } from '../store/settingsStore';
|
||||
import { useAddonStore } from '../store/addonStore';
|
||||
import AtlasPage from './AtlasPage';
|
||||
import { maplibreGL } from '@maplibre/maplibre-gl-leaflet';
|
||||
|
||||
@@ -1813,4 +1814,31 @@ describe('AtlasPage', () => {
|
||||
expect(screen.getByText('Machu Picchu')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
describe('FE-PAGE-ATLAS-052: the Tours tab shows the own tour activities (STA-02)', () => {
|
||||
it('offers the tab only with the Tours addon and reads the activities once it is opened', async () => {
|
||||
let reads = 0;
|
||||
server.use(
|
||||
http.get('/api/tours/activity-stats', () => {
|
||||
reads += 1;
|
||||
return HttpResponse.json({ entries: [], uncounted: { unassigned: 0, undated: 0 } });
|
||||
}),
|
||||
);
|
||||
const first = render(<AtlasPage />);
|
||||
await waitFor(() => expect(screen.getByText('Bucket List')).toBeInTheDocument());
|
||||
expect(screen.queryByRole('button', { name: 'Tours' })).not.toBeInTheDocument();
|
||||
first.unmount();
|
||||
|
||||
seedStore(useAddonStore, {
|
||||
addons: [{ id: 'tours', name: 'Tours', type: 'trip', icon: 'route', enabled: true }],
|
||||
});
|
||||
const user = userEvent.setup();
|
||||
render(<AtlasPage />);
|
||||
await waitFor(() => expect(screen.getByRole('button', { name: 'Tours' })).toBeInTheDocument());
|
||||
expect(reads).toBe(0);
|
||||
await user.click(screen.getByRole('button', { name: 'Tours' }));
|
||||
await waitFor(() => expect(screen.getByText('No completed tours yet')).toBeInTheDocument());
|
||||
expect(reads).toBe(1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -4,7 +4,7 @@ import { useTranslation } from '../i18n'
|
||||
import Navbar from '../components/Layout/Navbar'
|
||||
import CustomSelect from '../components/shared/CustomSelect'
|
||||
import EmptyState from '../components/shared/EmptyState'
|
||||
import { Globe, MapPin, Briefcase, Calendar, Flag, PanelLeftOpen, PanelLeftClose, X, Star, Plus, Trash2, Search, Check, ArrowLeft, ChevronRight, type LucideIcon } from 'lucide-react'
|
||||
import { Globe, MapPin, Briefcase, Calendar, Flag, PanelLeftOpen, PanelLeftClose, X, Star, Plus, Trash2, Search, Check, ArrowLeft, ChevronRight, Footprints, type LucideIcon } from 'lucide-react'
|
||||
import type { TranslationFn } from '../types'
|
||||
import { Tooltip } from '../components/shared/Tooltip'
|
||||
import { DialogButton, DialogFooter, DialogHeader, DialogShell, DialogTile, FooterSpacer, NEUTRAL_TINT, fs } from '../components/shared/DialogShell'
|
||||
@@ -18,6 +18,8 @@ import AtlasCountrySearch from './atlas/AtlasCountrySearch'
|
||||
import AtlasLayerToggle from './atlas/AtlasLayerToggle'
|
||||
import HelpAnchor from '../components/Help/HelpAnchor'
|
||||
import AtlasCountryPlaces from '../components/Atlas/AtlasCountryPlaces'
|
||||
import { AtlasTourActivityPane } from '../components/Atlas/tourActivity/AtlasTourActivityPane'
|
||||
import { useAddonStore } from '../store/addonStore'
|
||||
import { getIntlLanguage } from '@trek/shared'
|
||||
|
||||
// Fixed ids rather than useId: the page body stays free of hooks, and there is only one atlas.
|
||||
@@ -419,8 +421,9 @@ interface SidebarContentProps {
|
||||
onTripClick: (id: number) => void
|
||||
onUnmarkCountry?: (code: string) => void
|
||||
bucketList: any[]
|
||||
bucketTab: 'stats' | 'bucket'
|
||||
setBucketTab: (tab: 'stats' | 'bucket') => void
|
||||
/** The panel's tab: the travel numbers, the bucket list, or the user's own tours (STA-02, with the Tours addon). */
|
||||
bucketTab: 'stats' | 'bucket' | 'tours'
|
||||
setBucketTab: (tab: 'stats' | 'bucket' | 'tours') => void
|
||||
showBucketAdd: boolean
|
||||
setShowBucketAdd: (v: boolean) => void
|
||||
bucketForm: { name: string; notes: string; lat: string; lng: string; target_date: string }
|
||||
@@ -445,6 +448,7 @@ interface SidebarContentProps {
|
||||
|
||||
function SidebarContent({ data, stats, regionsVisited, countryRegions, onOpenPlaces, countries, selectedCountry, countryDetail, resolveName, onTripClick, onUnmarkCountry, bucketList, bucketTab, setBucketTab, showBucketAdd, setShowBucketAdd, bucketForm, setBucketForm, onAddBucket, onDeleteBucket, onClearBucketVisit, onSearchBucket, onSelectBucketPoi, bucketSearchResults, setBucketSearchResults, bucketPoiMonth, setBucketPoiMonth, bucketPoiYear, setBucketPoiYear, bucketSearching, bucketSearch, setBucketSearch, t, dark }: SidebarContentProps): React.ReactElement {
|
||||
const { language } = useTranslation()
|
||||
const toursEnabled = useAddonStore(s => s.isEnabled('tours'))
|
||||
const statsContentRef = useRef<HTMLDivElement>(null)
|
||||
const bucketSearchRowRef = useRef<HTMLDivElement>(null)
|
||||
const [statsWidth, setStatsWidth] = useState<number | undefined>(undefined)
|
||||
@@ -470,7 +474,11 @@ function SidebarContent({ data, stats, regionsVisited, countryRegions, onOpenPla
|
||||
// Tab switcher
|
||||
const tabBar = (
|
||||
<div style={{ display: 'flex', gap: 4, padding: '12px 16px 0', marginBottom: 4 }}>
|
||||
{[{ id: 'stats', label: t('atlas.statsTab'), icon: Globe }, { id: 'bucket', label: t('atlas.bucketTab'), icon: Star }].map(tab => (
|
||||
{[
|
||||
{ id: 'stats', label: t('atlas.statsTab'), icon: Globe },
|
||||
{ id: 'bucket', label: t('atlas.bucketTab'), icon: Star },
|
||||
...(toursEnabled ? [{ id: 'tours', label: t('tours.mode.tours'), icon: Footprints }] : []),
|
||||
].map(tab => (
|
||||
<button type="button" key={tab.id} onClick={() => setBucketTab(tab.id as any)}
|
||||
style={{
|
||||
flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 5,
|
||||
@@ -486,7 +494,7 @@ function SidebarContent({ data, stats, regionsVisited, countryRegions, onOpenPla
|
||||
</div>
|
||||
)
|
||||
|
||||
if (countries.length === 0 && !lastTrip && bucketTab !== 'bucket') {
|
||||
if (countries.length === 0 && !lastTrip && bucketTab === 'stats') {
|
||||
return (
|
||||
<>
|
||||
{tabBar}
|
||||
@@ -670,9 +678,9 @@ function SidebarContent({ data, stats, regionsVisited, countryRegions, onOpenPla
|
||||
return (
|
||||
<>
|
||||
{tabBar}
|
||||
{/* Both tabs always rendered so the wider one sets the panel width */}
|
||||
{/* Every tab always rendered so the widest one sets the panel width */}
|
||||
<div style={{ display: 'grid' }}>
|
||||
<div style={bucketTab === 'bucket' ? { visibility: 'hidden' as const, gridArea: '1/1' } : { gridArea: '1/1' }}>
|
||||
<div style={bucketTab !== 'stats' ? { visibility: 'hidden' as const, gridArea: '1/1' } : { gridArea: '1/1' }}>
|
||||
<div ref={statsContentRef} className="flex items-stretch justify-center">
|
||||
|
||||
{/* ═══ SECTION 1: Numbers ═══ */}
|
||||
@@ -799,9 +807,15 @@ function SidebarContent({ data, stats, regionsVisited, countryRegions, onOpenPla
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div style={bucketTab === 'stats' ? { visibility: 'hidden' as const, gridArea: '1/1' } : { gridArea: '1/1' }}>
|
||||
<div style={bucketTab !== 'bucket' ? { visibility: 'hidden' as const, gridArea: '1/1' } : { gridArea: '1/1' }}>
|
||||
{bucketContent}
|
||||
</div>
|
||||
{/* STA-02: the user's own tours, read only once the tab is first shown. */}
|
||||
{toursEnabled && (
|
||||
<div className="flex justify-center" style={bucketTab !== 'tours' ? { visibility: 'hidden' as const, gridArea: '1/1' } : { gridArea: '1/1' }}>
|
||||
<AtlasTourActivityPane active={bucketTab === 'tours'} maxWidth={statsWidth} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
||||
@@ -208,7 +208,7 @@ export function useAtlas() {
|
||||
const [bucketSearching, setBucketSearching] = useState(false)
|
||||
const [bucketPoiMonth, setBucketPoiMonth] = useState(0)
|
||||
const [bucketPoiYear, setBucketPoiYear] = useState(0)
|
||||
const [bucketTab, setBucketTab] = useState<'stats' | 'bucket'>('stats')
|
||||
const [bucketTab, setBucketTab] = useState<'stats' | 'bucket' | 'tours'>('stats')
|
||||
const bucketMarkersRef = useRef<any>(null)
|
||||
|
||||
const [atlas_country_search, set_atlas_country_search] = useState('')
|
||||
|
||||
Reference in New Issue
Block a user