@applicaster/zapp-react-native-utils/modalState/index.ts

Applicaster Zapp React Native utilities package

import { create } from "zustand";

interface ModalState {
  visible: boolean;
  screen: any;
  options: Record<string, unknown>;
  props: Record<string, unknown>;
}

interface ModalStore {
  modalState: ModalState;
  setModalState: (newState: Partial<ModalState>) => void;
  openModal: (
    item: any,
    options?: Record<string, unknown>,
    props?: Record<string, unknown>
  ) => void;
  dismissModal: () => void;
}

const initialModalState: ModalState = {
  visible: false,
  screen: null,
  options: {},
  props: {},
};

export const useModalStore = create<ModalStore>((set) => ({
  modalState: initialModalState,
  setModalState: (newState) =>
    set((state) => ({
      modalState: { ...state.modalState, ...newState },
    })),
  openModal: ({
    item,
    options = {},
    props = { screenData: {} },
  }: OpenModalArg) =>
    set({
      modalState: {
        visible: true,
        screen: item,
        options: {
          animated: true,
          animationType: "slide",
          onShow: () => {},
          presentationStyle: "overFullScreen",
          transparent: true,
          ...options,
          onDismiss: () => set({ modalState: initialModalState }),
          onRequestClose: () => set({ modalState: initialModalState }),
        },
        props,
      },
    }),
  dismissModal: () => set(() => ({ modalState: initialModalState })),
}));