react-adaka

High-precision state management for React using adaka.

Install

npm i react-adaka

Usage

Define your store and selector.

// store.ts
import { createStore, createSelectorHook } from "react-adaka";

// first create your store
export const store = createStore({
  status: "error",
  errors: [{ type: "api", message: "unknown error" }]
});

// create a selector hook. need only per store.
export const useSelector = createSelectorHook(store);

Now use the selector.

// component.ts
import { useSelector } from "./store";

// use the hook inside your React component.
function ShowErrorTypes() {
  // select the types of errors only when the status is in "error".
  const { errorTypes } = useSelector(
    { errorTypes: "$errors.type" },
    { status: "error" }
  );

  return errorTypes ? (
    <div>Issues found: {errorTypes.join("\n")} </div>
  ) : (
    <div />
  );
}

export default ShowErrorTypes;

License

MIT