import { create } from "zustand";
import { persist } from "zustand/middleware";

export const basketStore = create<any>()(
  persist(
    (set, get) => ({
      templ: {
        id1: {
          name: "Шаблонизатор",
          desc: "Дисковое хранилище 5 гб",
          id: "id1",
          privelegeid: "1",
          amount: 5,
          price: 390,
        },
        id2: {
          name: "Шаблонизатор",
          desc: "Подписка на месяц",
          id: "id2",
          privelegeid: "2",
          amount: 30,
          price: 290,
        },
      },
      squiz: {
        id1: {
          name: "Шаблонизатор",
          desc: "Дисковое хранилище 5 гб",
          id: "id1",
          privelegeid: "1",
          amount: 5,
          price: 390,
        },
        id2: {
          name: "Шаблонизатор",
          desc: "Подписка на месяц",
          id: "id2",
          privelegeid: "2",
          amount: 30,
          price: 290,
        },
      },
      reducer: {},
      openDrawer: false,
      add: ({ id, obj, type }: any) => {
        const store: any = get()[type] || {};
        const newStore = {
          [type]: {
            ...store,
            [id]: obj,
          },
        };
        set(() => newStore);
      },
      remove: (type: string, id: string) => {
        const store: any = get()[type] || {};

        const newStore = Object.entries(store).reduce<any>((accamulator, [key, value], index, array) => {
          if (key !== id) {
            accamulator[key] = value;
          }

          return accamulator;
        }, {});

        set({ [type]: newStore });
      },
      open: (boolean: boolean) => (event: React.KeyboardEvent | React.MouseEvent) => {
        set(() => ({ openDrawer: boolean }));
      },
    }),
    {
      name: "basket",
    }
  )
);