redan•3w ago

No types in ide

I am using convex with next js, and the types of all api. is any. the type of api is FilterApi<ApiFromModules<{ I keep getting the eslint error Unsafe assignment of an error typed value

77 Replies

Convex Bot•3w ago

Thanks for posting in <#1088161997662724167>. Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets. - Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.) - Use search.convex.dev to search Docs, Stack, and Discord all at once. - Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI. - Avoid tagging staff unless specifically instructed. Thank you!

Sara•3w ago

Usually if you run pnpm dlx convex dev and update the types it should fix this problem or npx for npm

redanOP•3w ago

This has not helped, I have run pnpm dlx convex dev, npx convex dev and npx convex deploy. I am using the pnpm package manager. I have also restarted the typescript server multiple times, and have closed and reopened cursor (my ide) and the file. Ant other ideas would be apreciated, as one of the reasons I like convex is its typesafty

Sara•3w ago

Hmmm are the updates on the schema being updated correctly? I sometimes misstype the schema file and that used to ruin it for me

redanOP•3w ago

The schema file is called schema.ts (copied and pasted) and when looking at _generated/api.d.ts it looks like all the files are correct and the schema on convex.dev is updating correctly Could it be something to do with me running both dev and deploy from the same location? Does convex take type priority as such?

Sara•3w ago

No You need to run it with pnpx on dev, deploy doesn't do anything on your development mode So run only pnpx convex dev, and try to update the schema Also are you using default export?😅 Oh I just realised that i missed something

redanOP•3w ago

Yes I am using export default. I am also running a production environment as well as a dev env, hense why I tried that

Sara•3w ago

Can you share where you used the api.?

redanOP•3w ago

src/app/api/v1/users/moderation/kick/route.ts > POST I am useing fetchQuery and fetchMutation

Sara•3w ago

Hmm, so just so we're clear deploy deploys to production not development

redanOP•3w ago

Yes

Sara•3w ago

Can you share code? Because that's your problem!

redanOP•3w ago

Usage:

fetchQuery(api.users.getProfile, {
      id: user._id,
      server: server._id,
    }),

fetchQuery(api.users.getProfile, {
      id: user._id,
      server: server._id,
    }),

Sara•3w ago

Convex doesn't need a server, so using the api post request on node side is not going to work, you'll need to use it on your actual frontend components ending with .tsx or .jsx Would you like some resources?

redanOP•3w ago

I have an api, that I am receiving from other programs, not just my front end, so I need them to hit my backend api (which makes multiple convex requests as well as logic) to return response. I am not using the nextjs api routes for my frontend (I would just use convex for them) yes please, if you have any for my requirements

Sara•3w ago

If you use the same code on your frontend components, not on the backend api, the types should work like normal, calling them from http endpoints won't work like you think it might Sure, you can do that by writing convex functions under your convex folder as routes, and then use them in "server components" as callable function hooks, so no need for a fetch request there, I'll post resources shortly

Sara•3w ago

Server side rendering: https://docs.convex.dev/client/react/nextjs/server-rendering

Next.js Server Rendering | Convex Developer Hub

Implement server-side rendering with Convex in Next.js App Router using preloadQuery, fetchQuery, and server actions for improved performance.

redanOP•3w ago

I have just tried in src/app/page.tsx and am still not getting types. Same as on the backend

Sara•3w ago

But i would start here for your case https://docs.convex.dev/quickstart/nextjs

Next.js Quickstart | Convex Developer Hub

Add Convex to a Next.js project

Sara•3w ago

And then move to tutorials https://docs.convex.dev/tutorial/

Convex Tutorial: A Chat App | Convex Developer Hub

Build a real-time chat application with Convex using queries, mutations, and the sync engine for automatic updates across all connected clients.

Sara•3w ago

Try using useQuery

redanOP•3w ago

I have already set it up for my next js app, and other next js apps i work on do have type saftey I did

Sara•3w ago

And please take a screenshot of the types that you're getting

redanOP•3w ago

Its the api variable thats broken

Sara•3w ago

Oh! Ok let me explain this again So for convex to work, There's a folder called "convex" where it has your code and your type generations, That's where the api is, the folder route that you showed earlier DOESN'T IMPORT TYPES FROM CONVEX

redanOP•3w ago

Heres my types

Sara•3w ago

The type annotation is imported from "/convex/_generated/api.d.ts" Where are you importing api from? Like the folder path 😅 @erquhart some help here please

redanOP•3w ago

I know, I have multiple other projects with next js and convex that work fine with a proper database, I have defined my schema in /convex/schema.ts, and run npx convex dev / npx convex deploy Those screenshots import import { api } from "../../convex/_generated/api";, I have also tried just import { api } convex/_generated/api"; which gives the exact same types. There is the exact same types in both the frontend page.tsx files and route.ts files

erquhart•3w ago

Can you paste your convex/_generated/api.d.ts

redanOP•3w ago

/* eslint-disable */
/**
 * Generated `api` utility.
 *
 * THIS CODE IS AUTOMATICALLY GENERATED.
 *
 * To regenerate, run `npx convex dev`.
 * @module
 */

import type {
  ApiFromModules,
  FilterApi,
  FunctionReference,
} from "convex/server";
import type * as config from "../config.js";
import type * as messages from "../messages.js";
import type * as moderation from "../moderation.js";
import type * as server from "../server.js";
import type * as sessions from "../sessions.js";
import type * as users from "../users.js";
import type * as whitelist from "../whitelist.js";

/**
 * A utility for referencing Convex functions in your app's API.
 *
 * Usage:
 * \`\`\`js
 * const myFunctionReference = api.myModule.myFunction;
 * \`\`\`
 */
declare const fullApi: ApiFromModules<{
  config: typeof config;
  messages: typeof messages;
  moderation: typeof moderation;
  server: typeof server;
  sessions: typeof sessions;
  users: typeof users;
  whitelist: typeof whitelist;
}>;
export declare const api: FilterApi<
  typeof fullApi,
  FunctionReference<any, "public">
>;
export declare const internal: FilterApi<
  typeof fullApi,
  FunctionReference<any, "internal">
>;

/* eslint-disable */
/**
 * Generated `api` utility.
 *
 * THIS CODE IS AUTOMATICALLY GENERATED.
 *
 * To regenerate, run `npx convex dev`.
 * @module
 */

import type {
  ApiFromModules,
  FilterApi,
  FunctionReference,
} from "convex/server";
import type * as config from "../config.js";
import type * as messages from "../messages.js";
import type * as moderation from "../moderation.js";
import type * as server from "../server.js";
import type * as sessions from "../sessions.js";
import type * as users from "../users.js";
import type * as whitelist from "../whitelist.js";

/**
 * A utility for referencing Convex functions in your app's API.
 *
 * Usage:
 * \`\`\`js
 * const myFunctionReference = api.myModule.myFunction;
 * \`\`\`
 */
declare const fullApi: ApiFromModules<{
  config: typeof config;
  messages: typeof messages;
  moderation: typeof moderation;
  server: typeof server;
  sessions: typeof sessions;
  users: typeof users;
  whitelist: typeof whitelist;
}>;
export declare const api: FilterApi<
  typeof fullApi,
  FunctionReference<any, "public">
>;
export declare const internal: FilterApi<
  typeof fullApi,
  FunctionReference<any, "internal">
>;

erquhart•3w ago

What do you see when you hover fullApi At declare const fullApi

redanOP•3w ago

const fullApi: ApiFromModules<{
    config: typeof config;
    messages: typeof messages;
    moderation: typeof moderation;
    server: typeof server;
    sessions: typeof sessions;
    users: typeof users;
    whitelist: typeof whitelist;
}>
A utility for referencing Convex functions in your app's API.

Usage:

const myFunctionReference = api.myModule.myFunction;

const fullApi: ApiFromModules<{
    config: typeof config;
    messages: typeof messages;
    moderation: typeof moderation;
    server: typeof server;
    sessions: typeof sessions;
    users: typeof users;
    whitelist: typeof whitelist;
}>
A utility for referencing Convex functions in your app's API.

Usage:

const myFunctionReference = api.myModule.myFunction;

erquhart•3w ago

hmm should be expanding those types

redanOP•3w ago

Yeah, its the same type im getting when I use api in the code

erquhart•3w ago

When you run npx convex dev or pnpm equivalent, what do you get, any errors/warnings

redanOP•3w ago

all my queries / mutations are exported no, and it uploads the schema to the dashboard fine Just ran it and heres the logs:

✔ Provisioned a dev deployment and saved its name as CONVEX_DEPLOYMENT to .env.local

Write your Convex functions in convex\
Give us feedback at https://convex.dev/community or support@convex.dev
View the Convex dashboard at website

✔ 14:51:15 Convex functions ready! (6.6s)

✔ Provisioned a dev deployment and saved its name as CONVEX_DEPLOYMENT to .env.local

Write your Convex functions in convex\
Give us feedback at https://convex.dev/community or support@convex.dev
View the Convex dashboard at website

✔ 14:51:15 Convex functions ready! (6.6s)

erquhart•3w ago

I don't think this is schema related Was it working at one point and then stopped?

Sara•3w ago

I'm out of clues except for the part where using it in the route.ts

redanOP•3w ago

I have other projects that work fine that (and I cant see a difference between them), and I follow the next js quickstart whenever I am making a new project. I believe it was working at one point, and then stopped

erquhart•3w ago

It sounds like this is really is ide specific if the code runs and deploys If it was working I'd try going to some previous commits and seeing if types are working there

redanOP•3w ago

Yes, can I ask you about that because Ive never had a problem before about using it in route.ts and the docs here https://docs.convex.dev/client/react/nextjs/server-rendering#server-actions-and-route-handlers do the same as me.

erquhart•3w ago

Could also make sure you're using the workspace Typescript version rather than the default Yeah it's fine to run functions from routes this way

Sara•3w ago

That's my bad! never seen this code block in the docs before

redanOP•3w ago

Ok thx, can I ask how to make sure Im using the correct ts version? Cant find a cmd or setting. Im using cursor if that helps

erquhart•3w ago

cmd + shift + p, typescript version

Sara•3w ago

I made the mistake of jumping into conclusions without googling first, https://github.com/typescript-eslint/typescript-eslint/issues/9771#issuecomment-2278956294 people are saying to restart eslint and update it

GitHub

Bug: [no-unsafe-assignment] "Unsafe assignment of an error typed va...

Before You File a Bug Report Please Confirm You Have Done The Following... I have tried restarting my IDE and the issue persists. I have updated to the latest version of the packages. I have search...

erquhart•3w ago

ooh that'll do it

Sara•3w ago

and mentioned that its an IDE specific issue which is interesting

redanOP•3w ago

Yh, founf it, i was in settings so didnt get them all Ok, i will try this

Sara•3w ago

well let us know if it worked 👀

redanOP•3w ago

unfortunatly not, I have tried reinstalling eslint with pnpm install eslint --global and restarting cursor, ts server and revalidating the open files It doesnt seem like even Doc type is working for whether its a valid table name

Sara•3w ago

could you share a link for the repository?

redanOP•3w ago

yes 1 sec https://github.com/DiscocraftBot/Website/tree/master

Sara•3w ago

100% an IDE specific issue

redanOP•3w ago

weird but ok, I have no idea how im going to fix it I dont think this is a ide problem actually, because when I ran the eslint and tsc --noEmit commands they both gave the errors I am seeing in the ide. I would find it weird that these be ide errors as I ran this in both the ide and in a terminal

Sara•3w ago

I've ran it, and used the fetchQuery method under a route and it seems to working for me when it comes to types, and getting the predective code to pop up

redanOP•3w ago

Do you mean u cloned my repo?

Sara•3w ago

yes

redanOP•3w ago

Did you clone the master or main branch? And thanks for making that effort

Sara•3w ago

I think it might've been the main, let me try on the master branch

redanOP•3w ago

Yeah, when i refactered (it was working after that as well) my code i moved to master, need to update github for the default branch

Sara•3w ago

this has got to be one of the worst errors i've seen in my life how'd you end up with tanstack and trpc?

redanOP•3w ago

I dont know, probably from moving over, got to clean up the installs at some point, as I dont use either currently The codebase is a mess

Sara•3w ago

also this api is from trpc not convex it seems

redanOP•3w ago

where? I am only using convex currently

Sara•3w ago

under page

redanOP•3w ago

Check src\app\api\v1\server\health\route.ts

Sara•3w ago

src/app/page.tsx

redanOP•3w ago

or any other api route basically ah, that came with the template i use to create a basic app

Sara•3w ago

it seems your project is seeing the api.js instead of api.d.ts which I have no idea how that happened

redanOP•3w ago

ok, any idea on how to change it?

Sara•3w ago

googling 😅

redanOP•3w ago

Sara•3w ago

phew something's wrong with your tsconfig on your root directory, copy paste this:

{
  "compilerOptions": {
    "target": "ESNext",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    ".next/types/**/*.ts",
    "next.config.js"
  ],
  "exclude": ["node_modules"]
}

{
  "compilerOptions": {
    "target": "ESNext",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    ".next/types/**/*.ts",
    "next.config.js"
  ],
  "exclude": ["node_modules"]
}

and to phyisically stop it from generating js files, create a file at the root called convex.json and add this to it:

{
  "codegen": {
    "staticApi": true,
    "staticDataModel": true
  },
  "typescript": true
}

{
  "codegen": {
    "staticApi": true,
    "staticDataModel": true
  },
  "typescript": true
}

delete the server.js and the api.js, and everything should work fine after that I'm marking this thread as resolved, any other questions please create a new thread here, we're always happy to help 😅

Sara•3w ago

here's a screenshot of the types getting back inline

redanOP•3w ago

Thx, this has worked. For future reference, can I ask what the problem was?

Sara•2w ago

Your tsconfig had the setup for the supposed template you were using before, and it didn't take the convex imports into account

No types in ide

Did you find this page helpful?