feat(ui): Add a dashboard assistant hub and improve chat output by nfebe · Pull Request #91 · trakli/webui

nfebe · 2026-06-18T13:23:48Z

Adds an assistant entry point to the dashboard and improves how the chat renders responses. Pairs with the backend changes in trakli/webservice (same branch).

Dashboard

New assistant section at the top: greeting, a free-text ask box, and quick actions (log a transaction, transfer money, build a report, import a document). Log and transfer save directly and stay on the dashboard; report and import hand off to the chat.
The wallet and period controls moved into a stats bar beneath it. The assistant section is dismissable for the session and returns on refresh.
Subtle background treatments on the other dashboard cards.

Chat

Renders more report widgets (callout, timeline, progress, comparison, list, quick actions, and a question with selectable answers), and shows an inline preview of generated canvas reports.
Quick-action popups always show their submit button (a global footer rule had been hiding it).
Slow responses keep showing progress instead of prematurely saying the response did not finish.
The advanced importer uses the shared icon set.

sourceant · 2026-06-18T13:24:05Z

Code Review Summary

This PR significantly enhances the dashboard experience by adding an AI-driven Assistant Hero and improving the richness of chat responses with specialized blocks (Timeline, Progress, Comparison, etc.). It also refactors several components for better reusability and updates tests to cover new functionality.

🚀 Key Improvements

New DashboardAgentHero provides a high-visibility entry point for AI interactions.
Decoupled DashboardWalletSelector allows for cleaner state management and reusable UI.
Enhanced chat rendering with dedicated blocks for financial data (KPIs, Charts, Timelines).
Implemented a 'Pending Ask' pattern to allow seamless transitions from dashboard to chat.

💡 Minor Suggestions

Use passive event listeners for scroll handlers in DashboardWalletSelector.
Consider extracting the icon-ambient background logic to a shared component.

sourceant

Review complete. See the overview comment for a summary.

sourceant · 2026-06-18T13:24:06Z

+
+const prettify = (key: string): string =>


When prettifying keys (e.g., 'total_amount'), it's safer to handle acronyms or specific finance terms. Currently, 'Id' becomes 'Id', while 'ID' is often preferred.

Suggested change

const prettify = (key: string): string =>

const prettify = (key: string): string =>

key.replace(/_/g, ' ').replace(/\bid\b/gi, 'ID').replace(/\b\w/g, (c) => c.toUpperCase());

sourceant · 2026-06-18T13:24:06Z

+// indefinitely (a worker crash, a backend timeout, etc.). Keep this in step with
+// the polling window in useAiChats: agent runs legitimately take a couple of
+// minutes, so only treat a message older than this as stuck.
+const STUCK_THRESHOLD_MS = 240_000;


Increasing the threshold to 4 minutes (240,000ms) might lead to a poor UX where a user waits too long for a truly failed request. Consider implementing a 'retry' or 'refresh' nudge if a message exceeds 90s but is under 240s.

Suggested change

const STUCK_THRESHOLD_MS = 240_000;

const STUCK_THRESHOLD_MS = 180_000;

sourceant · 2026-06-18T13:24:06Z

