repos / starfx

commit

c18cc7e

parent

da71852

author

Eric Bower

date

2024-02-21 19:35:38 +0000 UTC

docs: cleanup

1@@ -1,3 +1,8 @@
2+fmt:
3+	go fmt ./...
4+	deno fmt
5+.PHONY: fmt
6+
7 clean:
8 	rm -rf ./public/*
9 	echo "" > ./public/.gitkeep

 1@@ -327,7 +327,7 @@ function deserializeComment(com: any): Comment {
 2   };
 3 }
 4 
 5-const schema = createSchema({
 6+const [schema, initialState] = createSchema({
 7   cache: slice.table(),
 8   loaders: slice.loader(),
 9   token: slice.str(),
10@@ -335,7 +335,7 @@ const schema = createSchema({
11   people: slice.table<Person>(),
12   comments: slice.table<Comment>(),
13 });
14-type WebState = typeof schema.initialState;
15+type WebState = typeof initialState;
16 
17 const api = createApi();
18 api.use(mdw.api());

 1@@ -51,14 +51,22 @@ In this example, we will fetch users from an API endpoint, cache the `Response`
 2 json, and then ensure the endpoint only gets called at-most once every **5
 3 minutes**, mimicking the basic features of `react-query`.
 4 
 5+[Codesanbox](https://codesandbox.io/p/sandbox/starfx-simplest-dgqc9v?file=%2Fsrc%2Findex.tsx)
 6+
 7 ```tsx
 8 import ReactDOM from "react-dom/client";
 9 import { createApi, mdw, timer } from "starfx";
10-import { configureStore, createSchema, slice } from "starfx/store";
11+import { configureStore, createSchema, slice, storeMdw } from "starfx/store";
12 import { Provider, useCache } from "starfx/react";
13 
14+const [schema, initialState] = createSchema({
15+  loaders: slice.loader(),
16+  cache: slice.table(),
17+});
18+
19 const api = createApi();
20 api.use(mdw.api());
21+api.use(storeMdw.store(schema));
22 api.use(api.routes());
23 api.use(mdw.fetch({ baseUrl: "https://jsonplaceholder.typicode.com" }));
24 
25@@ -68,12 +76,8 @@ const fetchUsers = api.get(
26   api.cache(),
27 );
28 
29-const schema = createSchema({
30-  loaders: slice.loader(),
31-  cache: slice.table(),
32-});
33-const store = configureStore(schema);
34-type WebState = typeof store.initialState;
35+const store = configureStore(initialState);
36+type WebState = typeof initialState;
37 
38 store.run(api.bootup);
39 
40@@ -86,7 +90,7 @@ function App() {
41 
42   return (
43     <div>
44-      {users.map(
45+      {users?.map(
46         (user) => <div key={user.id}>{user.name}</div>,
47       )}
48     </div>

 1@@ -44,7 +44,7 @@ ought to be and it has a couple functions to manage and query the value stored
 2 inside of it.
 3 
 4 ```ts
 5-const schema = createSchema({
 6+const [schema] = createSchema({
 7   nav: slice.any<bool>(false),
 8 });
 9 
10@@ -60,7 +60,7 @@ function*() {
11 This slice has some custom actions to manage a number value.
12 
13 ```ts
14-const schema = createSchema({
15+const [schema] = createSchema({
16   views: slice.num(0),
17 });
18 
19@@ -79,7 +79,7 @@ This slice is probably not super useful since it is essentially the same as
20 `slice.any<string>` but we could add more actions to it in the future.
21 
22 ```ts
23-const schema = createSchema({
24+const [schema] = createSchema({
25   token: slice.str(""),
26 });
27 
28@@ -96,7 +96,7 @@ This is a specialized slice with some custom actions to deal with javascript
29 objects.
30 
31 ```ts
32-const schema = createSchema({
33+const [schema] = createSchema({
34   settings: slice.obj({
35     notifications: false,
36     theme: "light",
37@@ -126,7 +126,7 @@ type Table<Entity = any> = Record<string | number, Entity>;
38 The key is the entity's primary id and the value is the entity itself.
39 
40 ```ts
41-const schema = createSchema({
42+const [schema] = createSchema({
43   users: slice.table({ empty: { id: "", name: "" } }),
44 });
45 
46@@ -189,7 +189,7 @@ This is a specialized database table specific to managing loaders in `starfx`.
47 [Read more about loaders here](/loader).
48 
49 ```ts
50-const schema = createSchema({
51+const [schema] = createSchema({
52   loaders: slice.loader(),
53 });
54 
55@@ -244,10 +244,10 @@ export function counter(initialState?: number) {
56   return (name: string) => createCounter<AnyState>({ name, initialState });
57 }
58 
59-const schema = createSchema({
60+const [schema, initialState] = createSchema({
61   counter: counter(100),
62 });
63-const store = configureStore(schema);
64+const store = configureStore(initialState);
65 
66 store.run(function* () {
67   yield* schema.update([

 1@@ -47,12 +47,12 @@ interface User {
 2 }
 3 
 4 // app-wide database for ui, api data, or anything that needs reactivity
 5-const schema = createSchema({
 6+const [schema, initialState] = createSchema({
 7   cache: slice.table(),
 8   loaders: slice.loader(),
 9   users: slice.table<User>(),
10 });
11-type WebState = typeof schema.initialState;
12+type WebState = typeof initialState;
13 
14 // just a normal endpoint
15 const fetchUsers = api.get<never, User[]>(