@homefile/components-v2 2.24.13 → 2.24.15

package/dist/components/receipts/displayReceipts/GridReceipt.d.ts

@@ -1,2 +1,2 @@
 import { ReceiptI } from '../../../interfaces';
-export declare const GridReceipt: ({ assignStatus, _id, itemQuantity, menuItems, onClick, purchaseDate, receiptOrigin, total, }: ReceiptI) => import("react/jsx-runtime").JSX.Element;
+export declare const GridReceipt: ({ assignStatus, _id, itemQuantity, menuItems, onClick, purchaseDate, receiptOrigin, total, name }: ReceiptI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/receipts/displayReceipts/GridReceipt.js

@@ -5,7 +5,7 @@ import { ReceiptBg } from '../../../assets/images';
 import { IconMenu, MoreHorizontal, TextBadge } from '../..';
 import { receiptOrigins } from '../../../helpers';
 import { formatDateTime } from '../../../utils';
-export const GridReceipt = ({ assignStatus = 'unfiled', _id, itemQuantity, menuItems, onClick, purchaseDate, receiptOrigin = 'homeDepot', total, }) => {
+export const GridReceipt = ({ assignStatus = 'unfiled', _id, itemQuantity, menuItems, onClick, purchaseDate, receiptOrigin = 'homeDepot', total, name }) => {
     const storeImage = receiptOrigins[receiptOrigin];
     const handleClick = () => onClick(_id);
     const { formattedDate: date, formattedTime: time } = formatDateTime({
@@ -29,5 +29,5 @@ export const GridReceipt = ({ assignStatus = 'unfiled', _id, itemQuantity, menuI
         },
     };
     const { bgColor, text, width } = assignStatusMap[assignStatus];
-    return (_jsx(ButtonGroup, { transition: "all 200ms linear", _hover: { boxShadow: 'xl' }, children: _jsxs(Box, { boxShadow: "md", minW: ['91px', '108px'], position: "relative", children: [!!bgColor && (_jsx(Box, { position: "absolute", top: "-5px", left: "0", children: _jsx(TextBadge, { bgColor: bgColor, text: text, width: width }) })), _jsx(Box, { bgImg: ReceiptBg, bgRepeat: "repeat-x", w: "100%", h: "10px" }), _jsxs(Stack, { spacing: "1", h: "fit-content", bg: "neutral.white", px: "2", pb: "2", align: "end", children: [_jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 26 }), menuItems: menuItems, disabled: (menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) === 0, itemForm: _id }), _jsxs(Stack, { as: "button", onClick: handleClick, spacing: "6", align: "end", w: "100%", children: [_jsxs(Flex, { justify: "space-between", align: "start", gap: "1", w: "100%", children: [_jsx(Img, { alt: "logo", src: storeImage, boxSize: ['20px', '30px'] }), _jsxs(Stack, { align: "end", spacing: "0", children: [_jsx(Text, { fontSize: "xxs", lineHeight: "1.1", children: date }), _jsx(Text, { fontSize: "xxs", lineHeight: "1.1", children: time })] })] }), _jsxs(Stack, { align: "end", spacing: "0", children: [_jsx(Text, { fontSize: "xs", fontFamily: "secondary", children: `${itemQuantity} ${t('receipts.items')}` }), _jsx(Text, { children: total })] })] })] })] }) }));
+    return (_jsx(ButtonGroup, { transition: "all 200ms linear", _hover: { boxShadow: 'xl' }, children: _jsxs(Box, { boxShadow: "md", minW: ['91px', '108px'], position: "relative", children: [!!bgColor && (_jsx(Box, { position: "absolute", top: "-5px", left: "0", children: _jsx(TextBadge, { bgColor: bgColor, text: text, width: width }) })), _jsx(Box, { bgImg: ReceiptBg, bgRepeat: "repeat-x", w: "100%", h: "10px" }), _jsxs(Stack, { spacing: "1", h: "fit-content", bg: "neutral.white", px: "2", pb: "2", align: "end", children: [_jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 26 }), menuItems: menuItems, disabled: (menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) === 0, itemForm: _id }), _jsxs(Stack, { as: "button", onClick: handleClick, spacing: "4", align: "end", w: "100%", children: [_jsx(Flex, { width: "100%", children: _jsx(Text, { isTruncated: true, maxW: "5.5rem", fontSize: "xxs", lineHeight: "1.1", children: !name || name === "" ? t('receipts.receipts') : name }) }), _jsxs(Flex, { justify: "space-between", align: "start", gap: "1", w: "100%", children: [_jsx(Img, { alt: "logo", src: storeImage, boxSize: ['20px', '30px'] }), _jsxs(Stack, { align: "end", spacing: "0", children: [_jsx(Text, { fontSize: "xxs", lineHeight: "1.1", textAlign: 'left', children: date }), _jsx(Text, { fontSize: "xxs", lineHeight: "1.1", children: time })] })] }), _jsxs(Stack, { align: "end", spacing: "0", children: [_jsx(Text, { fontSize: "xs", fontFamily: "secondary", children: `${itemQuantity} ${t('receipts.items')}` }), _jsx(Text, { children: total })] })] })] })] }) }));
 };