+const runLog = async () => {
+  busy.value = true;
+  try {
+    const now = new Date();


The log transaction logic extracts the time from new Date(), but then sets date: form.date || ''. If form.date is empty, the backend might reject an empty string or default to the Unix epoch. It is safer to default to the current ISO date.

Suggested change

const now = new Date();

const now = new Date();

const time = now.toTimeString().slice(0, 5);

const defaultDate = now.toISOString().split('T')[0];

await addTransaction({

id: '',

date: form.date || defaultDate,

cloudflare-workers-and-pages · 2026-06-18T13:25:19Z

Deploying trakli-dev with Cloudflare Pages

Latest commit:	`c6c361e`
Status:	✅ Deploy successful!
Preview URL:	https://d259286f.trakli-dev.pages.dev
Branch Preview URL:	https://feat-issue-88-followups.trakli-dev.pages.dev

View logs

The dashboard now opens with an assistant section: a greeting, a free text ask box, and quick actions to log a transaction, transfer money, build a report, or import a document. Logging and transfers save directly and stay on the dashboard; reports and imports hand the request to the chat. The wallet and period controls moved into a stats bar below it, and the assistant section can be dismissed for the session and returns on refresh. In the chat, the assistant can present more report widgets (callouts, timelines, progress, comparisons, lists, quick actions, and a question with selectable answers), and a generated report now shows a preview inline instead of only a card. Quick action popups always show their submit button, and slow responses keep showing progress instead of prematurely claiming the response did not finish. The advanced importer uses the shared icon set for visual consistency.

sourceant

Review complete. See the overview comment for a summary.

sourceant · 2026-06-18T13:52:46Z

+const nowLocal = () => {
+  const d = new Date();
+  d.setMinutes(d.getMinutes() - d.getTimezoneOffset());
+  return d.toISOString().slice(0, 16);


The nowLocal function manually calculates the ISO string. For better reliability and to avoid potential edge cases with toISOString, consider using a dedicated date library or a more robust formatting approach.

Suggested change

return d.toISOString().slice(0, 16);

return new Date(d.getTime() - d.getTimezoneOffset() * 60000).toISOString().slice(0, 16);

cloudflare-workers-and-pages · 2026-06-18T13:54:26Z

Deploying webui with Cloudflare Pages

Latest commit:	`c6c361e`
Status:	✅ Deploy successful!
Preview URL:	https://8ff51ee5.webui-9fh.pages.dev
Branch Preview URL:	https://feat-issue-88-followups.webui-9fh.pages.dev

View logs

sourceant Bot suggested changes Jun 18, 2026

View reviewed changes

nfebe force-pushed the feat/issue-88-followups branch from 27ec1a4 to c6c361e Compare June 18, 2026 13:52

sourceant Bot reviewed Jun 18, 2026

View reviewed changes

nfebe merged commit d2e692e into dev Jun 18, 2026
6 checks passed

nfebe deleted the feat/issue-88-followups branch June 18, 2026 14:15

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat(ui): Add a dashboard assistant hub and improve chat output#91

feat(ui): Add a dashboard assistant hub and improve chat output#91
nfebe merged 1 commit into
devfrom
feat/issue-88-followups

nfebe commented Jun 18, 2026

Uh oh!

sourceant Bot commented Jun 18, 2026 •

edited

Loading

Uh oh!

sourceant Bot left a comment

Uh oh!

sourceant Bot Jun 18, 2026

Uh oh!

sourceant Bot Jun 18, 2026

Uh oh!

sourceant Bot Jun 18, 2026

Uh oh!

cloudflare-workers-and-pages Bot commented Jun 18, 2026 •

edited

Loading

Uh oh!

sourceant Bot left a comment

Uh oh!

sourceant Bot Jun 18, 2026

Uh oh!

cloudflare-workers-and-pages Bot commented Jun 18, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

	const STUCK_THRESHOLD_MS = 240_000;
	const STUCK_THRESHOLD_MS = 180_000;

-    const now = new Date();
+    const now = new Date();
+    const time = now.toTimeString().slice(0, 5);
+    const defaultDate = now.toISOString().split('T')[0];
+    await addTransaction({
+      id: '',
+      date: form.date || defaultDate,

	return d.toISOString().slice(0, 16);
	return new Date(d.getTime() - d.getTimezoneOffset() * 60000).toISOString().slice(0, 16);

Uh oh!

Conversation

nfebe commented Jun 18, 2026

Uh oh!

sourceant Bot commented Jun 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review Summary

🚀 Key Improvements

💡 Minor Suggestions

Uh oh!

sourceant Bot left a comment

Choose a reason for hiding this comment

Uh oh!

sourceant Bot Jun 18, 2026

Choose a reason for hiding this comment

Uh oh!

sourceant Bot Jun 18, 2026

Choose a reason for hiding this comment

Uh oh!

sourceant Bot Jun 18, 2026

Choose a reason for hiding this comment

Uh oh!

cloudflare-workers-and-pages Bot commented Jun 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying trakli-dev with Cloudflare Pages

Uh oh!

sourceant Bot left a comment

Choose a reason for hiding this comment

Uh oh!

sourceant Bot Jun 18, 2026

Choose a reason for hiding this comment

Uh oh!

cloudflare-workers-and-pages Bot commented Jun 18, 2026

Deploying webui with Cloudflare Pages

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

sourceant Bot commented Jun 18, 2026 •

edited

Loading

cloudflare-workers-and-pages Bot commented Jun 18, 2026 •

edited

Loading