@homefile/components-v2 2.8.43 → 2.8.45

package/dist/components/partner/panel/PartnerCatalogPanel.js

@@ -8,5 +8,5 @@ export const PartnerCatalogPanel = ({ config, onClose, onPartnerAdd, partners, }
     const { codeValue, displayType, handleSearchByCode, handleCategoryFilter, handleSearch, partnerList, searchTerm, setDisplayType, } = usePartnerCatalogPanel({
         partners,
     });
-    return (_jsxs(DrawerContent, { bg: "lightBlue.1", children: [_jsxs(DrawerHeader, { p: "0", children: [_jsx(PanelHeader, { handleCloseButton: onClose, title: t('partner.add'), icon: Catalog }), (config === null || config === void 0 ? void 0 : config.showCode) && (_jsx(PartnerCode, { code: codeValue, onCodeChange: handleSearchByCode })), _jsx(CatalogFilters, { onCategoryClick: handleCategoryFilter, onSearchChange: handleSearch, searchValue: searchTerm, showCategories: config === null || config === void 0 ? void 0 : config.showCategories })] }), _jsxs(DrawerBody, { p: "0", children: [_jsx(CatalogDisplay, { initialDisplay: displayType, onDisplayClick: setDisplayType, totalItems: partners.length, totalShowing: partnerList.length }), displayType === 'grid' && (_jsx(Grid, { templateColumns: ['repeat(2, 1fr)', 'repeat(3, 1fr)'], gap: "base", px: "base", pb: "40px", children: partnerList.map((partner) => (_jsx(CatalogPartnerCard, Object.assign({}, partner, { onAdd: onPartnerAdd })))) })), displayType === 'list' && (_jsx(Stack, { spacing: "1", px: "base", pb: "40px", children: partnerList.map((partner) => (_jsx(CatalogPartnerList, Object.assign({}, partner, { onAdd: onPartnerAdd })))) }))] })] }));
+    return (_jsxs(DrawerContent, { bg: "lightBlue.1", children: [_jsxs(DrawerHeader, { p: "0", children: [_jsx(PanelHeader, { handleCloseButton: onClose, title: t('partner.add'), icon: Catalog }), (config === null || config === void 0 ? void 0 : config.showCode) && (_jsx(PartnerCode, { code: codeValue, onCodeChange: handleSearchByCode })), _jsx(CatalogFilters, { onCategoryClick: handleCategoryFilter, onSearchChange: handleSearch, searchValue: searchTerm, showCategories: config === null || config === void 0 ? void 0 : config.showCategories })] }), _jsxs(DrawerBody, { p: "0", children: [_jsx(CatalogDisplay, { initialDisplay: displayType, onDisplayClick: setDisplayType, totalItems: partners.length, totalShowing: partnerList.length }), displayType === 'grid' && (_jsx(Grid, { templateColumns: ['repeat(2, 1fr)', 'repeat(3, 1fr)'], gap: "base", px: "base", pb: "40px", children: partnerList.map((partner) => (_jsx(CatalogPartnerCard, Object.assign({}, partner, { onAdd: onPartnerAdd }), partner._id))) })), displayType === 'list' && (_jsx(Stack, { spacing: "1", px: "base", pb: "40px", children: partnerList.map((partner) => (_jsx(CatalogPartnerList, Object.assign({}, partner, { onAdd: onPartnerAdd })))) }))] })] }));
 };

package/dist/components/rooms/GroupCardHeader.js

@@ -4,11 +4,9 @@ import { Divider, Flex, Image, Show, Text } from '@chakra-ui/react';
 import { IconMenu, MoreHorizontal } from '..';
 import { Group } from '../../assets/images';
 import { GroupIcons } from '../../helpers';
-import { useGroupCardHeader } from '../../hooks';
+import { getIconAltText } from '../../utils';
 export const GroupCardHeader = ({ title, totalAmount, menuItems, }) => {
-    const { haveNoMenuItems, iconAlt } = useGroupCardHeader({
-        menuItems,
-        title,
-    });
-    return (_jsxs(Flex, { justifyContent: "space-between", bg: "neutral.white", align: "center", children: [_jsxs(Flex, { gap: "base", id: "organizeByGroup", bg: "neutral.white", p: "4", children: [_jsx(Image, { src: GroupIcons[title] || Group, alt: iconAlt, w: "1rem", h: "auto" }), _jsx(Text, { noOfLines: 1, children: title })] }), _jsxs(Flex, { align: "center", gap: "base", p: "4", id: "trackGroupValue", bg: "neutral.white", children: [_jsx(Show, { breakpoint: "(min-width: 600px)", children: _jsx(Text, { textColor: "gray.4", fontWeight: "semibold", fontSize: "xs", mr: "3", children: t('groups.total') }) }), _jsx(Text, { textColor: "blue.8", fontWeight: "semibold", fontSize: ['md', 'lg'], children: totalAmount }), menuItems && menuItems.length > 0 && (_jsxs(_Fragment, { children: [_jsx(Show, { breakpoint: "(min-width: 600px)", children: _jsx(Divider, { orientation: "vertical", h: "6" }) }), _jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 38 }), menuItems: menuItems, disabled: haveNoMenuItems })] }))] })] }));
+    const iconAlt = getIconAltText(GroupIcons[title]);
+    const hasMenuItems = Number(menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) > 0;
+    return (_jsxs(Flex, { justifyContent: "space-between", bg: "neutral.white", align: "center", children: [_jsxs(Flex, { gap: "base", id: "organizeByGroup", bg: "neutral.white", p: "4", children: [_jsx(Image, { src: GroupIcons[title] || Group, alt: iconAlt, w: "1rem", h: "auto" }), _jsx(Text, { noOfLines: 1, children: title })] }), _jsxs(Flex, { align: "center", gap: "base", p: "4", id: "trackGroupValue", bg: "neutral.white", children: [_jsx(Show, { breakpoint: "(min-width: 600px)", children: _jsx(Text, { textColor: "gray.4", fontWeight: "semibold", fontSize: "xs", mr: "3", children: t('groups.total') }) }), _jsx(Text, { textColor: "blue.8", fontWeight: "semibold", fontSize: ['md', 'lg'], children: totalAmount }), hasMenuItems && (_jsxs(_Fragment, { children: [_jsx(Show, { breakpoint: "(min-width: 600px)", children: _jsx(Divider, { orientation: "vertical", h: "6" }) }), _jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 38 }), menuItems: menuItems, disabled: !hasMenuItems })] }))] })] }));
 };

