chore: files restructure (#4766)

* chore: bulk operations folder restructuring.

* fix: build errors

---------

Co-authored-by: sriram veeraghanta <veeraghanta.sriram@gmail.com>
This commit is contained in:
Prateek Shourya 2024-06-11 17:53:48 +05:30 committed by GitHub
parent 1c558eb6b3
commit e3ebb9b61c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
21 changed files with 34 additions and 314 deletions

View File

@ -9,11 +9,11 @@ import { PageHead } from "@/components/core";
import { CycleDetailsSidebar } from "@/components/cycles";
import { CycleLayoutRoot } from "@/components/issues/issue-layouts";
// constants
import { EIssuesStoreType } from "@/constants/issue";
// import { EIssuesStoreType } from "@/constants/issue";
// helpers
import { cn } from "@/helpers/common.helper";
// hooks
import { useCycle, useIssues, useProject } from "@/hooks/store";
import { useCycle, useProject } from "@/hooks/store";
import useLocalStorage from "@/hooks/use-local-storage";
// assets
import emptyCycle from "@/public/empty-state/cycle.svg";
@ -25,7 +25,7 @@ const CycleDetailPage = observer(() => {
// store hooks
const { fetchCycleDetails, getCycleById } = useCycle();
const { getProjectById } = useProject();
const { issuesFilter } = useIssues(EIssuesStoreType.CYCLE);
// const { issuesFilter } = useIssues(EIssuesStoreType.CYCLE);
// hooks
const { setValue, storedValue } = useLocalStorage("cycle_sidebar_collapsed", "false");
// fetching cycle details
@ -46,7 +46,7 @@ const CycleDetailPage = observer(() => {
*/
const toggleSidebar = () => setValue(`${!isSidebarCollapsed}`);
const activeLayout = issuesFilter?.issueFilters?.displayFilters?.layout;
// const activeLayout = issuesFilter?.issueFilters?.displayFilters?.layout;
return (
<>

View File

@ -9,11 +9,11 @@ import { PageHead } from "@/components/core";
import { ModuleLayoutRoot } from "@/components/issues";
import { ModuleDetailsSidebar } from "@/components/modules";
// constants
import { EIssuesStoreType } from "@/constants/issue";
// import { EIssuesStoreType } from "@/constants/issue";
// helpers
import { cn } from "@/helpers/common.helper";
// hooks
import { useIssues, useModule, useProject } from "@/hooks/store";
import { useModule, useProject } from "@/hooks/store";
import useLocalStorage from "@/hooks/use-local-storage";
// assets
import emptyModule from "@/public/empty-state/module.svg";
@ -25,7 +25,7 @@ const ModuleIssuesPage = observer(() => {
// store hooks
const { fetchModuleDetails, getModuleById } = useModule();
const { getProjectById } = useProject();
const { issuesFilter } = useIssues(EIssuesStoreType.MODULE);
// const { issuesFilter } = useIssues(EIssuesStoreType.MODULE);
// local storage
const { setValue, storedValue } = useLocalStorage("module_sidebar_collapsed", "false");
const isSidebarCollapsed = storedValue ? (storedValue === "true" ? true : false) : false;
@ -47,7 +47,7 @@ const ModuleIssuesPage = observer(() => {
if (!workspaceSlug || !projectId || !moduleId) return <></>;
const activeLayout = issuesFilter?.issueFilters?.displayFilters?.layout;
// const activeLayout = issuesFilter?.issueFilters?.displayFilters?.layout;
return (
<>

View File

@ -0,0 +1 @@
export * from "./root";

View File

@ -0,0 +1 @@
export * from "./bulk-operations";

View File

@ -0,0 +1 @@
export const ENABLE_BULK_OPERATIONS = false;

View File

@ -19,9 +19,12 @@ import {
WeekChartView,
YearChartView,
} from "@/components/gantt-chart";
import { IssueBulkOperationsRoot } from "@/components/issues";
// helpers
import { cn } from "@/helpers/common.helper";
// plane web components
import { IssueBulkOperationsRoot } from "@/plane-web/components/issues";
// plane web constants
import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue";
// helpers
// constants
import { GANTT_SELECT_GROUP } from "../constants";
// hooks
@ -123,7 +126,7 @@ export const GanttChartMainContent: React.FC<Props> = observer((props) => {
entities={{
[GANTT_SELECT_GROUP]: blockIds ?? [],
}}
disabled
disabled={!ENABLE_BULK_OPERATIONS}
>
{(helpers) => (
<>

View File

@ -1,67 +0,0 @@
import { useState } from "react";
import { observer } from "mobx-react";
// ui
import { ArchiveIcon, Tooltip } from "@plane/ui";
// components
// constants
import { ARCHIVABLE_STATE_GROUPS } from "@/constants/state";
// helpers
import { cn } from "@/helpers/common.helper";
// hooks
import { useAppRouter, useIssueDetail, useProjectState } from "@/hooks/store";
import { BulkArchiveConfirmationModal } from "../bulk-archive-modal";
type Props = {
handleClearSelection: () => void;
selectedEntityIds: string[];
};
export const BulkArchiveIssues: React.FC<Props> = observer((props) => {
const { handleClearSelection, selectedEntityIds } = props;
// states
const [isBulkArchiveModalOpen, setIsBulkArchiveModalOpen] = useState(false);
// store hooks
const { projectId, workspaceSlug } = useAppRouter();
const {
issue: { getIssueById },
} = useIssueDetail();
const { getStateById } = useProjectState();
const canAllIssuesBeArchived = selectedEntityIds.every((issueId) => {
const issueDetails = getIssueById(issueId);
if (!issueDetails) return false;
const stateDetails = getStateById(issueDetails.state_id);
if (!stateDetails) return false;
return ARCHIVABLE_STATE_GROUPS.includes(stateDetails.group);
});
return (
<>
{projectId && workspaceSlug && (
<BulkArchiveConfirmationModal
isOpen={isBulkArchiveModalOpen}
handleClose={() => setIsBulkArchiveModalOpen(false)}
issueIds={selectedEntityIds}
onSubmit={handleClearSelection}
projectId={projectId.toString()}
workspaceSlug={workspaceSlug.toString()}
/>
)}
<Tooltip
tooltipHeading="Archive"
tooltipContent={canAllIssuesBeArchived ? "" : "The selected issues are not in the right state group to archive"}
>
<button
type="button"
className={cn("outline-none grid place-items-center", {
"cursor-not-allowed text-custom-text-400": !canAllIssuesBeArchived,
})}
onClick={() => {
if (canAllIssuesBeArchived) setIsBulkArchiveModalOpen(true);
}}
>
<ArchiveIcon className="size-4" />
</button>
</Tooltip>
</>
);
});

View File

@ -1,45 +0,0 @@
import { useState } from "react";
import { observer } from "mobx-react";
import { Trash2 } from "lucide-react";
// ui
import { Tooltip } from "@plane/ui";
// hooks
import { useAppRouter } from "@/hooks/store";
import { BulkDeleteConfirmationModal } from "../bulk-delete-modal";
type Props = {
handleClearSelection: () => void;
selectedEntityIds: string[];
};
export const BulkDeleteIssues: React.FC<Props> = observer((props) => {
const { handleClearSelection, selectedEntityIds } = props;
// states
const [isBulkDeleteModalOpen, setIsBulkDeleteModalOpen] = useState(false);
// store hooks
const { projectId, workspaceSlug } = useAppRouter();
return (
<>
{projectId && workspaceSlug && (
<BulkDeleteConfirmationModal
isOpen={isBulkDeleteModalOpen}
handleClose={() => setIsBulkDeleteModalOpen(false)}
issueIds={selectedEntityIds}
onSubmit={handleClearSelection}
projectId={projectId.toString()}
workspaceSlug={workspaceSlug.toString()}
/>
)}
<Tooltip tooltipHeading="Delete" tooltipContent="">
<button
type="button"
className="outline-none grid place-items-center"
onClick={() => setIsBulkDeleteModalOpen(true)}
>
<Trash2 className="size-4" />
</button>
</Tooltip>
</>
);
});

View File

@ -1,3 +0,0 @@
export * from "./archive";
export * from "./delete";
export * from "./root";

View File

@ -1,18 +0,0 @@
import { BulkArchiveIssues } from "./archive";
import { BulkDeleteIssues } from "./delete";
type Props = {
handleClearSelection: () => void;
selectedEntityIds: string[];
};
export const BulkOperationsActionsRoot: React.FC<Props> = (props) => {
const { handleClearSelection, selectedEntityIds } = props;
return (
<div className="h-7 px-3 flex items-center gap-3 flex-shrink-0">
<BulkArchiveIssues handleClearSelection={handleClearSelection} selectedEntityIds={selectedEntityIds} />
<BulkDeleteIssues handleClearSelection={handleClearSelection} selectedEntityIds={selectedEntityIds} />
</div>
);
};

View File

@ -1,83 +0,0 @@
import { useState } from "react";
import { observer } from "mobx-react";
// ui
import { TOAST_TYPE, setToast } from "@plane/ui";
// components
import { AlertModalCore, EModalPosition, EModalWidth } from "@/components/core";
// constants
import { EErrorCodes, ERROR_DETAILS } from "@/constants/errors";
// hooks
import { useIssues } from "@/hooks/store";
import { useIssueStoreType } from "@/hooks/use-issue-layout-store";
type Props = {
handleClose: () => void;
isOpen: boolean;
issueIds: string[];
onSubmit?: () => void;
projectId: string;
workspaceSlug: string;
};
export const BulkArchiveConfirmationModal: React.FC<Props> = observer((props) => {
const { handleClose, isOpen, issueIds, onSubmit, projectId, workspaceSlug } = props;
// states
const [isArchiving, setIsDeleting] = useState(false);
// store hooks
const storeType = useIssueStoreType();
const {
issues: { archiveBulkIssues },
} = useIssues(storeType);
const handleSubmit = async () => {
setIsDeleting(true);
archiveBulkIssues &&
(await archiveBulkIssues(workspaceSlug, projectId, issueIds)
.then(() => {
setToast({
type: TOAST_TYPE.SUCCESS,
title: "Success!",
message: "Issues archived successfully.",
});
onSubmit?.();
handleClose();
})
.catch((error) => {
const errorInfo = ERROR_DETAILS[error?.error_code as EErrorCodes] ?? undefined;
setToast({
type: TOAST_TYPE.ERROR,
title: errorInfo?.title ?? "Error!",
message: errorInfo?.message ?? "Something went wrong. Please try again.",
});
})
.finally(() => setIsDeleting(false)));
};
const issueVariant = issueIds.length > 1 ? "issues" : "issue";
return (
<AlertModalCore
handleClose={handleClose}
handleSubmit={handleSubmit}
isSubmitting={isArchiving}
isOpen={isOpen}
variant="primary"
position={EModalPosition.CENTER}
width={EModalWidth.XL}
title={`Archive ${issueVariant}`}
content={
<>
Are you sure you want to archive {issueIds.length} {issueVariant}? Sub issues of selected {issueVariant} will
also be archived. Once archived {issueIds.length > 1 ? "they" : "it"} can be restored later via the archives
section.
</>
}
primaryButtonText={{
loading: "Archiving",
default: `Archive ${issueVariant}`,
}}
hideIcon
/>
);
});

View File

@ -1,79 +0,0 @@
import { useState } from "react";
import { observer } from "mobx-react";
// ui
import { TOAST_TYPE, setToast } from "@plane/ui";
// components
import { AlertModalCore, EModalPosition, EModalWidth } from "@/components/core";
// constants
// hooks
import { useIssues } from "@/hooks/store";
import { useIssueStoreType } from "@/hooks/use-issue-layout-store";
type Props = {
handleClose: () => void;
isOpen: boolean;
issueIds: string[];
onSubmit?: () => void;
projectId: string;
workspaceSlug: string;
};
export const BulkDeleteConfirmationModal: React.FC<Props> = observer((props) => {
const { handleClose, isOpen, issueIds, onSubmit, projectId, workspaceSlug } = props;
// states
const [isDeleting, setIsDeleting] = useState(false);
// store hooks
const storeType = useIssueStoreType();
const {
issues: { removeBulkIssues },
} = useIssues(storeType);
const handleSubmit = async () => {
setIsDeleting(true);
await removeBulkIssues(workspaceSlug, projectId, issueIds)
.then(() => {
setToast({
type: TOAST_TYPE.SUCCESS,
title: "Success!",
message: "Issues deleted successfully.",
});
onSubmit?.();
handleClose();
})
.catch(() =>
setToast({
type: TOAST_TYPE.ERROR,
title: "Error!",
message: "Something went wrong. Please try again.",
})
)
.finally(() => setIsDeleting(false));
};
const issueVariant = issueIds.length > 1 ? "issues" : "issue";
return (
<AlertModalCore
handleClose={handleClose}
handleSubmit={handleSubmit}
isSubmitting={isDeleting}
isOpen={isOpen}
variant="danger"
position={EModalPosition.CENTER}
width={EModalWidth.XL}
title={`Delete ${issueVariant}`}
content={
<>
Are you sure you want to delete {issueIds.length} {issueVariant}? Sub issues of selected {issueVariant} will
also be deleted. All of the data related to the {issueVariant} will be permanently removed. This action cannot
be undone.
</>
}
primaryButtonText={{
loading: "Deleting",
default: `Delete ${issueVariant}`,
}}
/>
);
});

View File

@ -1 +0,0 @@
export const BulkOperationsExtraProperties = () => null;

View File

@ -1,2 +1 @@
export * from "./root";
export * from "./upgrade-banner";

View File

@ -14,6 +14,8 @@ import { getIssueBlocksStructure } from "@/helpers/issue.helper";
import { useIssues, useUser } from "@/hooks/store";
import { useIssueStoreType } from "@/hooks/use-issue-layout-store";
import { useIssuesActions } from "@/hooks/use-issues-actions";
// plane web constants
import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue";
import { IssueLayoutHOC } from "../issue-layout-HOC";
@ -97,7 +99,7 @@ export const BaseGanttRoot: React.FC<IBaseGanttRoot> = observer((props: IBaseGan
enableBlockMove={isAllowed}
enableReorder={appliedDisplayFilters?.order_by === "sort_order" && isAllowed}
enableAddBlock={isAllowed}
enableSelection={false}
enableSelection={ENABLE_BULK_OPERATIONS && isAllowed}
quickAdd={
enableIssueCreation && isAllowed ? <GanttQuickAddIssueForm quickAddCallback={quickAddIssue} /> : undefined
}

View File

@ -15,12 +15,15 @@ import {
} from "@plane/types";
// components
import { MultipleSelectGroup } from "@/components/core";
import { IssueBulkOperationsRoot } from "@/components/issues";
// constants
import { ALL_ISSUES } from "@/constants/issue";
// hooks
import { useCycle, useLabel, useMember, useModule, useProject, useProjectState } from "@/hooks/store";
import { useIssueStoreType } from "@/hooks/use-issue-layout-store";
// plane web components
import { IssueBulkOperationsRoot } from "@/plane-web/components/issues";
// plane web constants
import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue";
// utils
import { getGroupByColumns, isWorkspaceLevel, GroupDropLocation } from "../utils";
import { ListGroup } from "./list-group";
@ -126,7 +129,7 @@ export const List: React.FC<IList> = observer((props) => {
return (
<div className="relative size-full flex flex-col">
{groups && (
<MultipleSelectGroup containerRef={containerRef} entities={entities} disabled>
<MultipleSelectGroup containerRef={containerRef} entities={entities} disabled={!ENABLE_BULK_OPERATIONS}>
{(helpers) => (
<>
<div

View File

@ -5,11 +5,15 @@ import { TIssue, IIssueDisplayFilterOptions, IIssueDisplayProperties } from "@pl
// components
import { LogoSpinner } from "@/components/common";
import { MultipleSelectGroup } from "@/components/core";
import { IssueBulkOperationsRoot, SpreadsheetQuickAddIssueForm } from "@/components/issues";
import { SpreadsheetQuickAddIssueForm } from "@/components/issues";
// constants
import { SPREADSHEET_PROPERTY_LIST, SPREADSHEET_SELECT_GROUP } from "@/constants/spreadsheet";
// hooks
import { useProject } from "@/hooks/store";
// plane web components
import { IssueBulkOperationsRoot } from "@/plane-web/components/issues";
// plane web constants
import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue";
// types
import { TRenderQuickActions } from "../list/list-view-types";
import { SpreadsheetTable } from "./spreadsheet-table";
@ -78,7 +82,7 @@ export const SpreadsheetView: React.FC<Props> = observer((props) => {
entities={{
[SPREADSHEET_SELECT_GROUP]: issueIds,
}}
disabled
disabled={!ENABLE_BULK_OPERATIONS}
>
{(helpers) => (
<>

View File

@ -0,0 +1 @@
export * from "ce/components/issues/bulk-operations/index";

View File

@ -0,0 +1 @@
export * from "ce/constants/issue";

View File

@ -11,7 +11,7 @@
"@/helpers/*": ["helpers/*"],
"@/public/*": ["public/*"],
"@/styles/*": ["styles/*"],
"@split/*": ["ce/*"]
"@/plane-web/*": ["ce/*"]
},
"plugins": [
{