Merge 79521f1 into d6a8993

.dockerignore

@@ -0,0 +1,2 @@
+*/node_modules
+*.log

.gitignore

@@ -2,3 +2,6 @@ node_modules
 build
 coverage
 .DS_Store
+website/build
+docs/api/**/*
+!docs/api/about-api-docs.md

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "workbench.colorCustomizations": {}
+}

Dockerfile

@@ -0,0 +1,10 @@
+FROM node:8.11.4
+
+WORKDIR /app/website
+
+EXPOSE 3000 35729
+COPY ./docs /app/docs
+COPY ./website /app/website
+RUN yarn install
+
+CMD ["yarn", "start"]

docker-compose.yml

@@ -0,0 +1,18 @@
+version: "3"
+
+services:
+  docusaurus:
+    build: .
+    ports:
+      - 3000:3000
+      - 35729:35729
+    volumes:
+      - ./docs:/app/docs
+      - ./website/blog:/app/website/blog
+      - ./website/core:/app/website/core
+      - ./website/i18n:/app/website/i18n
+      - ./website/pages:/app/website/pages
+      - ./website/static:/app/website/static
+      - ./website/sidebars.json:/app/website/sidebars.json
+      - ./website/siteConfig.js:/app/website/siteConfig.js
+    working_dir: /app/website

docs/TODO.md

@@ -0,0 +1,6 @@
+---
+id: todo
+title: TODO
+---
+
+This doc has not been created yet.

docs/api/about-api-docs.md

