k1nq/TREK
1
0
Fork 0
mirror of https://github.com/mauriceboe/TREK.git synced 2026-10-23 15:36:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(assistant): trip assistant chat with your own AI connection

Browse Source 
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.
This commit is contained in:
Maurice
2026-10-21 18:52:44 +02:00
parent bb3c0151d5
commit 214984f398
505 changed files with 51841 additions and 227 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/Map/assistantGhost.css
+106
View File
@@ -0,0 +1,106 @@
/*
* The assistant on the map: a suggested place drawn before it exists (a ghost),
* the pulse when its row or pin is under the pointer, and the pop of a place
* that just arrived. Both renderers position the outer element themselves (a
* transform), so every animation runs on its first child and never fights
* the position.
*/
@keyframes trek-ghost-enter {
from {
opacity: 0;
transform: scale(0.8);
}
to {
opacity: 1;
transform: scale(1);
}
}
@keyframes trek-ghost-pulse {
0% {
box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 45%, transparent);
}
100% {
box-shadow: 0 0 0 12px color-mix(in srgb, var(--accent) 0%, transparent);
}
}
@keyframes trek-place-pop {
0% {
transform: scale(0.6);
}
65% {
transform: scale(1.08);
}
100% {
transform: scale(1);
}
}
.trek-ghost-pin {
background: none;
border: none;
}
.trek-ghost {
width: 30px;
height: 30px;
cursor: pointer;
}
.trek-ghost-face {
display: flex;
box-sizing: border-box;
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
border: 2px dashed var(--accent);
border-radius: 9999px;
background: color-mix(in srgb, var(--bg-card) 60%, transparent);
color: var(--ghost-color, var(--text-secondary));
box-shadow: var(--shadow-sm);
animation: trek-ghost-enter 180ms var(--ease-out-quint) both;
}
.trek-ghost.is-hot .trek-ghost-face {
border-style: solid;
animation:
trek-ghost-enter 180ms var(--ease-out-quint) both,
trek-ghost-pulse 900ms var(--ease-out-quint) 2;
}
.trek-place-pulse > :first-child {
animation: trek-ghost-pulse 900ms var(--ease-out-quint) 2;
}
.trek-place-pop > :first-child {
animation: trek-place-pop 220ms var(--ease-out-quint);
}
@media (prefers-reduced-motion: reduce) {
.trek-ghost-face {
animation: trek-ghost-enter 120ms ease-out both;
}
.trek-ghost.is-hot .trek-ghost-face,
.trek-place-pulse > :first-child {
animation: none;
box-shadow: 0 0 0 3px var(--accent);
}
.trek-place-pop > :first-child {
animation: trek-backdrop-enter 120ms ease-out;
}
}
[data-reduce-motion] .trek-ghost-face {
animation: trek-ghost-enter 120ms ease-out both;
}
[data-reduce-motion] .trek-ghost.is-hot .trek-ghost-face,
[data-reduce-motion] .trek-place-pulse > :first-child {
animation: none;
box-shadow: 0 0 0 3px var(--accent);
}
[data-reduce-motion] .trek-place-pop > :first-child {
animation: trek-backdrop-enter 120ms ease-out;
}