From ff0595b021e998d2fb261c46d6f829f6f1bc1c6c Mon Sep 17 00:00:00 2001 From: Pramod Mahajan Date: Wed, 16 Apr 2025 11:01:02 +0530 Subject: [PATCH 1/9] customize avatar size --- src/components/common/Avatar.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/common/Avatar.jsx b/src/components/common/Avatar.jsx index a09d97d3..900c9403 100644 --- a/src/components/common/Avatar.jsx +++ b/src/components/common/Avatar.jsx @@ -1,6 +1,6 @@ import React from "react"; -const Avatar = ({ firstName, lastName }) => { +const Avatar = ({ firstName, lastName, size='sm' }) => { function generateAvatarText(firstName, lastName) { if (!firstName) return ""; if (!lastName || lastName.trim() === "") { @@ -27,7 +27,7 @@ const Avatar = ({ firstName, lastName }) => { return ( <>
-
+
From 9708a9184c4f13d9373eb6ee055250e1f79fd7f0 Mon Sep 17 00:00:00 2001 From: Pramod Mahajan Date: Wed, 16 Apr 2025 11:01:56 +0530 Subject: [PATCH 2/9] added new suspend model inside employee list --- src/components/Employee/SuspendEmp.jsx | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 src/components/Employee/SuspendEmp.jsx diff --git a/src/components/Employee/SuspendEmp.jsx b/src/components/Employee/SuspendEmp.jsx new file mode 100644 index 00000000..a508e62c --- /dev/null +++ b/src/components/Employee/SuspendEmp.jsx @@ -0,0 +1,24 @@ +import React from 'react' + +const SuspendEmp = ({onClose}) => { + return ( +
+
+
+ +
+
Coming Soon
+
+
+
+ + ) +} + +export default SuspendEmp \ No newline at end of file From 093e38096cbb54dc9eb431b81c3d54be879a5e02 Mon Sep 17 00:00:00 2001 From: Pramod Mahajan Date: Wed, 16 Apr 2025 11:04:48 +0530 Subject: [PATCH 3/9] changed export dropdown option and add new model for suspend employee --- src/pages/employee/EmployeeList.jsx | 55 +++++++++++------------------ 1 file changed, 21 insertions(+), 34 deletions(-) diff --git a/src/pages/employee/EmployeeList.jsx b/src/pages/employee/EmployeeList.jsx index 0e0f87a6..301e61a7 100644 --- a/src/pages/employee/EmployeeList.jsx +++ b/src/pages/employee/EmployeeList.jsx @@ -10,6 +10,7 @@ import { useProfile } from "../../hooks/useProfile"; import { hasUserPermission } from "../../utils/authUtils"; import { MANAGE_EMPLOYEES } from "../../utils/constants"; import { useHasUserPermission } from "../../hooks/useHasUserPermission"; +import SuspendEmp from "../../components/Employee/SuspendEmp"; const EmployeeList = () => { @@ -26,10 +27,11 @@ const EmployeeList = () => const [employeeList, setEmployeeList] = useState([]); const [modelConfig, setModelConfig] = useState(); const [currentPage, setCurrentPage] = useState(1); - const [itemsPerPage] = useState(5); + const [itemsPerPage] = useState(10); const [isCreateModalOpen, setIsCreateModalOpen] = useState(false); const [searchText, setSearchText] = useState(""); - const [filteredData, setFilteredData] = useState([]); + const [ filteredData, setFilteredData ] = useState( [] ); + const [showModal, setShowModal] = useState(false); const navigate = useNavigate(); const handleSearch = (e) => { @@ -74,7 +76,6 @@ const EmployeeList = () => const closeModal = () => { setIsCreateModalOpen(false); - const modalElement = document.getElementById("managerole-modal"); if (modalElement) { modalElement.classList.remove("show"); @@ -83,7 +84,9 @@ const EmployeeList = () => document.querySelector(".modal-backdrop").remove(); } }; - + const handleShow = () => setShowModal(true); + const handleClose = () => setShowModal( false ); + const handleConfigData = (config) => { setModelConfig(config); }; @@ -99,6 +102,17 @@ const EmployeeList = () => {isCreateModalOpen && ( )} + +
+ +
+
className="dropdown-item" href="#" > - - Print - - -
  • - - - Csv - -
    • -
  • - - - Excel - -
    • - -
  • - - - Pdf + {/* */} + Coming Soon
    • @@ -442,7 +429,7 @@ const EmployeeList = () => > Edit - +
    +
    +
    From 6bf8fcf9a26fb6ba0b29ddca954f4b24b83326f8 Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Wed, 16 Apr 2025 15:55:28 +0530 Subject: [PATCH 8/9] refactor: optimize Avatar component for better performance and readability --- src/components/common/Avatar.jsx | 51 +++++++++++++++++++++++--------- 1 file changed, 37 insertions(+), 14 deletions(-) diff --git a/src/components/common/Avatar.jsx b/src/components/common/Avatar.jsx index 900c9403..537af159 100644 --- a/src/components/common/Avatar.jsx +++ b/src/components/common/Avatar.jsx @@ -1,6 +1,22 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; + +// A simple hash function to generate a deterministic value from the name +function hashString(str) { + let hash = 0; + for (let i = 0; i < str.length; i++) { + const char = str.charCodeAt(i); + hash = (hash << 5) - hash + char; + } + return hash; +} const Avatar = ({ firstName, lastName, size='sm' }) => { + // Combine firstName and lastName to create a unique string for hashing + const fullName = `${firstName} ${lastName}`; + + const [bgClass, setBgClass] = useState(""); + + // Function to generate the avatar text function generateAvatarText(firstName, lastName) { if (!firstName) return ""; if (!lastName || lastName.trim() === "") { @@ -9,7 +25,8 @@ const Avatar = ({ firstName, lastName, size='sm' }) => { return `${firstName[0]}${lastName[0]}`.toUpperCase(); } - function getRandomBootstrapBgClass() { + // Function to map the hash value to a Bootstrap background class + function getBgClassFromHash(hash) { const bgClasses = [ "bg-primary", "bg-secondary", @@ -21,21 +38,27 @@ const Avatar = ({ firstName, lastName, size='sm' }) => { "text-light", ]; - const randomIndex = Math.floor(Math.random() * bgClasses.length); - return bgClasses[randomIndex]; + // Use the hash value to pick a background color from the array + const index = Math.abs(hash % bgClasses.length); + return bgClasses[index]; } + + useEffect(() => { + // Generate the hash from the full name and map it to a background class + const hash = hashString(fullName); + setBgClass(getBgClassFromHash(hash)); + }, [fullName]); // Re-run if the fullName changes + return ( - <> -
    -
    - - {generateAvatarText(firstName, lastName)} - -
    +
    +
    + + {generateAvatarText(firstName, lastName)} +
    - +
    ); }; From dcc6b80f122eeef89aec26499584196aecd824d6 Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Wed, 16 Apr 2025 15:55:53 +0530 Subject: [PATCH 9/9] refactor: clean up Header component for improved readability --- src/components/Layout/Header.jsx | 21 ++++++++------------- 1 file changed, 8 insertions(+), 13 deletions(-) diff --git a/src/components/Layout/Header.jsx b/src/components/Layout/Header.jsx index ae380b24..dcaa306f 100644 --- a/src/components/Layout/Header.jsx +++ b/src/components/Layout/Header.jsx @@ -6,9 +6,8 @@ import {changeMaster} from "../../slices/localVariablesSlice"; import useMaster from "../../hooks/masterHook/useMaster"; import {useProfile} from "../../hooks/useProfile"; import {useNavigate} from "react-router-dom"; - -const Header = () => -{ +import Avatar from "../../components/common/Avatar"; +const Header = () =>{ const {profile} = useProfile() const dispatch = useDispatch( changeMaster( "Job Role" ) ) const {data, loading} = useMaster() @@ -88,11 +87,9 @@ const Header = () => data-bs-toggle="dropdown" >
    - avatar-image
    @@ -106,11 +103,9 @@ const Header = () =>
    - avatar-image