Skip to content

Commit

Permalink
Merge pull request #2056 from ever-co/develop
Browse files Browse the repository at this point in the history 
Release
  • Loading branch information
@evereq
evereq authored Jan 3, 2024
2 parents e27ae30 + e48bf42 commit 9ad7162
Show file tree
Hide file tree
Showing 4 changed files with 49 additions and 29 deletions.
17 changes: 10 additions & 7 deletions apps/web/app/[locale]/kanban/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,11 +41,12 @@ const Kanban = () => {

return (
<>
<MainLayout>
<div className={'relative bg-white dark:bg-dark--theme pt-20 -mt-8 px-[32px] mx-[0px] w-full'}>
<Breadcrumb paths={breadcrumbPath} className="text-sm" />
<div className="flex flex-row items-center justify-between mt-[24px]">
<div></div>
<MainLayout
showTimer={true}
>
<div className={'fixed flex flex-col justify-between bg-white dark:bg-dark--theme h-[20vh] z-10 px-[32px] mx-[0px] w-full'}>
<div className="flex flex-row items-center justify-between mt-[34px]">
<Breadcrumb paths={breadcrumbPath} className="text-sm" />
<div className="flex flex-row items-center gap-[12px]">
<p>08:00 ( UTC +04:30 )</p>
<VerticalLine />
Expand Down Expand Up @@ -81,7 +82,7 @@ const Kanban = () => {
className="flex flex-row text-sm text-[#282048] dark:text-white border-2 border-[#0000001a] dark:border-white bg-white dark:bg-transparent rounded-full font-semibold items-center justify-center z-20 h-[40px] w-[40px]"
style={stackImages(3, 4)}
>
{activeTeamMembers.length - numberOfImagesDisplayed}+
{(activeTeamMembers.length - numberOfImagesDisplayed) < 100 ? (activeTeamMembers.length - numberOfImagesDisplayed) : 99}+
</div>
)}
</div>
Expand All @@ -92,7 +93,7 @@ const Kanban = () => {
</button>
</div>
</div>
<div className="relative flex flex-row justify-between items-center mt-[36px]">
<div className="relative flex flex-row justify-between items-center ">
<div className="flex flex-row">
<div
onClick={() => {
Expand Down Expand Up @@ -146,6 +147,7 @@ const Kanban = () => {
<div></div>
</div>
</div>
<div className="mt-[20vh] overflow-y-auto max-h-[60vh] z-0">
{/** TODO:fetch teamtask based on days */}
{/** Kanbanboard for today tasks */}
{activeTab === KanbanTabs.TODAY && (
Expand Down Expand Up @@ -179,6 +181,7 @@ const Kanban = () => {
)}
</>
)}
</div>
</MainLayout>
</>
);
Expand Down
2 changes: 1 addition & 1 deletion apps/web/lib/components/Kanban.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ function InnerItemList({
minHeight: items.length < 0 && dropSnapshot.isDraggingOver ? '120px' : '20px',
marginTop: items.length > 0 ? '20px' : '0px'
}}
className="flex flex-col gap-2.5 max-h-[520px] overflow-y-auto overflow-x-hidden"
className="flex flex-col gap-2.5 overflow-x-hidden"
>
{items.map((item: ITeamTask, index: number) => (
<Draggable key={item.id} draggableId={item.id} index={index}>
Expand Down
33 changes: 26 additions & 7 deletions apps/web/lib/components/kanban-card.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { useTimerView } from '@app/hooks';
import { pad } from '@app/helpers';
import { TaskStatus } from '@app/constants';
import { TaskIssueStatus } from 'lib/features';
import Link from 'next/link';

function getStyle(provided: DraggableProvided, style: any) {
if (!style) {
Expand Down Expand Up @@ -107,6 +108,10 @@ export default function Item(props: any) {

const { hours, minutes, seconds } = useTimerView();

const imageRadius = 20;
const numberOfImagesDisplayed = 4;
const totalLength = (item.members.length + 1) * imageRadius;

// const handleTime = () => {
// if (item.status === TaskStatus.INPROGRESS) {
// startTimer();
Expand Down Expand Up @@ -135,11 +140,11 @@ export default function Item(props: any) {
data-index={index}
aria-label={`${item.status.name} ${item.content}`}
>
<div className="flex gap-1.5 border-b border-b-gray-200 pb-4">
<div className="flex flex-col gap-5 grow">
<div className="grid grid-cols-4 w-full justify-between border-b border-b-gray-200 pb-4">
<div className="col-span-3 flex flex-col gap-5 grow w-full">
{item.tags && <TagList tags={item.tags} />}

<div className="flex flex-row flex-wrap items-center text-sm not-italic font-semibold">
<div className="flex flex-row flex-wrap text-wrap items-center text-sm not-italic font-semibold">
<TaskIssueStatus
showIssueLabels={false}
task={item}
Expand All @@ -151,13 +156,13 @@ export default function Item(props: any) {
/>

<span className="text-grey text-normal mr-1">#{item.number}</span>
<span className="text-black dark:text-white text-normal capitalize mr-2 bg-blue line-clamp-2">
<Link href={`/task/${item.id}`} className="text-black dark:text-white text-normal capitalize mr-2 bg-blue line-clamp-2">
{item.title}
</span>
</Link>
<Priority level={1} />
</div>
</div>
<div className="flex flex-col w-[48px] justify-between items-end">
<div className="flex flex-col justify-between items-end">
<VerticalThreeDot />

<CircularProgress percentage={10} />
Expand All @@ -181,8 +186,13 @@ export default function Item(props: any) {
)}

<div className="relative ">
<div className="w-10 flex h-fit flex-row justify-end items-center relative">
<div className="flex h-fit flex-row justify-end items-center relative"
style={{
width: `${totalLength}px`
}}
>
{item.members.map((option: any, index: number) => {
if (index < numberOfImagesDisplayed) {
return (
<div className="relative w-[40px] h-[40px]" key={index}>
<Image
Expand All @@ -194,7 +204,16 @@ export default function Item(props: any) {
/>
</div>
);
}
})}
{item.members.length > 4 && (
<div
className="flex flex-row text-sm text-[#282048] dark:text-white font-semibold items-center justify-center absolute h-[40px] w-[40px] rounded-full border-2 border-[#0000001a] dark:border-white bg-white dark:bg-[#191A20]"
style={stackImages(4, item.members.length)}
>
{(item.members.length - numberOfImagesDisplayed) < 100 ? (item.members.length - numberOfImagesDisplayed) : 99}+
</div>
)}
</div>
</div>
</div>
Expand Down
26 changes: 12 additions & 14 deletions apps/web/lib/features/team-members-kanban-view.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -199,8 +199,8 @@ export const KanbanView = ({ kanbanBoardTasks }: { kanbanBoardTasks: IKanban })
{columns.map((column: string, index: number) => {
return (
<React.Fragment key={index}>
<div className="flex flex-col" key={index}>
{isColumnCollapse(column) ? (
<div className={'order-last'} key={index}>
<EmptyKanbanDroppable
index={index}
title={column}
Expand All @@ -210,23 +210,21 @@ export const KanbanView = ({ kanbanBoardTasks }: { kanbanBoardTasks: IKanban })
column
)}
/>
</div>
) : (
<>
<div className="flex flex-col">
<KanbanDraggable
key={index}
index={index}
title={column}
items={items[column]}
backgroundColor={getHeaderBackground(
kanbanColumns,
column
)}
/>
</div>
<KanbanDraggable
key={index}
index={index}
title={column}
items={items[column]}
backgroundColor={getHeaderBackground(
kanbanColumns,
column
)}
/>
</>
)}
</div>
</React.Fragment>
);
})}
Expand Down

0 comments on commit 9ad7162

Please sign in to comment.