How to use the mobx-state-tree.types.maybeNull function in mobx-state-tree

events_url: types.maybeNull(types.string),
  followers_url: types.maybeNull(types.string),
  following_url: types.maybeNull(types.string),
  gists_url: types.maybeNull(types.string),
  gravatar_id: types.maybeNull(types.string),
  html_url: types.maybeNull(types.string),
  id: types.maybeNull(types.number),
  login: types.maybeNull(types.string),
  node_id: types.maybeNull(types.string),
  organizations_url: types.maybeNull(types.string),
  received_events_url: types.maybeNull(types.string),
  repos_url: types.maybeNull(types.string),
  site_admin: types.maybeNull(types.boolean),
  starred_url: types.maybeNull(types.string),
  subscriptions_url: types.maybeNull(types.string),
  type: types.maybeNull(types.string),
  url: types.maybeNull(types.string),
});

export interface IOwner extends Instance {}

export const Gist = types.model('Gist', {
  id: types.identifier,
  url: types.maybeNull(types.string),
  files: types.optional(types.map(File), {}),
  // forks?: [];
  forks_url: types.maybeNull(types.string),
  git_pull_url: types.maybeNull(types.string),
  git_push_url: types.maybeNull(types.string),
  // history?: [];
  html_url: types.maybeNull(types.string),
  owner: types.optional(Owner, {}),

import { types as t } from 'mobx-state-tree'

import { PAGE_SIZE } from '@config'

import { User, PagedUsers } from './User'
import { Community } from './Community'
/* import { Comment } from './Comment' */
import { Tag } from './Tag'

export const Video = t.model('Video', {
  id: t.maybeNull(t.string),
  title: t.maybeNull(t.string),
  desc: t.maybeNull(t.string),
  duration: t.maybeNull(t.string),
  /* durationDec: t.maybeNull(t.number), */
  thumbnil: t.maybeNull(t.string),
  poster: t.maybeNull(t.string),
  author: t.maybeNull(User),

  source: t.maybeNull(t.string),
  link: t.maybeNull(t.string),
  originalAuthor: t.maybeNull(t.string),
  originalAuthorLink: t.maybeNull(t.string),

  views: t.optional(t.number, 0),
  pin: t.maybeNull(t.boolean),

  communities: t.optional(t.array(Community), []),
  origialCommunity: t.optional(Community, {}),
  tags: t.optional(t.array(Tag), []),
  /* comments: t.optional(t.array(Comment), []), */
  favoritedCount: t.optional(t.number, 0),

editContent: t.optional(t.string, ''),
    // content input of current reply comment editor
    replyContent: t.optional(t.string, ''),
    // comments pagination data of current COMMUNITY / PART
    pagedComments: t.optional(PagedComments, emptyPagiData),

    isEdit: t.optional(t.boolean, false),
    editComment: t.maybeNull(Comment),

    // current "@user" in valid array format
    referUsers: t.optional(t.array(Mention), []),
    // current "@user" in string list
    extractMentions: t.optional(t.array(t.string), []),

    // parrent comment of current reply
    replyToComment: t.maybeNull(Comment),

    // mention users in content
    mentionList: t.optional(t.array(Mention), []),

    // toggle loading for creating comment
    creating: t.optional(t.boolean, false),
    // toggle loading for creating reply comment
    replying: t.optional(t.boolean, false),
    // toggle loading for comments list
    loading: t.optional(t.boolean, false),
    // toggle loading for first item of commetns list
    loadingFresh: t.optional(t.boolean, false),
  })
  .views(self => ({
    get root() {
      return getParent(self)

import { types as t } from 'mobx-state-tree'

import { PAGE_SIZE } from '@config'

import { User, PagedUsers } from './User'
import { Community } from './Community'
import { Comment } from './Comment'
import { Tag } from './Tag'

export const Post = t.model('Post', {
  id: t.maybeNull(t.string),
  title: t.optional(t.string, ''),
  body: t.maybeNull(t.string),
  digest: t.maybeNull(t.string),
  author: t.maybeNull(User),

  linkAddr: t.maybeNull(t.string),
  linkIcon: t.maybeNull(t.string),
  copyRight: t.optional(t.string, 'original'),

  communities: t.optional(t.array(Community), []),
  origialCommunity: t.optional(Community, {}),
  tags: t.optional(t.array(Tag), []),
  comments: t.optional(t.array(Comment), []),

  commentsCount: t.optional(t.number, 0),
  commentsParticipatorsCount: t.optional(t.number, 0),
  commentsParticipators: t.optional(t.array(User), []),
  views: t.optional(t.number, 0),

import asyncStates from '@zooniverse/async-states'
import { flow, types } from 'mobx-state-tree'
import auth from 'panoptes-client/lib/auth'

import numberString from './types/numberString'

const User = types
  .model('User', {
    avatar_src: types.maybeNull(types.string),
    display_name: types.maybeNull(types.string),
    error: types.maybeNull(types.frozen({})),
    id: types.maybeNull(numberString),
    login: types.maybeNull(types.string),
    loadingState: types.optional(types.enumeration('state', asyncStates.values), asyncStates.loading)
  })

  .views(self => ({
    get displayName () {
      return self.display_name
    },

    get isLoggedIn () {
      return !!self.id
    }
  }))

  .actions(self => ({
    checkCurrent: flow(function * checkCurrent () {

import asyncStates from '@zooniverse/async-states'
import { flow, types } from 'mobx-state-tree'
import auth from 'panoptes-client/lib/auth'

import numberString from './types/numberString'

const User = types
  .model('User', {
    avatar_src: types.maybeNull(types.string),
    display_name: types.maybeNull(types.string),
    error: types.maybeNull(types.frozen({})),
    id: types.maybeNull(numberString),
    login: types.maybeNull(types.string),
    loadingState: types.optional(types.enumeration('state', asyncStates.values), asyncStates.loading)
  })

  .views(self => ({
    get displayName () {
      return self.display_name
    },

    get isLoggedIn () {
      return !!self.id
    }
  }))

  .actions(self => ({

group?: string;
  type?: string;
}

export const DEFAULT_TYPE = 'string';
export const DEFAULT_GROUP_TITLE = 'Main';

export const SchemaField = types
  .model('SchemaField', {
    id: types.identifier,
    type: types.string,
    name: types.string,
    title: types.string,
    description: types.maybeNull(types.string),
    primary: types.optional(types.boolean, false),
    schemaId: types.maybeNull(types.string),
    options: types.frozen(),
    group: DEFAULT_GROUP_TITLE,
    fields: types.maybeNull(types.array(types.late((): any => SchemaField))),
    __typename: types.maybeNull(types.string),
  })
  .preProcessSnapshot(snapshot => ({
    ...snapshot,
    fields: snapshot.fields || [],
  }))
  .views(self => ({
    get isLeaf(): boolean {
      return !hasParentOfType(self, SchemaField);
    },
    get defaultOptions() {
      const settingsField = Settings.fields.find((f: any) => f.type === self.type);
      if (settingsField) {

pointstyle: types.string,

    closed: types.optional(types.boolean, false),

    points: types.array(PolygonPoint, []),

    states: types.maybeNull(types.array(types.union(LabelsModel, RatingModel, PolygonLabelsModel))),

    mouseOverStartPoint: types.optional(types.boolean, false),

    coordstype: types.optional(types.enumeration(["px", "perc"]), "px"),

    fromName: types.maybeNull(types.string),

    wp: types.maybeNull(types.number),
    hp: types.maybeNull(types.number),
  })
  .views(self => ({
    get parent() {
      return getParentOfType(self, ImageModel);
    },

    get completion() {
      return getRoot(self).completionStore.selected;
    },
  }))
  .actions(self => ({
    /**
     * Handler for mouse on start point of Polygon
     * @param {boolean} val
     */
    setMouseOverStartPoint(value) {

import { types } from "mobx-state-tree"

export const SpeakerModel = types.model().props({
  id: types.identifier,
  name: types.maybeNull(types.string),
  employer: types.maybeNull(types.string),
  image: types.maybeNull(types.string),
  facebook: types.maybeNull(types.string),
  github: types.maybeNull(types.string),
  twitter: types.maybeNull(types.string),
  medium: types.maybeNull(types.string),
  instagram: types.maybeNull(types.string),
  dribbble: types.maybeNull(types.string),
  websites: types.maybeNull(types.array(types.string)),
  bio: types.maybeNull(types.string),
})

const PagedCommunities = t.model('pagedCommunities', {
  entries: t.optional(t.array(Community), []),
  totalCount: t.optional(t.number, 0),
})

const ContributeRecord = t.model('ContributeRecord', {
  date: t.string,
  count: t.number,
})

const Contributes = t.model('Contributes', {
  records: t.optional(t.array(ContributeRecord), []),
  startDate: t.maybeNull(t.string),
  endDate: t.maybeNull(t.string),
  totalCount: t.maybeNull(t.number),
})

const GithubProfile = t.model('GithubProfile', {
  login: t.string,
  htmlUrl: t.string,
})

export const EduBackground = t.model('EduBackground', {
  school: t.optional(t.string, ''),
  major: t.optional(t.string, ''),
})

export const WorkBackground = t.model('WorkBackground', {
  company: t.optional(t.string, ''),
  title: t.maybeNull(t.string),
})