package/dist/components/receipts/displayReceipts/ListReceipt.d.ts

@@ -1,2 +1,2 @@
 import { ReceiptI } from '../../../interfaces';
-export declare const ListReceipt: ({ menuItems, onClick, _id, total, store, itemQuantity, purchaseDate, receiptOrigin, }: ReceiptI) => import("react/jsx-runtime").JSX.Element;
+export declare const ListReceipt: ({ menuItems, onClick, _id, total, store, itemQuantity, purchaseDate, receiptOrigin, name }: ReceiptI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/receipts/displayReceipts/ListReceipt.js

@@ -4,11 +4,11 @@ import { Box, Flex, Img, Stack, Text } from '@chakra-ui/react';
 import { IconMenu, MoreHorizontal } from '../..';
 import { receiptOrigins } from '../../../helpers';
 import { formatDateTime } from '../../../utils';
-export const ListReceipt = ({ menuItems, onClick, _id, total, store, itemQuantity, purchaseDate, receiptOrigin = 'homeDepot', }) => {
+export const ListReceipt = ({ menuItems, onClick, _id, total, store, itemQuantity, purchaseDate, receiptOrigin = 'homeDepot', name }) => {
     const storeImage = receiptOrigins[receiptOrigin];
     const handleClick = () => onClick(_id);
     const { formattedDate: date, formattedTime: time } = formatDateTime({
         date: purchaseDate,
     });
-    return (_jsx(Box, { bg: "neutral.white", w: "100%", transition: "all 0.2s ease-in-out", _hover: { bg: 'lightGreen.1' }, children: _jsxs(Flex, { align: "center", p: "2", children: [_jsxs(Flex, { gap: "base", flex: "auto", as: "button", onClick: handleClick, align: "center", children: [_jsx(Img, { alt: "logo", src: storeImage, boxSize: "36px" }), _jsxs(Box, { children: [store && (_jsx(Text, { variant: "date", textTransform: "uppercase", textAlign: "left", children: store })), _jsx(Text, { textOverflow: "ellipsis", noOfLines: 1, fontSize: "sm", textAlign: "left", children: t('receipts.receipts') })] })] }), _jsxs(Flex, { align: "center", gap: "base", children: [_jsx(Box, { children: _jsx(Text, { fontSize: "xs", fontFamily: "secondary", children: `${itemQuantity} ${t('receipts.items')}` }) }), _jsxs(Flex, { align: "start", gap: "2", mt: "-1", children: [_jsxs(Stack, { align: "flex-end", mt: "1", spacing: "0", children: [_jsx(Text, { variant: "date", textAlign: "right", children: `${date} ${time}` }), _jsx(Text, { children: total })] }), _jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 26 }), menuItems: menuItems, disabled: (menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) === 0, itemForm: _id })] })] })] }) }));
+    return (_jsx(Box, { bg: "neutral.white", w: "100%", transition: "all 0.2s ease-in-out", _hover: { bg: 'lightGreen.1' }, children: _jsxs(Flex, { align: "center", p: "2", children: [_jsxs(Flex, { gap: "base", flex: "auto", as: "button", onClick: handleClick, align: "center", children: [_jsx(Img, { alt: "logo", src: storeImage, boxSize: "36px" }), _jsxs(Box, { children: [store && (_jsx(Text, { variant: "date", textTransform: "uppercase", textAlign: "left", children: store })), _jsx(Text, { textOverflow: "ellipsis", noOfLines: 1, fontSize: "sm", textAlign: "left", children: !name || name === "" ? t('receipts.receipts') : name })] })] }), _jsxs(Flex, { align: "center", gap: "base", children: [_jsx(Box, { children: _jsx(Text, { fontSize: "xs", fontFamily: "secondary", children: `${itemQuantity} ${t('receipts.items')}` }) }), _jsxs(Flex, { align: "start", gap: "2", mt: "-1", children: [_jsxs(Stack, { align: "flex-end", mt: "1", spacing: "0", children: [_jsx(Text, { variant: "date", textAlign: "right", children: `${date} ${time}` }), _jsx(Text, { children: total })] }), _jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 26 }), menuItems: menuItems, disabled: (menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) === 0, itemForm: _id })] })] })] }) }));
 };

package/dist/components/receipts/receipt/ReceiptItems.js

