diff --git a/EXAMPLES/bsconfig.json b/EXAMPLES/bsconfig.json index 2707560..4518b65 100644 --- a/EXAMPLES/bsconfig.json +++ b/EXAMPLES/bsconfig.json @@ -16,6 +16,10 @@ } ], "ppx-flags": ["@reasonml-community/graphql-ppx/ppx"], + "jsx": { + "version": 4, + "mode": "automatic" + }, "reason": { "react-jsx": 3 }, diff --git a/EXAMPLES/package.json b/EXAMPLES/package.json index 0306e9c..2dfcecd 100644 --- a/EXAMPLES/package.json +++ b/EXAMPLES/package.json @@ -4,29 +4,29 @@ "description": "Examples for rescript-apollo-client", "private": true, "scripts": { - "clean": "bsb -clean-world", + "clean": "rescript clean", "graphql-server": "graphql-client-example-server", "server": "webpack-dev-server", - "start": "bsb -make-world -w" + "start": "rescript build -with-deps -w" }, "devDependencies": { - "@reasonml-community/graphql-ppx": "1.2.2", - "bs-platform": "9.0.0", - "graphql-client-example-server": "1.2.0", - "html-webpack-plugin": "4.3.0", - "webpack": "4.43.0", - "webpack-cli": "3.3.12", - "webpack-dev-server": "3.11.0" + "@reasonml-community/graphql-ppx": "1.2.3", + "graphql-client-example-server": "1.5.2", + "html-webpack-plugin": "5.5.0", + "rescript": "10.1.2", + "webpack": "5.75.0", + "webpack-cli": "5.0.1", + "webpack-dev-server": "^4.11.1" }, "dependencies": { - "@apollo/client": "3.5.6", - "@rescript/react": "0.10.1", - "@ryyppy/rescript-promise": "0.0.2", - "graphql": "15.3.0", - "react": "16.13.1", - "react-dom": "16.13.1", - "reason-promise": "1.1.1", + "@apollo/client": "3.7.6", + "@rescript/react": "0.11.0", + "@ryyppy/rescript-promise": "2.1.0", + "graphql": "^15.7.2", + "react": "18.2.0", + "react-dom": "18.2.0", + "reason-promise": "1.1.5", "rescript-apollo-client": "3.1.0", - "subscriptions-transport-ws": "0.9.16" + "subscriptions-transport-ws": "0.11.0" } } diff --git a/EXAMPLES/src/WebpackEntry.res b/EXAMPLES/src/WebpackEntry.res index 666a233..dae9ef5 100644 --- a/EXAMPLES/src/WebpackEntry.res +++ b/EXAMPLES/src/WebpackEntry.res @@ -1,4 +1,4 @@ switch ReactDOM.querySelector("#root") { -| Some(root) => ReactDOM.render(, root) +| Some(el) => ReactDOM.Client.createRoot(el)->ReactDOM.Client.Root.render() | None => () } diff --git a/EXAMPLES/src/clientUsage/AsyncAwait.res b/EXAMPLES/src/clientUsage/AsyncAwait.res new file mode 100644 index 0000000..d9edfc2 --- /dev/null +++ b/EXAMPLES/src/clientUsage/AsyncAwait.res @@ -0,0 +1,49 @@ +module ApolloError = ApolloClient.Types.ApolloError + +module DuplicateTodoMutation = %graphql(` + mutation AddTodo($text: String!) { + todo: addTodoSimple(text: $text) { + id + text + } + } + `) + +module TodosQuery = %graphql(` + query TodosQuery { + todos: allTodos { + id + text + completed + } + } + `) + +let client = Apollo.client + +let func = async () => { + let result = await client.query(~query=module(TodosQuery), ()) + + let firstTodo = switch result { + | Ok({data: {todos}}) => + switch todos->Belt.Array.get(0) { + | Some(firstTodo) => Ok(firstTodo) + | None => Error(ApolloError.make(~errorMessage="No To-Dos!", ())) + } + | Error(_) as error => error + } + + let result = await ( + switch firstTodo { + | Ok(firstTodo) => + client.mutate(~mutation=module(DuplicateTodoMutation), {text: firstTodo.text}) + | Error(_) as error => Promise.resolve(error) + } + ) + + switch result { + | Ok(_) => Js.log("Duplicated first todo!") + | Error(apolloError) => Js.log2("Something went wrong: ", apolloError.message) + } +} +func()->ignore diff --git a/EXAMPLES/src/clientUsage/ClientBasics.res b/EXAMPLES/src/clientUsage/ClientBasics.res index 4352923..e1b0689 100644 --- a/EXAMPLES/src/clientUsage/ClientBasics.res +++ b/EXAMPLES/src/clientUsage/ClientBasics.res @@ -1,19 +1,16 @@ module ApolloQueryResult = ApolloClient.Types.ApolloQueryResult module ObservableQuery = ApolloClient.Types.ObservableQuery -module AddTodoMutation = %graphql( - ` +module AddTodoMutation = %graphql(` mutation AddTodo($text: String!) { todo: addTodoSimple(text: $text) { id text } } - ` -) + `) -module TodosQuery = %graphql( - ` +module TodosQuery = %graphql(` query TodosQuery { todos: allTodos { id @@ -21,29 +18,29 @@ module TodosQuery = %graphql( completed } } - ` -) + `) -module StatsSubscription = %graphql( - ` +module StatsSubscription = %graphql(` subscription SorryItsNotASubscriptionForTodos { siteStatisticsUpdated { currentVisitorsOnline } } - ` -) + `) -let logTodos = _ => Apollo.client.query(~query=module(TodosQuery), ())->Promise.map(result => +let logTodos = _ => + Apollo.client.query(~query=module(TodosQuery), ()) + ->Promise.thenResolve(result => switch result { | Ok({data: {todos}}) => Js.log2("query To-Dos: ", todos) | Error(error) => Js.log2("Error: ", error) } - )->ignore + ) + ->ignore let addTodo = _ => Apollo.client.mutate(~mutation=module(AddTodoMutation), {text: "Another To-Do"}) - ->Promise.map(result => + ->Promise.thenResolve(result => switch result { | Ok({data}) => Js.log2("mutate result: ", data) | Error(error) => Js.log2("Error: ", error) @@ -76,7 +73,11 @@ let statsSubscription = Apollo.client.subscribe( @react.component let make = () =>
-

-

+

+ +

+

+ +

{"[ To-Dos also logged in console with watchQuery ]"->React.string}

diff --git a/EXAMPLES/src/clientUsage/PromiseChaining.res b/EXAMPLES/src/clientUsage/PromiseChaining.res index de13148..c157932 100644 --- a/EXAMPLES/src/clientUsage/PromiseChaining.res +++ b/EXAMPLES/src/clientUsage/PromiseChaining.res @@ -1,18 +1,15 @@ module ApolloError = ApolloClient.Types.ApolloError -module DuplicateTodoMutation = %graphql( - ` +module DuplicateTodoMutation = %graphql(` mutation AddTodo($text: String!) { todo: addTodoSimple(text: $text) { id text } } - ` -) + `) -module TodosQuery = %graphql( - ` +module TodosQuery = %graphql(` query TodosQuery { todos: allTodos { id @@ -20,12 +17,12 @@ module TodosQuery = %graphql( completed } } - ` -) + `) let client = Apollo.client -client.query(~query=module(TodosQuery), ())->Promise.map(result => +client.query(~query=module(TodosQuery), ()) +->Promise.thenResolve(result => switch result { | Ok({data: {todos}}) => switch todos->Belt.Array.get(0) { @@ -34,16 +31,19 @@ client.query(~query=module(TodosQuery), ())->Promise.map(result => } | Error(_) as error => error } -)->Promise.then(result => +) +->Promise.then(result => switch result { | Ok(firstTodo) => client.mutate(~mutation=module(DuplicateTodoMutation), {text: firstTodo.text}) | Error(_) as error => Promise.resolve(error) } -)->Promise.then(result => +) +->Promise.then(result => Promise.resolve( switch result { | Ok(_) => Js.log("Duplicated first todo!") | Error(apolloError) => Js.log2("Something went wrong: ", apolloError.message) }, ) -)->ignore +) +->ignore diff --git a/EXAMPLES/src/docs/Docs.res b/EXAMPLES/src/docs/Docs.res index 4992b55..607a543 100644 --- a/EXAMPLES/src/docs/Docs.res +++ b/EXAMPLES/src/docs/Docs.res @@ -1,7 +1,6 @@ /** This file used for formatting/typechecking of code snippets on the documentation website */ - module TodosQuery = %graphql(` query TodosQuery { todos: allTodos { @@ -20,7 +19,9 @@ module Basics = { | {error: Some(_error)} => "Error loading data"->React.string | {data: Some({todos})} =>
- {"There are "->React.string} {todos->Belt.Array.length->React.int} {" To-Dos"->React.string} + {"There are "->React.string} + {todos->Belt.Array.length->React.int} + {" To-Dos"->React.string}
| {data: None, error: None, loading: false} => "I hope this is impossible, but sometimes it's not!"->React.string @@ -63,14 +64,16 @@ module Lazy = { let (executeQuery, queryResult) = TodosQuery.useLazy()
{switch queryResult { - | Unexecuted(_) => <> + | Unexecuted(_) => + <> {"Waiting to be executed... "->React.string} | Executed({loading: true, data: None}) =>

{"Loading"->React.string}

- | Executed({loading, data: Some({todos}), error}) => <> + | Executed({loading, data: Some({todos}), error}) => + <> {loading ?

{"Refreshing..."->React.string}

: React.null} {switch error { @@ -114,7 +117,8 @@ module MutationTypical = { let (mutate, result) = AddTodoMutation.use() switch result { - | {called: false} => <> + | {called: false} => + <> {"Not called... "->React.string} | Executed({loading: true, data: None}) =>

{"Loading"->React.string}

- | Executed({loading, data: Some({todos}), error}) => <> + | Executed({loading, data: Some({todos}), error}) => + <> {loading ?

{"Refreshing..."->React.string}

: React.null} {switch error { diff --git a/EXAMPLES/src/hooksUsage/Query_OverlySimple.res b/EXAMPLES/src/hooksUsage/Query_OverlySimple.res index ed8442d..da532c3 100644 --- a/EXAMPLES/src/hooksUsage/Query_OverlySimple.res +++ b/EXAMPLES/src/hooksUsage/Query_OverlySimple.res @@ -15,7 +15,9 @@ let make = () => | {error: Some(_error)} => "Error loading data"->React.string | {data: Some({todos})} =>
- {"There are "->React.string} {todos->Belt.Array.length->React.int} {" To-Dos"->React.string} + {"There are "->React.string} + {todos->Belt.Array.length->React.int} + {" To-Dos"->React.string}
| {data: None, error: None, loading: false} => "I hope this is impossible, but sometimes it's not!"->React.string diff --git a/EXAMPLES/src/hooksUsage/Query_Typical.res b/EXAMPLES/src/hooksUsage/Query_Typical.res index efe09d0..3e6d733 100644 --- a/EXAMPLES/src/hooksUsage/Query_Typical.res +++ b/EXAMPLES/src/hooksUsage/Query_Typical.res @@ -1,5 +1,4 @@ -module TodosQuery = %graphql( - ` +module TodosQuery = %graphql(` query TodosQuery { todos: allTodos { id @@ -7,8 +6,7 @@ module TodosQuery = %graphql( completed } } - ` -) + `) @react.component let make = () => { @@ -39,12 +37,14 @@ let make = () => { } | None => previousData } - , ())->Promise.map(result => { + , ()) + ->Promise.thenResolve(result => { switch result { | Ok(_) => Js.log("fetchMore: success!") | Error(_) => Js.log("fetchMore: failure!") } - })->ignore + }) + ->ignore }}> {"Fetch More!"->React.string} diff --git a/EXAMPLES/webpack.config.js b/EXAMPLES/webpack.config.js index 49c7012..6257f2a 100644 --- a/EXAMPLES/webpack.config.js +++ b/EXAMPLES/webpack.config.js @@ -4,6 +4,9 @@ const outputDir = path.join(__dirname, "build/"); const isProd = process.env.NODE_ENV === "production"; +/** + * @type import("webpack").Configuration + */ module.exports = { entry: "./src/WebpackEntry.bs.js", mode: isProd ? "production" : "development", @@ -19,7 +22,9 @@ module.exports = { ], devServer: { compress: true, - contentBase: outputDir, + static: { + directory: outputDir, + }, port: process.env.PORT || 8000, historyApiFallback: true, }, diff --git a/bsconfig.json b/bsconfig.json index 24dcea6..68edf65 100644 --- a/bsconfig.json +++ b/bsconfig.json @@ -10,6 +10,10 @@ "react-jsx": 3 }, "refmt": 3, + "jsx": { + "version": 4, + "mode": "automatic" + }, "sources": [ { "dir": "src", diff --git a/package.json b/package.json index fab94a2..cf6a49b 100644 --- a/package.json +++ b/package.json @@ -14,29 +14,33 @@ "url": "https://github.com/jeddeloh/rescript-apollo-client" }, "scripts": { - "build": "bsb -make-world", - "clean": "bsb -clean-world", - "start": "bsb -make-world -w", + "build": "rescript build -with-deps", + "clean": "rescript clean", + "start": "rescript build -with-deps -w", "test": "jest" }, "devDependencies": { - "@apollo/client": "3.3.21", + "@apollo/client": "^3.5.0", "@reasonml-community/graphql-ppx": "^1.0.0", - "@rescript/react": "^0.10.1", - "bs-platform": "8.4.2", + "@rescript/react": "~0.11.0", + "rescript": "~10.1.2", "graphql": "^14.0.0", "jest": "26.5.3", - "react": "^16.13.1", - "react-dom": "^16.13.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", "subscriptions-transport-ws": "^0.9.17" }, "peerDependencies": { "@apollo/client": "^3.5.0", "@reasonml-community/graphql-ppx": "^1.0.0", - "@rescript/react": "^0.10.1", - "bs-platform": "^8.2.0 || ^9.0.0" + "@rescript/react": "~0.10. || ~0.11.0", + "bs-platform": "^8.2.0 || ^9.0.0", + "rescript": "^9.0.0 || ^10.0.0" }, "peerDependenciesMeta": { + "rescript": { + "optional": true + }, "bs-platform": { "optional": true }