dexorder/ai
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

bugfix

Browse Source
This commit is contained in:
Tim Olson
2026-04-13 21:42:28 -04:00
parent 5021138da6
commit 45a21ac933
6 changed files with 134 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
bin/deploy
View File

@@ -212,7 +212,7 @@ if [ "$DEPLOY" == "1" ]; then
esac
echo "deployed $PROJECT $REMOTE/ai-$PROJECT:$TAG"
else
YAML=$(sed "s#image: dexorder/ai-$PROJECT*#image: $REMOTE/ai-$PROJECT:$TAG#" deploy/k8s/$KUBERNETES.yaml)
YAML=$(sed "s#image: dexorder/ai-$PROJECT*#image: $REMOTE/ai-$PROJECT:$TAG#" deploy/k8s/base/$KUBERNETES.yaml)
echo "$YAML" | kubectl apply -f - || { echo "$YAML"; echo "kubectl apply failed"; exit 1; }
echo deployed $KUBERNETES.yaml $REMOTE/ai-$PROJECT:$TAG
fi

18
gateway/src/harness/agent-harness.ts
View File

@@ -505,8 +505,6 @@ export class AgentHarness {
const messagesCopy = [...messages];
let iterations = 0;
// Track last char of last yielded text chunk to detect missing spaces between tokens
let lastChunkTail = '';
while (iterations < maxIterations) {
if (signal?.aborted) break;
@@ -525,23 +523,14 @@ export class AgentHarness {
try {
const stream = await model.stream(messagesCopy, { signal });
for await (const chunk of stream) {
const contents: string[] = [];
if (typeof chunk.content === 'string' && chunk.content.length > 0) {
contents.push(chunk.content);
yield { type: 'chunk', content: chunk.content };
} else if (Array.isArray(chunk.content)) {
for (const block of chunk.content) {
if (block.type === 'text' && block.text) contents.push(block.text);
if (block.type === 'text' && block.text) {
yield { type: 'chunk', content: block.text };
}
}
for (const content of contents) {
// DeepInfra/GLM streams tokens without leading spaces; inject one when
// both the tail of the previous chunk and the head of this chunk are
// word characters (\w), which would otherwise merge two words.
if (lastChunkTail && /\w/.test(lastChunkTail) && /\w/.test(content[0])) {
yield { type: 'chunk', content: ' ' };
}
lastChunkTail = content[content.length - 1];
yield { type: 'chunk', content };
}
response = response ? response.concat(chunk) : chunk;
}
@@ -700,7 +689,6 @@ export class AgentHarness {
// After all tool calls complete, emit a space separator before the next LLM streaming pass
yield { type: 'chunk', content: ' ' };
lastChunkTail = ' ';
}
// Max iterations reached - yield done with apology

153
web/src/App.vue
View File

@@ -1,7 +1,5 @@
<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount, computed, watch } from 'vue'
import Splitter from 'primevue/splitter'
import SplitterPanel from 'primevue/splitterpanel'
import { ref, onMounted, onBeforeUnmount, watch } from 'vue'
import ChartView from './components/ChartView.vue'
import ChatPanel from './components/ChatPanel.vue'
import LoginScreen from './components/LoginScreen.vue'
@@ -17,10 +15,35 @@ import { authService } from './composables/useAuth'
const isAuthenticated = authService.isAuthenticated
const authError = ref<string>()
const isDragging = ref(false)
const isMobile = ref(false)
let stateSyncCleanup: (() => void) | null = null
// Horizontal split: chart width in pixels (initialized on mount)
const CHART_MIN_PX = 300
const CHAT_MIN_PX = 240
const CHART_DEFAULT_RATIO = 0.62
const chartWidth = ref(0)
let hDragStartX = 0
let hDragStartWidth = 0
function initChartWidth() {
chartWidth.value = Math.round(window.innerWidth * CHART_DEFAULT_RATIO)
}
function startHDrag(e: PointerEvent) {
e.preventDefault()
;(e.target as HTMLElement).setPointerCapture(e.pointerId)
hDragStartX = e.clientX
hDragStartWidth = chartWidth.value
}
function onHDragMove(e: PointerEvent) {
if (!e.buttons) return
const delta = e.clientX - hDragStartX
const maxWidth = window.innerWidth - CHAT_MIN_PX - 4
chartWidth.value = Math.max(CHART_MIN_PX, Math.min(maxWidth, hDragStartWidth + delta))
}
// Check screen width for mobile layout
const checkMobile = () => {
isMobile.value = window.innerWidth < 768
@@ -31,7 +54,6 @@ const chartStore = useChartStore()
// Watch mobile state and update ChartStore
watch(isMobile, (mobile) => {
if (mobile) {
// Set all chart state to null when chart is hidden
chartStore.symbol = null as any
chartStore.start_time = null
chartStore.end_time = null
@@ -41,13 +63,15 @@ watch(isMobile, (mobile) => {
// Check if user is already authenticated on page load
onMounted(async () => {
// Try to restore session from stored token
initChartWidth()
checkMobile()
window.addEventListener('resize', checkMobile)
const token = authService.getToken()
if (token) {
const sessionValid = await authService.checkAuth()
if (sessionValid) {
isAuthenticated.value = true
// Connect WebSocket with existing token
try {
await wsManager.connect(token)
await initializeApp()
@@ -56,33 +80,21 @@ onMounted(async () => {
}
}
}
// Initialize mobile check
checkMobile()
window.addEventListener('resize', checkMobile)
})
const handleAuthenticate = async (email: string, password: string) => {
authError.value = undefined
try {
// Step 1: Login via HTTP to get JWT token
const result = await authService.login(email, password)
if (!result.success) {
authError.value = result.error || 'Login failed'
return
}
if (!result.token) {
authError.value = 'No token received from server'
return
}
// Step 2: Connect WebSocket with JWT token for real-time sync
await wsManager.connect(result.token)
// Step 3: Initialize application
await initializeApp()
} catch (err: any) {
authError.value = err.message || 'Authentication failed'
@@ -91,7 +103,6 @@ const handleAuthenticate = async (email: string, password: string) => {
}
const initializeApp = async () => {
// Initialize state sync after successful authentication
const chartStore = useChartStore()
const shapeStore = useShapeStore()
const indicatorStore = useIndicatorStore()
@@ -107,26 +118,9 @@ const initializeApp = async () => {
stateSyncCleanup = stateSync.cleanup
}
onMounted(() => {
// Listen for splitter drag events
document.addEventListener('mousedown', (e) => {
// Check if the mousedown is on a splitter gutter
const target = e.target as HTMLElement
if (target.closest('.p-splitter-gutter')) {
isDragging.value = true
}
})
document.addEventListener('mouseup', () => {
isDragging.value = false
})
})
onBeforeUnmount(() => {
window.removeEventListener('resize', checkMobile)
if (stateSyncCleanup) {
stateSyncCleanup()
}
if (stateSyncCleanup) stateSyncCleanup()
wsManager.disconnect()
})
</script>
@@ -140,35 +134,28 @@ onBeforeUnmount(() => {
/>
<div v-else-if="!isMobile" class="desktop-layout">
<div class="top-area">
<Splitter class="main-splitter">
<SplitterPanel :size="62" :minSize="40" class="chart-panel">
<div class="chart-panel" :style="{ width: chartWidth + 'px' }">
<ChartView />
</SplitterPanel>
<SplitterPanel :size="38" :minSize="20" class="chat-panel">
</div>
<div class="h-grabber" @pointerdown="startHDrag" @pointermove="onHDragMove" />
<div class="chat-panel">
<ChatPanel />
</SplitterPanel>
</Splitter>
</div>
</div>
<BottomTray />
</div>
<div v-else class="mobile-layout">
<ChatPanel />
</div>
<!-- Transparent overlay to prevent iframe from capturing mouse events during drag -->
<div v-if="isDragging" class="drag-overlay"></div>
</div>
</template>
<style scoped>
.app-container {
width: 100vw !important;
height: 100vh !important;
width: 100vw;
height: 100vh;
overflow: hidden;
background: #0f0f0f !important;
}
.app-container.dark {
background: #0f0f0f !important;
background: #0f0f0f;
}
.desktop-layout {
@@ -181,46 +168,38 @@ onBeforeUnmount(() => {
.top-area {
flex: 1;
min-height: 0;
overflow: hidden;
}
.main-splitter {
height: 100% !important;
background: #0f0f0f !important;
}
.main-splitter :deep(.p-splitter-gutter) {
background: #2e2e2e !important;
}
.main-splitter :deep(.p-splitter-gutter-handle) {
background: #2e2e2e !important;
}
.chart-panel,
.chat-panel {
height: 100% !important;
display: flex;
flex-direction: column;
flex-direction: row;
overflow: hidden;
}
.chart-panel :deep(.p-splitter-panel-content),
.chat-panel :deep(.p-splitter-panel-content) {
.chart-panel {
flex-shrink: 0;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
}
.drag-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
cursor: auto;
background: transparent;
.h-grabber {
width: 4px;
flex-shrink: 0;
height: 100%;
background: #2e2e2e;
cursor: col-resize;
}
.h-grabber:hover {
background: #444;
}
.chat-panel {
flex: 1;
min-width: 0;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
}
.mobile-layout {
@@ -230,10 +209,4 @@ onBeforeUnmount(() => {
flex-direction: column;
overflow: hidden;
}
@media (max-width: 767px) {
.main-splitter {
display: none;
}
}
</style>

26
web/src/components/BottomTray.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, computed, onBeforeUnmount, type Component } from 'vue'
import { ref, computed, type Component } from 'vue'
import Tabs from 'primevue/tabs'
import TabList from 'primevue/tablist'
import Tab from 'primevue/tab'
@@ -53,29 +53,19 @@ function closeTab(tabId: string) {
let resizeStartY = 0
let resizeStartHeight = 0
function startResize(e: MouseEvent) {
function startResize(e: PointerEvent) {
e.preventDefault()
;(e.target as HTMLElement).setPointerCapture(e.pointerId)
resizeStartY = e.clientY
resizeStartHeight = expandedHeight.value
document.addEventListener('mousemove', onResizeMove)
document.addEventListener('mouseup', stopResize)
}
function onResizeMove(e: MouseEvent) {
function onResizeMove(e: PointerEvent) {
if (!e.buttons) return
const delta = resizeStartY - e.clientY // dragging up increases height
expandedHeight.value = Math.max(MIN_EXPANDED, resizeStartHeight + delta)
}
function stopResize() {
document.removeEventListener('mousemove', onResizeMove)
document.removeEventListener('mouseup', stopResize)
}
onBeforeUnmount(() => {
document.removeEventListener('mousemove', onResizeMove)
document.removeEventListener('mouseup', stopResize)
})
defineExpose({
openTab(id: string, label: string, component: Component, props?: Record<string, any>) {
const existing = tempTabs.value.find(t => t.id === id)
@@ -90,7 +80,7 @@ defineExpose({
<template>
<div class="bottom-tray" :style="trayStyle">
<div v-if="isExpanded" class="tray-resize-handle" @mousedown="startResize" />
<div v-if="isExpanded" class="tray-resize-handle" @pointerdown="startResize" @pointermove="onResizeMove" />
<Tabs :value="activeTab" class="tray-tabs">
<TabList class="tray-tab-list">
<Tab value="orders" @click="onTabClick('orders')">Orders</Tab>
@@ -107,7 +97,9 @@ defineExpose({
<button class="tab-close-btn" @click.stop="closeTab(tab.id)">×</button>
</Tab>
<div class="tray-spacer" />
<button v-if="isExpanded" class="tray-close-btn" @click="isExpanded = false">✕</button>
<button v-if="isExpanded" class="tray-close-btn" @click="isExpanded = false" title="Minimize">
<i class="pi pi-chevron-down" />
</button>
</TabList>
<TabPanels v-if="isExpanded" class="tray-panels">
<TabPanel value="orders" class="tray-panel"><OrdersTab /></TabPanel>

69
web/src/components/ChatPanel.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, onMounted, onUnmounted, computed } from 'vue'
import { ref, onMounted, onUnmounted, computed, onBeforeUnmount, watch, nextTick } from 'vue'
import { register } from 'vue-advanced-chat'
import Badge from 'primevue/badge'
import Button from 'primevue/button'
@@ -11,6 +11,26 @@ register()
const channelStore = useChannelStore()
// Measure container height and feed a concrete pixel value to vue-advanced-chat,
// because height: 100% doesn't reliably resolve through flex chains.
const chatContainerRef = ref<HTMLElement | null>(null)
const chatHeight = ref('400px')
let resizeObserver: ResizeObserver | null = null
onMounted(() => {
if (chatContainerRef.value) {
resizeObserver = new ResizeObserver(entries => {
const h = entries[0].contentRect.height
if (h > 0) chatHeight.value = h + 'px'
})
resizeObserver.observe(chatContainerRef.value)
}
})
onBeforeUnmount(() => {
resizeObserver?.disconnect()
})
const SESSION_ID = 'default'
const CURRENT_USER_ID = 'user-123'
const AGENT_ID = 'agent'
@@ -543,16 +563,8 @@ onMounted(() => {
wsManager.addHandler(handleMessage)
setTimeout(() => {
// Inject styles into shadow DOM to widen message bubbles
const chatEl = document.querySelector('vue-advanced-chat')
if (chatEl?.shadowRoot) {
const style = document.createElement('style')
style.textContent = `
.vac-message-wrapper .vac-message-box { max-width: 80%; }
.vac-message-wrapper .vac-offset-current { margin-left: 20%; }
`
chatEl.shadowRoot.appendChild(style)
}
// Inject styles into shadow DOM to widen message bubbles (fallback if already ready at mount)
injectShadowStyles()
const chatInput = document.querySelector('.vac-textarea') as HTMLTextAreaElement
if (chatInput) {
@@ -561,13 +573,38 @@ onMounted(() => {
}, 300)
})
const injectShadowStyles = () => {
const chatEl = document.querySelector('vue-advanced-chat')
if (chatEl?.shadowRoot) {
// Remove any previously injected style to avoid duplicates
chatEl.shadowRoot.querySelector('#vac-width-override')?.remove()
const style = document.createElement('style')
style.id = 'vac-width-override'
style.textContent = `
.vac-message-wrapper .vac-message-box { max-width: 80%; }
.vac-message-wrapper .vac-offset-current { margin-left: 20%; }
`
chatEl.shadowRoot.appendChild(style)
}
}
watch(() => channelStore.isReady, async (ready) => {
if (!ready) return
await nextTick()
setTimeout(() => {
injectShadowStyles()
const chatInput = document.querySelector('.vac-textarea') as HTMLTextAreaElement
chatInput?.focus()
}, 100)
})
onUnmounted(() => {
wsManager.removeHandler(handleMessage)
})
</script>
<template>
<div class="chat-container">
<div class="chat-container" ref="chatContainerRef">
<!--
<div class="chat-header-custom">
<span class="chat-title">AI Agent Chat</span>
@@ -586,7 +623,7 @@ onUnmounted(() => {
<vue-advanced-chat
v-else
height="100vh"
:height="chatHeight"
:current-user-id="CURRENT_USER_ID"
:rooms="JSON.stringify(rooms)"
:messages="JSON.stringify(messages)"
@@ -640,13 +677,13 @@ onUnmounted(() => {
align-items: center;
justify-content: center;
gap: 1rem;
background: #131722;
color: #787B86;
background: #0f0f0f;
color: #888;
}
.workspace-loading-spinner {
font-size: 2rem;
color: #787B86;
color: #089981;
}
.workspace-loading-message {

4
web/src/components/LoginScreen.vue
View File

@@ -129,7 +129,7 @@ onMounted(() => {
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, var(--p-surface-0) 0%, var(--p-surface-100) 100%);
background: #0f0f0f;
}
.login-container {
@@ -139,7 +139,7 @@ onMounted(() => {
}
.login-card {
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
box-shadow: 0 8px 48px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.login-title {