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

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

View File

@ -76,7 +76,10 @@ export const AllBoards: React.FC<Props> = ({
if (groupedByIssues[singleGroup].length === 0)
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">
{currentState &&
getStateGroupIcon(currentState.group, "16", "16", currentState.color)}

View File

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