{"expireTime":9007200821600205000,"key":"gatsby-plugin-mdx-entire-payload-32c22432b68d44e671628a367020e3d3-","val":{"mdast":{"type":"root","children":[{"type":"paragraph","children":[{"type":"text","value":"The EntityApi provides a declarative way to turn a series of promise returning functions into hoc's\nthat fetch your data.","position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":3,"column":22,"offset":122},"indent":[1]}}],"position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":3,"column":22,"offset":122},"indent":[1]}},{"type":"code","lang":"js","meta":null,"value":"EntityApi(\n    actionMap: {[key: string]: () => Promise<*>},\n    schema?: Schema,\n);","position":{"start":{"line":5,"column":1,"offset":124},"end":{"line":10,"column":4,"offset":218},"indent":[1,1,1,1,1]}},{"type":"heading","depth":2,"children":[{"type":"text","value":"Params","position":{"start":{"line":12,"column":4,"offset":223},"end":{"line":12,"column":10,"offset":229},"indent":[]}}],"position":{"start":{"line":12,"column":1,"offset":220},"end":{"line":12,"column":10,"offset":229},"indent":[]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"actionMap","position":{"start":{"line":14,"column":5,"offset":235},"end":{"line":14,"column":14,"offset":244},"indent":[]}}],"position":{"start":{"line":14,"column":1,"offset":231},"end":{"line":14,"column":14,"offset":244},"indent":[]}},{"type":"paragraph","children":[{"type":"strong","children":[{"type":"text","value":"type:","position":{"start":{"line":15,"column":3,"offset":247},"end":{"line":15,"column":8,"offset":252},"indent":[]}}],"position":{"start":{"line":15,"column":1,"offset":245},"end":{"line":15,"column":10,"offset":254},"indent":[]}},{"type":"text","value":" ","position":{"start":{"line":15,"column":10,"offset":254},"end":{"line":15,"column":11,"offset":255},"indent":[]}},{"type":"inlineCode","value":"{[key: string]: () => Promise<*>} ","position":{"start":{"line":15,"column":11,"offset":255},"end":{"line":15,"column":47,"offset":291},"indent":[]}},{"type":"break","position":{"start":{"line":15,"column":47,"offset":291},"end":{"line":16,"column":1,"offset":294},"indent":[1]}},{"type":"strong","children":[{"type":"text","value":"returns:","position":{"start":{"line":16,"column":3,"offset":296},"end":{"line":16,"column":11,"offset":304},"indent":[]}}],"position":{"start":{"line":16,"column":1,"offset":294},"end":{"line":16,"column":13,"offset":306},"indent":[]}},{"type":"text","value":" ","position":{"start":{"line":16,"column":13,"offset":306},"end":{"line":16,"column":14,"offset":307},"indent":[]}},{"type":"inlineCode","value":"{[key: string]: {useRequest: RequestHook, entityProvider}}","position":{"start":{"line":16,"column":14,"offset":307},"end":{"line":16,"column":74,"offset":367},"indent":[]}}],"position":{"start":{"line":15,"column":1,"offset":245},"end":{"line":16,"column":74,"offset":367},"indent":[1]}},{"type":"paragraph","children":[{"type":"text","value":"Action map is an aribtarily nested set of promise returning functions. Enty wraps these\nfunctions into a ","position":{"start":{"line":18,"column":1,"offset":369},"end":{"line":19,"column":18,"offset":474},"indent":[1]}},{"type":"linkReference","identifier":"requesthook","label":"RequestHook","referenceType":"shortcut","children":[{"type":"text","value":"RequestHook","position":{"start":{"line":19,"column":19,"offset":475},"end":{"line":19,"column":30,"offset":486},"indent":[]}}],"position":{"start":{"line":19,"column":18,"offset":474},"end":{"line":19,"column":31,"offset":487},"indent":[]}},{"type":"text","value":" bound to the schema provided.","position":{"start":{"line":19,"column":31,"offset":487},"end":{"line":19,"column":61,"offset":517},"indent":[]}}],"position":{"start":{"line":18,"column":1,"offset":369},"end":{"line":19,"column":61,"offset":517},"indent":[1]}},{"type":"code","lang":"js","meta":null,"value":"const Api = EntityApi({\n    currentUser: (payload) => get('/currentUser', payload)\n    course: {\n        get: (payload) => get('/user', payload),\n        create: (payload) => post('/user', payload)\n    }\n}, ApplicationSchema);\n\nexport const useCurrentUser = Api.currentUser.useRequest;\nexport const useCourseGet = Api.course.get.useRequest;\nexport const useCourseCreate = Api.course.create.useRequest;\n\nexport const Provider = Api.Provider;","position":{"start":{"line":21,"column":1,"offset":519},"end":{"line":35,"column":4,"offset":969},"indent":[1,1,1,1,1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"schema","position":{"start":{"line":37,"column":5,"offset":975},"end":{"line":37,"column":11,"offset":981},"indent":[]}}],"position":{"start":{"line":37,"column":1,"offset":971},"end":{"line":37,"column":11,"offset":981},"indent":[]}},{"type":"paragraph","children":[{"type":"strong","children":[{"type":"text","value":"type:","position":{"start":{"line":38,"column":3,"offset":984},"end":{"line":38,"column":8,"offset":989},"indent":[]}}],"position":{"start":{"line":38,"column":1,"offset":982},"end":{"line":38,"column":10,"offset":991},"indent":[]}},{"type":"text","value":" ","position":{"start":{"line":38,"column":10,"offset":991},"end":{"line":38,"column":11,"offset":992},"indent":[]}},{"type":"inlineCode","value":"StructuralSchema","position":{"start":{"line":38,"column":11,"offset":992},"end":{"line":38,"column":29,"offset":1010},"indent":[]}}],"position":{"start":{"line":38,"column":1,"offset":982},"end":{"line":38,"column":29,"offset":1010},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"When data is returned from an api function Enty will use this schema to start the normalizing \nprocess. This schema functions similarly to the ","position":{"start":{"line":40,"column":1,"offset":1012},"end":{"line":41,"column":49,"offset":1155},"indent":[1]}},{"type":"linkReference","identifier":"graphql","label":"graphql","referenceType":"shortcut","children":[{"type":"text","value":"graphql","position":{"start":{"line":41,"column":50,"offset":1156},"end":{"line":41,"column":57,"offset":1163},"indent":[]}}],"position":{"start":{"line":41,"column":49,"offset":1155},"end":{"line":41,"column":58,"offset":1164},"indent":[]}},{"type":"text","value":" root resolver and works like a small\nnamespace for your specific schemas. ","position":{"start":{"line":41,"column":58,"offset":1164},"end":{"line":42,"column":38,"offset":1239},"indent":[1]}}],"position":{"start":{"line":40,"column":1,"offset":1012},"end":{"line":42,"column":38,"offset":1239},"indent":[1,1]}},{"type":"list","ordered":false,"start":null,"spread":true,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"emphasis","children":[{"type":"text","value":"There is no required type of schema, but in most cases an \nObjectSchema makes the most sense.","position":{"start":{"line":44,"column":4,"offset":1244},"end":{"line":45,"column":35,"offset":1337},"indent":[1]}}],"position":{"start":{"line":44,"column":3,"offset":1243},"end":{"line":45,"column":36,"offset":1338},"indent":[1]}}],"position":{"start":{"line":44,"column":3,"offset":1243},"end":{"line":45,"column":36,"offset":1338},"indent":[1]}}],"position":{"start":{"line":44,"column":1,"offset":1241},"end":{"line":46,"column":1,"offset":1339},"indent":[1,1]}},{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"emphasis","children":[{"type":"text","value":"Schema is optional. If you dont provide a schema all your request state will still be tracked but nothing will be normalized.","position":{"start":{"line":47,"column":4,"offset":1343},"end":{"line":47,"column":129,"offset":1468},"indent":[]}}],"position":{"start":{"line":47,"column":3,"offset":1342},"end":{"line":47,"column":130,"offset":1469},"indent":[]}}],"position":{"start":{"line":47,"column":3,"offset":1342},"end":{"line":47,"column":130,"offset":1469},"indent":[]}}],"position":{"start":{"line":47,"column":1,"offset":1340},"end":{"line":47,"column":130,"offset":1469},"indent":[]}}],"position":{"start":{"line":44,"column":1,"offset":1241},"end":{"line":47,"column":130,"offset":1469},"indent":[1,1,1]}},{"type":"code","lang":"js","meta":null,"value":"const user = new EntitySchema('user');\nconst course = new EntitySchema('course');\nconst course = new EntitySchema('course');\nconst rootSchema = new ObjectSchema({\n    user,\n    course,\n    location\n});\n\nEntityApi(rootSchema, actionMap);","position":{"start":{"line":50,"column":1,"offset":1472},"end":{"line":61,"column":4,"offset":1718},"indent":[1,1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":2,"children":[{"type":"text","value":"Returns","position":{"start":{"line":63,"column":4,"offset":1723},"end":{"line":63,"column":11,"offset":1730},"indent":[]}}],"position":{"start":{"line":63,"column":1,"offset":1720},"end":{"line":63,"column":11,"offset":1730},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"EntityApi traverses the provided object map and wraps each promise function in RequestHook and a RequestHoc.This lets you group portions of your api as it make sense to.","position":{"start":{"line":64,"column":1,"offset":1731},"end":{"line":64,"column":170,"offset":1900},"indent":[]}}],"position":{"start":{"line":64,"column":1,"offset":1731},"end":{"line":64,"column":170,"offset":1900},"indent":[]}},{"type":"code","lang":"js","meta":null,"value":"const api = EntityApi({\n    course: {\n        get: (payload) => get('/course', payload),\n        create: (payload) => post('/course', payload),\n        save: (payload) => post(`/course/${payload.id}`, payload)\n    },\n    user: {\n        get: (payload) => get('/course', payload),\n        create: (payload) => post('/course', payload),\n        save: (payload) => post(`/course/${payload.id}`, payload)\n    }\n});\n\nexport const getUserHook = api.user.get.useRequest;\nexport const createCourseHoc = api.course.create.requestHoc;","position":{"start":{"line":66,"column":1,"offset":1902},"end":{"line":82,"column":4,"offset":2436},"indent":[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"useRequest","position":{"start":{"line":84,"column":5,"offset":2442},"end":{"line":84,"column":15,"offset":2452},"indent":[]}}],"position":{"start":{"line":84,"column":1,"offset":2438},"end":{"line":84,"column":15,"offset":2452},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"See ","position":{"start":{"line":85,"column":1,"offset":2453},"end":{"line":85,"column":5,"offset":2457},"indent":[]}},{"type":"link","title":null,"url":"/api/react-enty/request-hook","children":[{"type":"text","value":"RequestHook","position":{"start":{"line":85,"column":6,"offset":2458},"end":{"line":85,"column":17,"offset":2469},"indent":[]}}],"position":{"start":{"line":85,"column":5,"offset":2457},"end":{"line":85,"column":48,"offset":2500},"indent":[]}}],"position":{"start":{"line":85,"column":1,"offset":2453},"end":{"line":85,"column":48,"offset":2500},"indent":[]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"RequestHoc","position":{"start":{"line":87,"column":5,"offset":2506},"end":{"line":87,"column":15,"offset":2516},"indent":[]}}],"position":{"start":{"line":87,"column":1,"offset":2502},"end":{"line":87,"column":15,"offset":2516},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"See ","position":{"start":{"line":88,"column":1,"offset":2517},"end":{"line":88,"column":5,"offset":2521},"indent":[]}},{"type":"link","title":null,"url":"/api/react-enty/request-hoc","children":[{"type":"text","value":"RequestHoc","position":{"start":{"line":88,"column":6,"offset":2522},"end":{"line":88,"column":16,"offset":2532},"indent":[]}}],"position":{"start":{"line":88,"column":5,"offset":2521},"end":{"line":88,"column":46,"offset":2562},"indent":[]}}],"position":{"start":{"line":88,"column":1,"offset":2517},"end":{"line":88,"column":46,"offset":2562},"indent":[]}},{"type":"heading","depth":2,"children":[{"type":"text","value":"Root Returns","position":{"start":{"line":90,"column":4,"offset":2567},"end":{"line":90,"column":16,"offset":2579},"indent":[]}}],"position":{"start":{"line":90,"column":1,"offset":2564},"end":{"line":90,"column":16,"offset":2579},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"EntityApi also returns a few global tools at the root level that are necessary for your application.","position":{"start":{"line":91,"column":1,"offset":2580},"end":{"line":91,"column":101,"offset":2680},"indent":[]}}],"position":{"start":{"line":91,"column":1,"offset":2580},"end":{"line":91,"column":101,"offset":2680},"indent":[]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"Provider","position":{"start":{"line":94,"column":5,"offset":2687},"end":{"line":94,"column":13,"offset":2695},"indent":[]}}],"position":{"start":{"line":94,"column":1,"offset":2683},"end":{"line":94,"column":13,"offset":2695},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"The Provider links lets Request Hooks connect to the Enty store via context. It must be rendered above any component that uses a Request hook or hoc.","position":{"start":{"line":95,"column":1,"offset":2696},"end":{"line":95,"column":150,"offset":2845},"indent":[]}}],"position":{"start":{"line":95,"column":1,"offset":2696},"end":{"line":95,"column":150,"offset":2845},"indent":[]}},{"type":"code","lang":"jsx","meta":null,"value":"import Api from './EntityApi';\nimport ThemeProvider from './ThemeProvider';\n\nexport default function MainView() {\n    return <Api.Provider>\n        <ThemeProvider>\n            <AppComponent/>\n        </ThemeProvider>\n    </Api.Provider>;\n}","position":{"start":{"line":97,"column":1,"offset":2847},"end":{"line":108,"column":4,"offset":3097},"indent":[1,1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"ProviderHoc","position":{"start":{"line":110,"column":5,"offset":3103},"end":{"line":110,"column":16,"offset":3114},"indent":[]}}],"position":{"start":{"line":110,"column":1,"offset":3099},"end":{"line":110,"column":16,"offset":3114},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"The ProviderHoc wraps the Provider in a hoc. This is useful if your ","position":{"start":{"line":111,"column":1,"offset":3115},"end":{"line":111,"column":69,"offset":3183},"indent":[]}}],"position":{"start":{"line":111,"column":1,"offset":3115},"end":{"line":111,"column":69,"offset":3183},"indent":[]}},{"type":"code","lang":"jsx","meta":null,"value":"import Api from './EntityApi';\nimport ThemeProviderHoc from './ThemeProviderHoc';\nimport composeWith from 'unmutable/composeWith';\n\nexport default composeWith(\n    Api.ProviderHoc(),\n    ThemeProviderHoc(),\n    AppComponent\n);","position":{"start":{"line":113,"column":1,"offset":3185},"end":{"line":123,"column":4,"offset":3422},"indent":[1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"useRemove","position":{"start":{"line":125,"column":5,"offset":3428},"end":{"line":125,"column":14,"offset":3437},"indent":[]}}],"position":{"start":{"line":125,"column":1,"offset":3424},"end":{"line":125,"column":14,"offset":3437},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"Returns a side-effect that will remove an entity from the store.","position":{"start":{"line":126,"column":1,"offset":3438},"end":{"line":126,"column":65,"offset":3502},"indent":[]}}],"position":{"start":{"line":126,"column":1,"offset":3438},"end":{"line":126,"column":65,"offset":3502},"indent":[]}},{"type":"code","lang":"jsx","meta":null,"value":"// RemoveUser.jsx\nimport api from './EntityApi';\n\nexport default function RemoveUser(props) {\n    const remove = api.useRemove();\n    return <button onClick={() => remove('user', props.id)}>Remove User</button>;\n}","position":{"start":{"line":128,"column":1,"offset":3504},"end":{"line":136,"column":4,"offset":3728},"indent":[1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"RemoveHoc","position":{"start":{"line":138,"column":5,"offset":3734},"end":{"line":138,"column":14,"offset":3743},"indent":[]}}],"position":{"start":{"line":138,"column":1,"offset":3730},"end":{"line":138,"column":14,"offset":3743},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"Hocs a component with a ","position":{"start":{"line":139,"column":1,"offset":3744},"end":{"line":139,"column":25,"offset":3768},"indent":[]}},{"type":"inlineCode","value":"useRemove","position":{"start":{"line":139,"column":25,"offset":3768},"end":{"line":139,"column":36,"offset":3779},"indent":[]}},{"type":"text","value":" hook and provides the side-effect to ","position":{"start":{"line":139,"column":36,"offset":3779},"end":{"line":139,"column":74,"offset":3817},"indent":[]}},{"type":"inlineCode","value":"config.name","position":{"start":{"line":139,"column":74,"offset":3817},"end":{"line":139,"column":87,"offset":3830},"indent":[]}}],"position":{"start":{"line":139,"column":1,"offset":3744},"end":{"line":139,"column":87,"offset":3830},"indent":[]}},{"type":"code","lang":"jsx","meta":null,"value":"// RemoveUser.jsx\nimport api from './EntityApi';\n\nfunction RemoveUser({onRemove, id}) {\n    return <button onClick={() => onRemove('user', id)}>Remove User</button>;\n}\n\nexport default api.RemoveHoc({name: 'onRemove'})(RemoveUser);","position":{"start":{"line":141,"column":1,"offset":3832},"end":{"line":150,"column":4,"offset":4073},"indent":[1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":2,"children":[{"type":"text","value":"Examples","position":{"start":{"line":156,"column":4,"offset":4082},"end":{"line":156,"column":12,"offset":4090},"indent":[]}}],"position":{"start":{"line":156,"column":1,"offset":4079},"end":{"line":156,"column":12,"offset":4090},"indent":[]}},{"type":"heading","depth":3,"children":[{"type":"text","value":"Combining Multiple Apis","position":{"start":{"line":158,"column":5,"offset":4096},"end":{"line":158,"column":28,"offset":4119},"indent":[]}}],"position":{"start":{"line":158,"column":1,"offset":4092},"end":{"line":158,"column":28,"offset":4119},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"Because the api is declarative, it is easy to split portions of your api into different files.","position":{"start":{"line":160,"column":1,"offset":4121},"end":{"line":160,"column":95,"offset":4215},"indent":[]}}],"position":{"start":{"line":160,"column":1,"offset":4121},"end":{"line":160,"column":95,"offset":4215},"indent":[]}},{"type":"code","lang":"js","meta":null,"value":"// UserApi.js\nexport default {\n    get: payload => request.get('/user', payload),\n    create: payload => request.post('/user', payload),\n    save: payload => request.post(`/user/${payload.id}`, payload)\n};\n\n// CourseApi.js\nexport default {\n    get: payload => request.get('/course', payload),\n    create: payload => request.post('/course', payload),\n    save: payload => request.post(`/course/${payload.id}`, payload)\n};\n\n// EntityApi.js\nimport UserApi from './UserApi';\nimport CourseApi from './CourseApi';\nconst Api = EntityApi({\n    user: UserApi,\n    course: CourseApi\n}, EntitySchema);\n","position":{"start":{"line":162,"column":1,"offset":4217},"end":{"line":185,"column":4,"offset":4818},"indent":[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]}},{"type":"export","value":"export const _frontmatter = {\"id\":\"EntityApi\",\"title\":\"Entity Api\",\"group\":\"React Enty\"}","position":{"start":{"line":188,"column":1,"offset":4821},"end":{"line":188,"column":89,"offset":4909},"indent":[]}}],"position":{"start":{"line":1,"column":1,"offset":0},"end":{"line":188,"column":89,"offset":4909}}},"scopeImports":["import React from 'react'"],"scopeIdentifiers":["React"],"body":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsx mdx */\nvar _frontmatter = {\n  \"id\": \"EntityApi\",\n  \"title\": \"Entity Api\",\n  \"group\": \"React Enty\"\n};\n\nvar makeShortcode = function makeShortcode(name) {\n  return function MDXDefaultShortcode(props) {\n    console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n    return mdx(\"div\", props);\n  };\n};\n\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, [\"components\"]);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"p\", null, \"The EntityApi provides a declarative way to turn a series of promise returning functions into hoc's\\nthat fetch your data.\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-js\"\n  }), \"EntityApi(\\n    actionMap: {[key: string]: () => Promise<*>},\\n    schema?: Schema,\\n);\\n\")), mdx(\"h2\", null, \"Params\"), mdx(\"h3\", null, \"actionMap\"), mdx(\"p\", null, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"type:\"), \" \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"{[key: string]: () => Promise<*>} \"), mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"returns:\"), \" \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"{[key: string]: {useRequest: RequestHook, entityProvider}}\")), mdx(\"p\", null, \"Action map is an aribtarily nested set of promise returning functions. Enty wraps these\\nfunctions into a \", \"[RequestHook]\", \" bound to the schema provided.\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-js\"\n  }), \"const Api = EntityApi({\\n    currentUser: (payload) => get('/currentUser', payload)\\n    course: {\\n        get: (payload) => get('/user', payload),\\n        create: (payload) => post('/user', payload)\\n    }\\n}, ApplicationSchema);\\n\\nexport const useCurrentUser = Api.currentUser.useRequest;\\nexport const useCourseGet = Api.course.get.useRequest;\\nexport const useCourseCreate = Api.course.create.useRequest;\\n\\nexport const Provider = Api.Provider;\\n\")), mdx(\"h3\", null, \"schema\"), mdx(\"p\", null, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"type:\"), \" \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"StructuralSchema\")), mdx(\"p\", null, \"When data is returned from an api function Enty will use this schema to start the normalizing\\nprocess. This schema functions similarly to the \", \"[graphql]\", \" root resolver and works like a small\\nnamespace for your specific schemas. \"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"em\", {\n    parentName: \"p\"\n  }, \"There is no required type of schema, but in most cases an\\nObjectSchema makes the most sense.\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"em\", {\n    parentName: \"p\"\n  }, \"Schema is optional. If you dont provide a schema all your request state will still be tracked but nothing will be normalized.\")))), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-js\"\n  }), \"const user = new EntitySchema('user');\\nconst course = new EntitySchema('course');\\nconst course = new EntitySchema('course');\\nconst rootSchema = new ObjectSchema({\\n    user,\\n    course,\\n    location\\n});\\n\\nEntityApi(rootSchema, actionMap);\\n\")), mdx(\"h2\", null, \"Returns\"), mdx(\"p\", null, \"EntityApi traverses the provided object map and wraps each promise function in RequestHook and a RequestHoc.This lets you group portions of your api as it make sense to.\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-js\"\n  }), \"const api = EntityApi({\\n    course: {\\n        get: (payload) => get('/course', payload),\\n        create: (payload) => post('/course', payload),\\n        save: (payload) => post(`/course/${payload.id}`, payload)\\n    },\\n    user: {\\n        get: (payload) => get('/course', payload),\\n        create: (payload) => post('/course', payload),\\n        save: (payload) => post(`/course/${payload.id}`, payload)\\n    }\\n});\\n\\nexport const getUserHook = api.user.get.useRequest;\\nexport const createCourseHoc = api.course.create.requestHoc;\\n\")), mdx(\"h3\", null, \"useRequest\"), mdx(\"p\", null, \"See \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"/api/react-enty/request-hook\"\n  }), \"RequestHook\")), mdx(\"h3\", null, \"RequestHoc\"), mdx(\"p\", null, \"See \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"/api/react-enty/request-hoc\"\n  }), \"RequestHoc\")), mdx(\"h2\", null, \"Root Returns\"), mdx(\"p\", null, \"EntityApi also returns a few global tools at the root level that are necessary for your application.\"), mdx(\"h3\", null, \"Provider\"), mdx(\"p\", null, \"The Provider links lets Request Hooks connect to the Enty store via context. It must be rendered above any component that uses a Request hook or hoc.\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-jsx\"\n  }), \"import Api from './EntityApi';\\nimport ThemeProvider from './ThemeProvider';\\n\\nexport default function MainView() {\\n    return <Api.Provider>\\n        <ThemeProvider>\\n            <AppComponent/>\\n        </ThemeProvider>\\n    </Api.Provider>;\\n}\\n\")), mdx(\"h3\", null, \"ProviderHoc\"), mdx(\"p\", null, \"The ProviderHoc wraps the Provider in a hoc. This is useful if your \"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-jsx\"\n  }), \"import Api from './EntityApi';\\nimport ThemeProviderHoc from './ThemeProviderHoc';\\nimport composeWith from 'unmutable/composeWith';\\n\\nexport default composeWith(\\n    Api.ProviderHoc(),\\n    ThemeProviderHoc(),\\n    AppComponent\\n);\\n\")), mdx(\"h3\", null, \"useRemove\"), mdx(\"p\", null, \"Returns a side-effect that will remove an entity from the store.\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-jsx\"\n  }), \"// RemoveUser.jsx\\nimport api from './EntityApi';\\n\\nexport default function RemoveUser(props) {\\n    const remove = api.useRemove();\\n    return <button onClick={() => remove('user', props.id)}>Remove User</button>;\\n}\\n\")), mdx(\"h3\", null, \"RemoveHoc\"), mdx(\"p\", null, \"Hocs a component with a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"useRemove\"), \" hook and provides the side-effect to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"config.name\")), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-jsx\"\n  }), \"// RemoveUser.jsx\\nimport api from './EntityApi';\\n\\nfunction RemoveUser({onRemove, id}) {\\n    return <button onClick={() => onRemove('user', id)}>Remove User</button>;\\n}\\n\\nexport default api.RemoveHoc({name: 'onRemove'})(RemoveUser);\\n\")), mdx(\"h2\", null, \"Examples\"), mdx(\"h3\", null, \"Combining Multiple Apis\"), mdx(\"p\", null, \"Because the api is declarative, it is easy to split portions of your api into different files.\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-js\"\n  }), \"// UserApi.js\\nexport default {\\n    get: payload => request.get('/user', payload),\\n    create: payload => request.post('/user', payload),\\n    save: payload => request.post(`/user/${payload.id}`, payload)\\n};\\n\\n// CourseApi.js\\nexport default {\\n    get: payload => request.get('/course', payload),\\n    create: payload => request.post('/course', payload),\\n    save: payload => request.post(`/course/${payload.id}`, payload)\\n};\\n\\n// EntityApi.js\\nimport UserApi from './UserApi';\\nimport CourseApi from './CourseApi';\\nconst Api = EntityApi({\\n    user: UserApi,\\n    course: CourseApi\\n}, EntitySchema);\\n\\n\")));\n}\n;\nMDXContent.isMDXComponent = true;","rawMDXOutput":"/* @jsx mdx */\nimport { mdx } from '@mdx-js/react';\n/* @jsx mdx */\n\nexport const _frontmatter = {\n  \"id\": \"EntityApi\",\n  \"title\": \"Entity Api\",\n  \"group\": \"React Enty\"\n};\nconst makeShortcode = name => function MDXDefaultShortcode(props) {\n  console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\")\n  return <div {...props}/>\n};\n\nconst layoutProps = {\n  _frontmatter\n};\nconst MDXLayout = \"wrapper\"\nexport default function MDXContent({\n  components,\n  ...props\n}) {\n  return <MDXLayout {...layoutProps} {...props} components={components} mdxType=\"MDXLayout\">\n    <p>{`The EntityApi provides a declarative way to turn a series of promise returning functions into hoc's\nthat fetch your data.`}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-js\"\n      }}>{`EntityApi(\n    actionMap: {[key: string]: () => Promise<*>},\n    schema?: Schema,\n);\n`}</code></pre>\n    <h2>{`Params`}</h2>\n    <h3>{`actionMap`}</h3>\n    <p><strong parentName=\"p\">{`type:`}</strong>{` `}<inlineCode parentName=\"p\">{`{[key: string]: () => Promise<*>} `}</inlineCode><br parentName=\"p\"></br>{`\n`}<strong parentName=\"p\">{`returns:`}</strong>{` `}<inlineCode parentName=\"p\">{`{[key: string]: {useRequest: RequestHook, entityProvider}}`}</inlineCode></p>\n    <p>{`Action map is an aribtarily nested set of promise returning functions. Enty wraps these\nfunctions into a `}{`[RequestHook]`}{` bound to the schema provided.`}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-js\"\n      }}>{`const Api = EntityApi({\n    currentUser: (payload) => get('/currentUser', payload)\n    course: {\n        get: (payload) => get('/user', payload),\n        create: (payload) => post('/user', payload)\n    }\n}, ApplicationSchema);\n\nexport const useCurrentUser = Api.currentUser.useRequest;\nexport const useCourseGet = Api.course.get.useRequest;\nexport const useCourseCreate = Api.course.create.useRequest;\n\nexport const Provider = Api.Provider;\n`}</code></pre>\n    <h3>{`schema`}</h3>\n    <p><strong parentName=\"p\">{`type:`}</strong>{` `}<inlineCode parentName=\"p\">{`StructuralSchema`}</inlineCode></p>\n    <p>{`When data is returned from an api function Enty will use this schema to start the normalizing\nprocess. This schema functions similarly to the `}{`[graphql]`}{` root resolver and works like a small\nnamespace for your specific schemas. `}</p>\n    <ul>\n      <li parentName=\"ul\">\n        <p parentName=\"li\"><em parentName=\"p\">{`There is no required type of schema, but in most cases an\nObjectSchema makes the most sense.`}</em></p>\n      </li>\n      <li parentName=\"ul\">\n        <p parentName=\"li\"><em parentName=\"p\">{`Schema is optional. If you dont provide a schema all your request state will still be tracked but nothing will be normalized.`}</em></p>\n      </li>\n    </ul>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-js\"\n      }}>{`const user = new EntitySchema('user');\nconst course = new EntitySchema('course');\nconst course = new EntitySchema('course');\nconst rootSchema = new ObjectSchema({\n    user,\n    course,\n    location\n});\n\nEntityApi(rootSchema, actionMap);\n`}</code></pre>\n    <h2>{`Returns`}</h2>\n    <p>{`EntityApi traverses the provided object map and wraps each promise function in RequestHook and a RequestHoc.This lets you group portions of your api as it make sense to.`}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-js\"\n      }}>{`const api = EntityApi({\n    course: {\n        get: (payload) => get('/course', payload),\n        create: (payload) => post('/course', payload),\n        save: (payload) => post(\\`/course/\\${payload.id}\\`, payload)\n    },\n    user: {\n        get: (payload) => get('/course', payload),\n        create: (payload) => post('/course', payload),\n        save: (payload) => post(\\`/course/\\${payload.id}\\`, payload)\n    }\n});\n\nexport const getUserHook = api.user.get.useRequest;\nexport const createCourseHoc = api.course.create.requestHoc;\n`}</code></pre>\n    <h3>{`useRequest`}</h3>\n    <p>{`See `}<a parentName=\"p\" {...{\n        \"href\": \"/api/react-enty/request-hook\"\n      }}>{`RequestHook`}</a></p>\n    <h3>{`RequestHoc`}</h3>\n    <p>{`See `}<a parentName=\"p\" {...{\n        \"href\": \"/api/react-enty/request-hoc\"\n      }}>{`RequestHoc`}</a></p>\n    <h2>{`Root Returns`}</h2>\n    <p>{`EntityApi also returns a few global tools at the root level that are necessary for your application.`}</p>\n    <h3>{`Provider`}</h3>\n    <p>{`The Provider links lets Request Hooks connect to the Enty store via context. It must be rendered above any component that uses a Request hook or hoc.`}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-jsx\"\n      }}>{`import Api from './EntityApi';\nimport ThemeProvider from './ThemeProvider';\n\nexport default function MainView() {\n    return <Api.Provider>\n        <ThemeProvider>\n            <AppComponent/>\n        </ThemeProvider>\n    </Api.Provider>;\n}\n`}</code></pre>\n    <h3>{`ProviderHoc`}</h3>\n    <p>{`The ProviderHoc wraps the Provider in a hoc. This is useful if your `}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-jsx\"\n      }}>{`import Api from './EntityApi';\nimport ThemeProviderHoc from './ThemeProviderHoc';\nimport composeWith from 'unmutable/composeWith';\n\nexport default composeWith(\n    Api.ProviderHoc(),\n    ThemeProviderHoc(),\n    AppComponent\n);\n`}</code></pre>\n    <h3>{`useRemove`}</h3>\n    <p>{`Returns a side-effect that will remove an entity from the store.`}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-jsx\"\n      }}>{`// RemoveUser.jsx\nimport api from './EntityApi';\n\nexport default function RemoveUser(props) {\n    const remove = api.useRemove();\n    return <button onClick={() => remove('user', props.id)}>Remove User</button>;\n}\n`}</code></pre>\n    <h3>{`RemoveHoc`}</h3>\n    <p>{`Hocs a component with a `}<inlineCode parentName=\"p\">{`useRemove`}</inlineCode>{` hook and provides the side-effect to `}<inlineCode parentName=\"p\">{`config.name`}</inlineCode></p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-jsx\"\n      }}>{`// RemoveUser.jsx\nimport api from './EntityApi';\n\nfunction RemoveUser({onRemove, id}) {\n    return <button onClick={() => onRemove('user', id)}>Remove User</button>;\n}\n\nexport default api.RemoveHoc({name: 'onRemove'})(RemoveUser);\n`}</code></pre>\n    <h2>{`Examples`}</h2>\n    <h3>{`Combining Multiple Apis`}</h3>\n    <p>{`Because the api is declarative, it is easy to split portions of your api into different files.`}</p>\n    <pre><code parentName=\"pre\" {...{\n        \"className\": \"language-js\"\n      }}>{`// UserApi.js\nexport default {\n    get: payload => request.get('/user', payload),\n    create: payload => request.post('/user', payload),\n    save: payload => request.post(\\`/user/\\${payload.id}\\`, payload)\n};\n\n// CourseApi.js\nexport default {\n    get: payload => request.get('/course', payload),\n    create: payload => request.post('/course', payload),\n    save: payload => request.post(\\`/course/\\${payload.id}\\`, payload)\n};\n\n// EntityApi.js\nimport UserApi from './UserApi';\nimport CourseApi from './CourseApi';\nconst Api = EntityApi({\n    user: UserApi,\n    course: CourseApi\n}, EntitySchema);\n\n`}</code></pre>\n\n    </MDXLayout>;\n}\n\n;\nMDXContent.isMDXComponent = true;"}}