@weareconceptstudio/account 0.2.5 → 0.2.6

package/dist/modules/account/AccountTemplate/style.js

@@ -99,7 +99,7 @@ const AccountStyle = styled.section `
 
 				//! Order History Individual Styles
 				.order-info-wrap {
-					.btn-wrap {
+					.back-to-list-btn-block {
 						margin-bottom: var(--account_backToListMBot);
 					}
 

package/dist/modules/cart/SimpleItems/style.js

@@ -42,6 +42,13 @@ const CartItemsStyle = styled.section `
 
 	--account_cartItemSelectFixedWidth: calc(var(--sp9x) + var(--sp0-5x));
 
+	.mobile-info-wrap-title {
+		a,
+		button {
+			text-align: left;
+		}
+	}
+
 	.line {
 		width: calc(100% - var(--account_col1Distance));
 		height: 2px;

package/dist/modules/order/OrderIndividualTemplate/index.js

@@ -1,6 +1,5 @@
 import React, { useState, useEffect } from 'react';
 import { api } from '@weareconceptstudio/core';
-import { useAccountContext } from '../../../AccountProvider';
 //* Components
 import { AccountButton } from '../../../components';
 import OrderDetails from '../OrderDetails';
@@ -10,8 +9,6 @@ import { ShippingBillingInfo } from '../../address';
 import OrderIndividualTemplateStyle from './style';
 // TODO: status change
 const OrderIndividualTemplate = ({ uniqueKey }) => {
-    const { useCart } = useAccountContext();
-    const cartContext = useCart();
     const [data, setData] = useState();
     const [loading, setLoading] = useState(true);
     useEffect(() => {
@@ -20,17 +17,12 @@ const OrderIndividualTemplate = ({ uniqueKey }) => {
             setLoading(false);
         });
     }, [uniqueKey]);
-    const handleReorder = () => {
-        cartContext.reorder(data.id);
-    };
     return !loading ? (React.createElement(OrderIndividualTemplateStyle, null,
         React.createElement("div", { className: `order-info-wrap` },
-            React.createElement(AccountButton, { text: `backToList`, btnType: `green-large-text`, url: '/account/order-history/' }),
-            React.createElement("div", null,
-                React.createElement(AccountButton, { btnType: `purple-text`, text: 'reorder', onClick: handleReorder })),
+            React.createElement(AccountButton, { text: `backToList`, btnType: `green-large-text`, url: '/account/order-history/', className: `back-to-list-btn-block` }),
             React.createElement("div", { className: `details-shipping-billing-wrap` },
                 React.createElement(OrderDetails, { className: `col-50`, ...data }),
                 React.createElement(ShippingBillingInfo, { className: `col-50`, billing_address: data?.billingAddress, shipping_address: data?.shippingAddress })),
-            data.items?.length > 0 ? (React.createElement(OrderedItems, { data: data.items, status: data.status })) : null))) : null;
+            React.createElement(OrderedItems, { data: data.items, dataId: data.id, status: data.status })))) : null;
 };
 export default OrderIndividualTemplate;

package/dist/modules/order/OrderedItems/index.d.ts

@@ -1,6 +1,7 @@
 export default OrderedItems;
-declare function OrderedItems({ data: items, status }: {
+declare function OrderedItems({ data: items, status, dataId }: {
     data: any;
     status: any;
+    dataId: any;
 }): React.JSX.Element;
 import React from 'react';

package/dist/modules/order/OrderedItems/index.js

@@ -4,9 +4,10 @@ import { handlePriceCheckFunc } from '../../../utils/_functions';
 import { useAccountContext } from '../../../AccountProvider';
 import { AccountButton } from '../../../components';
 import OrderedItemsStyle from './style';
-const OrderedItems = ({ data: items, status }) => {
+const OrderedItems = ({ data: items, status, dataId }) => {
     const { winWidth } = useUi();
-    const { currency, handleProductClick } = useAccountContext();
+    const { currency, handleProductClick, useCart } = useAccountContext();
+    const cartContext = useCart();
     //! Store order items
     const storeOrderedItems = useMemo(() => {
         return items?.length > 0
@@ -62,8 +63,13 @@ const OrderedItems = ({ data: items, status }) => {
                             React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1`, text: handlePriceCheckFunc(item.total, currency) })))))))
             : null;
     }, [items, currency, winWidth, status, handleProductClick]);
-    return (React.createElement(OrderedItemsStyle, { className: `ordered-items-wrapper` },
-        React.createElement(Text, { className: 'account-p account-p1 account-font-bold account-primary-color1 ', text: 'orderItems' }),
+    const handleReorder = () => {
+        cartContext.reorder(dataId);
+    };
+    return items?.length > 0 ? (React.createElement(OrderedItemsStyle, { className: `ordered-items-wrapper` },
+        React.createElement("div", { className: 'order-flex-block' },
+            React.createElement(Text, { className: 'account-p account-p1 account-font-bold account-primary-color1 ', text: 'orderItems' }),
+            React.createElement(AccountButton, { text: 'reorder', onClick: handleReorder, className: 'reorder-btn' })),
         React.createElement("div", { className: 'line' }),
         React.createElement("div", { className: `order-items-table-wrap` },
             React.createElement("div", { className: `titles-wrap` },
@@ -75,6 +81,6 @@ const OrderedItems = ({ data: items, status }) => {
                     React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 nowrap align-right`, text: `price` })),
                 React.createElement("div", { className: `title-wrap tl-col-4 title-item` },
                     React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 nowrap align-right`, text: `total` }))),
-            React.createElement("div", { className: 'items-wrap' }, storeOrderedItems))));
+            React.createElement("div", { className: 'items-wrap' }, storeOrderedItems)))) : null;
 };
 export default OrderedItems;

package/dist/modules/order/OrderedItems/style.js

@@ -43,6 +43,21 @@ const OrderedItemsStyle = styled.div `
 
 	margin-top: var(--account_orderItemsMarginTop);
 
+	.order-flex-block {
+		display: flex;
+		flex-wrap: wrap;
+		align-items: center;
+		justify-content: space-between;
+		gap: var(--sp1x);
+	}
+
+	.ordered-item-mobile-title {
+		a,
+		button {
+			text-align: left;
+		}
+	}
+
 	.line {
 		width: 100%;
 		border-bottom: 2px solid var(--account_primaryColor1);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@weareconceptstudio/account",
-	"version": "0.2.5",
+	"version": "0.2.6",
 	"description": "Concept Studio Account",
 	"author": "Concept Studio",
 	"license": "ISC",