thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

refactor: state with group 'completed' or 'cancelled' are collapsed by default (#506)

Browse Source
This commit is contained in:
Dakshesh Jain 2023-03-23 18:10:28 +05:30 committed by GitHub
parent 4a81b988b4
commit feb0e40559
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 106 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/app/components/core/board-view/all-boards.tsx
View File

@ -76,7 +76,10 @@ export const AllBoards: React.FC<Props> = ({
if (groupedByIssues[singleGroup].length === 0) if (groupedByIssues[singleGroup].length === 0)
return ( return (
<div className="flex items-center justify-between gap-2 rounded bg-white p-2 shadow"> <div
key={index}
className="flex items-center justify-between gap-2 rounded bg-white p-2 shadow"
>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{currentState && {currentState &&
getStateGroupIcon(currentState.group, "16", "16", currentState.color)} getStateGroupIcon(currentState.group, "16", "16", currentState.color)}

12
apps/app/components/core/board-view/single-board.tsx
View File

@ -1,4 +1,4 @@
import { useState } from "react"; import { useState, useEffect } from "react";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
@ -58,6 +58,11 @@ export const SingleBoard: React.FC<Props> = ({
const isNotAllowed = userAuth.isGuest || userAuth.isViewer; const isNotAllowed = userAuth.isGuest || userAuth.isViewer;
useEffect(() => {
if (currentState?.group === "completed" || currentState?.group === "cancelled")
setIsCollapsed(false);
}, [currentState]);
return ( return (
<div className={`h-full flex-shrink-0 ${!isCollapsed ? "" : "w-96 bg-gray-50"}`}> <div className={`h-full flex-shrink-0 ${!isCollapsed ? "" : "w-96 bg-gray-50"}`}>
<div className={`${!isCollapsed ? "" : "flex h-full flex-col space-y-3"}`}> <div className={`${!isCollapsed ? "" : "flex h-full flex-col space-y-3"}`}>
@ -68,6 +73,7 @@ export const SingleBoard: React.FC<Props> = ({
isCollapsed={isCollapsed} isCollapsed={isCollapsed}
setIsCollapsed={setIsCollapsed} setIsCollapsed={setIsCollapsed}
/> />
{isCollapsed && (
<StrictModeDroppable key={groupTitle} droppableId={groupTitle}> <StrictModeDroppable key={groupTitle} droppableId={groupTitle}>
{(provided, snapshot) => ( {(provided, snapshot) => (
<div <div
@ -89,7 +95,8 @@ export const SingleBoard: React.FC<Props> = ({
snapshot.isDraggingOver ? "block" : "hidden" snapshot.isDraggingOver ? "block" : "hidden"
} pointer-events-none top-1/2 left-1/2 z-[99] -translate-y-1/2 -translate-x-1/2 whitespace-nowrap rounded bg-white p-2 text-xs`} } pointer-events-none top-1/2 left-1/2 z-[99] -translate-y-1/2 -translate-x-1/2 whitespace-nowrap rounded bg-white p-2 text-xs`}
> >
This board is ordered by {replaceUnderscoreIfSnakeCase(orderBy ?? "created_at")} This board is ordered by{" "}
{replaceUnderscoreIfSnakeCase(orderBy ?? "created_at")}
</div> </div>
</> </>
)} )}
@ -164,6 +171,7 @@ export const SingleBoard: React.FC<Props> = ({
</div> </div>
)} )}
</StrictModeDroppable> </StrictModeDroppable>
)}
</div> </div>
</div> </div>
); );