plane/web/store/command-palette.store.ts
Prateek Shourya a2cdbd52dc
[WEB-1436] chore: pages improvement. (#4657)
* add empty state if no pages are available.
* set access to private in create page modal when the modal is open form private tab.
2024-05-31 18:30:38 +05:30

244 lines
6.7 KiB
TypeScript

import { observable, action, makeObservable, computed } from "mobx";
// services
import { EIssuesStoreType, TCreateModalStoreTypes } from "@/constants/issue";
// types / constants
import { DEFAULT_CREATE_PAGE_MODAL_DATA, EPageAccess, TCreatePageModal } from "@/constants/page";
export interface ModalData {
store: EIssuesStoreType;
viewId: string;
}
export interface ICommandPaletteStore {
// observables
isCommandPaletteOpen: boolean;
isShortcutModalOpen: boolean;
isCreateProjectModalOpen: boolean;
isCreateCycleModalOpen: boolean;
isCreateModuleModalOpen: boolean;
isCreateViewModalOpen: boolean;
createPageModal: TCreatePageModal;
isCreateIssueModalOpen: boolean;
isDeleteIssueModalOpen: boolean;
isBulkDeleteIssueModalOpen: boolean;
// computed
isAnyModalOpen: boolean;
// toggle actions
toggleCommandPaletteModal: (value?: boolean) => void;
toggleShortcutModal: (value?: boolean) => void;
toggleCreateProjectModal: (value?: boolean) => void;
toggleCreateCycleModal: (value?: boolean) => void;
toggleCreateViewModal: (value?: boolean) => void;
toggleCreatePageModal: (value?: TCreatePageModal) => void;
toggleCreateIssueModal: (value?: boolean, storeType?: TCreateModalStoreTypes) => void;
toggleCreateModuleModal: (value?: boolean) => void;
toggleDeleteIssueModal: (value?: boolean) => void;
toggleBulkDeleteIssueModal: (value?: boolean) => void;
createIssueStoreType: TCreateModalStoreTypes;
}
export class CommandPaletteStore implements ICommandPaletteStore {
// observables
isCommandPaletteOpen: boolean = false;
isShortcutModalOpen: boolean = false;
isCreateProjectModalOpen: boolean = false;
isCreateCycleModalOpen: boolean = false;
isCreateModuleModalOpen: boolean = false;
isCreateViewModalOpen: boolean = false;
isCreateIssueModalOpen: boolean = false;
isDeleteIssueModalOpen: boolean = false;
isBulkDeleteIssueModalOpen: boolean = false;
createPageModal: TCreatePageModal = DEFAULT_CREATE_PAGE_MODAL_DATA;
createIssueStoreType: TCreateModalStoreTypes = EIssuesStoreType.PROJECT;
constructor() {
makeObservable(this, {
// observable
isCommandPaletteOpen: observable.ref,
isShortcutModalOpen: observable.ref,
isCreateProjectModalOpen: observable.ref,
isCreateCycleModalOpen: observable.ref,
isCreateModuleModalOpen: observable.ref,
isCreateViewModalOpen: observable.ref,
isCreateIssueModalOpen: observable.ref,
isDeleteIssueModalOpen: observable.ref,
isBulkDeleteIssueModalOpen: observable.ref,
createPageModal: observable,
// computed
isAnyModalOpen: computed,
// projectPages: computed,
// toggle actions
toggleCommandPaletteModal: action,
toggleShortcutModal: action,
toggleCreateProjectModal: action,
toggleCreateCycleModal: action,
toggleCreateViewModal: action,
toggleCreatePageModal: action,
toggleCreateIssueModal: action,
toggleCreateModuleModal: action,
toggleDeleteIssueModal: action,
toggleBulkDeleteIssueModal: action,
});
}
/**
* Checks whether any modal is open or not.
* @returns boolean
*/
get isAnyModalOpen() {
return Boolean(
this.isCreateIssueModalOpen ||
this.isCreateCycleModalOpen ||
this.isCreateProjectModalOpen ||
this.isCreateModuleModalOpen ||
this.isCreateViewModalOpen ||
this.isShortcutModalOpen ||
this.isBulkDeleteIssueModalOpen ||
this.isDeleteIssueModalOpen ||
this.createPageModal.isOpen
);
}
/**
* Toggles the command palette modal
* @param value
* @returns
*/
toggleCommandPaletteModal = (value?: boolean) => {
if (value !== undefined) {
this.isCommandPaletteOpen = value;
} else {
this.isCommandPaletteOpen = !this.isCommandPaletteOpen;
}
};
/**
* Toggles the shortcut modal
* @param value
* @returns
*/
toggleShortcutModal = (value?: boolean) => {
if (value !== undefined) {
this.isShortcutModalOpen = value;
} else {
this.isShortcutModalOpen = !this.isShortcutModalOpen;
}
};
/**
* Toggles the create project modal
* @param value
* @returns
*/
toggleCreateProjectModal = (value?: boolean) => {
if (value !== undefined) {
this.isCreateProjectModalOpen = value;
} else {
this.isCreateProjectModalOpen = !this.isCreateProjectModalOpen;
}
};
/**
* Toggles the create cycle modal
* @param value
* @returns
*/
toggleCreateCycleModal = (value?: boolean) => {
if (value !== undefined) {
this.isCreateCycleModalOpen = value;
} else {
this.isCreateCycleModalOpen = !this.isCreateCycleModalOpen;
}
};
/**
* Toggles the create view modal
* @param value
* @returns
*/
toggleCreateViewModal = (value?: boolean) => {
if (value !== undefined) {
this.isCreateViewModalOpen = value;
} else {
this.isCreateViewModalOpen = !this.isCreateViewModalOpen;
}
};
/**
* Toggles the create page modal along with the page access
* @param value
* @returns
*/
toggleCreatePageModal = (value?: TCreatePageModal) => {
if (value) {
this.createPageModal = {
isOpen: value.isOpen,
pageAccess: value.pageAccess || EPageAccess.PUBLIC,
};
} else {
this.createPageModal = {
isOpen: !this.createPageModal.isOpen,
pageAccess: EPageAccess.PUBLIC,
};
}
};
/**
* Toggles the create issue modal
* @param value
* @param storeType
* @returns
*/
toggleCreateIssueModal = (value?: boolean, storeType?: TCreateModalStoreTypes) => {
if (value !== undefined) {
this.isCreateIssueModalOpen = value;
this.createIssueStoreType = storeType || EIssuesStoreType.PROJECT;
} else {
this.isCreateIssueModalOpen = !this.isCreateIssueModalOpen;
this.createIssueStoreType = EIssuesStoreType.PROJECT;
}
};
/**
* Toggles the delete issue modal
* @param value
* @returns
*/
toggleDeleteIssueModal = (value?: boolean) => {
if (value !== undefined) {
this.isDeleteIssueModalOpen = value;
} else {
this.isDeleteIssueModalOpen = !this.isDeleteIssueModalOpen;
}
};
/**
* Toggles the create module modal
* @param value
* @returns
*/
toggleCreateModuleModal = (value?: boolean) => {
if (value !== undefined) {
this.isCreateModuleModalOpen = value;
} else {
this.isCreateModuleModalOpen = !this.isCreateModuleModalOpen;
}
};
/**
* Toggles the bulk delete issue modal
* @param value
* @returns
*/
toggleBulkDeleteIssueModal = (value?: boolean) => {
if (value !== undefined) {
this.isBulkDeleteIssueModalOpen = value;
} else {
this.isBulkDeleteIssueModalOpen = !this.isBulkDeleteIssueModalOpen;
}
};
}