openclaw/oikos
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): show external calendar name and location in upcoming events

Browse Source 
Imports fmtLocation; renderUpcomingEvents adds event-item__cal span for
cal_name and shows location with normalized ICS escapes via fmtLocation().
Event color dot gets filter: saturate(0.4) to match calendar view style.
This commit is contained in:
Konrad M.
2026-04-21 21:56:41 +02:00
parent e729bc9c4e
commit c6c02f0f30
2 changed files with 12 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/pages/dashboard.js
+4 -3
View File
@@ -6,7 +6,7 @@
import { api } from '/api.js'; import { api } from '/api.js';
import { t, formatDate, formatTime, getLocale } from '/i18n.js'; import { t, formatDate, formatTime, getLocale } from '/i18n.js';
import { esc } from '/utils/html.js'; import { esc, fmtLocation } from '/utils/html.js';
import { openModal, closeModal } from '/components/modal.js'; import { openModal, closeModal } from '/components/modal.js';
// Hält den AbortController des aktuellen FAB-Listeners - wird bei jedem render() erneuert. // Hält den AbortController des aktuellen FAB-Listeners - wird bei jedem render() erneuert.
@@ -236,13 +236,14 @@ function renderUpcomingEvents(events) {
const timeStr = e.all_day ? t('dashboard.allDay') : `${formatTime(d)}${_suffix ? ' ' + _suffix : ''}`.trim(); const timeStr = e.all_day ? t('dashboard.allDay') : `${formatTime(d)}${_suffix ? ' ' + _suffix : ''}`.trim();
return ` return `
<div class="event-item" data-route="/calendar" role="button" tabindex="0"> <div class="event-item" data-route="/calendar" role="button" tabindex="0">
<div class="event-item__bar" style="background-color:${esc(e.color) || 'var(--color-accent)'}"></div> <div class="event-item__bar" style="background-color:${esc(e.cal_color || e.color) || 'var(--color-accent)'}"></div>
<div class="event-item__content"> <div class="event-item__content">
<div class="event-item__title">${esc(e.title)}</div> <div class="event-item__title">${esc(e.title)}</div>
<div class="event-item__time"> <div class="event-item__time">
<span class="event-time-badge ${isToday ? 'event-time-badge--today' : ''}">${isToday ? t('common.today') : formatDateTime(e.start_datetime).split(',')[0]}</span> <span class="event-time-badge ${isToday ? 'event-time-badge--today' : ''}">${isToday ? t('common.today') : formatDateTime(e.start_datetime).split(',')[0]}</span>
${timeStr} ${timeStr}
${e.location ? ` · ${esc(e.location)}` : ''} ${e.location ? ` · ${esc(fmtLocation(e.location))}` : ''}
${e.cal_name ? `<span class="event-item__cal">${esc(e.cal_name)}</span>` : ''}
</div> </div>
</div> </div>
</div> </div>
public/styles/dashboard.css
+8
View File
@@ -369,6 +369,7 @@
border-radius: var(--radius-full); border-radius: var(--radius-full);
flex-shrink: 0; flex-shrink: 0;
background-color: var(--color-accent); background-color: var(--color-accent);
filter: saturate(0.4);
} }
.event-item__content { .event-item__content {
@@ -392,9 +393,16 @@
margin-top: 1px; margin-top: 1px;
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap;
gap: var(--space-1); gap: var(--space-1);
} }
.event-item__cal {
width: 100%;
font-size: var(--text-xs);
color: var(--color-text-disabled);
}
.event-time-badge { .event-time-badge {
font-size: var(--text-xs); font-size: var(--text-xs);
font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold);