Skip to content

Commit

Permalink
Merge pull request #2723 from ever-co/develop
Browse files Browse the repository at this point in the history 
Release
  • Loading branch information
@evereq
evereq authored Jul 13, 2024
2 parents 3b7565a + d77cf39 commit a85315a
Show file tree
Hide file tree
Showing 25 changed files with 709 additions and 261 deletions.
5 changes: 5 additions & 0 deletions apps/web/app/stores/header-tabs.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,3 +10,8 @@ export const allTeamsHeaderTabs = atom<IssuesView>({
key: 'allTeamsHeaderTabs',
default: IssuesView.CARDS
});

export const dailyPlanViewHeaderTabs = atom<IssuesView>({
key: 'dailyPlanViewHeaderTabs',
default: IssuesView.CARDS
});
119 changes: 58 additions & 61 deletions apps/web/lib/components/image-overlapper.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,15 @@ import { ITeamTask, ITimerStatus } from '@app/interfaces';
import Skeleton from 'react-loading-skeleton';
import { Tooltip } from './tooltip';
import { ScrollArea } from '@components/ui/scroll-bar';
import { RiUserFill, RiUserAddFill } from "react-icons/ri";
import { RiUserFill, RiUserAddFill } from 'react-icons/ri';
import { useModal } from '@app/hooks';
import { Modal, Divider } from 'lib/components';
import { useOrganizationTeams } from '@app/hooks';
import { useTranslations } from 'next-intl';
import { TaskAssignButton } from '../../lib/features/task/task-assign-button';
import { clsxm } from '@app/utils';
import { TaskAvatars } from 'lib/features';
import { FaCheck } from "react-icons/fa6";
import { FaCheck } from 'react-icons/fa6';
import TeamMember from 'lib/components/team-member';
import { IEmployee } from '@app/interfaces';

Expand Down Expand Up @@ -42,7 +42,7 @@ export default function ImageOverlapper({
arrowData = null,
hasActiveMembers = false,
assignTaskButtonCall = false,
hasInfo = '',
hasInfo = ''
}: {
images: ImageOverlapperProps[];
radius?: number;
Expand All @@ -56,11 +56,11 @@ export default function ImageOverlapper({
hasInfo?: string;
}) {
// Split the array into two arrays based on the display number
const firstArray = images.slice(0, displayImageCount);
const widthCalculate = images.slice(0, 5);
const secondArray = images.slice(displayImageCount);
const isMoreThanDisplay = images.length > displayImageCount;
const imageLength = images.length;
const firstArray = images?.slice(0, displayImageCount);
const widthCalculate = images?.slice(0, 5);
const secondArray = images?.slice(displayImageCount);
const isMoreThanDisplay = images?.length > displayImageCount;
const imageLength = images?.length;
const { isOpen, openModal, closeModal } = useModal();
const { activeTeam } = useOrganizationTeams();
const allMembers = activeTeam?.members || [];
Expand All @@ -82,13 +82,12 @@ export default function ImageOverlapper({
const updatedUnassign = unassignedMembers.filter((el: IEmployee) => el.id != member.id);
setUnassignedMembers(updatedUnassign);
}

}
};

const onCLickValidate = () => {
setValidate(!validate);
closeModal();
}
};

const hasMembers = item?.members?.length > 0;
const membersList = { assignedMembers, unassignedMembers };
Expand All @@ -100,59 +99,56 @@ export default function ImageOverlapper({
if ((!hasMembers && item) || hasActiveMembers || assignTaskButtonCall) {
return (
<div className="relative">
{hasInfo.length > 0 && showInfo &&
(<div className="flex w-[200px] justify-center items-center rounded-[3px] text-[12px] absolute left-[-80px] top-[-45px]">
{hasInfo.length > 0 && showInfo && (
<div className="flex w-[200px] justify-center items-center rounded-[3px] text-[12px] absolute left-[-80px] top-[-45px]">
<div className="relative bg-black text-white rounded-[3px]">
<span className="text-center p-[6px] z-10">{hasInfo}</span>
<div className="absolute bottom-0 left-1/2 transform -translate-x-1/2 w-0 h-0 border-t-[10px] border-t-black border-r-[10px] border-r-transparent border-l-[10px] border-l-transparent"></div>
</div>
</div>
)}
{
iconType ? (
<TaskAssignButton
onClick={openModal}
disabled={arrowData?.activeTaskStatus ? arrowData?.disabled : arrowData?.task.status === 'closed'}
className={clsxm('h-9 w-9', arrowData?.className)}
iconClassName={arrowData?.iconClassName}
/>

) : (
<>
{
!hasMembers ?
(
<div
className="flex items-center justify-center rounded-full border-2 border-dashed border-[#6b7280] cursor-pointer"
style={{ width: diameter, height: diameter }}>
<RiUserFill
fill={"#6b7280"}
className="w-6 h-6 cursor-pointer stroke-[#c46060]"
onClick={openModal}
style={{ width: diameter / 2, height: diameter / 2 }}
onMouseOver={() => setShowInfo(true)}
onMouseOut={() => setShowInfo(false)}
/>
</div>
)
:
(
<div className="flex items-center justify-center rounded-full border-2 border-dashed border-[#6b7280] cursor-pointer"
style={{ width: diameter, height: diameter }}>
<RiUserAddFill
fill={"#6b7280"}
className="w-6 h-6 cursor-pointer stroke-[#c46060]"
onClick={openModal}
style={{ width: diameter / 2, height: diameter / 2 }}
onMouseOver={() => setShowInfo(true)}
onMouseOut={() => setShowInfo(false)}
/>
</div>
)
}

</>)
}
)}
{iconType ? (
<TaskAssignButton
onClick={openModal}
disabled={
arrowData?.activeTaskStatus ? arrowData?.disabled : arrowData?.task.status === 'closed'
}
className={clsxm('h-9 w-9', arrowData?.className)}
iconClassName={arrowData?.iconClassName}
/>
) : (
<>
{!hasMembers ? (
<div
className="flex items-center justify-center rounded-full border-2 border-dashed border-[#6b7280] cursor-pointer"
style={{ width: diameter, height: diameter }}
>
<RiUserFill
fill={'#6b7280'}
className="w-6 h-6 cursor-pointer stroke-[#c46060]"
onClick={openModal}
style={{ width: diameter / 2, height: diameter / 2 }}
onMouseOver={() => setShowInfo(true)}
onMouseOut={() => setShowInfo(false)}
/>
</div>
) : (
<div
className="flex items-center justify-center rounded-full border-2 border-dashed border-[#6b7280] cursor-pointer"
style={{ width: diameter, height: diameter }}
>
<RiUserAddFill
fill={'#6b7280'}
className="w-6 h-6 cursor-pointer stroke-[#c46060]"
onClick={openModal}
style={{ width: diameter / 2, height: diameter / 2 }}
onMouseOver={() => setShowInfo(true)}
onMouseOut={() => setShowInfo(false)}
/>
</div>
)}
</>
)}

<div>
<Modal
Expand Down Expand Up @@ -184,7 +180,7 @@ export default function ImageOverlapper({

<div className="sticky top-[100%] h-[60px] w-[100%]">
<Divider className="mt-4" />
<div className='flex -space-x-3.5 overflow-hidden flex-center mt-[5px] items-center sm:justify-between'>
<div className="flex -space-x-3.5 overflow-hidden flex-center mt-[5px] items-center sm:justify-between">
<TaskAvatars task={{ members: assignedMembers }} limit={3} />
<div className="flex px-4 h-fit">
<button
Expand All @@ -194,7 +190,8 @@ export default function ImageOverlapper({
h-12 gap-1 items-center"
onClick={() => {
onCLickValidate();
}}>
}}
>
<FaCheck size={17} fill="#ffffff" />
{t('common.CONFIRM')}
</button>
Expand Down
4 changes: 2 additions & 2 deletions apps/web/lib/components/kanban-card.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ function getStyle(provided: DraggableProvided, style: any) {
};
}

function setCommentIconColor(commentType: 'tagged' | 'untagged') {
export function setCommentIconColor(commentType: 'tagged' | 'untagged') {
let style;

if (commentType === 'tagged') {
Expand Down Expand Up @@ -77,7 +77,7 @@ export function TagList({ tags }: { tags: Tag[] }) {
);
}

function Priority({ level }: { level: ITaskPriority }) {
export function Priority({ level }: { level: ITaskPriority }) {
const levelSmallCase = level.toString().toLowerCase();
const levelIntoNumber =
levelSmallCase === 'low' ? 1 : levelSmallCase === 'medium' ? 2 : levelSmallCase === 'high' ? 3 : 4;
Expand Down
63 changes: 42 additions & 21 deletions apps/web/lib/features/task/daily-plan/future-tasks.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,20 @@ import { TaskCard } from '../task-card';
import { Button } from '@components/ui/button';
import { useCanSeeActivityScreen, useDailyPlan } from '@app/hooks';
import { ReloadIcon } from '@radix-ui/react-icons';
import { useRecoilValue } from 'recoil';
import { dailyPlanViewHeaderTabs } from '@app/stores/header-tabs';
import TaskBlockCard from '../task-block-card';
import { clsxm } from '@app/utils';
import { HorizontalSeparator } from 'lib/components';
import { useState } from 'react';
import { AlertPopup } from 'lib/components';

export function FutureTasks({ profile }: { profile: any }) {
const { deleteDailyPlan, deleteDailyPlanLoading, futurePlans } = useDailyPlan();
const canSeeActivity = useCanSeeActivityScreen();
const [popupOpen, setPopupOpen] = useState(false)
const [popupOpen, setPopupOpen] = useState(false);

const view = useRecoilValue(dailyPlanViewHeaderTabs);

return (
<div className="flex flex-col gap-6">
Expand All @@ -25,34 +32,48 @@ export function FutureTasks({ profile }: { profile: any }) {
<AccordionItem
value={plan.date.toString().split('T')[0]}
key={plan.id}
className="dark:border-slate-600"
className="dark:border-slate-600 !border-none"
>
<AccordionTrigger className="hover:no-underline">
<div className="text-lg">
{formatDayPlanDate(plan.date.toString())} ({plan.tasks?.length})
<AccordionTrigger className="!min-w-full text-start hover:no-underline">
<div className="flex items-center justify-between gap-3 w-full">
<div className="text-lg min-w-max">
{formatDayPlanDate(plan.date.toString())} ({plan.tasks?.length})
</div>
<HorizontalSeparator />
</div>
</AccordionTrigger>
<AccordionContent className="bg-light--theme border-none dark:bg-dark--theme">
{/* Plan header */}
<PlanHeader plan={plan} planMode="Outstanding" />

{/* Plan tasks list */}
<ul className="flex flex-col gap-2 pb-[1.5rem]">
{plan.tasks?.map((task) => (
<TaskCard
key={`${task.id}${plan.id}`}
isAuthUser={true}
activeAuthTask={true}
viewType={'dailyplan'}
task={task}
profile={profile}
type="HORIZONTAL"
taskBadgeClassName={`rounded-sm`}
taskTitleClassName="mt-[0.0625rem]"
plan={plan}
planMode="Future Tasks"
/>
))}
<ul
className={clsxm(
view === 'CARDS' && 'flex-col',
view === 'TABLE' && 'flex-wrap',
'flex gap-2 pb-[1.5rem]',
view === 'BLOCKS' && 'overflow-x-scroll'
)}
>
{plan.tasks?.map((task) =>
view === 'CARDS' ? (
<TaskCard
key={`${task.id}${plan.id}`}
isAuthUser={true}
activeAuthTask={true}
viewType={'dailyplan'}
task={task}
profile={profile}
type="HORIZONTAL"
taskBadgeClassName={`rounded-sm`}
taskTitleClassName="mt-[0.0625rem]"
plan={plan}
planMode="Future Tasks"
/>
) : (
<TaskBlockCard key={task.id} task={task} />
)
)}
</ul>

{/* Delete Plan */}
Expand Down
Loading

0 comments on commit a85315a

Please sign in to comment.