graphiti 2.0.0.beta.2 → 2.0.0.beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (269) hide show
  1. checksums.yaml +4 -4
  2. data/.github/workflows/ci.yml +30 -86
  3. data/.github/workflows/docs.yml +60 -0
  4. data/.github/workflows/release.yml +8 -8
  5. data/.gitignore +7 -0
  6. data/.npmrc +9 -0
  7. data/.standard.yml +4 -1
  8. data/Appraisals +33 -32
  9. data/CHANGELOG.md +41 -0
  10. data/README.md +13 -2
  11. data/UPGRADING.md +2 -68
  12. data/docs/concepts/backends-and-models.md +122 -0
  13. data/docs/concepts/endpoints.md +183 -0
  14. data/docs/concepts/links.md +212 -0
  15. data/docs/concepts/overview.md +80 -0
  16. data/docs/concepts/persisting.md +376 -0
  17. data/docs/concepts/relationships.md +527 -0
  18. data/docs/concepts/resources.md +677 -0
  19. data/docs/getting-started/first-api.md +289 -0
  20. data/docs/getting-started/installation.md +185 -0
  21. data/docs/intro.md +307 -0
  22. data/docs/js/authentication.md +63 -0
  23. data/docs/js/ddau.md +20 -0
  24. data/docs/js/extra-params.md +41 -0
  25. data/docs/js/index.md +112 -0
  26. data/docs/js/installation.md +120 -0
  27. data/docs/js/middleware.md +72 -0
  28. data/docs/js/models.md +202 -0
  29. data/docs/js/reads.md +494 -0
  30. data/docs/js/state-syncing.md +100 -0
  31. data/docs/js/writes.md +373 -0
  32. data/docs/reference/vandal.md +63 -0
  33. data/docs/reference/why.md +13 -0
  34. data/docs/topics/authorization.md +155 -0
  35. data/docs/topics/caching.md +55 -0
  36. data/docs/topics/customizing-sideloads.md +156 -0
  37. data/docs/topics/debugging.md +216 -0
  38. data/docs/topics/error-handling.md +210 -0
  39. data/docs/topics/etags.md +46 -0
  40. data/docs/topics/hopping-relationships.md +149 -0
  41. data/docs/topics/json-attributes.md +77 -0
  42. data/docs/topics/openstruct-models.md +50 -0
  43. data/docs/topics/remote-resources.md +291 -0
  44. data/docs/topics/testing.md +894 -0
  45. data/docs/topics/without-activerecord.md +324 -0
  46. data/docs/tutorial/index.md +58 -0
  47. data/docs/tutorial/step_0.md +107 -0
  48. data/docs/tutorial/step_1.md +199 -0
  49. data/docs/tutorial/step_2.md +312 -0
  50. data/docs/tutorial/step_3.md +142 -0
  51. data/docs/tutorial/step_4.md +135 -0
  52. data/docs/tutorial/step_5.md +69 -0
  53. data/docs/tutorial/step_6.md +82 -0
  54. data/docs/tutorial/step_7.md +205 -0
  55. data/docs/tutorial/step_8.md +128 -0
  56. data/docs/tutorial/step_9.md +171 -0
  57. data/docs/upgrading.md +265 -0
  58. data/gemfiles/rails_7_1.gemfile +4 -3
  59. data/gemfiles/{rails_7_2_graphiti_rails.gemfile → rails_7_2.gemfile} +3 -3
  60. data/gemfiles/{rails_8_1_graphiti_rails.gemfile → rails_8_0.gemfile} +3 -3
  61. data/gemfiles/{rails_8_0_graphiti_rails.gemfile → rails_8_1.gemfile} +3 -3
  62. data/graphiti.gemspec +7 -5
  63. data/{deprecated_generators → lib/generators}/graphiti/api_test_generator.rb +7 -1
  64. data/{deprecated_generators → lib/generators}/graphiti/generator_mixin.rb +14 -1
  65. data/{deprecated_generators → lib/generators}/graphiti/install_generator.rb +19 -13
  66. data/{deprecated_generators → lib/generators}/graphiti/resource_generator.rb +43 -6
  67. data/{deprecated_generators → lib/generators}/graphiti/templates/index_request_spec.rb.erb +1 -1
  68. data/{deprecated_generators → lib/generators}/graphiti/templates/resource_reads_spec.rb.erb +6 -6
  69. data/{deprecated_generators → lib/generators}/graphiti/templates/show_request_spec.rb.erb +1 -1
  70. data/lib/graphiti/configuration.rb +2 -2
  71. data/lib/graphiti/error_serializers/conflict_request.rb +19 -0
  72. data/lib/graphiti/error_serializers/deprecated_constants.rb +48 -0
  73. data/lib/graphiti/error_serializers/invalid_request.rb +56 -0
  74. data/lib/graphiti/error_serializers/validation.rb +143 -0
  75. data/lib/graphiti/errors.rb +4 -23
  76. data/lib/graphiti/query.rb +1 -1
  77. data/lib/graphiti/rails/context.rb +33 -0
  78. data/lib/graphiti/rails/controller.rb +41 -0
  79. data/lib/graphiti/rails/debugging.rb +18 -0
  80. data/lib/graphiti/rails/exception_handlers.rb +77 -0
  81. data/lib/graphiti/rails/railtie.rb +139 -0
  82. data/lib/graphiti/rails/responders.rb +21 -0
  83. data/lib/graphiti/rails/test_helpers.rb +22 -0
  84. data/lib/graphiti/rails.rb +47 -29
  85. data/lib/graphiti/resource/configuration.rb +1 -0
  86. data/lib/graphiti/resource/interface.rb +2 -2
  87. data/lib/graphiti/resource/persistence.rb +14 -2
  88. data/lib/graphiti/resource/remote.rb +2 -2
  89. data/lib/graphiti/resource/sideloading.rb +1 -1
  90. data/lib/graphiti/resource.rb +13 -1
  91. data/lib/graphiti/responders.rb +7 -20
  92. data/lib/graphiti/schema.rb +5 -1
  93. data/lib/graphiti/schema_diff.rb +4 -0
  94. data/lib/graphiti/scope.rb +45 -37
  95. data/lib/graphiti/serializer.rb +6 -0
  96. data/lib/graphiti/sideload/belongs_to.rb +38 -5
  97. data/lib/graphiti/sideload/polymorphic_belongs_to.rb +27 -23
  98. data/lib/graphiti/sideload.rb +54 -35
  99. data/lib/graphiti/spec_helpers/errors.rb +73 -0
  100. data/lib/graphiti/spec_helpers/errors_proxy.rb +75 -0
  101. data/lib/graphiti/spec_helpers/helpers.rb +107 -0
  102. data/lib/graphiti/spec_helpers/node.rb +88 -0
  103. data/lib/graphiti/spec_helpers/rspec.rb +147 -0
  104. data/lib/graphiti/spec_helpers.rb +53 -0
  105. data/lib/graphiti/util/include_params.rb +2 -2
  106. data/lib/graphiti/util/persistence.rb +10 -11
  107. data/lib/graphiti/util/serializer_relationships.rb +41 -5
  108. data/lib/graphiti/version.rb +1 -1
  109. data/lib/graphiti-rails.rb +11 -0
  110. data/lib/graphiti.rb +34 -10
  111. data/lib/graphiti_errors.rb +11 -0
  112. data/lib/graphiti_spec_helpers/rspec.rb +3 -0
  113. data/lib/graphiti_spec_helpers.rb +11 -0
  114. data/lib/{graphiti/deprecated_tasks.rb → tasks/graphiti.rake} +6 -1
  115. data/package-lock.json +6199 -0
  116. data/package.json +5 -4
  117. data/website/.gitignore +20 -0
  118. data/website/README.md +43 -0
  119. data/website/docusaurus.config.js +141 -0
  120. data/website/package-lock.json +19474 -0
  121. data/website/package.json +46 -0
  122. data/website/sidebars.js +82 -0
  123. data/website/src/css/custom.css +58 -0
  124. data/website/src/pages/markdown-page.mdx +7 -0
  125. data/website/static/.nojekyll +0 -0
  126. data/website/static/1.13/2019/03/31/graphiti-1-0.html +205 -0
  127. data/website/static/1.13/2019/05/08/graphiti-1-1.html +212 -0
  128. data/website/static/1.13/2019/05/20/graphiti-1-2.html +214 -0
  129. data/website/static/1.13/2019/10/14/tutorial.html +198 -0
  130. data/website/static/1.13/CNAME +1 -0
  131. data/website/static/1.13/README.md +16 -0
  132. data/website/static/1.13/assets/css/syntax.css +60 -0
  133. data/website/static/1.13/assets/favicons/android-chrome-192x192.png +0 -0
  134. data/website/static/1.13/assets/favicons/android-chrome-256x256.png +0 -0
  135. data/website/static/1.13/assets/favicons/apple-touch-icon.png +0 -0
  136. data/website/static/1.13/assets/favicons/browserconfig.xml +9 -0
  137. data/website/static/1.13/assets/favicons/favicon-16x16.png +0 -0
  138. data/website/static/1.13/assets/favicons/favicon-32x32.png +0 -0
  139. data/website/static/1.13/assets/favicons/favicon.ico +0 -0
  140. data/website/static/1.13/assets/favicons/mstile-150x150.png +0 -0
  141. data/website/static/1.13/assets/favicons/safari-pinned-tab.svg +1 -0
  142. data/website/static/1.13/assets/favicons/site.webmanifest +19 -0
  143. data/website/static/1.13/assets/img/backend.gif +0 -0
  144. data/website/static/1.13/assets/img/conformity.png +0 -0
  145. data/website/static/1.13/assets/img/error_payload.png +0 -0
  146. data/website/static/1.13/assets/img/gh.png +0 -0
  147. data/website/static/1.13/assets/img/lifecycle.gif +0 -0
  148. data/website/static/1.13/assets/img/logo-500.png +0 -0
  149. data/website/static/1.13/assets/img/logo.png +0 -0
  150. data/website/static/1.13/assets/img/love-graffiti.jpg +0 -0
  151. data/website/static/1.13/assets/img/meta_total_count.png +0 -0
  152. data/website/static/1.13/assets/img/persist.jpg +0 -0
  153. data/website/static/1.13/assets/img/resource.gif +0 -0
  154. data/website/static/1.13/assets/img/rest-graffiti.jpg +0 -0
  155. data/website/static/1.13/assets/img/rest1.gif +0 -0
  156. data/website/static/1.13/assets/img/rest2.gif +0 -0
  157. data/website/static/1.13/assets/img/rest3.gif +0 -0
  158. data/website/static/1.13/assets/img/rethink-rest-graffiti.jpg +0 -0
  159. data/website/static/1.13/assets/img/why.png +0 -0
  160. data/website/static/1.13/assets/js/highlight.pack.js +2 -0
  161. data/website/static/1.13/assets/main.css +15518 -0
  162. data/website/static/1.13/assets/main.css.map +1 -0
  163. data/website/static/1.13/bin/bundle +109 -0
  164. data/website/static/1.13/bin/jekyll +27 -0
  165. data/website/static/1.13/bin/kramdown +27 -0
  166. data/website/static/1.13/bin/listen +27 -0
  167. data/website/static/1.13/bin/rake +27 -0
  168. data/website/static/1.13/bin/rougify +27 -0
  169. data/website/static/1.13/bin/safe_yaml +27 -0
  170. data/website/static/1.13/bin/sass +27 -0
  171. data/website/static/1.13/bin/sass-convert +27 -0
  172. data/website/static/1.13/bin/scss +27 -0
  173. data/website/static/1.13/blog.html +259 -0
  174. data/website/static/1.13/cheatsheet.html +316 -0
  175. data/website/static/1.13/cookbooks/authorization.md +0 -0
  176. data/website/static/1.13/cookbooks/caching.md +0 -0
  177. data/website/static/1.13/cookbooks/customizing-sideloads.html +325 -0
  178. data/website/static/1.13/cookbooks/etags.md +0 -0
  179. data/website/static/1.13/cookbooks/hopping-relationships.html +324 -0
  180. data/website/static/1.13/cookbooks/json_attributes.md +0 -0
  181. data/website/static/1.13/cookbooks/openstruct-models.md +0 -0
  182. data/website/static/1.13/cookbooks/remote-resources.md +0 -0
  183. data/website/static/1.13/cookbooks/without-activerecord.html +510 -0
  184. data/website/static/1.13/features.html +249 -0
  185. data/website/static/1.13/feed.xml +106 -0
  186. data/website/static/1.13/guides/concepts/backends-and-models.html +467 -0
  187. data/website/static/1.13/guides/concepts/debugging.html +440 -0
  188. data/website/static/1.13/guides/concepts/endpoints.html +432 -0
  189. data/website/static/1.13/guides/concepts/error-handling.html +396 -0
  190. data/website/static/1.13/guides/concepts/links.html +501 -0
  191. data/website/static/1.13/guides/concepts/remote-resources.html +536 -0
  192. data/website/static/1.13/guides/concepts/resources.html +2176 -0
  193. data/website/static/1.13/guides/concepts/testing.html +1469 -0
  194. data/website/static/1.13/guides/getting-started/installation.html +420 -0
  195. data/website/static/1.13/guides/graphiti-rails-migration.html +242 -0
  196. data/website/static/1.13/guides/index.html +269 -0
  197. data/website/static/1.13/guides/overview.html +325 -0
  198. data/website/static/1.13/guides/upgrading-2-0.html +193 -0
  199. data/website/static/1.13/guides/upgrading.html +314 -0
  200. data/website/static/1.13/guides/vandal.html +282 -0
  201. data/website/static/1.13/guides/why.html +1121 -0
  202. data/website/static/1.13/index.html +72 -0
  203. data/website/static/1.13/js/authentication.html +295 -0
  204. data/website/static/1.13/js/ddau.html +238 -0
  205. data/website/static/1.13/js/extra-params.html +270 -0
  206. data/website/static/1.13/js/index.html +321 -0
  207. data/website/static/1.13/js/installation.html +637 -0
  208. data/website/static/1.13/js/introduction.html +257 -0
  209. data/website/static/1.13/js/middleware.html +318 -0
  210. data/website/static/1.13/js/reads/fieldsets.html +271 -0
  211. data/website/static/1.13/js/reads/filtering.html +289 -0
  212. data/website/static/1.13/js/reads/includes.html +260 -0
  213. data/website/static/1.13/js/reads/index.html +497 -0
  214. data/website/static/1.13/js/reads/nested-queries.html +353 -0
  215. data/website/static/1.13/js/reads/pagination.html +260 -0
  216. data/website/static/1.13/js/reads/sorting.html +265 -0
  217. data/website/static/1.13/js/reads/statistics.html +289 -0
  218. data/website/static/1.13/js/state-syncing.html +340 -0
  219. data/website/static/1.13/js/writes/deferred.html +296 -0
  220. data/website/static/1.13/js/writes/dirty-tracking.html +399 -0
  221. data/website/static/1.13/js/writes/index.html +391 -0
  222. data/website/static/1.13/js/writes/nested.html +330 -0
  223. data/website/static/1.13/js/writes/validations.html +272 -0
  224. data/website/static/1.13/quickstart.html +660 -0
  225. data/website/static/1.13/template +161 -0
  226. data/website/static/1.13/tutorial/index.html +250 -0
  227. data/website/static/1.13/tutorial/step_0.html +292 -0
  228. data/website/static/1.13/tutorial/step_1.html +517 -0
  229. data/website/static/1.13/tutorial/step_2.html +481 -0
  230. data/website/static/1.13/tutorial/step_3.html +323 -0
  231. data/website/static/1.13/tutorial/step_4.html +318 -0
  232. data/website/static/1.13/tutorial/step_5.html +265 -0
  233. data/website/static/1.13/tutorial/step_6.html +276 -0
  234. data/website/static/1.13/tutorial/step_7.html +390 -0
  235. data/website/static/1.13/tutorial/step_8.html +316 -0
  236. data/website/static/1.13/tutorial/step_9.html +365 -0
  237. data/website/static/assets/img/error_payload.png +0 -0
  238. data/website/static/assets/img/legacy/legacy-0378a3bb39.png +0 -0
  239. data/website/static/assets/img/legacy/legacy-05bbd3e5fd.png +0 -0
  240. data/website/static/assets/img/legacy/legacy-07aa104495.png +0 -0
  241. data/website/static/assets/img/legacy/legacy-0c75a16b3a.gif +0 -0
  242. data/website/static/assets/img/legacy/legacy-3076df6209.png +0 -0
  243. data/website/static/assets/img/legacy/legacy-7f6889bc89.png +0 -0
  244. data/website/static/assets/img/legacy/legacy-a2cc4363c3.png +0 -0
  245. data/website/static/assets/img/legacy/legacy-f67cfa89ab.png +0 -0
  246. data/website/static/assets/img/meta_total_count.png +0 -0
  247. data/website/static/img/docusaurus-social-card.jpg +0 -0
  248. data/website/static/img/docusaurus.png +0 -0
  249. data/website/static/img/favicon.ico +0 -0
  250. data/website/static/img/logo.png +0 -0
  251. data/website/static/img/logo.svg +1 -0
  252. data/website/static/img/undraw_docusaurus_mountain.svg +171 -0
  253. data/website/static/img/undraw_docusaurus_react.svg +170 -0
  254. data/website/static/img/undraw_docusaurus_tree.svg +40 -0
  255. metadata +245 -46
  256. data/gemfiles/rails_6.gemfile +0 -18
  257. data/gemfiles/rails_6_graphiti_rails.gemfile +0 -19
  258. data/gemfiles/rails_7.gemfile +0 -18
  259. data/gemfiles/rails_7_1_graphiti_rails.gemfile +0 -19
  260. data/gemfiles/rails_7_graphiti_rails.gemfile +0 -19
  261. data/lib/graphiti/railtie.rb +0 -121
  262. /data/{deprecated_generators → lib/generators}/graphiti/resource_test_generator.rb +0 -0
  263. /data/{deprecated_generators → lib/generators}/graphiti/templates/application_resource.rb.erb +0 -0
  264. /data/{deprecated_generators → lib/generators}/graphiti/templates/controller.rb.erb +0 -0
  265. /data/{deprecated_generators → lib/generators}/graphiti/templates/create_request_spec.rb.erb +0 -0
  266. /data/{deprecated_generators → lib/generators}/graphiti/templates/destroy_request_spec.rb.erb +0 -0
  267. /data/{deprecated_generators → lib/generators}/graphiti/templates/resource.rb.erb +0 -0
  268. /data/{deprecated_generators → lib/generators}/graphiti/templates/resource_writes_spec.rb.erb +0 -0
  269. /data/{deprecated_generators → lib/generators}/graphiti/templates/update_request_spec.rb.erb +0 -0
