mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-22 06:56:35 +00:00
Maurice
214984f398
Adds an in-app assistant that reads and plans the open trip. Users connect their own provider (Sign in with ChatGPT, or an Anthropic, OpenAI, Gemini or OpenRouter key) or use the one the admin set up, including a custom OpenAI-compatible server. It is an addon and only shows while a connection is usable. The chat runs on the existing MCP tools, pinned to the trip. Every change is held as a change card the user applies or discards, and applied changes can be undone. On the desktop it is a floating window that can be moved and resized; on the phone it is fullscreen. Search results show as place cards that can go onto a day, weather lookups as a strip, proposed places as ghost markers on the map with a before/after switch, and an answer can be shared into the trip chat. Booking files can be dropped in and are read into change cards.
44 lines
1.9 KiB
TypeScript
44 lines
1.9 KiB
TypeScript
import type { AssistantApplied } from '@trek/shared';
|
|
import { useCallback, useMemo } from 'react';
|
|
import { useLocation, useMatch, useNavigate } from 'react-router';
|
|
|
|
import { useTripStore } from '../../store/tripStore';
|
|
import AssistantWindow from './AssistantWindow';
|
|
import { showOnMapSearch } from './assistantShowOnMap';
|
|
|
|
/** The trip a route under /trips/:id shows, or null anywhere else. */
|
|
function useRouteTripId(): number | null {
|
|
const match = useMatch('/trips/:id/*');
|
|
const id = Number(match?.params.id);
|
|
return Number.isInteger(id) && id > 0 ? id : null;
|
|
}
|
|
|
|
/**
|
|
* The desktop assistant, mounted once above the routes so a conversation
|
|
* keeps going from page to page. Inside a trip it is about that trip; "Show
|
|
* on map" opens the planner on the change through its links (`?place=`,
|
|
* `?day=`), the same way a notification opens a place, and a day picked in
|
|
* the chat (its weather) selects that day the same way.
|
|
*/
|
|
export default function AssistantHost() {
|
|
const navigate = useNavigate();
|
|
const { pathname } = useLocation();
|
|
const tripId = useRouteTripId();
|
|
// The title is there once the planner has loaded the trip; the window waits for nothing else.
|
|
const title = useTripStore((s) => (s.trip && s.trip.id === tripId ? s.trip.title : ''));
|
|
const trip = useMemo(() => (tripId === null ? null : { id: tripId, title }), [tripId, title]);
|
|
|
|
const openPlanner = useCallback(
|
|
(search: string) => {
|
|
if (tripId === null) return;
|
|
const planner = `/trips/${tripId}`;
|
|
void navigate({ pathname: planner, search }, { replace: pathname === planner });
|
|
},
|
|
[navigate, pathname, tripId]
|
|
);
|
|
const showOnMap = useCallback((applied: AssistantApplied) => openPlanner(showOnMapSearch(applied)), [openPlanner]);
|
|
const focusDay = useCallback((dayId: number) => openPlanner(`?day=${dayId}`), [openPlanner]);
|
|
|
|
return <AssistantWindow trip={trip} onShowOnMap={showOnMap} onFocusDay={focusDay} />;
|
|
}
|