Corbi-Wan Kenobi Posts - Convex Community

Corbi-Wan Kenobi

•Created by Corbi-Wan Kenobi on 2/27/2025 in #support-community

TanStack Start and Convex Pagination glitches

TanStack Start 1.111.10, and Convex bits version as of today. I'm loading a component into an Outlet that is a table that displays a list of models of devices. Using the instructions for Paginated Queries I'm able to load 10 items at a time, but there one odd (to me) behavior and one crash. Odd behavior - I have a Load More button that does load more, but it reloads Outlet. Is that nomral? I thought it would just append to the end of the table. It's not doing a full root reload, but its reloading the outlet and adding 10. Crash - when I get to the end of the rows, TanStack crashes with the following.

[CONVEX Q(deviceModels:getAllModels)] [Request ID: 9c6fbc4b7cfc4b65] Server Error
Uncaught TypeError: Must provide arg 1 "id" to "get"
    at <anonymous> (../convex/deviceModels.ts:29:34)
    at map [as map] (<anonymous>)
    at handler (../convex/deviceModels.ts:28:14)

  Called by client

There is a key=ID on each table row. Like I said, this only happens when I try to load the last page of results. Feels like a TanStank Start glitch? Something to do with the query maybe? Typical Convex queries need some extra convexQuery love so I'm wondering it this is a TSStart/Convex/TSQuery interaction.

9 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 2/24/2025 in #support-community

useQuery giving undefined while useSuspenseQuery gives results

Using TanStack Start. Here is the query.

export const getDeviceTypes = query({
  args: {},
  handler: async (ctx) => {
    return await ctx.db
      .query("device_types")
      .withIndex("by_categoryId", (q) =>
        q.eq(
          "categoryId",
          "kn7bypng5v3mbmn4fnvrfd34r57azdcw" as Id<"deviceCategories">,
        ),
      )
      .collect();
  },
});

When I call it from my tsx page, if I use const { data } = useQuery(convexQuery(api.network.getDeviceTypes, {})); then I get undefined via a console.log. If I use useSuspenseQuery I get the array I expect. I've also tried const data = useQuery(api.network.getDeviceTypes, {}); which also returns undefined.

5 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 2/14/2025 in #support-community

How to query while inside a function?

I have a handleSubmit function called by a form. I have a query built that works, but I don’t know how to access it while I’m inside of a function. I know the query works because I can hardcode and use a stand alone useQuery but I can’t figure out the syntax/command to use while inside of a function to call it with an arg. I’m using TanStack. Clarification: the query does a check for some business logic which is why I’m doing it inside of the handleSubmit. The rest of the handleSubmit depends on the result of this initial query. Do I need to do this more sequentially instead of all inside one function? Get the form element I need and make it a const then pass that to a query, then call that from inside the handle form?

6 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 2/11/2025 in #support-community

When to query data in a framework's loader vs a route component? Or imported component?

Coming from a Remix/RR7 background where basically all data fetching was done in the loader. Now I'm making headway in TanStack Start/Router and Convex and its slowly starting to click. Convex docs for TanStack always show doing a query in the route component, usually highlighting the reactivity for changes in the database which is great. My questions are, under what circumstances would one do the query in a loader/beforeLoad and when would one do it in the route component? When reactivity is needed is it only achieved in the route component? Can reactivity happen from an imported component that has a useQuery in its export? If one doesn't need reactivity is it better to query in the loader? Some of this has to do with the code splitting that TanStack does, keeping code securely processed on the server vs potentially exposed on the client. How that all works is one of the many ways my ignorance starts to show. Like anyone else, I want to keep safe the data that needs keeping safe, and also have the app do the work where it should be doing it (loader/component/route) and not mistakenly trying to make it do it one way when it only works the other.

25 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 2/11/2025 in #support-community

Preferred method for saving formatted text in string fields?

It's still early days for me in Convex and my app. For now I need to display a block of text made up of a number of paragraphs. What is the secret sauce to copy/paste into a string field and maintain paragraphs? Eventually I will be building something more sophisticated with TipTap or similar. For now, I'd like this block to have some paragraph breaks. I tried \r and \n thinking it might interpret those but it doesn't seem to.

7 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/26/2025 in #support-community

COPPA compliance?

One of my projects is for the large private school I work at. I would need to store student data. COPPA (basically the student version of HIPPA) would be a factor. Would I want to use the open source convex and host onsite? When I was looking at Supabase they said that they needed some extra configuration if a project needed to be HIPPA compliant. Anything like that with Convex?

3 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/26/2025 in #support-community

Using pagination in convex vs something like TanStack Tables?

I discovered convex via TanStack. I have a playground project where I got TanStack Tables working with pagination, sorting, and filtering all in one go. Benefits/drawbacks on using that over more hands-on coding with convex pagination and other coding to get the same results (dynamic filtering, sorting, address bar syncing and browser history consistency)?

22 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/25/2025 in #support-community

How to tell the query to include specific fields

Instead of returning ALL of the fields in a document I want the query to only include specific fields. When I asked AI to help it said to put a .map function after the .query but when I do that I get a .map is not a function error. Ideally I want to specify the fields in the query, not in the return. Akin to select firstname, lastname from people where... as opposed to what is happening now which is select * from people where... What I tried based on AI.

