From 010cbe1af8c3e48dc87401390b9dd2ce8431bb50 Mon Sep 17 00:00:00 2001
From: shancds <shancds1@gmail.com>
Date: Wed, 28 May 2025 10:50:35 +0530
Subject: [PATCH 1/3] feat(ratecard-drawer): enhance drawer close logic to
 handle unsaved changes and delete empty rate cards

---
 .../ratecard-drawer/ratecard-drawer.tsx       | 191 +++++++++---------
 1 file changed, 98 insertions(+), 93 deletions(-)

diff --git a/worklenz-frontend/src/features/finance/ratecard-drawer/ratecard-drawer.tsx b/worklenz-frontend/src/features/finance/ratecard-drawer/ratecard-drawer.tsx
index f3645752..b968f3e3 100644
--- a/worklenz-frontend/src/features/finance/ratecard-drawer/ratecard-drawer.tsx
+++ b/worklenz-frontend/src/features/finance/ratecard-drawer/ratecard-drawer.tsx
@@ -307,16 +307,21 @@ const RatecardDrawer = ({
     },
   ];
 
-  const handleDrawerClose = () => {
-    if (!name || name.trim() === '' || name === 'Untitled Rate Card') {
+  const handleDrawerClose = async() => {
+    if (!name || name.trim() === '') {
       messageApi.open({
-      type: 'warning',
-      content: t('ratecardNameRequired') || 'Rate card name is required.',
-    });
-    return;
-  } else if (hasChanges) {
+        type: 'warning',
+        content: t('ratecardNameRequired') || 'Rate card name is required.',
+      });
+      return;
+    } else if (hasChanges) {
       setShowUnsavedAlert(true);
-    } else {
+    } 
+    else if (name === 'Untitled Rate Card' && roles.length === 0){
+      await dispatch(deleteRateCard(ratecardId));
+      dispatch(toggleRatecardDrawer());
+    }
+    else {
       dispatch(toggleRatecardDrawer());
     }
   };
