Generated server models for twitter

.gitignore

@@ -64,4 +64,5 @@ typings/
 
 dist
 
-tmp_schema.json
+tmp_schema.json
+.awcache

README.md

@@ -390,10 +390,11 @@ TODO: philosophical section on whether to define the UI purely in terms of store
 
 The `mst-gql` command currently accepts the following arguments:
 
-- `--format ts|js` The type of files that need to be generated (default: `js`)
+- `--format ts|js|mjs` The type of files that need to be generated (default: `js`)
 - `--outDir <dir>` The output directory of the generated files (default: `src/models`)
 - `--excludes 'type1,type2,typeN'` The types that should be omitted during generation, as we are not interested in for this app.
 - `--roots 'type1,type2,typeN'` The types that should be used as (root types)[#root-types]
+- `--modelsOnly` Generates only models, but no queries or graphQL capabilities. This is great for backend usage, or if you want to create your own root store
 - `source` The last argument is the location at which to find the graphQL definitions. This can be
   - a graphql endpoint, like `http://host/graphql`
   - a graphql files, like `schema.graphql`

examples/6-twitter-clone/package.json

@@ -4,9 +4,11 @@
   "private": true,
   "license": "MIT",
   "scripts": {
-    "start:server": "node ./src/server/index.js",
-    "start:client": "yarn scaffold && webpack-dev-server --hot --inline",
-    "scaffold": "../../generator/mst-gql-scaffold.js --excludes 'Mutation,CacheControlScope,Query,Subscription' --outDir src/app/models/ --format ts http://localhost:4000/graphql",
+    "start:server": "yarn scaffold:server && ts-node --project ./src/server/tsconfig.json ./src/server/index.ts",
+    "start:client": "yarn scaffold:client && webpack-dev-server --hot --inline",
+    "scaffold": "yarn scaffold:server && yarn scaffold:client",
+    "scaffold:client": "../../generator/mst-gql-scaffold.js --excludes 'Mutation,CacheControlScope,Query,Subscription' --outDir src/app/models/ --format ts src/server/schema.graphql",
+    "scaffold:server": "../../generator/mst-gql-scaffold.js --excludes 'Mutation,CacheControlScope,Query,Subscription' --outDir src/server/models/ --format ts --modelsOnly src/server/schema.graphql",
     "start": "run-p start:server start:client",
     "postinstall": "yarn install-mst-gql",
     "install-mst-gql": "bash ../../scripts/install-mst-gql.sh"
@@ -24,20 +26,25 @@
     "webpack-dev-server": "^3.1.14"
   },
   "dependencies": {
+    "@babel/core": "^7.4.4",
+    "@babel/node": "^7.2.2",
     "@types/react": "^16.8.16",
     "@types/react-dom": "^16.8.4",
     "apollo-server-express": "^2.3.3",
     "arg": "^4.1.0",
     "cors": "^2.8.5",
+    "esm": "^3.2.25",
     "express": "^4.16.4",
     "fakergem": "^1.0.3",
     "graphql-playground-middleware-express": "^1.7.11",
     "isomorphic-fetch": "^2.2.1",
     "mobx": "^5.9.4",
     "mobx-react-lite": "^1.3.1",
     "mobx-state-tree": "^3.14.0",
-    "mst-gql": "file:./mst-gql1558079637.tgz",
+    "mst-gql": "file:./mst-gql1558084542.tgz",
+    "node-uuid": "^1.4.8",
     "react": "^16.8.1",
-    "react-dom": "^16.8.1"
+    "react-dom": "^16.8.1",
+    "ts-node": "^8.1.0"
   }
 }

examples/6-twitter-clone/src/app/models/MessageModel.base.ts

@@ -6,6 +6,7 @@ import { types } from "mobx-state-tree"
 import { MSTGQLObject, MSTGQLRef } from "mst-gql"
 
 import { UserModel } from "./UserModel"