package/dist/hooks/partner/panel/usePartnerCatalogPanel.d.ts

@@ -9,7 +9,6 @@ export declare const usePartnerCatalogPanel: ({ partners, }: UsePartnerCatalogPa
     handleCategoryFilter: (category: string) => void;
     handleSearch: (input: React.ChangeEvent<HTMLInputElement>) => void;
     partnerList: {
-        key: string;
         _id: string;
         bgColor: string;
         category: string;

package/dist/hooks/partner/panel/usePartnerCatalogPanel.js

@@ -4,7 +4,7 @@ import { categoryColors, partnerCategoriesIcons } from '../../../helpers';
 export const usePartnerCatalogPanel = ({ partners, }) => {
     const partnerListMapped = partners.map((partner) => {
         var _a, _b, _c;
-        return Object.assign(Object.assign({}, partner), { key: partner._id, _id: partner._id, bgColor: categoryColors[(_a = partner.category) !== null && _a !== void 0 ? _a : 'other'], category: t(`partner.categories.${(_b = partner.category) !== null && _b !== void 0 ? _b : 'other'}`), description: partner.description, icon: partnerCategoriesIcons[(_c = partner.category) !== null && _c !== void 0 ? _c : 'other'], name: partner.name, code: partner.code });
+        return Object.assign(Object.assign({}, partner), { _id: partner._id, bgColor: categoryColors[(_a = partner.category) !== null && _a !== void 0 ? _a : 'other'], category: t(`partner.categories.${(_b = partner.category) !== null && _b !== void 0 ? _b : 'other'}`), description: partner.description, icon: partnerCategoriesIcons[(_c = partner.category) !== null && _c !== void 0 ? _c : 'other'], name: partner.name, code: partner.code });
     });
     const [displayType, setDisplayType] = useState('grid');
     const [partnerList, setPartnerList] = useState(partnerListMapped);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homefile/components-v2",
-  "version": "2.8.43",
+  "version": "2.8.45",
   "author": "Homefile",
   "license": "UNLICENSED",
   "typings": "dist/index.d.ts",

package/src/components/partner/panel/PartnerCatalogPanel.tsx

@@ -69,7 +69,7 @@ export const PartnerCatalogPanel = ({
             pb="40px"
           >
             {partnerList.map((partner) => (
-              <CatalogPartnerCard {...partner} onAdd={onPartnerAdd} />
+              <CatalogPartnerCard key={partner._id} {...partner} onAdd={onPartnerAdd} />
             ))}
           </Grid>
         )}

package/src/components/rooms/GroupCardHeader.tsx

@@ -4,17 +4,15 @@ import { IconMenu, MoreHorizontal } from '@/components'
 import { GroupCardHeaderI } from '@/interfaces'
 import { Group } from '@/assets/images'
 import { GroupIcons } from '@/helpers'
-import { useGroupCardHeader } from '@/hooks'
+import { getIconAltText } from '@/utils'
 
 export const GroupCardHeader = ({
   title,
   totalAmount,
   menuItems,
 }: GroupCardHeaderI) => {
-  const { haveNoMenuItems, iconAlt } = useGroupCardHeader({
-    menuItems,
-    title,
-  })
+  const iconAlt = getIconAltText(GroupIcons[title])
+  const hasMenuItems = Number(menuItems?.length) > 0
 
   return (
     <Flex justifyContent="space-between" bg="neutral.white" align="center">
@@ -42,7 +40,7 @@ export const GroupCardHeader = ({
         <Text textColor="blue.8" fontWeight="semibold" fontSize={['md', 'lg']}>
           {totalAmount}
         </Text>
-        {menuItems && menuItems.length > 0 && (
+        {hasMenuItems && (
           <>
             <Show breakpoint="(min-width: 600px)">
               <Divider orientation="vertical" h="6" />
@@ -50,7 +48,7 @@ export const GroupCardHeader = ({
             <IconMenu
               icon={<MoreHorizontal size={38} />}
               menuItems={menuItems}
-              disabled={haveNoMenuItems}
+              disabled={!hasMenuItems}
             />
           </>
         )}

package/src/hooks/partner/panel/usePartnerCatalogPanel.ts

@@ -13,7 +13,6 @@ export const usePartnerCatalogPanel = ({
   const partnerListMapped = partners.map((partner) => {
     return {
       ...partner,
-      key: partner._id,
       _id: partner._id,
       bgColor: categoryColors[partner.category ?? 'other'],
       category: t(`partner.categories.${partner.category ?? 'other'}`),