@evershop/evershop 1.0.0 → 1.1.0

package/src/modules/checkout/pages/frontStore/checkout/SummaryMobile.jsx

@@ -0,0 +1,132 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import { Items } from '@components/frontStore/checkout/checkout/summary/Items';
+import { CartSummary } from '@components/frontStore/checkout/checkout/summary/Cart';
+import Area from '@components/common/Area';
+import './SummaryMobile.scss';
+
+export default function Summary({
+  cart,
+  setting: { displayCheckoutPriceIncludeTax }
+}) {
+  return (
+    <Area
+      id="checkoutSummary"
+      className="checkout-summary checkout__summary__mobile md:hidden divide-y border rounded border-divider px-2 mb-2"
+      coreComponents={[
+        {
+          component: { default: Items },
+          props: { items: cart.items, displayCheckoutPriceIncludeTax },
+          sortOrder: 20,
+          id: 'checkoutOrderSummaryItems'
+        },
+        {
+          component: { default: CartSummary },
+          props: { ...cart, displayCheckoutPriceIncludeTax },
+          sortOrder: 30,
+          id: 'checkoutOrderSummaryCart'
+        }
+      ]}
+    />
+  );
+}
+
+Summary.propTypes = {
+  cart: PropTypes.shape({
+    items: PropTypes.arrayOf(
+      PropTypes.shape({
+        thumbnail: PropTypes.string,
+        productName: PropTypes.string,
+        variantOptions: PropTypes.string,
+        qty: PropTypes.number,
+        total: PropTypes.shape({
+          text: PropTypes.string
+        }),
+        subTotal: PropTypes.shape({
+          text: PropTypes.string
+        })
+      })
+    ),
+    totalQty: PropTypes.number,
+    subTotal: PropTypes.shape({
+      text: PropTypes.string
+    }),
+    subTotalInclTax: PropTypes.shape({
+      text: PropTypes.string
+    }),
+    grandTotal: PropTypes.shape({
+      text: PropTypes.string
+    }),
+    discountAmount: PropTypes.shape({
+      text: PropTypes.string
+    }),
+    taxAmount: PropTypes.shape({
+      text: PropTypes.string
+    }),
+    shippingFeeInclTax: PropTypes.shape({
+      text: PropTypes.string
+    }),
+    shippingMethodName: PropTypes.string,
+    coupon: PropTypes.string
+  }).isRequired,
+  setting: PropTypes.shape({
+    displayCheckoutPriceIncludeTax: PropTypes.bool
+  }).isRequired
+};
+
+export const layout = {
+  areaId: 'beforePlaceOrderButton',
+  sortOrder: 10
+};
+
+export const query = `
+  query Query {
+    cart {
+      totalQty
+      subTotal {
+        value
+        text
+      }
+      subTotalInclTax {
+        value
+        text
+      }
+      grandTotal {
+        value
+        text
+      }
+      discountAmount {
+        value
+        text
+      }
+      taxAmount {
+        value
+        text
+      }
+      shippingFeeInclTax {
+        value
+        text
+      }
+      shippingMethodName
+      coupon
+      items {
+        thumbnail
+        productName
+        productSku
+        qty
+        variantOptions
+        total {
+          value
+          text
+        }
+        subTotal {
+          value
+          text
+        }
+      }
+    }
+    setting {
+      displayCheckoutPriceIncludeTax
+    }
+  }
+`;

package/src/modules/checkout/pages/frontStore/checkout/SummaryMobile.scss

@@ -0,0 +1,7 @@
+.checkout-summary.checkout__summary__mobile {
+  min-height: auto;
+  &::after {
+    display: none;
+    background-color: none
+  }
+}

package/src/modules/checkout/services/cart/Cart.js

@@ -6,7 +6,10 @@ const {
 } = require('@evershop/evershop/src/lib/util/registry');
 const { select } = require('@evershop/postgres-query-builder');
 const { pool } = require('@evershop/evershop/src/lib/postgres/connection');
