Merge pull request #439 from mobxjs/development

Merge 0.17.2
mobxjs · Feb 4, 2024 · 07ac7af · 07ac7af
2 parents 74dfa56 + 0b7b51f
commit 07ac7af
Show file tree

Hide file tree

Showing 33 changed files with 1,019 additions and 541 deletions.
diff --git a/.github/workflows/build-and-test.yml b/.github/workflows/build-and-test.yml
@@ -1,6 +1,7 @@
 name: Test
 on:
   pull_request: {}
+  workflow_dispatch:
 
 jobs:
   test:

diff --git a/.gitignore b/.gitignore
@@ -84,7 +84,7 @@ tmp_schema.json
 .parcel-cache
 
 # create-react-app test folder
-tests/cra-test/cra-tmp
+tests/vite-app-test/cra-tmp
 
 # IntelliJ IDEA project files
 .idea
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # CHANGELOG
 
+## 0.17.2
+
+- Fix tests, upgrade minor versions of mobx, mobx-state-tree
+
 ## 0.17.1
 
 - Use [Pinst](https://www.npmjs.com/package/pinst) to fix `postinstall` scripts running when installing mst-gql

diff --git a/examples/1-getting-started/package.json b/examples/1-getting-started/package.json
@@ -15,14 +15,14 @@
     "arg": "^5.0.2",
     "cors": "^2.8.5",
     "express": "^4.17.1",
-    "graphql": "^16.5.0",
+    "graphql": "15.8.0",
     "graphql-playground-middleware-express": "^1.7.21",
     "graphql-tag": "^2.12.6",
     "isomorphic-fetch": "^2.2.1",
     "jest": "^27.0.6",
-    "mobx": "^6.6.0",
+    "mobx": "^6.10.2",
     "mobx-react": "^7.5.0",
-    "mobx-state-tree": "^5.1.5",
+    "mobx-state-tree": "^5.3.0",
     "mst-gql": "portal:../../",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"

diff --git a/examples/1-getting-started/src/app/models/RootStore.base.ts b/examples/1-getting-started/src/app/models/RootStore.base.ts
@@ -13,7 +13,7 @@ import { todoModelPrimitives, TodoModelSelector } from "./TodoModel.base"
 export type CreateTodoInput = {
   id: string
   text: string
-  complete?: boolean
+  complete?: (boolean | null)
 }
 /* The TypeScript type that explicits the refs to other models in order to prevent a circular refs issue */
 type Refs = {
@@ -45,20 +45,20 @@ export const RootStoreBase = withTypedRefs<Refs>()(MSTGQLStore
   })
   .actions(self => ({
     queryTodos(variables?: {  }, resultSelector: string | ((qb: TodoModelSelector) => TodoModelSelector) = todoModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ todos: TodoModelType[]}>(`query todos { todos {
+      return self.query<{ todos: TodoModelType[] }>(`query todos { todos {
         ${typeof resultSelector === "function" ? resultSelector(new TodoModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },
-    queryStringFromServer(variables: { string?: string }, options: QueryOptions = {}) {
+    queryStringFromServer(variables: { string?: (string | null) }, options: QueryOptions = {}) {
       return self.query<{ stringFromServer: string }>(`query stringFromServer($string: String) { stringFromServer(string: $string) }`, variables, options)
     },
     mutateToggleTodo(variables: { id: string }, resultSelector: string | ((qb: TodoModelSelector) => TodoModelSelector) = todoModelPrimitives.toString(), optimisticUpdate?: () => void) {
-      return self.mutate<{ toggleTodo: TodoModelType}>(`mutation toggleTodo($id: ID!) { toggleTodo(id: $id) {
+      return self.mutate<{ toggleTodo: TodoModelType }>(`mutation toggleTodo($id: ID!) { toggleTodo(id: $id) {
         ${typeof resultSelector === "function" ? resultSelector(new TodoModelSelector()).toString() : resultSelector}
       } }`, variables, optimisticUpdate)
     },
     mutateCreateTodo(variables: { todo: CreateTodoInput }, resultSelector: string | ((qb: TodoModelSelector) => TodoModelSelector) = todoModelPrimitives.toString(), optimisticUpdate?: () => void) {
-      return self.mutate<{ createTodo: TodoModelType}>(`mutation createTodo($todo: CreateTodoInput!) { createTodo(todo: $todo) {
+      return self.mutate<{ createTodo: TodoModelType }>(`mutation createTodo($todo: CreateTodoInput!) { createTodo(todo: $todo) {
         ${typeof resultSelector === "function" ? resultSelector(new TodoModelSelector()).toString() : resultSelector}
       } }`, variables, optimisticUpdate)
     },

diff --git a/examples/2-scaffolding/package.json b/examples/2-scaffolding/package.json
@@ -7,9 +7,10 @@
     "start": "yarn scaffold && yarn build"
   },
   "dependencies": {
+    "graphql": "^16.5.0",
     "graphql-request": "^4.3.0",
-    "mobx": "^6.6.0",
-    "mobx-state-tree": "^5.1.5",
+    "mobx": "^6.10.2",
+    "mobx-state-tree": "^5.3.0",
     "mst-gql": "portal:../../"
   },
   "devDependencies": {

diff --git a/examples/2-scaffolding/src/models/RootStore.base.ts b/examples/2-scaffolding/src/models/RootStore.base.ts
@@ -46,12 +46,12 @@ export const RootStoreBase = withTypedRefs<Refs>()(MSTGQLStore
   })
   .actions(self => ({
     queryPokemons(variables: { first: number }, resultSelector: string | ((qb: PokemonModelSelector) => PokemonModelSelector) = pokemonModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ pokemons: PokemonModelType[]}>(`query pokemons($first: Int!) { pokemons(first: $first) {
+      return self.query<{ pokemons: PokemonModelType[] }>(`query pokemons($first: Int!) { pokemons(first: $first) {
         ${typeof resultSelector === "function" ? resultSelector(new PokemonModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },
     queryPokemon(variables: { id?: (string | null), name?: (string | null) }, resultSelector: string | ((qb: PokemonModelSelector) => PokemonModelSelector) = pokemonModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ pokemon: PokemonModelType}>(`query pokemon($id: String, $name: String) { pokemon(id: $id, name: $name) {
+      return self.query<{ pokemon: PokemonModelType }>(`query pokemon($id: String, $name: String) { pokemon(id: $id, name: $name) {
         ${typeof resultSelector === "function" ? resultSelector(new PokemonModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },

diff --git a/examples/3-twitter-clone/package.json b/examples/3-twitter-clone/package.json
@@ -16,11 +16,13 @@
     "cors": "^2.8.5",
     "express": "^4.17.1",
     "fakergem": "^1.0.3",
+    "graphql": "15.8.0",
     "graphql-playground-middleware-express": "^1.7.21",
     "isomorphic-fetch": "^2.2.1",
-    "mobx": "^6.6.0",
-    "mobx-react-lite": "^1.4.1",
-    "mobx-state-tree": "^5.1.5",
+    "mobx": "^6.10.2",
+    "mobx-react": "^7.5.0",
+    "mobx-react-lite": "^4.0.5",
+    "mobx-state-tree": "^5.3.0",
     "mst-gql": "portal:../../",
     "node-uuid": "^1.4.8",
     "react": "^18.2.0",

diff --git a/examples/3-twitter-clone/public/index.html b/examples/3-twitter-clone/public/index.html
@@ -9,6 +9,6 @@
 
   <body>
     <div id="root"></div>
-    <script type="text/javascript" src="../src/app/index.tsx"></script>
+    <script type="module" src="../src/app/index.tsx"></script>
   </body>
 </html>
diff --git a/examples/3-twitter-clone/src/app/components/Message.tsx b/examples/3-twitter-clone/src/app/components/Message.tsx
@@ -6,7 +6,14 @@ import { MessageModelType } from "../models/"
 import { Replies } from "./Replies"
 
 // @ts-ignore
-import images from "../avatars/*.jpg"
+import chuck from "../avatars/chuck.jpg"
+// @ts-ignore
+import michel from "../avatars/michel.jpg"
+
+const images = {
+  michel,
+  chuck
+}
 
 export const Message = observer(
   ({ message, asChild }: { message: MessageModelType; asChild?: boolean }) => {

diff --git a/examples/3-twitter-clone/src/app/models/MessageModel.base.ts b/examples/3-twitter-clone/src/app/models/MessageModel.base.ts
@@ -44,9 +44,9 @@ export class MessageModelSelector extends QueryBuilder {
   get id() { return this.__attr(`id`) }
   get timestamp() { return this.__attr(`timestamp`) }
   get text() { return this.__attr(`text`) }
-  user(builder?: string | UserModelSelector | ((selector: UserModelSelector) => UserModelSelector)) { return this.__child(`user`, UserModelSelector, builder) }
-  likes(builder?: string | UserModelSelector | ((selector: UserModelSelector) => UserModelSelector)) { return this.__child(`likes`, UserModelSelector, builder) }
-  replyTo(builder?: string | MessageModelSelector | ((selector: MessageModelSelector) => MessageModelSelector)) { return this.__child(`replyTo`, MessageModelSelector, builder) }
+  user(builder: string | UserModelSelector | ((selector: UserModelSelector) => UserModelSelector) | undefined) { return this.__child(`user`, UserModelSelector, builder) }
+  likes(builder: string | UserModelSelector | ((selector: UserModelSelector) => UserModelSelector) | undefined) { return this.__child(`likes`, UserModelSelector, builder) }
+  replyTo(builder: string | MessageModelSelector | ((selector: MessageModelSelector) => MessageModelSelector) | undefined) { return this.__child(`replyTo`, MessageModelSelector, builder) }
 }
 export function selectFromMessage() {
   return new MessageModelSelector()

diff --git a/examples/3-twitter-clone/src/app/models/RootStore.base.ts b/examples/3-twitter-clone/src/app/models/RootStore.base.ts
@@ -47,42 +47,42 @@ export const RootStoreBase = withTypedRefs<Refs>()(MSTGQLStore
   })
   .actions(self => ({
     querySearch(variables: { searchText: string }, resultSelector: string | ((qb: SearchResultModelSelector) => SearchResultModelSelector) = searchResultModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ search: SearchResultUnion[]}>(`query search($searchText: String!) { search(searchText: $searchText) {
+      return self.query<{ search: SearchResultUnion[] }>(`query search($searchText: String!) { search(searchText: $searchText) {
         ${typeof resultSelector === "function" ? resultSelector(new SearchResultModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },
-    queryMessages(variables: { offset?: string, count?: number, replyTo?: string }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ messages: MessageModelType[]}>(`query messages($offset: ID, $count: Int, $replyTo: ID) { messages(offset: $offset, count: $count, replyTo: $replyTo) {
+    queryMessages(variables: { offset?: (string | null), count?: (number | null), replyTo?: (string | null) }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), options: QueryOptions = {}) {
+      return self.query<{ messages: MessageModelType[] }>(`query messages($offset: ID, $count: Int, $replyTo: ID) { messages(offset: $offset, count: $count, replyTo: $replyTo) {
         ${typeof resultSelector === "function" ? resultSelector(new MessageModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },
     queryMessage(variables: { id: string }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ message: MessageModelType}>(`query message($id: ID!) { message(id: $id) {
+      return self.query<{ message: MessageModelType }>(`query message($id: ID!) { message(id: $id) {
         ${typeof resultSelector === "function" ? resultSelector(new MessageModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },
     queryMe(variables?: {  }, resultSelector: string | ((qb: UserModelSelector) => UserModelSelector) = userModelPrimitives.toString(), options: QueryOptions = {}) {
-      return self.query<{ me: UserModelType}>(`query me { me {
+      return self.query<{ me: UserModelType }>(`query me { me {
         ${typeof resultSelector === "function" ? resultSelector(new UserModelSelector()).toString() : resultSelector}
       } }`, variables, options)
     },
     mutateChangeName(variables: { id: string, name: string }, resultSelector: string | ((qb: UserModelSelector) => UserModelSelector) = userModelPrimitives.toString(), optimisticUpdate?: () => void) {
-      return self.mutate<{ changeName: UserModelType}>(`mutation changeName($id: ID!, $name: String!) { changeName(id: $id, name: $name) {
+      return self.mutate<{ changeName: UserModelType }>(`mutation changeName($id: ID!, $name: String!) { changeName(id: $id, name: $name) {
         ${typeof resultSelector === "function" ? resultSelector(new UserModelSelector()).toString() : resultSelector}
       } }`, variables, optimisticUpdate)
     },
     mutateLike(variables: { msg: string, user: string }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), optimisticUpdate?: () => void) {
-      return self.mutate<{ like: MessageModelType}>(`mutation like($msg: ID!, $user: ID!) { like(msg: $msg, user: $user) {
+      return self.mutate<{ like: MessageModelType }>(`mutation like($msg: ID!, $user: ID!) { like(msg: $msg, user: $user) {
         ${typeof resultSelector === "function" ? resultSelector(new MessageModelSelector()).toString() : resultSelector}
       } }`, variables, optimisticUpdate)
     },
-    mutatePostTweet(variables: { text: string, user: string, replyTo?: string }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), optimisticUpdate?: () => void) {
-      return self.mutate<{ postTweet: MessageModelType}>(`mutation postTweet($text: String!, $user: ID!, $replyTo: ID) { postTweet(text: $text, user: $user, replyTo: $replyTo) {
+    mutatePostTweet(variables: { text: string, user: string, replyTo?: (string | null) }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), optimisticUpdate?: () => void) {
+      return self.mutate<{ postTweet: MessageModelType }>(`mutation postTweet($text: String!, $user: ID!, $replyTo: ID) { postTweet(text: $text, user: $user, replyTo: $replyTo) {
         ${typeof resultSelector === "function" ? resultSelector(new MessageModelSelector()).toString() : resultSelector}
       } }`, variables, optimisticUpdate)
     },
     subscribeNewMessages(variables?: {  }, resultSelector: string | ((qb: MessageModelSelector) => MessageModelSelector) = messageModelPrimitives.toString(), onData?: (item: any) => void, onError?: (error: Error) => void) {
-      return self.subscribe<{ newMessages: MessageModelType}>(`subscription newMessages { newMessages {
+      return self.subscribe<{ newMessages: MessageModelType }>(`subscription newMessages { newMessages {
         ${typeof resultSelector === "function" ? resultSelector(new MessageModelSelector()).toString() : resultSelector}
       } }`, variables, onData, onError)
     },

diff --git a/examples/3-twitter-clone/src/app/models/index.ts b/examples/3-twitter-clone/src/app/models/index.ts
@@ -2,8 +2,8 @@
 /* eslint-disable */
 /* tslint:disable */
 
-export * from "./SearchResultModelSelector"
 export * from "./UserModel"
 export * from "./MessageModel"
+export * from "./SearchResultModelSelector"
 export * from "./RootStore"
 export * from "./reactUtils"
diff --git a/examples/3-twitter-clone/src/app/tsconfig.json b/examples/3-twitter-clone/src/app/tsconfig.json
@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
-    "target": "es5",
-    "rootDir": "./src/app",
-    "baseUrl": "./src/app",
+    "target": "es6",
+    "rootDir": "./",
+    //    "baseUrl": "./src/app",
     "strict": false,
     "lib": ["dom", "es2018", "esnext.asynciterable", "esnext.array"],
     "jsx": "react",

diff --git a/examples/4-apollo-tutorial/client/package.json b/examples/4-apollo-tutorial/client/package.json
@@ -19,10 +19,12 @@
     "react-scripts": "^5.0.1"
   },
   "devDependencies": {
+    "graphql": "^16.8.1",
+    "graphql-request": "^6.1.0",
     "jest-dom": "^3.0.0",
-    "mobx": "^6.6.0",
+    "mobx": "^6.10.2",
     "mobx-react": "^7.5.0",
-    "mobx-state-tree": "^5.1.5",
+    "mobx-state-tree": "^5.3.0",
     "react-testing-library": "^5.4.4",
     "wait-port": "^0.2.9"
   },

diff --git a/examples/4-apollo-tutorial/server/package.json b/examples/4-apollo-tutorial/server/package.json
@@ -15,10 +15,10 @@
     "apollo-server": "^2.9.4",
     "apollo-server-testing": "^2.9.4",
     "dotenv": "^6.1.0",
-    "graphql": "^16.5.0",
+    "graphql": "15.8.0",
     "isemail": "^3.1.3",
     "nodemon": "^1.19.2",
-    "sequelize": "^5.15.1",
+    "sequelize": "^6.29.0",
     "sqlite3": "^4.0.9"
   },
   "devDependencies": {

diff --git a/examples/4-apollo-tutorial/server/store.sqlite b/examples/4-apollo-tutorial/server/store.sqlite
diff --git a/examples/5-nextjs/next-env.d.ts b/examples/5-nextjs/next-env.d.ts
@@ -1,2 +1,5 @@
 /// <reference types="next" />
-/// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.
diff --git a/examples/5-nextjs/package.json b/examples/5-nextjs/package.json
@@ -10,11 +10,12 @@
     "apollo-server-express": "^2.18.0",
     "cross-env": "^5.2.1",
     "express": "^4.17.1",
-    "mobx": "^6.6.0",
+    "graphql": "15.8.0",
+    "mobx": "^6.10.2",
     "mobx-react": "^7.5.0",
-    "mobx-state-tree": "^5.1.5",
+    "mobx-state-tree": "^5.3.0",
     "mst-gql": "portal:../../",
-    "next": "^12.2.2"
+    "next": "^13.5.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.15",
@@ -23,8 +24,5 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "typescript": "^4.7.3"
-  },
-  "resolutions": {
-    "graphql": "^16.5.0"
   }
 }
diff --git a/examples/5-nextjs/tsconfig.json b/examples/5-nextjs/tsconfig.json
@@ -14,7 +14,8 @@
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "resolveJsonModule": true,
-    "isolatedModules": true
+    "isolatedModules": true,
+    "incremental": true
   },
   "exclude": ["node_modules"],
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]

diff --git a/examples/6-scaffolding-ts-hasura/package.json b/examples/6-scaffolding-ts-hasura/package.json
@@ -6,9 +6,10 @@
     "start": "yarn scaffold && yarn build"
   },
   "dependencies": {
+    "graphql": "^16.8.1",
     "graphql-request": "^4.3.0",
-    "mobx": "^6.6.0",
-    "mobx-state-tree": "^5.1.5",
+    "mobx": "^6.10.2",
+    "mobx-state-tree": "^5.3.0",
     "mst-gql": "portal:../../"
   },
   "devDependencies": {

diff --git a/examples/6-scaffolding-ts-hasura/src/models/PollsModel.base.ts b/examples/6-scaffolding-ts-hasura/src/models/PollsModel.base.ts
@@ -56,8 +56,8 @@ export class PollsModelSelector extends QueryBuilder {
   get question() { return this.__attr(`question`) }
   get updated_at() { return this.__attr(`updated_at`) }
   get updated_by() { return this.__attr(`updated_by`) }
-  choices(builder: string | ChoicesModelSelector | ((selector: ChoicesModelSelector) => ChoicesModelSelector) | undefined, args?: { distinctOn?: ChoicesSelectColumn[], limit?: (number | null), offset?: (number | null), orderBy?: ChoicesOrderBy[], where?: (ChoicesBoolExp | null) }) { return this.__child(`choices`+ (args ? '('+['distinctOn', 'limit', 'offset', 'orderBy', 'where'].map((argName) => ((args as any)[argName] ? `${argName}: ${JSON.stringify((args as any)[argName])}` : null) ).filter((v) => v!=null).join(', ') + ')': ''), ChoicesModelSelector, builder) }
-  choices_aggregate(builder: string | ChoicesAggregateModelSelector | ((selector: ChoicesAggregateModelSelector) => ChoicesAggregateModelSelector) | undefined, args?: { distinctOn?: ChoicesSelectColumn[], limit?: (number | null), offset?: (number | null), orderBy?: ChoicesOrderBy[], where?: (ChoicesBoolExp | null) }) { return this.__child(`choices_aggregate`+ (args ? '('+['distinctOn', 'limit', 'offset', 'orderBy', 'where'].map((argName) => ((args as any)[argName] ? `${argName}: ${JSON.stringify((args as any)[argName])}` : null) ).filter((v) => v!=null).join(', ') + ')': ''), ChoicesAggregateModelSelector, builder) }
+  choices(builder: string | ChoicesModelSelector | ((selector: ChoicesModelSelector) => ChoicesModelSelector) | undefined, args?: { distinctOn?: ChoicesSelectColumn[] | null, limit?: (number | null), offset?: (number | null), orderBy?: ChoicesOrderBy[] | null, where?: (ChoicesBoolExp | null) }) { return this.__child(`choices`+ (args ? '('+['distinctOn', 'limit', 'offset', 'orderBy', 'where'].map((argName) => ((args as any)[argName] ? `${argName}: ${JSON.stringify((args as any)[argName])}` : null) ).filter((v) => v!=null).join(', ') + ')': ''), ChoicesModelSelector, builder) }
+  choices_aggregate(builder: string | ChoicesAggregateModelSelector | ((selector: ChoicesAggregateModelSelector) => ChoicesAggregateModelSelector) | undefined, args?: { distinctOn?: ChoicesSelectColumn[] | null, limit?: (number | null), offset?: (number | null), orderBy?: ChoicesOrderBy[] | null, where?: (ChoicesBoolExp | null) }) { return this.__child(`choices_aggregate`+ (args ? '('+['distinctOn', 'limit', 'offset', 'orderBy', 'where'].map((argName) => ((args as any)[argName] ? `${argName}: ${JSON.stringify((args as any)[argName])}` : null) ).filter((v) => v!=null).join(', ') + ')': ''), ChoicesAggregateModelSelector, builder) }
 }
 export function selectFromPolls() {
   return new PollsModelSelector()