+import { MessageModel } from "./MessageModel"
 import { RootStore } from "./index"
 
 /**
@@ -17,8 +18,10 @@ export const MessageModelBase = MSTGQLObject
   .props({
     __typename: types.optional(types.literal("Message"), "Message"),
     id: types.identifier,
+    timestamp: types.integer,
     user: MSTGQLRef(types.late(() => UserModel)),
     text: types.string,
+    replyTo: types.maybe(MSTGQLRef(types.late((): any => MessageModel))),
   })
   .views(self => ({
     get store() {
@@ -29,6 +32,7 @@ export const MessageModelBase = MSTGQLObject
 export const messageModelPrimitives = `
 __typename
 id
+timestamp
 text
 `
 

examples/6-twitter-clone/tsconfig.json → examples/6-twitter-clone/src/app/tsconfig.json

@@ -1,12 +1,14 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "rootDir": "./src",
-    "baseUrl": "./src",
+    "rootDir": "./src/app",
+    "baseUrl": "./src/app",
     "strict": false,
     "lib": ["dom", "es2018", "esnext.asynciterable", "esnext.array"],
     "jsx": "react",
     "esModuleInterop": true,
-    "moduleResolution": "node"
-  }
+    "moduleResolution": "node",
+    "isolatedModules": true
+  },
+  "files": ["index.tsx"]
 }

examples/6-twitter-clone/src/server/db/initial.json

@@ -0,0 +1,34 @@
+{
+  "messages": {
+    "abc": {
+      "id": "abc",
+      "timestamp": 1558081865759,
+      "text": "#MobX is cool",
+      "user": "mweststrate"
+    },
+    "def": {
+      "id": "def",
+      "timestamp": 1558081465759,
+      "text": "Chuck Norris doesn't believe in floating point numbers because they can't be typed on his binary keyboard.",
+      "user": "chucknorris"
+    },
+    "ghi": {
+      "id": "ghi",
+      "timestamp": 1558081462759,
+      "text": "All arrays Chuck Norris declares are of infinite size, because Chuck Norris knows no bounds.",
+      "user": "chucknorris"
+    }
+  },
+  "users": {
+    "mweststrate": {
+      "id": "mweststrate",
+      "name": "Michel Weststrate",
+      "avatar": "https://pbs.twimg.com/profile_images/1126182603944599558/BlES9eyZ_400x400.jpg"
+    },
+    "chucknorris": {
+      "id": "chucknorris",
+      "name": "Chuck Norris",
+      "avatar": "https://beardoholic.com/wp-content/uploads/2017/12/c74461ae2a9917a2482ac7b53f195b3c6e2fdd59e778c673256fb29d1b07f181.jpg"
+    }
+  }
+}

examples/6-twitter-clone/src/server/index.js → examples/6-twitter-clone/src/server/index.ts

@@ -1,11 +1,12 @@
-const { makeExecutableSchema } = require("graphql-tools")
-const { execute, subscribe } = require("graphql")
-const { createServer } = require("http")
-const { SubscriptionServer } = require("subscriptions-transport-ws")
-const { ApolloServer } = require("apollo-server-express")
-const cors = require("cors")
-const express = require("express")
-const { typeDefs, resolvers } = require("./schema")
+import { makeExecutableSchema } from "graphql-tools"
+import { execute, subscribe } from "graphql"
+import { createServer } from "http"
+import { SubscriptionServer } from "subscriptions-transport-ws"
+import { ApolloServer } from "apollo-server-express"
+import cors from "cors"
+import express from "express"
+
+import { typeDefs, resolvers } from "./schema"
 
 const PORT = 4000
 const WS_PORT = 4001
@@ -32,12 +33,13 @@ websocketServer.listen(WS_PORT, () =>
   console.log(`Websocket Server is now running on http://localhost:${WS_PORT}`)
 )
 
-// Setup graphql server
 const app = express()
 
+// @ts-ignore
 app.use(cors())
 
 const server = new ApolloServer({
+  // @ts-ignore
   typeDefs,
   resolvers,
   subscriptionsPath: `http://localhost:${WS_PORT}`

examples/6-twitter-clone/src/server/models/MessageModel.base.ts

@@ -0,0 +1,32 @@
+/* This is a mst-sql generated file, don't modify it manually */
+/* eslint-disable */
+/* tslint:disable */
+
+import { types } from "mobx-state-tree"
+import { MSTGQLObject, MSTGQLRef } from "mst-gql"
+
+import { UserModel } from "./UserModel"
+import { MessageModel } from "./MessageModel"
+import { RootStore } from "./index"
+
+/**
+ * MessageBase
+ * auto generated base class for the model MessageModel.
+ */
+export const MessageModelBase = MSTGQLObject
+  .named('Message')
+  .props({
+    __typename: types.optional(types.literal("Message"), "Message"),
+    id: types.identifier,
+    timestamp: types.number,
+    user: MSTGQLRef(types.late(() => UserModel)),
+    text: types.string,
+    replyTo: types.maybe(MSTGQLRef(types.late((): any => MessageModel))),
+  })
+  .views(self => ({
+    get store() {
+      return self.__getStore<typeof RootStore.Type>()
+    }
+  }))
+
+

