import { createStoreManager } from "store4mp";

type Data = {
  value: string;
};

type Actions = {
  action: string; // action name & action payload
};

const { allocateStore, getStore, freeStore, getDefaultData } =
  createStoreManager<Data, Actions>();
export { allocateStore, getStore, freeStore, getDefaultData };

Component({
  attached() {
    this.store = allocateStore();
    this.store.on("action", ({ payload, data }) => {
      console.log(payload, data); // string, { value: string }
    });
  },
  methods: {
    goToSecondaryPage() {
      this.store.data.value = "foo";
      wx.navigateTo(`url?component-store-id=${this.storeId}`);
    },
  },
  detached() {
    freeStore(this.store.id);
  },
});

Component({
  data: {
    ...getDefaultData(),
  },
  attached() {
    const currentPages = getCurrentPages();
    const currentPage = currentPages[currentPages.length - 1];
    const { options } = currentPage;

    this.store = getStore(options["component-store-id"]);
    this.setData(this.store.data);
    console.log(this.data); // { value: 'foo' }
  },
  methods: {
    handleTap() {
      this.store.dispatch("action", "hello main page");
      // parent page will show "hello main page"
    },
  },
});