Merge branch 'release-v2.1.4' of https://github.com/Worklenz/worklenz into feature/team-utilization

This commit is contained in:
chamikaJ
2025-07-30 12:56:56 +05:30
173 changed files with 12856 additions and 1582 deletions

View File

@@ -1,14 +1,4 @@
import {
AutoComplete,
Button,
Drawer,
Flex,
Form,
message,
Select,
Spin,
Typography,
} from '@/shared/antd-imports';
import { AutoComplete, Button, Drawer, Flex, Form, message, Modal, Select, Spin, Typography } from '@/shared/antd-imports';
import { useAppSelector } from '@/hooks/useAppSelector';
import { useAppDispatch } from '@/hooks/useAppDispatch';
import {
@@ -21,6 +11,7 @@ import { jobTitlesApiService } from '@/api/settings/job-titles/job-titles.api.se
import { IJobTitle } from '@/types/job.types';
import { teamMembersApiService } from '@/api/team-members/teamMembers.api.service';
import { ITeamMemberCreateRequest } from '@/types/teamMembers/team-member-create-request';
import { LinkOutlined } from '@ant-design/icons';
interface FormValues {
email: string[];
@@ -97,23 +88,33 @@ const InviteTeamMembers = () => {
};
return (
<Drawer
<Modal
title={
<Typography.Text strong style={{ fontSize: 16 }}>
{t('addMemberDrawerTitle')}
</Typography.Text>
}
open={isDrawerOpen}
onClose={handleClose}
onCancel={handleClose}
destroyOnClose
afterOpenChange={visible => visible && handleSearch('')}
width={400}
loading={loading}
footer={
<Flex justify="end">
<Button type="primary" onClick={form.submit}>
{t('addToTeamButton')}
</Button>
<Flex justify="space-between">
{/* <Button
style={{ width: 140, fontSize: 12 }}
block
icon={<LinkOutlined />}
disabled
>
{t('copyTeamLink')}
</Button> */}
<Flex justify="end">
<Button onClick={form.submit} style={{ fontSize: 12 }}>
{t('addToTeamButton')}
</Button>
</Flex>
</Flex>
}
>
@@ -186,7 +187,7 @@ const InviteTeamMembers = () => {
/>
</Form.Item>
</Form>
</Drawer>
</Modal>
);
};

View File

@@ -10,6 +10,7 @@ import {
Image,
Input,
Flex,
theme,
} from '@/shared/antd-imports';
import React, { useEffect, useState } from 'react';
import { useSelector } from 'react-redux';
@@ -37,13 +38,12 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
showBothTabs = false,
templateSelected = (templateId: string) => {
if (!templateId) return;
templateId;
},
selectedTemplateType = (type: 'worklenz' | 'custom') => {
type;
},
}) => {
const themeMode = useSelector((state: RootState) => state.themeReducer.mode);
const { token } = theme.useToken();
const { t } = useTranslation('template-drawer');
const [searchQuery, setSearchQuery] = useState('');
@@ -149,7 +149,12 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
<Tag
key={phase.name}
color={phase.color_code}
style={{ color: 'black', marginBottom: '8px' }}
style={{
color: token.colorText,
marginBottom: '8px',
backgroundColor: phase.color_code ? undefined : token.colorBgContainer,
borderColor: phase.color_code ? undefined : token.colorBorder
}}
>
{phase.name}
</Tag>
@@ -171,7 +176,12 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
<Tag
key={status.name}
color={status.color_code}
style={{ color: 'black', marginBottom: '8px' }}
style={{
color: token.colorText,
marginBottom: '8px',
backgroundColor: status.color_code ? undefined : token.colorBgContainer,
borderColor: status.color_code ? undefined : token.colorBorder
}}
>
{status.name}
</Tag>
@@ -193,7 +203,12 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
<Tag
key={priority.name}
color={priority.color_code}
style={{ color: 'black', marginBottom: '8px' }}
style={{
color: token.colorText,
marginBottom: '8px',
backgroundColor: priority.color_code ? undefined : token.colorBgContainer,
borderColor: priority.color_code ? undefined : token.colorBorder
}}
>
{priority.name}
</Tag>
@@ -215,7 +230,12 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
<Tag
key={label.name}
color={label.color_code}
style={{ color: 'black', marginBottom: '8px' }}
style={{
color: token.colorText,
marginBottom: '8px',
backgroundColor: label.color_code ? undefined : token.colorBgContainer,
borderColor: label.color_code ? undefined : token.colorBorder
}}
>
{label.name}
</Tag>
@@ -251,14 +271,24 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
};
const menuContent = (
<div style={{ display: 'flex' }}>
<div style={{ display: 'flex', backgroundColor: token.colorBgContainer }}>
{/* Menu Area */}
<div style={{ minWidth: '250px', overflowY: 'auto', height: '100%' }}>
<div style={{
minWidth: '250px',
overflowY: 'auto',
height: '100%',
backgroundColor: token.colorBgContainer,
borderRight: `1px solid ${token.colorBorder}`
}}>
<Skeleton loading={loadingTemplates} active>
<Menu
className="template-menu"
onClick={({ key }) => handleMenuClick(key)}
style={{ width: 256 }}
style={{
width: 256,
backgroundColor: token.colorBgContainer,
borderColor: token.colorBorder
}}
defaultSelectedKeys={[templates[0]?.id || '']}
mode="inline"
items={menuItems}
@@ -272,9 +302,11 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
flex: 1,
maxHeight: 'calc(100vh - 200px)',
padding: '16px',
backgroundColor: token.colorBgContainer,
color: token.colorText
}}
>
<Title level={4}>Details</Title>
<Title level={4} style={{ color: token.colorText }}>Details</Title>
<Skeleton loading={loadingSelectedTemplate} active>
{selectedTemplate?.image_url && (
<Image preview={false} src={selectedTemplate.image_url} alt={selectedTemplate.name} />
@@ -297,12 +329,17 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
};
const customTemplatesContent = (
<div>
<div style={{ backgroundColor: token.colorBgContainer, padding: '16px' }}>
<Flex justify="space-between" align="center">
<Input
placeholder={t('searchTemplates')}
suffix={<SearchOutlined />}
style={{ maxWidth: '300px' }}
suffix={<SearchOutlined style={{ color: token.colorTextTertiary }} />}
style={{
maxWidth: '300px',
backgroundColor: token.colorBgContainer,
borderColor: token.colorBorder,
color: token.colorText
}}
onChange={e => setSearchQuery(e.target.value)}
/>
</Flex>
@@ -312,10 +349,20 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
bordered
dataSource={filteredCustomTemplates}
loading={loadingCustomTemplates}
style={{
backgroundColor: token.colorBgContainer,
borderColor: token.colorBorder
}}
renderItem={item => (
<List.Item
key={item.id}
onClick={() => handleCustomTemplateClick(item.id || '')}
style={{
backgroundColor: item.selected ? token.colorPrimaryBg : token.colorBgContainer,
borderColor: item.selected ? token.colorPrimary : token.colorBorder,
color: token.colorText,
cursor: 'pointer'
}}
className={
item.selected && themeMode === 'dark'
? 'selected-custom-template-dark'
@@ -324,7 +371,7 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
: ''
}
>
{item.name}
<span style={{ color: token.colorText }}>{item.name}</span>
</List.Item>
)}
/>
@@ -355,18 +402,31 @@ const TemplateDrawer: React.FC<TemplateDrawerProps> = ({
};
return (
<div style={{ height: '100vh', overflow: 'hidden' }}>
<div style={{
height: '100vh',
overflow: 'hidden',
backgroundColor: token.colorBgLayout
}}>
<div
style={{
position: 'sticky',
top: 0,
zIndex: 100,
backgroundColor: themeMode === 'dark' ? '' : '#fff',
backgroundColor: token.colorBgContainer,
overflow: 'hidden',
borderBottom: `1px solid ${token.colorBorder}`
}}
>
{showBothTabs ? (
<Tabs type="card" items={tabs} onChange={handleTabChange} destroyInactiveTabPane />
<Tabs
type="card"
items={tabs}
onChange={handleTabChange}
destroyInactiveTabPane
style={{
backgroundColor: token.colorBgContainer
}}
/>
) : (
menuContent
)}