botserver/ui/suite/partials/contexts.html
Rodrigo Rodriguez (Pragmatismo) e68a12176d Add Suite app documentation, templates, and Askama config
- Add askama.toml for template configuration (ui/ directory)
- Add Suite app documentation with flow diagrams (SVG)
  - App launcher, chat flow, drive flow, tasks flow
  - Individual app docs: chat, drive, tasks, mail, etc.
- Add HTML templates for Suite apps
  - Base template with header and app launcher
  - Auth login page
  - Chat, Drive, Mail, Meet, Tasks templates
  - Partial templates for messages, sessions, notifications
- Add Extensions type to AppState for type-erased storage
- Add mTLS module for service-to-service authentication
- Update web handlers to use new template paths (suite/)
- Fix auth module to avoid axum-extra TypedHeader dependency
2025-11-30 21:00:48 -03:00

117 lines
2.6 KiB
HTML

<div class="contexts-selector">
<label class="contexts-label">Context:</label>
<select
class="contexts-dropdown"
name="context"
hx-post="/api/chat/context"
hx-trigger="change"
hx-swap="none"
>
<option value="">Select context...</option>
{% for context in contexts %}
<option value="{{ context.id }}">{{ context.name }}</option>
{% endfor %}
</select>
</div>
{% if contexts.len() > 0 %}
<div class="contexts-list">
{% for context in contexts %}
<div
class="context-item"
hx-post="/api/chat/context"
hx-vals='{"context_id": "{{ context.id }}"}'
hx-swap="none"
>
<div class="context-name">{{ context.name }}</div>
<div class="context-description">{{ context.description }}</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="contexts-empty">
<p>No contexts configured</p>
</div>
{% endif %}
<style>
.contexts-selector {
margin-bottom: 12px;
}
.contexts-label {
display: block;
font-size: 12px;
font-weight: 500;
color: var(--text-secondary);
margin-bottom: 6px;
}
.contexts-dropdown {
width: 100%;
padding: 10px 12px;
background: var(--surface-hover);
border: 1px solid var(--border);
border-radius: 8px;
color: var(--text);
font-size: 13px;
cursor: pointer;
transition: all 0.15s;
}
.contexts-dropdown:hover {
border-color: var(--primary);
}
.contexts-dropdown:focus {
outline: none;
border-color: var(--primary);
box-shadow: 0 0 0 2px var(--primary-light);
}
.contexts-list {
display: flex;
flex-direction: column;
gap: 6px;
}
.context-item {
padding: 10px 12px;
background: var(--surface-hover);
border: 1px solid var(--border);
border-radius: 8px;
cursor: pointer;
transition: all 0.15s;
}
.context-item:hover {
background: var(--surface);
border-color: var(--primary);
}
.context-item.active {
background: var(--primary-light);
border-color: var(--primary);
}
.context-name {
font-size: 13px;
font-weight: 500;
margin-bottom: 2px;
}
.context-description {
font-size: 11px;
color: var(--text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.contexts-empty {
padding: 16px;
text-align: center;
color: var(--text-secondary);
font-size: 13px;
}
</style>