@@ -0,0 +1,111 @@
+---
+id: about-api-docs
+title: About API docs
+sidebar_label: About these docs
+---
+
+These docs are auto-generated by [`generate-api-docs.js`](../TODO.md) which generates the docs based on the ambient typings files within the repository (the `*.d.ts` files). [See below for more info.](#how-these-docs-work)
+
+If you are using an editor that uses the typescript language service (e.g. vs-code, visual studio, webstorm/intelliJ), then you should be able to hover over the definitions within your editor to get the same documentation.
+
+TODO: add screenshot of typings in editors
+
+Please open any issues if you find any within these docs. Open pull requests modifying the `*.d.ts` files.
+
+## How these docs work
+
+These docs work by parsing the ambient typings files (`*.d.ts`) files in `/src` and turning them into markdown files (`*.md`).
+
+This works by using the typescript API (i.e. `const ts = require('typescript');`) to parse the ambient typings for JS doc comments, interfaces, and other code.
+
+The generator will only pick up code that is commented with a JSDoc comment that contains the `@docs` directive.
+
+```ts
+//    this comment must be a JSDoc comment
+// 👇 (which is more than a multi-line comment)
+/**
+ * @docs Title of `module`
+ *
+ * Description of module. You can also put _markdown_ in **here**
+ */
+function myModule(x: number): string;
+```
+
+This will generate the following document:
+
+---
+
+#### Title of `module`
+
+Description of module. You can also put _markdown_ in **here**
+
+```ts
+function module(x: number): string;
+```
+
+---
+
+## Generating tables for `interface`s
+
+When you put the `@docs` directive above an interface, the generator will go through all the property declarations and generate a table.
+
+```ts
+/**
+ * @docs `ExampleModule`
+ *
+ * This is a description of `ExampleModule`
+ */
+interface ExampleModule {
+  /**
+   * This is the description of foo.
+   */
+  foo: string;
+  /**
+   * This is the description of bar.
+   */
+  bar?: number;
+}
+```
+
+---
+
+#### `ExampleModule`
+
+This is a description of `ExampleModule`
+
+| Name | Description                     | Type                | Required |
+| ---- | ------------------------------- | ------------------- | -------- |
+| foo  | This is the description of foo. | <code>string</code> | yes      |
+| bar  | This is the description of bar. | <code>number</code> | no       |
+
+---
+
+## Other code behavior
+
+When the generator sees the `@docs` directive in a JSDoc comment before anything else that isn't an `interface`, it will simply take the declaration and wrap it in a code block with one difference—it will remove the generics from the types (e.g. `<T>`).
+
+Why? Non-TS users are confused by generics. Simply removing the generics declaration (i.e. the stuff between the `<>`s) fixes the readability issue while also keeping the generics there.
+
+For example, see the input code block vs the output code block.
+
+Input:
+
+```ts
+export function myModule<Foo, Bar, Args extends any[], Result>(
+  ...args: Args
+): {
+  foo: Foo;
+  bar: (bar: Bar) => Result;
+};
+```
+
+Output (more readable to JS users):
+
+```ts
+function myModule(
+  ...args: Args
+): {
+  foo: Foo;
+  bar: (bar: Bar) => Result;
+};
+```

docs/doc1.md

@@ -0,0 +1,29 @@
+---
+id: doc1
+title: Latin-ish
+sidebar_label: Example Page
+---
+
+Check the [documentation](https://docusaurus.io) for how to use Docusaurus.
+
+## Lorem
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus elementum massa eget nulla aliquet sagittis. Proin odio tortor, vulputate ut odio in, ultrices ultricies augue. Cras ornare ultrices lorem malesuada iaculis. Etiam sit amet libero tempor, pulvinar mauris sed, sollicitudin sapien.
+
+## Mauris In Code
+
+```
+Mauris vestibulum ullamcorper nibh, ut semper purus pulvinar ut. Donec volutpat orci sit amet mauris malesuada, non pulvinar augue aliquam. Vestibulum ultricies at urna ut suscipit. Morbi iaculis, erat at imperdiet semper, ipsum nulla sodales erat, eget tincidunt justo dui quis justo. Pellentesque dictum bibendum diam at aliquet. Sed pulvinar, dolor quis finibus ornare, eros odio facilisis erat, eu rhoncus nunc dui sed ex. Nunc gravida dui massa, sed ornare arcu tincidunt sit amet. Maecenas efficitur sapien neque, a laoreet libero feugiat ut.
+```
+
+## Nulla
+
+Nulla facilisi. Maecenas sodales nec purus eget posuere. Sed sapien quam, pretium a risus in, porttitor dapibus erat. Sed sit amet fringilla ipsum, eget iaculis augue. Integer sollicitudin tortor quis ultricies aliquam. Suspendisse fringilla nunc in tellus cursus, at placerat tellus scelerisque. Sed tempus elit a sollicitudin rhoncus. Nulla facilisi. Morbi nec dolor dolor. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras et aliquet lectus. Pellentesque sit amet eros nisi. Quisque ac sapien in sapien congue accumsan. Nullam in posuere ante. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin lacinia leo a nibh fringilla pharetra.
+
+## Orci
+
+Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin venenatis lectus dui, vel ultrices ante bibendum hendrerit. Aenean egestas feugiat dui id hendrerit. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur in tellus laoreet, eleifend nunc id, viverra leo. Proin vulputate non dolor vel vulputate. Curabitur pretium lobortis felis, sit amet finibus lorem suscipit ut. Sed non mollis risus. Duis sagittis, mi in euismod tincidunt, nunc mauris vestibulum urna, at euismod est elit quis erat. Phasellus accumsan vitae neque eu placerat. In elementum arcu nec tellus imperdiet, eget maximus nulla sodales. Curabitur eu sapien eget nisl sodales fermentum.
+
+## Phasellus
+
+Phasellus pulvinar ex id commodo imperdiet. Praesent odio nibh, sollicitudin sit amet faucibus id, placerat at metus. Donec vitae eros vitae tortor hendrerit finibus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque vitae purus dolor. Duis suscipit ac nulla et finibus. Phasellus ac sem sed dui dictum gravida. Phasellus eleifend vestibulum facilisis. Integer pharetra nec enim vitae mattis. Duis auctor, lectus quis condimentum bibendum, nunc dolor aliquam massa, id bibendum orci velit quis magna. Ut volutpat nulla nunc, sed interdum magna condimentum non. Sed urna metus, scelerisque vitae consectetur a, feugiat quis magna. Donec dignissim ornare nisl, eget tempor risus malesuada quis.

docs/doc2.md

@@ -0,0 +1,7 @@
+---
+id: doc2
+title: document number 2
+---
+
+This is a link to [another document.](doc3.md)  
+This is a link to an [external page.](http://www.example.com)

docs/doc3.md

@@ -0,0 +1,13 @@
+---
+id: doc3
+title: This is document number 3
+---
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ac euismod odio, eu consequat dui. Nullam molestie consectetur risus id imperdiet. Proin sodales ornare turpis, non mollis massa ultricies id. Nam at nibh scelerisque, feugiat ante non, dapibus tortor. Vivamus volutpat diam quis tellus elementum bibendum. Praesent semper gravida velit quis aliquam. Etiam in cursus neque. Nam lectus ligula, malesuada et mauris a, bibendum faucibus mi. Phasellus ut interdum felis. Phasellus in odio pulvinar, porttitor urna eget, fringilla lectus. Aliquam sollicitudin est eros. Mauris consectetur quam vitae mauris interdum hendrerit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
+Duis et egestas libero, imperdiet faucibus ipsum. Sed posuere eget urna vel feugiat. Vivamus a arcu sagittis, fermentum urna dapibus, congue lectus. Fusce vulputate porttitor nisl, ac cursus elit volutpat vitae. Nullam vitae ipsum egestas, convallis quam non, porta nibh. Morbi gravida erat nec neque bibendum, eu pellentesque velit posuere. Fusce aliquam erat eu massa eleifend tristique.
+
+Sed consequat sollicitudin ipsum eget tempus. Integer a aliquet velit. In justo nibh, pellentesque non suscipit eget, gravida vel lacus. Donec odio ante, malesuada in massa quis, pharetra tristique ligula. Donec eros est, tristique eget finibus quis, semper non nisl. Vivamus et elit nec enim ornare placerat. Sed posuere odio a elit cursus sagittis.
+
+Phasellus feugiat purus eu tortor ultrices finibus. Ut libero nibh, lobortis et libero nec, dapibus posuere eros. Sed sagittis euismod justo at consectetur. Nulla finibus libero placerat, cursus sapien at, eleifend ligula. Vivamus elit nisl, hendrerit ac nibh eu, ultrices tempus dui. Nam tellus neque, commodo non rhoncus eu, gravida in risus. Nullam id iaculis tortor.
+
+Nullam at odio in sem varius tempor sit amet vel lorem. Etiam eu hendrerit nisl. Fusce nibh mauris, vulputate sit amet ex vitae, congue rhoncus nisl. Sed eget tellus purus. Nullam tempus commodo erat ut tristique. Cras accumsan massa sit amet justo consequat eleifend. Integer scelerisque vitae tellus id consectetur.

docs/exampledoc4.md

@@ -0,0 +1,6 @@
+---
+id: doc4
+title: Other Document
+---
+
+this is another document

docs/exampledoc5.md

@@ -0,0 +1,6 @@
+---
+id: doc5
+title: Fifth Document
+---
+
+Another one

docs/guides/context-fetches.md

@@ -0,0 +1,144 @@
+---
+id: context-fetches
+title: Context fetches
+sidebar_label: Context fetches
+---
+
+A "context fetch" is simply a fetch that is accessed via the React context.
+
+You can think of a context fetch as just a regular fetch that uses the built-in React context to get updates.
+
+<details>
+<summary>Long Technical Details</summary>
+
+React context is ideal for ["low frequency unlikely updates (like locale/theme)"](https://github.com/facebook/react/issues/14110#issuecomment-448074060) because it uses "tree walking" to get updates (vs Redux's subscription mechanism). In essence, this means you can pull data from context as desired at near zero-cost with no worries of "tearing" (i.e. inconsistent state due to different parts of the tree getting updates at different times).
+
+When we have app-wide fetches for app-wide data, it's ideal to use a context to grab the data from the fetch because these objects (e.g. the Sift configuration) may be used several times in one component (due to many custom hooks that use the config). If context is not used, then each use of the config would result in a Redux subscription.
+
+Subscription mechanisms require components to subscribe on mount and then unsubscribe on un-mount. Since Resift uses Redux subscriptions internally, that means any component that use `useFetch` adds a subscription to Redux. This is usually the ideal path for most fetches however there are cases where too many Redux subscriptions causes problems. Specifically has occurred when we unknowingly created a list 500+ Redux subscriptions by having items of a list use `useFetch`.
+
+Redux's subscriptions is implemented with a single-tiered/un-prioritized array of subscriptions. In the case of a list of react elements, each unsubscribe resulted in a `O(n)` operation for removing each subscription (due to [`Array.prototype.indexOf`](https://github.com/reduxjs/redux/blob/39cc043c55a770503bab3daf6026da5340923632/src/createStore.js#L153)) which overall resulted in an `O(n^2)` for un-mounting the whole list.
+
+React context's updates are not implemented with a subscription mechanism. Again, React context uses a "zero-subscription" tree walking algorithm to allow for zero-cost reads but at the cost of slow updates (relatively, compared to subscriptions).
+
+</details>
+
+**TL;DR** Use context fetches when you want to use the result of a fetch globally.
+
+When to use context fetches:
+
+- when you have data from a fetch that you want to use app-wide (e.g. themes, configurations, locales)
+- when this data doesn't change often (or at all)
+- when you want to use data in many custom hooks
+
+Good candidates for context fetches are:
+
+- app configurations (user, global, entity, settings)
+- authentication/current-logged-in-user
+- themes
+- locales
+
+When not to use context fetches:
+
+- when the data associated with the fetch is updated a lot
+- when the data in the fetch is only used in a few components that is only rendered a few times on screen
+
+## Usage
+
+Example config fetch:
+
+`configFetch.js`
+
+```js
+import { defineFetch } from 'resift';
+
+const makeConfigFetch = defineFetch({
+  displayName: 'Get Configuration',
+  make: () => ({
+    key: [],
+    request: () => ({ http }) =>
+      http({
+        method: 'GET',
+        route: '/configuration',
+      }),
+  }),
+});
+
+const configFetch = makeConfigFetch();
+
+export default configFetch;
+```
+
+Creating the config fetch:
+
+`useConfig.js`
+
+```js
+import configFetch from './configFetch';
+import { createContextFetch } from 'resift';
+
+const [ConfigProvider, useConfig] = createContextFetch(configFetch);
+
+export { ConfigProvider };
+export default useConfig;
+```
+
+Adding the provider:
+
+`App.js`
+
+```js
+import React, { useEffect } from 'react';
+import { useDispatch } from 'resift';
+import MyComponent from './MyComponent';
+import configFetch from './configFetch';
+import { ConfigProvider } from './useConfig';
+
+function App() {
+  const dispatch = useDispatch();
+
+  // NOTE: you still have to start dispatch a fetch yourself
+  // Context fetches just give you a new way to access the data from a fetch
+  useEffect(() => {
+    dispatch(configFetch());
+  }, [dispatch]);
+
+  return (
+    // this assumes you have the ReduxProvider above this component somewhere
+    <ConfigProvider>
+      <MyComponent />
+    </ConfigProvider>
+  );
+}
+```
+
+Using the config:
+
+`MyComponent.js`
+
+```js
+import React from 'react';
+import useConfig from './useConfig';
+
+function MyComponent() {
+  // just get the value
+  const config = useConfig();
+
+  // or get the status too
+  const [alsoConfig, status] = useConfig({ withStatus: true });
+
+  return <div>{config.displayName}</div>;
+}
+```
+
+And don't forget, you can use this value in a custom hook:
+
+```js
+export default function useFilters() {
+  const config = useConfig();
+  const params = useQuery();
+
+  // e.g.
+  return params.filter(param => config.fields.includes(param));
+}
+```

docs/guides/http-proxies.md

@@ -0,0 +1,7 @@
+---
+id: http-proxies
+title: HTTP proxies
+sidebar_label: HTTP proxies
+---
+
+This doc has not be created yet.

docs/guides/usage-with-redux.md

@@ -0,0 +1,7 @@
+---
+id: usage-with-redux
+title: Usage with Redux
+sidebar_label: Usage with Redux
+---
+
+This doc has not been created yet.

docs/guides/writing-fetch-services.md

@@ -0,0 +1,7 @@
+---
+id: writing-fetch-services
+title: Writing fetch services
+sidebar_label: Writing fetch services
+---
+
+This doc has not been completed yet