@@ -10,6 +10,6 @@ export const ReceiptItems = ({ isSelectDisabled = true, leftOptions = [], onItem
     });
     return (_jsxs(Box, { mb: "10rem", children: [_jsxs(Stack, { bg: "lightBlue.2", px: "4", pb: "base", pt: "2", children: [_jsx(Text, { textTransform: "uppercase", variant: "home", children: title }), _jsxs(Flex, { gap: "base", align: "center", children: [_jsx(Checkbox, { onChange: handleSelectAll }), _jsx(DoubleSelects, { isSelectDisabled: isSelectDisabled, leftOptions: leftOptions, rightOptions: rightOptions, onLeftSelectChange: onLeftSelectChange, onRightSelectChange: onRightSelectChange })] })] }), receipts.map((receipt) => {
                 const hasRoomType = !!(receipt === null || receipt === void 0 ? void 0 : receipt.roomType);
-                return (_jsxs(Box, { children: [!hasRoomType && (_jsx(ReceiptItem, Object.assign({ onChange: () => handleItemSelect(receipt._id), isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, onEditClick: () => onEditReceipt === null || onEditReceipt === void 0 ? void 0 : onEditReceipt(receipt.sku), selectItems: receiptOptions, variant: variant }, receipt))), hasRoomType && (_jsx(ReceiptItemAssigned, Object.assign({ onChange: () => handleItemSelect(receipt._id), onRoomClick: onRoomClick, isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, initialSelectValue: receiptOptions === null || receiptOptions === void 0 ? void 0 : receiptOptions[1], selectItems: receiptOptions, variant: variant }, receipt)))] }, receipt._id));
+                return (_jsxs(Box, { children: [!hasRoomType && (_jsx(ReceiptItem, Object.assign({ onChange: () => handleItemSelect(receipt._id), isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, onEditClick: () => onEditReceipt === null || onEditReceipt === void 0 ? void 0 : onEditReceipt(receipt._id), selectItems: receiptOptions, variant: variant }, receipt))), hasRoomType && (_jsx(ReceiptItemAssigned, Object.assign({ onChange: () => handleItemSelect(receipt._id), onRoomClick: onRoomClick, isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, initialSelectValue: receiptOptions === null || receiptOptions === void 0 ? void 0 : receiptOptions[1], selectItems: receiptOptions, variant: variant }, receipt)))] }, receipt._id));
             })] }));
 };

package/package.json

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

package/src/components/receipts/displayReceipts/GridReceipt.tsx

@@ -15,6 +15,7 @@ export const GridReceipt = ({
   purchaseDate,
   receiptOrigin = 'homeDepot',
   total,
+  name
 }: ReceiptI) => {
   const storeImage = receiptOrigins[receiptOrigin]
 
@@ -70,14 +71,19 @@ export const GridReceipt = ({
           <Stack
             as="button"
             onClick={handleClick}
-            spacing="6"
+            spacing="4"
             align="end"
             w="100%"
           >
+            <Flex width={"100%"}>
+              <Text isTruncated maxW={"5.5rem"} fontSize="xxs" lineHeight="1.1">
+                {!name || name === "" ? t('receipts.receipts') : name}
+              </Text>
+            </Flex>
             <Flex justify="space-between" align="start" gap="1" w="100%">
               <Img alt="logo" src={storeImage} boxSize={['20px', '30px']} />
               <Stack align="end" spacing="0">
-                <Text fontSize="xxs" lineHeight="1.1">
+                <Text fontSize="xxs" lineHeight="1.1" textAlign={'left'}>
                   {date}
                 </Text>
                 <Text fontSize="xxs" lineHeight="1.1">

package/src/components/receipts/displayReceipts/ListReceipt.tsx

@@ -14,6 +14,7 @@ export const ListReceipt = ({
   itemQuantity,
   purchaseDate,
   receiptOrigin = 'homeDepot',
+  name
 }: ReceiptI) => {
   const storeImage = receiptOrigins[receiptOrigin]
   const handleClick = () => onClick(_id)
@@ -48,7 +49,7 @@ export const ListReceipt = ({
               fontSize="sm"
               textAlign="left"
             >
-              {t('receipts.receipts')}
+              {!name || name === "" ? t('receipts.receipts') : name}
             </Text>
           </Box>
         </Flex>

package/src/components/receipts/receipt/ReceiptItems.tsx

@@ -51,7 +51,7 @@ export const ReceiptItems = ({
                 onChange={() => handleItemSelect(receipt._id)}
                 isChecked={isItemSelected(receipt._id)}
                 onSelectedChange={onReceiptSelectedChange}
-                onEditClick={() => onEditReceipt?.(receipt.sku)}
+                onEditClick={() => onEditReceipt?.(receipt._id)}
                 selectItems={receiptOptions}
                 variant={variant}
                 {...receipt}