Convex.dev + ReScript

Starting this thread about how to integrate Convex.dev with ReScript.
Any tips and insights are welcome.

How to put ReScript files using inside convex folder

In convex folder you can have the files like this:

/convex/hello..res 
/convex/hello..res.js

Two dot so that convex ignore the ReScript file.

1 Like

Helpful snippets for VSCode for useMutation and useQuery

{
"usemut": {
		"prefix": "usemut",
		"body": [
			"module Mutation_$1 = {",
			"  @module(\"@packages/backend/convex/_generated/api\")",
			"  external api: 'api = \"api\"",
			"  type input = {  todo: string }",
			"  type t = input => Promise.t<unit>",
			"  @module(\"convex/react\") external useMutation: string => t = \"useMutation\" ",
			"}",
			"let mutation_$1 = Mutation_$1.useMutation(Mutation_$1.api[\"\"][\"$1\"])",
			"try {",
			"  await mutation_$1({ todo })",
			"} catch { ",
			"  | Js.Exn.Error(err) => { ",
			"    Js.log2(\"Failure!!\", err)",
			"  }",
			"}"
		],
		"description": "bind useMutation and implement in component"
	},
	/**
  @module("@/common/convex") external useQuery_poById: (string, option<input>) => option<purchaseOrder> = "useQuerySkip"
  */
	"usequery": {
		"prefix": "usequery",
		"body": [
			"module Query_$1 = {",
			"  @module(\"@packages/backend/convex/_generated/api\")",
			"  external api: 'api = \"api\"",
			"  type input_ = { $2: string }",
			"  @unboxed type input = Input(input_) | Skip(string)",
			"  type output = anotherType",
			"  @module(\"convex/react\") external useQuery: (string, input) => option<output> = \"useQuery\" ",
			"}",
			"let response_$1 = Query_$1.useQuery(Query_$1.api[\"\"][\"$1\"], if $2 === \"\" { Skip(\"skip\") } else { {$2: $2}->Input })",
		],
		"description": "bind useQuery and implement in component"
	}
}

output example

Query

module Query_getPage = {
	@module("@packages/backend/convex/_generated/api")
	external api: 'api = "api"
	type input_ = { : string }
	@unboxed type input = Input(input_) | Skip(string)
	type output = anotherType
	@module("convex/react") external useQuery: (string, input) => option<output> = "useQuery" 
}

Mutation

 module Mutation_insertItem = {
	 @module("@packages/backend/convex/_generated/api")
	 external api: 'api = "api"
	 type input = {  todo: string }
	 type t = input => Promise.t<unit>
	 @module("convex/react") external useMutation: string => t = "useMutation" 
 }
 let mutation_insertItem = Mutation_insertItem.useMutation(Mutation_insertItem.api[""]["insertItem"])
 try {
	 await mutation_insertItem({ todo })
 } catch { 
	 | Js.Exn.Error(err) => { 
		 Js.log2("Failure!!", err)
	 }
 }