-const { v4: uuidv4 } = require('uuid');
+const { v4: uuidv4, validate } = require('uuid');
+const {
+  translate
+} = require('@evershop/evershop/src/lib/locale/translate/translate');
 const { DataObject } = require('./DataObject');
 const {
   getProductsBaseQuery
@@ -62,6 +65,12 @@ class Cart extends DataObject {
     return this.getData('items') ?? [];
   }
 
+  /**
+   *
+   * @param {string} productID | product_id, sku, or uuid
+   * @param {number} qty
+   * @returns
+   */
   async addItem(productID, qty) {
     const item = await this.createItem(productID, parseInt(qty, 10));
     if (item.hasError()) {
@@ -87,7 +96,7 @@ class Cart extends DataObject {
       if (!duplicateItem) {
         items = items.concat(item);
       }
-      await this.setData('items', items);
+      await this.setData('items', items, true);
       return duplicateItem || item;
     }
   }
@@ -115,14 +124,21 @@ class Cart extends DataObject {
       throw new Error('Invalid quantity');
     }
     const productQuery = getProductsBaseQuery();
-    const product = await productQuery
-      .where('product_id', '=', productID)
-      .load(pool);
+    if (validate(productID)) {
+      productQuery.where('product.uuid', '=', productID);
+    } else if (/^\d+$/.test(productID)) {
+      productQuery
+        .where('product.product_id', '=', productID)
+        .or('product.sku', '=', productID);
+    } else {
+      productQuery.where('product.sku', '=', productID);
+    }
+    const product = await productQuery.load(pool);
     if (!product) {
-      throw new Error('Product not found');
+      throw new Error(translate('Product not found'));
     }
     const item = new Item(this, {
-      product_id: productID,
+      product_id: product.product_id,
       qty
     });
     await item.build();

package/src/modules/checkout/services/cart/DataObject.js

@@ -1,6 +1,6 @@
 /* eslint-disable no-underscore-dangle */
 const isEqualWith = require('lodash/isEqualWith');
-const { error } = require('@evershop/evershop/src/lib/log/debuger');
+const { error } = require('@evershop/evershop/src/lib/log/logger');
 
 module.exports.DataObject = class DataObject {
   #fields;
@@ -80,7 +80,7 @@ module.exports.DataObject = class DataObject {
     }
   }
 
-  async setData(key, value) {
+  async setData(key, value, force = false) {
     this.#triggeredField = key;
     this.#requestedValue = value;
     if (this.isBuilding === true) {
@@ -91,7 +91,7 @@ module.exports.DataObject = class DataObject {
       throw new Error(`Field ${key} not existed`);
     }
 
-    if (isEqualWith(this.#data[key], value)) {
+    if (isEqualWith(this.#data[key], value) && !force) {
       return value;
     }
 

package/src/modules/checkout/services/cart/registerCartBaseFields.js

@@ -262,6 +262,7 @@ module.exports.registerCartBaseFields = function registerCartBaseFields() {
             );
           shippingMethodQuery
             .where('uuid', '=', shippingMethod)
+            .and('is_enabled', '=', true)
             .and(
               'shipping_zone_method.zone_id',
               '=',
@@ -383,6 +384,37 @@ module.exports.registerCartBaseFields = function registerCartBaseFields() {
                 this.setError('shipping_fee_excl_tax', response.data.message);
                 return 0;
               }
+            } else if (shippingMethod.weight_based_cost) {
+              const totalWeight = this.getData('total_weight');
+              const weightBasedCost = shippingMethod.weight_based_cost
+                .map(({ min_weight, cost }) => ({
+                  min_weight: parseFloat(min_weight),
+                  cost: toPrice(cost)
+                }))
+                .sort((a, b) => a.min_weight - b.min_weight);
+
+              let cost = 0;
+              for (let i = 0; i < weightBasedCost.length; i += 1) {
+                if (totalWeight >= weightBasedCost[i].min_weight) {
+                  cost = weightBasedCost[i].cost;
+                }
+              }
+              return toPrice(cost);
+            } else if (shippingMethod.price_based_cost) {
+              const subTotal = this.getData('sub_total');
+              const priceBasedCost = shippingMethod.price_based_cost
+                .map(({ min_price, cost }) => ({
+                  min_price: toPrice(min_price),
+                  cost: toPrice(cost)
+                }))
+                .sort((a, b) => a.min_price - b.min_price);
+              let cost = 0;
+              for (let i = 0; i < priceBasedCost.length; i += 1) {
+                if (subTotal >= priceBasedCost[i].min_price) {
+                  cost = priceBasedCost[i].cost;
+                }
+              }
+              return toPrice(cost);
             } else {
               this.setError(
                 'shipping_fee_excl_tax',

package/src/modules/checkout/services/cart/registerCartItemBaseFields.js

@@ -328,8 +328,9 @@ module.exports.registerCartItemBaseFields =
                 .from('variant_group')
                 .where('variant_group_id', '=', product.variant_group_id)
                 .load(pool);
-              if (!group) return null;
-              else {
+              if (!group) {
+                return null;
+              } else {
                 const query = select('a.attribute_code')
                   .select('a.attribute_name')
                   .select('a.attribute_id')

package/src/modules/cms/bootstrap.js

@@ -1,4 +1,9 @@
 const config = require('config');
+const registerDefaultPageCollectionFilters = require('./services/registerDefaultPageCollectionFilters');
+const {
+  defaultPaginationFilters
+} = require('../../lib/util/defaultPaginationFilters');
+const { addProcessor } = require('../../lib/util/registry');
 
 module.exports = () => {
   const themeConfig = {
@@ -20,4 +25,16 @@ module.exports = () => {
   config.util.setModuleDefaults('system', {
     file_storage: 'local'
   });
+
+  // Reigtering the default filters for attribute collection
+  addProcessor(
+    'cmsPageCollectionFilters',
+    registerDefaultPageCollectionFilters,
+    1
+  );
+  addProcessor(
+    'cmsPageCollectionFilters',
+    (filters) => [...filters, ...defaultPaginationFilters],
+    2
+  );
 };

package/src/modules/cms/graphql/types/CmsPage/CmsPage.resolvers.js

@@ -1,4 +1,3 @@
-const { select } = require('@evershop/postgres-query-builder');
 const { buildUrl } = require('@evershop/evershop/src/lib/router/buildUrl');
 const { camelCase } = require('@evershop/evershop/src/lib/util/camelCase');
 const {
@@ -9,23 +8,15 @@ const { CMSPageCollection } = require('../../../services/CMSPageCollection');
 module.exports = {
   Query: {
     cmsPage: async (root, { id }, { pool }) => {
-      const query = select().from('cms_page');
-      query
-        .leftJoin('cms_page_description')
-        .on(
-          'cms_page.cms_page_id',
-          '=',
-          'cms_page_description.cms_page_description_cms_page_id'
-        );
+      const query = getCmsPagesBaseQuery();
       query.where('cms_page_id', '=', id);
-
       const page = await query.load(pool);
       return page ? camelCase(page) : null;
     },
     cmsPages: async (_, { filters = [] }, { user }) => {
       const query = getCmsPagesBaseQuery();
       const root = new CMSPageCollection(query);
-      await root.init({}, { filters }, { user });
+      await root.init(filters, !!user);
       return root;
     }
   },

package/src/modules/cms/pages/admin/all/Layout.scss

@@ -47,8 +47,9 @@ table {
     }
     th {
       border: 0;
-      padding-top: 2rem;
-      padding-bottom: 2rem;
+      padding-top: 1.5rem;
+      padding-bottom: 1.5rem;
+      align-content: center;
     }
   }
 }

package/src/modules/cms/pages/admin/all/SearchBox.jsx

@@ -70,7 +70,7 @@ export default function SearchBox({ resourceLinks }) {
     query: SearchQuery,
     variables: {
       filters: keyword
-        ? [{ key: 'keyword', operation: '=', value: keyword }]
+        ? [{ key: 'keyword', operation: 'eq', value: keyword }]
         : []
     },
     pause: true

package/src/modules/cms/pages/admin/cmsPageGrid/Grid.jsx

@@ -7,10 +7,11 @@ import { useAlertContext } from '@components/common/modal/Alert';
 import { Checkbox } from '@components/common/form/fields/Checkbox';
 import { Card } from '@components/admin/cms/Card';
 import Area from '@components/common/Area';
-import BasicColumnHeader from '@components/common/grid/headers/Basic';
-import StatusColumnHeader from '@components/common/grid/headers/Status';
 import StatusRow from '@components/common/grid/rows/StatusRow';
 import PageName from '@components/admin/cms/cmsPageGrid/rows/PageName';
+import { Form } from '@components/common/form/Form';
+import { Field } from '@components/common/form/Field';
+import SortableHeader from '@components/common/grid/headers/Sortable';
 
 function Actions({ pages = [], selectedIds = [] }) {
   const { openAlert, closeAlert } = useAlertContext();
@@ -164,6 +165,60 @@ export default function CMSPageGrid({
 
   return (
     <Card>
+      <Card.Session
+        title={
+          <Form submitBtn={false}>
+            <Area
+              id="cmsPageGridFilter"
+              noOuter
+              coreComponents={[
+                {
+                  component: {
+                    default: () => (
+                      <Field
+                        type="text"
+                        id="name"
+                        placeholder="Search"
+                        value={
+                          currentFilters.find((f) => f.key === 'name')?.value
+                        }
+                        onKeyPress={(e) => {
+                          // If the user press enter, we should submit the form
+                          if (e.key === 'Enter') {
+                            const url = new URL(document.location);
+                            const name = document.getElementById('name')?.value;
+                            if (name) {
+                              url.searchParams.set('name[operation]', 'like');
+                              url.searchParams.set('name[value]', name);
+                            } else {
+                              url.searchParams.delete('name[operation]');
+                              url.searchParams.delete('name[value]');
+                            }
+                            window.location.href = url;
+                          }
+                        }}
+                      />
+                    )
+                  },
+                  sortOrder: 10
+                }
+              ]}
+            />
+          </Form>
+        }
+        actions={[
+          {
+            variant: 'interactive',
+            name: 'Clear filter',
+            onAction: () => {
+              // Just get the url and remove all query params
+              const url = new URL(document.location);
+              url.search = '';
+              window.location.href = url.href;
+            }
+          }
+        ]}
+       />
       <table className="listing sticky">
         <thead>
           <tr>
@@ -186,9 +241,9 @@ export default function CMSPageGrid({
                 {
                   component: {
                     default: () => (
-                      <BasicColumnHeader
+                      <SortableHeader
                         title="Name"
-                        id="name"
+                        name="name"
                         currentFilters={currentFilters}
                       />
                     )
@@ -198,12 +253,10 @@ export default function CMSPageGrid({
                 {
                   component: {
                     default: () => (
-                      <StatusColumnHeader
+                      <SortableHeader
                         title="Status"
-                        id="status"
-                        currentFilter={currentFilters.find(
-                          (f) => f.key === 'status'
-                        )}
+                        name="status"
+                        currentFilters={currentFilters}
                       />
                     )
                   },

package/src/modules/cms/pages/admin/cmsPageGrid/index.js

@@ -11,6 +11,5 @@ module.exports = (request, response) => {
     title: 'Cms pages',
     description: 'Cms pages'
   });
-  const { query } = request;
-  setContextValue(request, 'filtersFromUrl', buildFilterFromUrl(query));
+  setContextValue(request, 'filtersFromUrl', buildFilterFromUrl(request));
 };

package/src/modules/cms/services/CMSPageCollection.js

@@ -1,91 +1,44 @@
 const { camelCase } = require('@evershop/evershop/src/lib/util/camelCase');
 const { pool } = require('@evershop/evershop/src/lib/postgres/connection');
+const { getValue } = require('@evershop/evershop/src/lib/util/registry');
 
 class CMSPageCollection {
   constructor(baseQuery) {
     this.baseQuery = baseQuery;
   }
 
-  async init(args, { filters = [] }, { user }) {
-    if (!user) {
+  async init(filters = [], isAdmin = false) {
+    if (!isAdmin) {
       this.baseQuery.andWhere('cms_page.status', '=', 't');
     }
     const currentFilters = [];
 
-    // Name filter
-    const nameFilter = filters.find((f) => f.key === 'name');
-    if (nameFilter) {
-      this.baseQuery.andWhere(
-        'cms_page_description.name',
-        'ILIKE',
-        `%${nameFilter.value}%`
-      );
-      currentFilters.push({
-        key: 'name',
-        operation: '=',
-        value: nameFilter.value
-      });
-    }
-
-    // Status filter
-    const statusFilter = filters.find((f) => f.key === 'status');
-    if (statusFilter) {
-      this.baseQuery.andWhere('cms_page.status', '=', statusFilter.value);
-      currentFilters.push({
-        key: 'status',
-        operation: '=',
-        value: statusFilter.value
-      });
-    }
-
-    const sortBy = filters.find((f) => f.key === 'sortBy');
-    const sortOrder = filters.find(
-      (f) =>
-        f.key === 'sortOrder' &&
-        ['ASC', 'DESC', 'asc', 'desc'].includes(f.value)
-    ) || { value: 'DESC' };
+    // Apply the filters
+    const cmsPageCollectionFilters = await getValue(
+      'cmsPageCollectionFilters',
+      []
+    );
 
-    if (sortBy && sortBy.value === 'name') {
-      this.baseQuery.orderBy('cms_page_description.name', sortOrder.value);
-      currentFilters.push({
-        key: 'sortBy',
-        operation: '=',
-        value: sortBy.value
-      });
-    } else {
-      this.baseQuery.orderBy('cms_page.cms_page_id', 'DESC');
-    }
-    if (sortOrder.key) {
-      currentFilters.push({
-        key: 'sortOrder',
-        operation: '=',
-        value: sortOrder.value
-      });
-    }
+    cmsPageCollectionFilters.forEach((filter) => {
+      const check = filters.find((f) => f.key === filter.key);
+      if (check) {
+        if (filter.operation.includes(check.operation)) {
+          filter.callback(
+            this.baseQuery,
+            check.operation,
+            check.value,
+            currentFilters
+          );
+        }
+      }
+    });
 
     // Clone the main query for getting total right before doing the paging
     const totalQuery = this.baseQuery.clone();
     totalQuery.select('COUNT(cms_page.cms_page_id)', 'total');
     totalQuery.removeOrderBy();
-    // Paging
-    const page = filters.find((f) => f.key === 'page') || { value: 1 };
-    const limit = filters.find((f) => f.key === 'limit' && f.value > 0) || {
-      value: 20
-    }; // TODO: Get from the config
-    currentFilters.push({
-      key: 'page',
-      operation: '=',
-      value: page.value
-    });
-    currentFilters.push({
-      key: 'limit',
-      operation: '=',
-      value: limit.value
-    });
-    this.baseQuery.limit(
-      (page.value - 1) * parseInt(limit.value, 10),
-      parseInt(limit.value, 10)
-    );
+    totalQuery.removeLimit();
+
     this.currentFilters = currentFilters;
     this.totalQuery = totalQuery;
   }

package/src/modules/cms/services/registerDefaultPageCollectionFilters.js

@@ -0,0 +1,62 @@
+const {
+  OPERATION_MAP
+} = require('@evershop/evershop/src/lib/util/filterOperationMapp');
+const { getValueSync } = require('@evershop/evershop/src/lib/util/registry');
+
+module.exports = async function registerDefaultPageCollectionFilters() {
+  // List of default supported filters
+  const defaultFilters = [
+    {
+      key: 'name',
+      operation: ['eq', 'like'],
+      callback: (query, operation, value, currentFilters) => {
+        if (operation === 'eq') {
+          query.andWhere('cms_page_description.name', '=', value);
+        } else {
+          query.andWhere('cms_page_description.name', 'ilike', `%${value}%`);
+        }
+        currentFilters.push({
+          key: 'name',
+          operation,
+          value
+        });
+      }
+    },
+    {
+      key: 'status',
+      operation: ['eq'],
+      callback: (query, operation, value, currentFilters) => {
+        query.andWhere('cms_page.status', OPERATION_MAP[operation], value);
+        currentFilters.push({
+          key: 'status',
+          operation,
+          value
+        });
+      }
+    },
+    {
+      key: 'ob',
+      operation: ['eq'],
+      callback: (query, operation, value, currentFilters) => {
+        const cmsPageCollectionSortBy = getValueSync(
+          'cmsPageCollectionSortBy',
+          {
+            name: (query) => query.orderBy('cms_page_description.name'),
+            status: (query) => query.orderBy('cms_page.status')
+          }
+        );
+
+        if (cmsPageCollectionSortBy[value]) {
+          cmsPageCollectionSortBy[value](query, operation);
+          currentFilters.push({
+            key: 'ob',
+            operation,
+            value
+          });
+        }
+      }
+    }
+  ];
+
+  return defaultFilters;
+};

package/src/modules/cms/services/tailwind.admin.config.js

@@ -43,7 +43,12 @@ module.exports = {
   },
   theme: {
     fontSize: {
-      base: '.875rem'
+      sm: '0.8rem',
+      xs: '.75rem',
+      base: '.875rem',
+      lg: '1.125rem',
+      xl: '1.25rem',
+      '2xl': '1.5rem'
     },
     colors: {
       primary: '#008060',