examples/6-twitter-clone/src/server/models/MessageModel.ts

@@ -0,0 +1,19 @@
+import { MessageModelBase } from "./MessageModel.base"
+
+/* The TypeScript type of an instance of MessageModel */
+export type MessageModelType = typeof MessageModel.Type
+
+
+
+/**
+ * MessageModel
+ */
+export const MessageModel = MessageModelBase
+  .actions(self => ({
+    // This is just an auto-generated example action, which can be safely thrown away. 
+    // Feel free to add your own actions, props, views etc to the model. 
+    // Any code outside the '#region mst-gql-*'  regions will be preserved
+    log() {
+      console.log(JSON.stringify(self))
+    }
+  }))

examples/6-twitter-clone/src/server/models/RootStore.base.ts

@@ -0,0 +1,20 @@
+/* This is a mst-sql generated file, don't modify it manually */
+/* eslint-disable */
+/* tslint:disable */
+import { types } from "mobx-state-tree"
+import { MSTGQLStore, configureStoreMixin, QueryOptions } from "mst-gql"
+
+import { MessageModel, UserModel } from "./index"
+
+/**
+* Store, managing, among others, all the objects received through graphQL
+*/
+export const RootStoreBase = types.model()
+  .named("RootStore")
+  .extend(configureStoreMixin([['Message', () => MessageModel], ['User', () => UserModel]], ['Message', 'User']))
+  .props({
+    messages: types.optional(types.map(types.late(() => MessageModel)), {}),
+    users: types.optional(types.map(types.late(() => UserModel)), {})
+  })
+  .actions(self => ({    
+  }))

examples/6-twitter-clone/src/server/models/RootStore.ts

@@ -0,0 +1,13 @@
+import { RootStoreBase } from "./RootStore.base"
+
+export type RootStoreType = typeof RootStore.Type
+
+export const RootStore = RootStoreBase
+  .actions(self => ({
+    // This is just an auto-generated example action, which can be safely thrown away. 
+    // Feel free to add your own actions, props, views etc to the model. 
+    // Any code outside the '#region mst-gql-*'  regions will be preserved
+    log() {
+      console.log(JSON.stringify(self))
+    }
+  }))

examples/6-twitter-clone/src/server/models/UserModel.base.ts

@@ -0,0 +1,29 @@
+/* This is a mst-sql generated file, don't modify it manually */
+/* eslint-disable */
+/* tslint:disable */
+
+import { types } from "mobx-state-tree"
+import { MSTGQLObject, MSTGQLRef } from "mst-gql"
+
+
+import { RootStore } from "./index"
+
+/**
+ * UserBase
+ * auto generated base class for the model UserModel.
+ */
+export const UserModelBase = MSTGQLObject
+  .named('User')
+  .props({
+    __typename: types.optional(types.literal("User"), "User"),
+    id: types.identifier,
+    name: types.string,
+    avatar: types.string,
+  })
+  .views(self => ({
+    get store() {
+      return self.__getStore<typeof RootStore.Type>()
+    }
+  }))
+
+

examples/6-twitter-clone/src/server/models/UserModel.ts

@@ -0,0 +1,19 @@
+import { UserModelBase } from "./UserModel.base"
+
+/* The TypeScript type of an instance of UserModel */
+export type UserModelType = typeof UserModel.Type
+
+
+
+/**
+ * UserModel
+ */
+export const UserModel = UserModelBase
+  .actions(self => ({
+    // This is just an auto-generated example action, which can be safely thrown away. 
+    // Feel free to add your own actions, props, views etc to the model. 
+    // Any code outside the '#region mst-gql-*'  regions will be preserved
+    log() {
+      console.log(JSON.stringify(self))
+    }
+  }))

examples/6-twitter-clone/src/server/models/index.ts

@@ -0,0 +1,7 @@
+/* This is a mst-sql generated file, don't modify it manually */
+/* eslint-disable */
+/* tslint:disable */
+
+export * from "./MessageModel"
+export * from "./UserModel"
+export * from "./RootStore"

examples/6-twitter-clone/src/server/schema.graphql

@@ -0,0 +1,23 @@
+type User {
+  id: ID
+  name: String!
+  avatar: String!
+}
+type Message {
+  id: ID
+  timestamp: Float!
+  user: User!
+  text: String!
+  replyTo: Message
+}
+type Query {
+  messages: [Message]
+  message(id: ID!): Message
+  me: User
+}
+type Subscription {
+  newMessages: Message
+}
+type Mutation {
+  changeName(id: ID!, name: String!): User
+}