State and Store in frontend codebase - State example - service

service.ts

import * as User from "./state/user";
import * as State from "./state";

import { store } from "./store";

export const createUserAndSave = ({
  firstName,
  lastName,
  picture
}: {
  firstName: string;
  lastName: string;
  picture?: string;
}) => {
  const currentState = store.read();

  if (!State.canCreateUser(currentState)) {
    return;
  }

  const user = User.createNew({ firstName, lastName, picture });

  fetch(...)
    .then(() => {
      store.apply((currentState) => {
        if (State.isLoading(currentState) || State.isError(currentState)) {
          return currentState;
        }

        return State.addUser(user)(currentState);
      })();
    })
    .catch((error) => {
      store.apply(() => error)();
    });
};

export const init = () => {
  fetch(...)
    .then((payload) => {
      store.apply(() => State.decode(payload))();
      console.log({ state: store.read() });
    })
    .catch((error) => {
      store.apply(() => error)();
    });
};