Course lesson 32 · Building AI Workflows
Add Evaluation Data in UI
The application’s evaluation screens are connected to real backend records instead of placeholder arrays. Two shared DataOps queries supply problematic destinations and recent evaluations through tRPC, filtered by the account context. The debugging sequence shows that an empty UI can be correct when the selected account differs from the account attached to the stored evaluation.
Primary source: course video 32 · Supplied English subtitles · 00:05:45.
Understand the idea
- The backend produces evaluation data; tRPC exposes that data to the application’s existing screens.
- The problematic-destinations view selects evaluations classified as unavailable.
- The general evaluations query returns recent records and supports a created-before filter for pagination.
- Account filtering determines which records a user-facing query can see.
- Remote D1 development depends on the developer’s Cloudflare authentication as well as application query logic.
What the course does
- Start the user application and locate the problematic-links and evaluations sections.
- Import the shared evaluation queries into the tRPC evaluation routes.
- Replace problematic-destination dummy data with the query for unavailable results.
- Replace the general evaluation placeholder array with the real recent-evaluations query and await the results.
- Resolve the expired Cloudflare login affecting the remote D1 connection.
- Compare the test account ID in D1 with the application’s temporary user/account value, align the test setup, and inspect the displayed evaluations.
Watch for
- The lesson temporarily uses a hard-coded user ID as an account proxy; this is development scaffolding that the later auth section replaces.
- Unknown evaluations do not automatically appear in the unavailable-only problematic-links list.
- Added advice: when a list is empty, distinguish missing records, filtering, authentication, and loading failures before changing the query.
Follow the final workflow correction in lesson 34 when combining these steps.
Recall before revealing
Why could D1 contain evaluations while the application displays none?
Reveal the explanation
The route filters by account, and the demonstration’s stored test account initially did not match the application’s temporary account value.
Try it
Write a troubleshooting sequence for an empty evaluations screen. Include a query with the exact account ID being used by the route.
Check your result
You can separate a valid empty result from a broken connection and identify whether the stored account matches the requested account.
Practice prompts and answer checks are added teaching material. Answer from memory first, then compare and explain any difference.
Rewatch only what you need
Open this lesson in your original course library and seek to the times below. Videos are not hosted on this site.
- 00:00:29 — Shared evaluation queries
- 00:01:13 — Replacing tRPC dummy responses
- 00:02:35 — Cloudflare login caused remote-query trouble
- 00:03:33 — Account-ID mismatch explains an empty list
- 00:04:29 — Viewing real evaluation reasons and URLs
Companion primary documentation: Workflows Workers API. For recorded API names, commands, limits, and prices, check the version you use.