data/website/static/1.13/js/reads/index.html ADDED
@@ -0,0 +1,497 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="utf-8">
6
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
7
+ <meta name="viewport" content="width=device-width, initial-scale=1">
8
+ <link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">
9
+ <link href="https://fonts.googleapis.com/css?family=Boogaloo" rel="stylesheet">
10
+
11
+ <link rel="apple-touch-icon" sizes="180x180" href="/1.13/assets/favicons/apple-touch-icon.png">
12
+ <link rel="icon" type="image/png" sizes="32x32" href="/1.13/assets/favicons/favicon-32x32.png">
13
+ <link rel="icon" type="image/png" sizes="16x16" href="/1.13/assets/favicons/favicon-16x16.png">
14
+ <link rel="manifest" href="/1.13/assets/favicons/site.webmanifest">
15
+ <link rel="mask-icon" href="/1.13/assets/favicons/safari-pinned-tab.svg" color="#F86DA7">
16
+ <link rel="shortcut icon" href="/1.13/assets/favicons/favicon.ico">
17
+ <meta name="msapplication-TileColor" content="#F86DA7">
18
+ <meta name="msapplication-config" content="/1.13/assets/favicons/browserconfig.xml">
19
+ <meta name="theme-color" content="#F86DA7">
20
+
21
+ <title>Graphiti</title>
22
+ <meta name="description" content="Stylish Graph APIs">
23
+
24
+ <link rel="stylesheet" href="/1.13/assets/main.css?ref=wh4t3v45">
25
+ <link rel="alternate" type="application/rss+xml" title="Graphiti" href="/1.13/feed.xml">
26
+
27
+ <!-- Global site tag (gtag.js) - Google Analytics -->
28
+ <script async src="https://www.googletagmanager.com/gtag/js?id=UA-127904727-1"></script>
29
+ <script>
30
+ window.dataLayer = window.dataLayer || [];
31
+ function gtag(){dataLayer.push(arguments);}
32
+ gtag('js', new Date());
33
+
34
+ gtag('config', 'UA-127904727-1');
35
+ </script>
36
+
37
+ <!-- javascript -->
38
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
39
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
40
+
41
+
42
+ </head>
43
+
44
+
45
+ <body>
46
+ <main class="page-content" aria-label="Content">
47
+ <div class="wrapper">
48
+ <header class="navbar navbar-inverse normal" role="banner">
49
+ <div class="container">
50
+ <div class="navbar-header">
51
+ <a href="/1.13/1.13" class="navbar-brand">
52
+ <img alt="logo" src="/1.13/assets/img/logo.png">
53
+ </a>
54
+ </div>
55
+ <nav class="" role="navigation">
56
+ <ul class="nav navbar-nav nav-links">
57
+ <li>
58
+ <a class="quickstart nav-link" href="/1.13/quickstart">Quickstart</a>
59
+ </li>
60
+ <li>
61
+ <a class="guides nav-link" href="/1.13/guides">Guides</a>
62
+ </li>
63
+ <li>
64
+ <a class="tutorial nav-link" href="/1.13/tutorial">Tutorial</a>
65
+ </li>
66
+ <li>
67
+ <a class="spraypaint nav-link" href="/1.13/js">Spraypaint</a>
68
+ </li>
69
+ </ul>
70
+ <ul class="nav gh navbar-nav navbar-right visible-lg visible-md">
71
+ <li>
72
+ <span class="star">⭐</span>
73
+ <a href="https://github.com/graphiti-api/graphiti">
74
+ <img alt="github-star" style="margin-right: 65px;margin-top: -20px" src="/1.13/assets/img/gh.png">
75
+ </a>
76
+ </li>
77
+ </ul>
78
+ </nav>
79
+ </div>
80
+ </header>
81
+
82
+ <div class="container">
83
+ <h1>
84
+ Spraypaint
85
+ <small>the isomorphic, framework-agnostic Graphiti ORM</small>
86
+ </h1>
87
+
88
+ <div class="js-toc col-md-3">
89
+ <ul>
90
+ <li><a href="/1.13/js/index">Home</a></li>
91
+ <li><a href="/1.13/js/introduction">Introduction</a></li>
92
+ <li><a href="/1.13/js/installation">Installation</a>
93
+ <ul>
94
+ <li><a href="/1.13/js/installation#typescript">Typescript</a></li>
95
+ <li><a href="/1.13/js/installation#defining-models">Defining Models</a></li>
96
+ <li><a href="/1.13/js/installation#connecting-to-the-api">Connecting to the API</a></li>
97
+ <li><a href="/1.13/js/installation#defining-attributes">Defining Attributes</a></li>
98
+ <li><a href="/1.13/js/installation#defining-relationships">Defining Relationships</a></li>
99
+ </ul>
100
+ </li>
101
+ <li><a href="/1.13/js/reads">Reads</a>
102
+ <ul>
103
+ <li><a href="/1.13/js/reads/sorting">Sorting</a></li>
104
+ <li><a href="/1.13/js/reads/pagination">Pagination</a></li>
105
+ <li><a href="/1.13/js/reads/filtering">Filtering</a></li>
106
+ <li><a href="/1.13/js/reads/fieldsets">Fieldsets</a></li>
107
+ <li><a href="/1.13/js/reads/statistics">Statistics</a></li>
108
+ <li><a href="/1.13/js/reads/includes">Includes</a></li>
109
+ <li><a href="/1.13/js/reads/nested-queries">Nested Queries</a></li>
110
+ </ul>
111
+ </li>
112
+ <li><a href="/1.13/js/writes">Writes</a>
113
+ <ul>
114
+ <li><a href="/1.13/js/writes/validations">Validations</a></li>
115
+ <li><a href="/1.13/js/writes/dirty-tracking">Dirty Tracking</a></li>
116
+ <li><a href="/1.13/js/writes/nested">Nested Writes</a></li>
117
+ <li><a href="/1.13/js/writes/deferred">Deferred Action</a></li>
118
+ </ul>
119
+ </li>
120
+ <li><a href="/1.13/js/middleware">Middleware</a></li>
121
+ <li><a href="/1.13/js/authentication">Authentication</a></li>
122
+ <li><a href="/1.13/js/state-syncing">State Syncing</a></li>
123
+ <li><a href="/1.13/js/ddau">Data Down, Actions Up</a></li>
124
+ <li><a href="/1.13/js/extra-params">Extra params</a></li>
125
+ </ul>
126
+ </div>
127
+
128
+ <div class="col-md-8 col-md-offset-1">
129
+ <h3 id="reads">Reads</h3>
130
+
131
+ <p>The interface for read operations is a simpler version of the
132
+ <a href="http://guides.rubyonrails.org/active_record_querying.html">ActiveRecord Query Interface</a>.
133
+ Instead of generating SQL, we’ll be generating JSONAPI requests.</p>
134
+
135
+ <h3 id="basic-finders">Basic Finders</h3>
136
+
137
+ <p>Execute queries with <code class="language-plaintext highlighter-rouge">.all()</code>, <code class="language-plaintext highlighter-rouge">find()</code>, or <code class="language-plaintext highlighter-rouge">.first()</code>:</p>
138
+
139
+ <div class="tabs">
140
+ <div class="tab typescript active">
141
+ <span>Typescript</span>
142
+ </div>
143
+ <div class="tab javascript">
144
+ <span>Javascript</span>
145
+ </div>
146
+ </div>
147
+
148
+ <div class="code-tabs">
149
+
150
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">let</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span>
151
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// array of Post instances</span>
152
+ </code></pre></figure>
153
+
154
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">().</span><span class="nf">then</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span> <span class="p">{</span>
155
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// array of Post instances</span>
156
+ <span class="p">});</span>
157
+ </code></pre></figure>
158
+
159
+ </div>
160
+ <blockquote class="url">
161
+ <p>GET /posts</p>
162
+ </blockquote>
163
+
164
+ <div class="tabs">
165
+ <div class="tab typescript active">
166
+ <span>Typescript</span>
167
+ </div>
168
+ <div class="tab javascript">
169
+ <span>Javascript</span>
170
+ </div>
171
+ </div>
172
+
173
+ <div class="code-tabs">
174
+
175
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">let</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">find</span><span class="p">(</span><span class="mi">123</span><span class="p">)</span>
176
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// Post instance</span>
177
+ </code></pre></figure>
178
+
179
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="nx">Post</span><span class="p">.</span><span class="nf">find</span><span class="p">(</span><span class="mi">123</span><span class="p">).</span><span class="nf">then</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span> <span class="p">{</span>
180
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// Post instance</span>
181
+ <span class="p">});</span>
182
+ </code></pre></figure>
183
+
184
+ </div>
185
+ <blockquote class="url">
186
+ <p>GET /posts/123</p>
187
+ </blockquote>
188
+
189
+ <div class="tabs">
190
+ <div class="tab typescript active">
191
+ <span>Typescript</span>
192
+ </div>
193
+ <div class="tab javascript">
194
+ <span>Javascript</span>
195
+ </div>
196
+ </div>
197
+
198
+ <div class="code-tabs">
199
+
200
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">let</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">first</span><span class="p">()</span>
201
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// Post instance</span>
202
+ </code></pre></figure>
203
+
204
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="nx">Post</span><span class="p">.</span><span class="nf">first</span><span class="p">().</span><span class="nf">then</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span> <span class="p">{</span>
205
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// Post instance</span>
206
+ <span class="p">});</span>
207
+ </code></pre></figure>
208
+
209
+ </div>
210
+ <blockquote class="url">
211
+ <p>GET /posts?page[size]=1</p>
212
+ </blockquote>
213
+
214
+ <h3 id="composable-queries-with-scopes">Composable Queries with Scopes</h3>
215
+
216
+ <p>The beauty of ORMs is their ability to compose queries. We’ll be doing
217
+ this by chaining together <code class="language-plaintext highlighter-rouge">Scope</code>s (query fragments). All of the methods
218
+ you see on this page can be chained together - the request will not fire
219
+ until the chain ends with <code class="language-plaintext highlighter-rouge">all()</code>, <code class="language-plaintext highlighter-rouge">first()</code>, or <code class="language-plaintext highlighter-rouge">find</code>. Example:</p>
220
+
221
+ <div class="tabs">
222
+ <div class="tab typescript active">
223
+ <span>Typescript</span>
224
+ </div>
225
+ <div class="tab javascript">
226
+ <span>Javascript</span>
227
+ </div>
228
+ </div>
229
+
230
+ <div class="code-tabs">
231
+
232
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">let</span> <span class="nx">scope</span> <span class="o">=</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">order</span><span class="p">({</span> <span class="na">name</span><span class="p">:</span> <span class="dl">"</span><span class="s2">desc</span><span class="dl">"</span> <span class="p">})</span>
233
+
234
+ <span class="k">if </span><span class="p">(</span><span class="nx">someCheckboxIsChecked</span><span class="p">)</span> <span class="p">{</span>
235
+ <span class="nx">scope</span> <span class="o">=</span> <span class="nx">scope</span><span class="p">.</span><span class="nf">where</span><span class="p">({</span> <span class="na">important</span><span class="p">:</span> <span class="kc">true</span> <span class="p">})</span>
236
+ <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
237
+ <span class="nx">scope</span> <span class="o">=</span> <span class="nx">scope</span><span class="p">.</span><span class="nf">where</span><span class="p">({</span> <span class="na">important</span><span class="p">:</span> <span class="kc">false</span> <span class="p">})</span>
238
+ <span class="p">}</span>
239
+
240
+ <span class="nx">scope</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span> <span class="c1">// request fires</span>
241
+ </code></pre></figure>
242
+
243
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="kd">var</span> <span class="nx">scope</span> <span class="o">=</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">order</span><span class="p">({</span> <span class="na">name</span><span class="p">:</span> <span class="dl">"</span><span class="s2">desc</span><span class="dl">"</span> <span class="p">});</span>
244
+
245
+ <span class="k">if </span><span class="p">(</span><span class="nx">someCheckboxIsChecked</span><span class="p">)</span> <span class="p">{</span>
246
+ <span class="nx">scope</span> <span class="o">=</span> <span class="nx">scope</span><span class="p">.</span><span class="nf">where</span><span class="p">({</span> <span class="na">important</span><span class="p">:</span> <span class="kc">true</span> <span class="p">});</span>
247
+ <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
248
+ <span class="nx">scope</span> <span class="o">=</span> <span class="nx">scope</span><span class="p">.</span><span class="nf">where</span><span class="p">({</span> <span class="na">important</span><span class="p">:</span> <span class="kc">false</span> <span class="p">});</span>
249
+ <span class="p">}</span>
250
+
251
+ <span class="nx">scope</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span> <span class="c1">// request fires</span>
252
+ </code></pre></figure>
253
+
254
+ </div>
255
+ <blockquote class="url">
256
+ <p>/posts?sort=-name&amp;filter[important]=true</p>
257
+ <p>/posts?sort=-name&amp;filter[important]=false</p>
258
+ </blockquote>
259
+
260
+ <p>In practice, you’ll probably have some scopes you want to re-use across
261
+ different contexts. A best practice is to store these scopes as class
262
+ methods (static methods) in the model:</p>
263
+
264
+ <div class="tabs">
265
+ <div class="tab typescript active">
266
+ <span>Typescript</span>
267
+ </div>
268
+ <div class="tab javascript">
269
+ <span>Javascript</span>
270
+ </div>
271
+ </div>
272
+
273
+ <div class="code-tabs">
274
+
275
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">class</span> <span class="nc">Post</span> <span class="kd">extends</span> <span class="nc">ApplicationRecord</span> <span class="p">{</span>
276
+ <span class="c1">// ... code ...</span>
277
+ <span class="k">static</span> <span class="nf">superImportant</span><span class="p">()</span> <span class="p">{</span>
278
+ <span class="k">return</span> <span class="k">this</span>
279
+ <span class="p">.</span><span class="nf">where</span><span class="p">({</span> <span class="na">ranking_gt</span><span class="p">:</span> <span class="mi">8</span> <span class="p">})</span>
280
+ <span class="p">.</span><span class="nf">order</span><span class="p">({</span> <span class="na">ranking</span><span class="p">:</span> <span class="dl">'</span><span class="s1">desc</span><span class="dl">'</span> <span class="p">})</span>
281
+ <span class="p">.</span><span class="nf">stats</span><span class="p">({</span> <span class="nx">total</span> <span class="dl">'</span><span class="s1">count</span><span class="dl">'</span> <span class="p">})</span>
282
+ <span class="p">}</span>
283
+ <span class="p">}</span>
284
+
285
+ <span class="c1">// get 10 super important posts</span>
286
+ <span class="kd">let</span> <span class="nx">scope</span> <span class="o">=</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">superImportant</span><span class="p">().</span><span class="nf">per</span><span class="p">(</span><span class="mi">10</span><span class="p">)</span>
287
+ <span class="nx">scope</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span> <span class="c1">// fire query</span>
288
+ </code></pre></figure>
289
+
290
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="kd">const</span> <span class="nx">Post</span> <span class="o">=</span> <span class="nx">ApplicationRecord</span><span class="p">.</span><span class="nf">extend</span><span class="p">({</span>
291
+ <span class="c1">// ... code ...</span>
292
+ <span class="na">static</span><span class="p">:</span> <span class="p">{</span>
293
+ <span class="nf">superImportant</span><span class="p">()</span> <span class="p">{</span>
294
+ <span class="k">return</span> <span class="k">this</span>
295
+ <span class="p">.</span><span class="nf">where</span><span class="p">({</span> <span class="na">ranking_gt</span><span class="p">:</span> <span class="mi">8</span> <span class="p">})</span>
296
+ <span class="p">.</span><span class="nf">order</span><span class="p">({</span> <span class="na">ranking</span><span class="p">:</span> <span class="dl">'</span><span class="s1">desc</span><span class="dl">'</span> <span class="p">})</span>
297
+ <span class="p">.</span><span class="nf">stats</span><span class="p">({</span> <span class="nx">total</span> <span class="dl">'</span><span class="s1">count</span><span class="dl">'</span> <span class="p">})</span>
298
+ <span class="p">}</span>
299
+ <span class="p">}</span>
300
+ <span class="p">})</span>
301
+
302
+ <span class="c1">// get 10 super important posts</span>
303
+ <span class="kd">var</span> <span class="nx">scope</span> <span class="o">=</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">superImportant</span><span class="p">().</span><span class="nf">per</span><span class="p">(</span><span class="mi">10</span><span class="p">);</span>
304
+ <span class="nx">scope</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span> <span class="c1">// fire query</span>
305
+ </code></pre></figure>
306
+
307
+ </div>
308
+ <blockquote class="url">
309
+ <p>/posts?sort=-ranking&amp;stats[total]=count&amp;page[size]=10&amp;filter[ranking_gt]=8</p>
310
+ </blockquote>
311
+
312
+ <h3 id="metadata">Metadata</h3>
313
+
314
+ <p>The <a href="http://jsonapi.org/format/#document-meta">meta information</a> of the
315
+ JSONAPI response is available as a POJO on the response:</p>
316
+
317
+ <div class="tabs">
318
+ <div class="tab typescript active">
319
+ <span>Typescript</span>
320
+ </div>
321
+ <div class="tab javascript">
322
+ <span>Javascript</span>
323
+ </div>
324
+ </div>
325
+
326
+ <div class="code-tabs">
327
+
328
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">let</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span>
329
+ <span class="nx">response</span><span class="p">.</span><span class="nx">meta</span> <span class="c1">// { stats: { total: { count: 100 } } }</span>
330
+ </code></pre></figure>
331
+
332
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">().</span><span class="nf">then</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span> <span class="p">{</span>
333
+ <span class="nx">response</span><span class="p">.</span><span class="nx">meta</span> <span class="c1">// { stats: { total: { count: 100 } } }</span>
334
+ <span class="p">})</span>
335
+ </code></pre></figure>
336
+
337
+ </div>
338
+
339
+ <h3 id="promises-and-asyncawait">Promises and Async/Await</h3>
340
+
341
+ <p>The result of <code class="language-plaintext highlighter-rouge">all()</code>, <code class="language-plaintext highlighter-rouge">first()</code> or <code class="language-plaintext highlighter-rouge">find</code> is a <a href="https://developers.google.com/web/fundamentals/primers/promises">Promise</a>. The promise will resolve to a <code class="language-plaintext highlighter-rouge">Response</code> object.</p>
342
+
343
+ <p>A <code class="language-plaintext highlighter-rouge">Response</code> object has three keys - <code class="language-plaintext highlighter-rouge">data</code>, <code class="language-plaintext highlighter-rouge">meta</code>, and <code class="language-plaintext highlighter-rouge">raw</code>. <code class="language-plaintext highlighter-rouge">data</code> - the one
344
+ you’ll be using the most - will be a <code class="language-plaintext highlighter-rouge">Model</code> instance (or array of
345
+ <code class="language-plaintext highlighter-rouge">Model</code>) instances. <code class="language-plaintext highlighter-rouge">meta</code> will be the <a href="http://jsonapi.org/format/#document-meta">Meta Information</a> returned by the API (mostly used for statistics in our case). <code class="language-plaintext highlighter-rouge">raw</code> is only used to introspect the raw response document.</p>
346
+
347
+ <div class="tabs">
348
+ <div class="tab typescript active">
349
+ <span>Typescript</span>
350
+ </div>
351
+ <div class="tab javascript">
352
+ <span>Javascript</span>
353
+ </div>
354
+ </div>
355
+
356
+ <div class="code-tabs">
357
+
358
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">().</span><span class="nf">then</span><span class="p">((</span><span class="nx">response</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span>
359
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// array of Post instances</span>
360
+ <span class="nx">response</span><span class="p">.</span><span class="nx">meta</span> <span class="c1">// js object from the server</span>
361
+ <span class="nx">response</span><span class="p">.</span><span class="nx">raw</span> <span class="c1">// js response document</span>
362
+ <span class="p">})</span>
363
+ </code></pre></figure>
364
+
365
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">().</span><span class="nf">then</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span> <span class="p">{</span>
366
+ <span class="nx">response</span><span class="p">.</span><span class="nx">data</span> <span class="c1">// array of Post instances</span>
367
+ <span class="nx">response</span><span class="p">.</span><span class="nx">meta</span> <span class="c1">// js object from the server</span>
368
+ <span class="nx">response</span><span class="p">.</span><span class="nx">raw</span> <span class="c1">// js response document</span>
369
+ <span class="p">});</span>
370
+ </code></pre></figure>
371
+
372
+ </div>
373
+ <blockquote class="url">
374
+ <p>/posts</p>
375
+ </blockquote>
376
+
377
+ <p>Hopefully you’re running in an environment that supports
378
+ ES7’s <a href="https://hackernoon.com/6-reasons-why-javascripts-async-await-blows-promises-away-tutorial-c7ec10518dd9">Async/Await</a>. This makes things even easier:</p>
379
+
380
+ <figure class="highlight"><pre><code class="language-typescript" data-lang="typescript"><span class="kd">let</span> <span class="p">{</span> <span class="nx">data</span> <span class="p">}</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">()</span>
381
+ <span class="nx">data</span> <span class="c1">// array of Post instances</span>
382
+
383
+ <span class="c1">// alternatively</span>
384
+
385
+ <span class="kd">let</span> <span class="nx">posts</span> <span class="o">=</span> <span class="p">(</span><span class="k">await</span> <span class="nx">Post</span><span class="p">.</span><span class="nf">all</span><span class="p">()).</span><span class="nx">data</span>
386
+ <span class="nx">posts</span> <span class="c1">// array of Post instances</span></code></pre></figure>
387
+
388
+ <blockquote class="url">
389
+ <p>/posts</p>
390
+ </blockquote>
391
+
392
+ <div class="clearfix">
393
+ <h2 id="next">
394
+ <a href="/1.13/js/reads/sorting">
395
+ NEXT:
396
+ <small>Sorting</small>
397
+ &raquo;
398
+ </a>
399
+ </h2>
400
+ </div>
401
+ </div>
402
+
403
+ </div>
404
+ </div>
405
+ </main>
406
+ <div class="main-footer main-footer--dark">
407
+ <div class="container">
408
+ <div class="row">
409
+ <div class="col-sm-4 menu">
410
+ <h3>Overview</h3>
411
+ <ul>
412
+ <li>
413
+ <a href="/1.13/quickstart">Quickstart</a>
414
+ </li>
415
+ <li>
416
+ <a href="/1.13/tutorial">Tutorial</a>
417
+ </li>
418
+ <li>
419
+ <a href="/1.13/guides">Guides</a>
420
+ </li>
421
+ </ul>
422
+ </div>
423
+ <div class="col-sm-4 menu">
424
+ <h3>Contact</h3>
425
+ <ul>
426
+ <li>
427
+ <a target="_blank" href="https://discord.gg/wgqkMBsSRV">Discord Chat</a>
428
+ </li>
429
+ <li>
430
+ <a href="mailto:richmolj@gmail.com">Email</a>
431
+ </li>
432
+ </ul>
433
+ </div>
434
+ <div class="col-sm-4 menu">
435
+ <h3>Related</h3>
436
+ <ul>
437
+ <li>
438
+ <a target="_blank" href="http://jsonapi.org">JSONAPI Spec</a>
439
+ </li>
440
+ <li>
441
+ <a target="_blank" href="http://jsonapi-rb.org">jsonapi-rb</a>
442
+ </li>
443
+ <li>
444
+ <a target="_blank" href="https://vuejs.org/">VueJS</a>
445
+ </li>
446
+ </ul>
447
+ </div>
448
+ </div>
449
+ </div>
450
+ </div>
451
+
452
+ <script type="text/javascript">
453
+ $(function () {
454
+
455
+ var flipTabs = function() {
456
+ var isTS = true;
457
+ if (localStorage.getItem('js-lang') === 'javascript') {
458
+ isTS = false;
459
+ }
460
+
461
+ $('.code-tabs').each(function(index, el) {
462
+ if (isTS) {
463
+ console.log('hiding js');
464
+ $($(el).children()[1]).hide();
465
+ $($(el).children()[0]).show();
466
+ } else {
467
+ console.log('hiding ts');
468
+ $($(el).children()[0]).hide();
469
+ $($(el).children()[1]).show();
470
+ }
471
+ });
472
+
473
+ if (isTS) {
474
+ $('.tab.typescript').addClass('active');
475
+ $('.tab.javascript').removeClass('active');
476
+ } else {
477
+ $('.tab.typescript').removeClass('active');
478
+ $('.tab.javascript').addClass('active');
479
+ }
480
+ }
481
+
482
+ $('.tab').click(function() {
483
+ if ($(this).hasClass('typescript')) {
484
+ localStorage.setItem('js-lang', 'typescript');
485
+ } else {
486
+ localStorage.setItem('js-lang', 'javascript');
487
+ }
488
+
489
+ flipTabs();
490
+ });
491
+
492
+ flipTabs();
493
+ })
494
+ </script>
495
+
496
+ </body>
497
+ </html>