we_pro_dock/FRONTEND/STORE/UI.TS.md

Импорт функции defineStore из библиотеки pinia для создания хранилища:

import { defineStore } from 'pinia';

Определение типа данных ConfirmationModalDataType:

type ConfirmationModalDataType = {
    text: string,
    action: () => any
};

Здесь определяется тип данных ConfirmationModalDataType, который содержит текст модального окна и функцию действия при подтверждении.

Определение типа состояния для хранилища ui:

type uiState = {
    confirmationModalStatus: boolean;
    confirmationModalData: ConfirmationModalDataType | undefined;
};

В этом блоке определяется тип состояния uiState для хранилища. confirmationModalStatus указывает на состояние модального окна (открыто или закрыто), а confirmationModalData содержит данные для модального окна подтверждения.

Начальное состояние хранилища:

const defaultState: uiState = {
    confirmationModalStatus: false,
    confirmationModalData: undefined,
};

Здесь устанавливается начальное состояние хранилища uiStore, в котором модальное окно подтверждения изначально закрыто и данные для него не определены.

Экспорт хранилища uiStore с использованием defineStore:

export const uiStore = defineStore({
    id: 'ui',
    state: () => defaultState,
    actions: {
        openConfirmationModal(text: string, action: () => any) {
            this.confirmationModalData = { text, action };
            this.confirmationModalStatus = true;
        },
        closeConfirmationModal() {
            this.confirmationModalData = undefined;
            this.confirmationModalStatus = false;
        },
    },
    persist: true,
});

Здесь мы используем defineStore для создания хранилища uiStore с определенным состоянием (state), действиями (actions) для открытия и закрытия модального окна подтверждения, а также флагом persist: true, чтобы сохранять состояние хранилища между перезагрузками страницы.