Convex.dev + ReScript

,
1

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

1 Like
2

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
3

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)
	 }
 }