export default query(async (ctx) => {
  console.log("Write and test your query function here!");
  return await ctx.db.query("people").map((person) => ({
nameFirst: person.name_first
  })).collect();
})

What get - Server Error Uncaught TypeError: ctx.db.query(...).map is not a function

10 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/24/2025 in #support-community

Suggestions on schema best practice?

Bringin my data from postgres, this is one model I've been using and I'm wondering if this would not be better in convex as arrays. I'm coming from an SQL background with the usually weight on normalization. I have a people table, a phone_number_types table, and a person_numbers table linking the two with fireign keys (what is convex-speak for primary and foreign keys? same thing? Convex doesn't specificy foreign keys in their tables, right?). This allows for a given person to have one or more phone numbers attached to them with different types. Some people will only have one number, others will have several. I didn't want my people table to have fields for 5 possible types of numbers most of which would be empty for most people. I also have the same structure for email addresses and physical addresses. I'm wondering, from a convex perspective, is it better to store these kinds of things in array fields in the people table? It would mean far fewer relational joins, but I read in one of the docs it is better to not have too deeply nested of array fields. The array might look like {phone_numbers: {home: xxxxxxxxxx},{mobile: yyyyyyyyyy}} I actually had this a year or so ago when I was playing with MongoDB. Is it a matter of preference in this case since its really only a two level deep array?

3 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/24/2025 in #support-community

Joining related tables help

There is a rough example of a join function in the convex docs that looks like this.

export const eventAttendees = query({
  args: { eventId: v.id("events") },
  handler: async (ctx, args) => {
    const event = await ctx.db.get(args.eventId);
    return Promise.all(
      (event?.attendeeIds ?? []).map((userId) => ctx.db.get(userId)),
    );
  },
});

I have a devices table that is related to a devices_makes and a devices_models table all by _id. Thanks to @lee 's help I got my foreign keys updated with migrations. No I just need help with how to join them so that I get something back like | devices:Asset Tag | devices_makes:Make | devices_model:Model | In the cited example an event can have many attendees (one-to-many). In this case mine are one-to-one. I've tried to plug in my own table and field names for just linking device_makes into the above examples but I get TypeScript Errors. I need some baby steps for join statements. Note to super Convex documentation people: it would be really helpful in the docs if you could include things like example schemas when giving example statements, especially for more complex things like joins.

38 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/21/2025 in #support-community

I need to rekey my tables after importing

I'm used to a database-first development approach (only an SQL background) meaning that any modifications to the structure of my data/tables/relations, I have always managed directly in the database via SQL statements. I'm fully on-bard with Convex's mission and position on SQL, but I'm still in the early stages of the Mt Everest of learning curves for me. I've started small, imorting a primary table, some secondary tables (my terms) and a few many-to-many tables that link them. Since convex generates new unique row IDs, I would like to update/replace the values that make up all of the relationships in the many-to-many linking tables. What is the convex/JS way to do this, updating foreign keys based on new primary keys?

46 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/18/2025 in #support-community

Convex Auth workflow

I'm converting from Remix/ReactRouter7 and Supabase to TanStack Start and Convex. I have this working in the other app and I'm having trouble knowing what to put where in "TanVex" or "ConStack" 🙂 Step 1 - User puts their email in a form for a Magic Link auth (which I have working on its own), and clicks the button. Step 2 - I need convex to take the submitted email address, query my "people" table and check if (a) the email exists/is connected to a user and (b) the "can_login" boolean for the user is set to true. Here is how I'm capturing the email address and sending it to the query:

 const formData = new FormData(event.currentTarget);
  const submittedEmail = formData.get("email");
  const { data } = useSuspenseQuery(convexQuery(api.personEmails.checkCanLogin, {email_address: submittedEmail}));

I have that happening in the sample login form linked below (between lines 58 and 59). I don't know how to grab and use the submittedEmail in the query I'm working on in the personEmails.checkCanLogin, nor do I know how to return back to the login page that requested it. Step 3 - If the tests pass, proceed with the magic link process and display a "check your email" message. If the tests fail, show a "that address is not authorized" message. I was working with the sample login form located here as a template (https://github.com/get-convex/convex-auth-example/blob/main/src/auth/SignInFormEmailLink.tsx). I'm new to both Convex and Tanstack. I haven't figured out how to pass the formData email to the convex query that I've put in a person_emails.ts file. That's where I'm stuck. I'll of course need to return the results. There are great examples of pulling all rows from a table in the docs. I can't find good examples of accepting, passing, and returning things like this search. I'm guessing its framework specific. I get Remix/RR7 loaders and actions, I'm having trouble bridging the concepts here.

7 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/15/2025 in #support-community

Dumb question: how do I make it stop looking for the sample data?

I installed the convex and tanstack start template. New to both. Every time I npm run dev I see a warning that it can't find the sample.json file which I did delete. How do I make convex stop looking for that?

7 replies

CCConvex Community

•Created by Corbi-Wan Kenobi on 1/14/2025 in #support-community

Working on importing/migrating from another database

I'm just starting to experiment with migrating data over from Postgres. I see that "each row's entries are interpreted either as a (floating point) number or a string." Got it. However, when I do the import (csv), every value ends up in convex with quotation marks around it. This is messing up my boolean fields. How can I find/replace/update all rows/fields where I have a boolean so that it removes the quotation marks?

3 replies