@@ -339,95 +344,95 @@ const RatecardDrawer = ({
 
   return (
     <>
-    {contextHolder}
-    <Drawer
-      loading={drawerLoading}
-      onClose={handleDrawerClose}
-      title={
-        <Flex align="center" justify="space-between">
-          <Typography.Text style={{ fontWeight: 500, fontSize: 16 }}>
-            <Input
-              value={name}
-              placeholder="Enter rate card name"
-              style={{
-                fontWeight: 500,
-                fontSize: 16,
-                background: 'transparent',
-                border: 'none',
-                boxShadow: 'none',
-                padding: 0,
-              }}
-              onChange={e => {
-                setName(e.target.value);
-              }}
-            />
-          </Typography.Text>
-          <Flex gap={8} align="center">
-            <Typography.Text>{t('currency')}</Typography.Text>
-            <Select
-              value={currency}
-              options={[
-                { value: 'USD', label: 'USD' },
-                { value: 'LKR', label: 'LKR' },
-                { value: 'INR', label: 'INR' },
-              ]}
-              onChange={(value) => setCurrency(value)}
-            />
-            <Button onClick={handleAddAllRoles} type="default">
-              {t('addAllButton') || 'Add All'}
+      {contextHolder}
+      <Drawer
+        loading={drawerLoading}
+        onClose={handleDrawerClose}
+        title={
+          <Flex align="center" justify="space-between">
+            <Typography.Text style={{ fontWeight: 500, fontSize: 16 }}>
+              <Input
+                value={name}
+                placeholder="Enter rate card name"
+                style={{
+                  fontWeight: 500,
+                  fontSize: 16,
+                  background: 'transparent',
+                  border: 'none',
+                  boxShadow: 'none',
+                  padding: 0,
+                }}
+                onChange={e => {
+                  setName(e.target.value);
+                }}
+              />
+            </Typography.Text>
+            <Flex gap={8} align="center">
+              <Typography.Text>{t('currency')}</Typography.Text>
+              <Select
+                value={currency}
+                options={[
+                  { value: 'USD', label: 'USD' },
+                  { value: 'LKR', label: 'LKR' },
+                  { value: 'INR', label: 'INR' },
+                ]}
+                onChange={(value) => setCurrency(value)}
+              />
+              <Button onClick={handleAddAllRoles} type="default">
+                {t('addAllButton') || 'Add All'}
+              </Button>
+            </Flex>
+          </Flex>
+        }
+        open={isDrawerOpen}
+        width={700}
+        footer={
+          <Flex justify="end" gap={16} style={{ marginTop: 16 }}>
+            <Button style={{ marginBottom: 24 }} onClick={handleSave} type="primary" disabled={name === '' || (name === 'Untitled Rate Card' && roles.length === 0)}>
+              {t('saveButton')}
             </Button>
           </Flex>
-        </Flex>
-      }
-      open={isDrawerOpen}
-      width={700}
-      footer={
-        <Flex justify="end" gap={16} style={{ marginTop: 16 }}>
-          <Button style={{ marginBottom: 24 }} onClick={handleSave} type="primary" disabled={name === '' || (name === 'Untitled Rate Card' && roles.length === 0)}>
-            {t('saveButton')}
-          </Button>
-        </Flex>
-      }
-    >
-      {showUnsavedAlert && (
-        <Alert
-          message={t('unsavedChangesTitle') || 'Unsaved Changes'}
-          type="warning"
-          showIcon
-          closable
-          onClose={() => setShowUnsavedAlert(false)}
-          action={
-            <Space direction="horizontal">
-              <Button size="small" type="primary" onClick={handleConfirmSave}>
-                Save
-              </Button>
-              <Button size="small" danger onClick={handleConfirmDiscard}>
-                Discard
-              </Button>
-            </Space>
-          }
-          style={{ marginBottom: 16 }}
-        />
-      )}
-      <Table
-        dataSource={roles}
-        columns={columns}
-        rowKey={(record) => record.job_title_id}
-        pagination={false}
-        footer={() => (
-          <Button
-            type="dashed"
-            onClick={handleAddRole}
-            block
-            style={{ margin: 0, padding: 0 }}
-          >
-            {t('addRoleButton')}
-          </Button>
+        }
+      >
+        {showUnsavedAlert && (
+          <Alert
+            message={t('unsavedChangesTitle') || 'Unsaved Changes'}
+            type="warning"
+            showIcon
+            closable
+            onClose={() => setShowUnsavedAlert(false)}
+            action={
+              <Space direction="horizontal">
+                <Button size="small" type="primary" onClick={handleConfirmSave}>
+                  Save
+                </Button>
+                <Button size="small" danger onClick={handleConfirmDiscard}>
+                  Discard
+                </Button>
+              </Space>
+            }
+            style={{ marginBottom: 16 }}
+          />
         )}
-      />
-    </Drawer>
+        <Table
+          dataSource={roles}
+          columns={columns}
+          rowKey={(record) => record.job_title_id}
+          pagination={false}
+          footer={() => (
+            <Button
+              type="dashed"
+              onClick={handleAddRole}
+              block
+              style={{ margin: 0, padding: 0 }}
+            >
+              {t('addRoleButton')}
+            </Button>
+          )}
+        />
+      </Drawer>
     </>
-    
+
   );
 };
 

From 5cb6548889bd5bd4b6dc60f59be3508f2ff125e4 Mon Sep 17 00:00:00 2001
From: shancds <shancds1@gmail.com>
Date: Wed, 28 May 2025 12:12:33 +0530
Subject: [PATCH 2/3] feat(import-ratecards-drawer): add alert for already
 imported rate cards and update button logic

---
 .../locales/en/project-view-finance.json      |  3 +-
 .../import-ratecards-drawer.tsx               | 67 +++++++++++--------
 2 files changed, 42 insertions(+), 28 deletions(-)

diff --git a/worklenz-frontend/public/locales/en/project-view-finance.json b/worklenz-frontend/public/locales/en/project-view-finance.json
index 2c2d0325..642422b2 100644
--- a/worklenz-frontend/public/locales/en/project-view-finance.json
+++ b/worklenz-frontend/public/locales/en/project-view-finance.json
@@ -35,7 +35,8 @@
     "ratecardsPluralText": "Rate Card Templates",
     "deleteConfirm": "Are you sure ?",
     "yes": "Yes",
-    "no": "No"
+    "no": "No",
+    "alreadyImportedRateCardMessage": "A rate card has already been imported. Clear all imported rate cards to add a new one."
 
   }
   
\ No newline at end of file
diff --git a/worklenz-frontend/src/features/finance/ratecard-drawer/import-ratecards-drawer.tsx b/worklenz-frontend/src/features/finance/ratecard-drawer/import-ratecards-drawer.tsx
index ff44f9f0..3e9e4d10 100644
--- a/worklenz-frontend/src/features/finance/ratecard-drawer/import-ratecards-drawer.tsx
+++ b/worklenz-frontend/src/features/finance/ratecard-drawer/import-ratecards-drawer.tsx
@@ -1,4 +1,4 @@
-import { Drawer, Typography, Button, Table, Menu, Flex, Spin } from 'antd';
+import { Drawer, Typography, Button, Table, Menu, Flex, Spin, Alert } from 'antd';
 import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useAppSelector } from '../../../hooks/useAppSelector';
@@ -85,32 +85,45 @@ const ImportRatecardsDrawer: React.FC = () => {
       }
       footer={
         <div style={{ textAlign: 'right' }}>
-            <Button
-            type="primary"
-            disabled={rolesRedux.length !== 0}
-            onClick={() => {
-              if (!projectId) {
-              // Handle missing project id (show error, etc.)
-              return;
-              }
-              if (drawerRatecard?.jobRolesList?.length) {
-              dispatch(
-                insertProjectRateCardRoles({
-                project_id: projectId,
-                roles: drawerRatecard.jobRolesList
-                  .filter((role) => typeof role.rate !== 'undefined')
-                  .map((role) => ({
-                  ...role,
-                  rate: Number(role.rate),
-                  })),
-                })
-              );
-              }
-              dispatch(toggleImportRatecardsDrawer());
-            }}
-            >
-            {t('import')}
-            </Button>
+          {/* Alert message */}
+          {rolesRedux.length !== 0 ? (
+            <div style={{ textAlign: 'right' }}>
+              <Alert
+                message={t('alreadyImportedRateCardMessage') || 'A rate card has already been imported. Clear all imported rate cards to add a new one.'}
+                type="warning"
+                showIcon
+                style={{ marginBottom: 16 }}
+              />
+            </div>
+          ) : (
+            <div style={{ textAlign: 'right' }}>
+              <Button
+                type="primary"
+                onClick={() => {
+                  if (!projectId) {
+                    // Handle missing project id (show error, etc.)
+                    return;
+                  }
+                  if (drawerRatecard?.jobRolesList?.length) {
+                    dispatch(
+                      insertProjectRateCardRoles({
+                        project_id: projectId,
+                        roles: drawerRatecard.jobRolesList
+                          .filter((role) => typeof role.rate !== 'undefined')
+                          .map((role) => ({
+                            ...role,
+                            rate: Number(role.rate),
+                          })),
+                      })
+                    );
+                  }
+                  dispatch(toggleImportRatecardsDrawer());
+                }}
+              >
+                {t('import')}
+              </Button>
+            </div>
+          )}
         </div>
       }
       open={isDrawerOpen}

From cae55241687f544bb603345ba280a605981eaaf8 Mon Sep 17 00:00:00 2001
From: shancds <shancds1@gmail.com>
Date: Wed, 28 May 2025 12:38:19 +0530
Subject: [PATCH 3/3] feat(ratecard-assignee-selector): add assignedMembers
 prop to handle member assignment across job titles

---
 .../ratecard-assignee-selector.tsx            | 63 ++++++++++---------
 .../reatecard-table/ratecard-table.tsx        |  5 ++
 2 files changed, 40 insertions(+), 28 deletions(-)

diff --git a/worklenz-frontend/src/components/project-ratecard/ratecard-assignee-selector.tsx b/worklenz-frontend/src/components/project-ratecard/ratecard-assignee-selector.tsx
index 175ad48e..dc2521d4 100644
--- a/worklenz-frontend/src/components/project-ratecard/ratecard-assignee-selector.tsx
+++ b/worklenz-frontend/src/components/project-ratecard/ratecard-assignee-selector.tsx
@@ -23,7 +23,8 @@ const RateCardAssigneeSelector = ({
   onChange,
   selectedMemberIds = [],
   memberlist = [],
-}: RateCardAssigneeSelectorProps) => {
+  assignedMembers = [], // New prop: List of all assigned member IDs across all job titles
+}: RateCardAssigneeSelectorProps & { assignedMembers: string[] }) => {
   const membersInputRef = useRef<InputRef>(null);
   const [searchQuery, setSearchQuery] = useState('');
   const [members, setMembers] = useState<IProjectMemberViewModel[]>(memberlist);
@@ -46,33 +47,39 @@ const RateCardAssigneeSelector = ({
       />
       <List style={{ padding: 0, maxHeight: 200, overflow: 'auto' }}>
         {filteredMembers.length ? (
-          filteredMembers.map((member) => (
-            <List.Item
-              key={member.id}
-              style={{
-                display: 'flex',
-                gap: 8,
-                alignItems: 'center',
-                padding: '4px 8px',
-                border: 'none',
-                opacity: member.pending_invitation ? 0.5 : 1,
-                justifyContent: 'flex-start',
-                textAlign: 'left',
-              }}
-            >
-              <Checkbox
-                checked={selectedMemberIds.includes(member.id || '')}
-                disabled={member.pending_invitation}
-                onChange={() => onChange?.(member.id || '')}
-              />
-              <SingleAvatar
-                avatarUrl={member.avatar_url}
-                name={member.name}
-                email={member.email}
-              />
-              <span>{member.name}</span>
-            </List.Item>
-          ))
+          filteredMembers.map((member) => {
+            const isAssignedToAnotherJobTitle =
+              assignedMembers.includes(member.id || '') &&
+              !selectedMemberIds.includes(member.id || ''); // Check if the member is assigned elsewhere
+
+            return (
+              <List.Item
+                key={member.id}
+                style={{
+                  display: 'flex',
+                  gap: 8,
+                  alignItems: 'center',
+                  padding: '4px 8px',
+                  border: 'none',
+                  opacity: member.pending_invitation || isAssignedToAnotherJobTitle ? 0.5 : 1,
+                  justifyContent: 'flex-start',
+                  textAlign: 'left',
+                }}
+              >
+                <Checkbox
+                  checked={selectedMemberIds.includes(member.id || '')}
+                  disabled={member.pending_invitation || isAssignedToAnotherJobTitle}
+                  onChange={() => onChange?.(member.id || '')}
+                />
+                <SingleAvatar
+                  avatarUrl={member.avatar_url}
+                  name={member.name}
+                  email={member.email}
+                />
+                <span>{member.name}</span>
+              </List.Item>
+            );
+          })
         ) : (
           <Empty description="No members found" />
         )}
diff --git a/worklenz-frontend/src/pages/projects/projectView/finance/ratecard-tab/reatecard-table/ratecard-table.tsx b/worklenz-frontend/src/pages/projects/projectView/finance/ratecard-tab/reatecard-table/ratecard-table.tsx
index 51818231..3a621f10 100644
--- a/worklenz-frontend/src/pages/projects/projectView/finance/ratecard-tab/reatecard-table/ratecard-table.tsx
+++ b/worklenz-frontend/src/pages/projects/projectView/finance/ratecard-tab/reatecard-table/ratecard-table.tsx
@@ -191,6 +191,10 @@ const RatecardTable: React.FC = () => {
     }
   };
 
+  const assignedMembers = roles
+    .flatMap((role) => role.members || [])
+    .filter((memberId, index, self) => self.indexOf(memberId) === index);
+
   // Columns
   const columns: TableProps<JobRoleType>['columns'] = [
     {
@@ -267,6 +271,7 @@ const RatecardTable: React.FC = () => {
               selectedMemberIds={memberscol || []}
               onChange={(memberId) => handleMemberChange(memberId, index, record)}
               memberlist={members}
+              assignedMembers={assignedMembers} // Pass assigned members here
             />
           </div>
         </div>