What's wrong with the following simple line of code?
readyTitles: defineTable({
name: v.string(),
category: v.optional(v.string()),
}).index("by_name", ["name"]),Query:
export const collectTitles = query({
handler: async (ctx) => {
const titles = await ctx.db
.query("readyTitles")
.withIndex("by_name")
.collect();
return titles;
},
});And, the page.tsx where I want to display all the title names:
...
const titles = useQuery(api.titles.collectTitles);
// some more code<div className="grid gap-4 space-y-4">
<h3>Essay Titles:</h3>
{titles?.map((title) => (
<p key={title._id}>{title.name}</p>
))}
</div>I want all the readyTitles to be displayed on page.tsx. I think I followed the docs correctly, but, no result. Just empty space instead of the list of mapped titles.
The table data was generated manually using the convex.dev dashboard, and seems like they are all saved, because once i logged off and logged in the data is there.
What am i missing?
Please, help me solve this small issue. I am new to web dev and still in my learning journey.
Thanks beforehand!
