@evershop/evershop 1.0.0-rc.2 → 1.0.0-rc.3

package/bin/build/client/index.js

@@ -5,7 +5,6 @@ const {
 
 module.exports.buildClient = async function buildClient(routes) {
   const config = createConfigClient(routes);
-  console.log('client', config);
   const compiler = webpack(config);
 
   return new Promise((resolve, reject) => {

package/bin/install/createMigrationTable.js

@@ -1,20 +1,17 @@
-const { execute } = require('@evershop/mysql-query-builder');
+const { execute } = require('@evershop/postgres-query-builder');
 
 module.exports.createMigrationTable = async function createMigrationTable(
   connection
 ) {
   await execute(
     connection,
-    `CREATE TABLE \`migration\` (
-        \`migration_id\` int(10) unsigned NOT NULL AUTO_INCREMENT,
-        \`module\` char(255) NOT NULL,
-        \`version\` char(255) NOT NULL,
-        \`status\` char(255) NOT NULL,
-        \`created_at\` timestamp NOT NULL DEFAULT current_timestamp(),
-        \`updated_at\` timestamp NOT NULL DEFAULT current_timestamp() ON UPDATE current_timestamp(),
-        PRIMARY KEY (\`migration_id\`),
-        UNIQUE KEY \`MODULE_UNIQUE\` (\`module\`)
-        ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='Migration';
-    `
+    `CREATE TABLE "migration" (
+        "migration_id" INT GENERATED ALWAYS AS IDENTITY (START WITH 1 INCREMENT BY 1) PRIMARY KEY,
+        "module" varchar NOT NULL,
+        "version" varchar NOT NULL,
+        "created_at" TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
+        "updated_at" TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
+        CONSTRAINT "MODULE_UNIQUE" UNIQUE ("module")
+        )`
   );
 };

package/bin/install/index.js

@@ -5,19 +5,31 @@ const path = require('path');
 const { red, green } = require('kleur');
 const ora = require('ora');
 const boxen = require('boxen');
-const mysql = require('mysql2');
-const { execute } = require('@evershop/mysql-query-builder');
+const { Pool } = require('pg');
+const {
+  execute,
+  startTransaction,
+  commit,
+  rollback
+} = require('@evershop/postgres-query-builder');
 const { prompt } = require('enquirer');
 const { CONSTANTS } = require('@evershop/evershop/src/lib/helpers');
 const { migrate } = require('./migrate');
 const { createMigrationTable } = require('./createMigrationTable');
 
-function error(message) {
-  console.log(`\n❌ ${red(message)}`);
+function error(e) {
+  // Check if e is a string message
+  if (typeof e === 'string') {
+    // eslint-disable-next-line no-console
+    console.log(`\n❌ ${red(e)}\n`);
+    return;
+  } else {
+    // eslint-disable-next-line no-console
+    console.log(`\n❌ ${red(e.message)}\n${e.stack}`);
+  }
 }
 
-// eslint-disable-next-line func-names
-(async function () {
+async function install() {
   // eslint-disable-next-line no-var
   var db;
   // eslint-disable-next-line no-var
@@ -44,8 +56,8 @@ function error(message) {
     {
       type: 'input',
       name: 'databasePort',
-      message: 'MySql Database Port (3306)',
-      initial: 3306
+      message: 'MySql Database Port (5432)',
+      initial: 5432
     },
     {
       type: 'input',
@@ -56,13 +68,13 @@ function error(message) {
     {
       type: 'input',
       name: 'databaseUser',
-      message: 'MySql Database User (root)',
-      initial: 'root'
+      message: 'MySql Database User (postgres)',
+      initial: 'postgres'
     },
     {
       type: 'input',
       name: 'databasePassword',
-      message: 'MySql Database Password (<empty>)',
+      message: 'PostgreSQL Database Password (<empty>)',
       initial: ''
     }
   ];
@@ -73,14 +85,15 @@ function error(message) {
     process.exit(0);
   }
 
-  let pool = mysql.createPool({
+  let pool = new Pool({
     host: db.databaseHost,
     port: db.databasePort,
     user: db.databaseUser,
     password: db.databasePassword,
     database: db.databaseName,
-    dateStrings: true,
-    connectionLimit: 10,
+    max: 30,
+    idleTimeoutMillis: 30000,
+    connectionTimeoutMillis: 2000,
     ssl: {
       rejectUnauthorized: false
     }
@@ -88,10 +101,10 @@ function error(message) {
 
   // Test the secure connection
   try {
-    await execute(pool, `SELECT 1`);
+    await pool.query(`SELECT 1`);
   } catch (e) {
-    if (e.message.includes('Server does not support secure connnection')) {
-      pool = mysql.createPool({
+    if (e.message.includes('does not support SSL')) {
+      pool = new Pool({
         host: db.databaseHost,
         port: db.databasePort,
         user: db.databaseUser,
@@ -101,22 +114,17 @@ function error(message) {
         connectionLimit: 10
       });
     } else {
-      error(e.message);
+      error(e);
       process.exit(0);
     }
   }
 
-  // Validate the database
+  // Check postgres database version
   try {
-    const result = await execute(
-      pool,
-      `SELECT table_name FROM information_schema.tables WHERE table_schema = '${
-        db.databaseName || 'evershop'
-      }'`
-    );
-    if (result.length > 0) {
+    const { rows } = await execute(pool, `SHOW SERVER_VERSION;`);
+    if (rows[0].server_version < '13.0') {
       error(
-        `The '${db.databaseName}' database is not empty. Please create a new one`
+        `Your database server version(${rows[0].server_version}) is not supported. Please upgrade to PostgreSQL version 13.0 or higher`
       );
       process.exit(0);
     }
@@ -218,14 +226,75 @@ function error(message) {
   messages.push(green('Setting up a database'));
   spinner.text = messages.join('\n');
 
+  const connection = await pool.connect();
+  startTransaction(connection);
   try {
-    await createMigrationTable(pool);
+    await createMigrationTable(connection);
   } catch (e) {
+    rollback(connection);
     error(e);
     process.exit(0);
   }
 
-  await migrate(pool, path.resolve(__dirname, '../../src/modules'), adminUser);
+  const modules = [
+    {
+      name: 'auth',
+      resolve: path.resolve(__dirname, '../../src/modules/auth')
+    },
+    {
+      name: 'base',
+      resolve: path.resolve(__dirname, '../../src/modules/base')
+    },
+    {
+      name: 'catalog',
+      resolve: path.resolve(__dirname, '../../src/modules/catalog')
+    },
+    {
+      name: 'checkout',
+      resolve: path.resolve(__dirname, '../../src/modules/checkout')
+    },
+    {
+      name: 'cms',
+      resolve: path.resolve(__dirname, '../../src/modules/cms')
+    },
+    {
+      name: 'cod',
+      resolve: path.resolve(__dirname, '../../src/modules/cod')
+    },
+    {
+      name: 'customer',
+      resolve: path.resolve(__dirname, '../../src/modules/customer')
+    },
+    {
+      name: 'graphql',
+      resolve: path.resolve(__dirname, '../../src/modules/graphql')
+    },
+    {
+      name: 'paypal',
+      resolve: path.resolve(__dirname, '../../src/modules/paypal')
+    },
+    {
+      name: 'promotion',
+      resolve: path.resolve(__dirname, '../../src/modules/promotion')
+    },
+    {
+      name: 'setting',
+      resolve: path.resolve(__dirname, '../../src/modules/setting')
+    },
+    {
+      name: 'stripe',
+      resolve: path.resolve(__dirname, '../../src/modules/stripe')
+    }
+  ];
+
+  try {
+    await migrate(connection, modules, adminUser);
+    commit(connection);
+  } catch (e) {
+    rollback(connection);
+    error(e);
+    process.exit(0);
+  }
   messages.pop();
   messages.push(green('✔ Setup database'));
   messages.push(green('✔ Create admin user'));
@@ -247,4 +316,14 @@ function error(message) {
     )
   );
   process.exit(0);
+}
+
+// eslint-disable-next-line func-names
+(async () => {
+  try {
+    await install();
+  } catch (e) {
+    error(e);
+    process.exit(0);
+  }
 })();

package/bin/install/migrate.js

@@ -1,4 +1,4 @@
-const { insertOnUpdate } = require('@evershop/mysql-query-builder');
+const { insertOnUpdate } = require('@evershop/postgres-query-builder');
 const { readdirSync, existsSync } = require('fs');
 const path = require('path');
 const semver = require('semver');
@@ -6,19 +6,19 @@ const bcrypt = require('bcryptjs');
 
 module.exports.migrate = async function migrate(
   connection,
-  modulePath,
+  modules,
   adminUser
 ) {
-  const modules = readdirSync(path.resolve(modulePath), { withFileTypes: true })
-    .filter((dirent) => dirent.isDirectory())
-    .map((dirent) => dirent.name);
+  // const modules = readdirSync(path.resolve(modulePath), { withFileTypes: true })
+  //   .filter((dirent) => dirent.isDirectory())
+  //   .map((dirent) => dirent.name);
 
   // eslint-disable-next-line no-restricted-syntax
   for (const module of modules) {
     try {
-      if (existsSync(path.resolve(modulePath, module, 'migration'))) {
+      if (existsSync(path.resolve(module.resolve, 'migration'))) {
         const migrations = readdirSync(
-          path.resolve(modulePath, module, 'migration'),
+          path.resolve(module.resolve, 'migration'),
           { withFileTypes: true }
         )
           .filter(
@@ -36,40 +36,36 @@ module.exports.migrate = async function migrate(
             // eslint-disable-next-line no-await-in-loop
             // eslint-disable-next-line global-require
             await require(path.resolve(
-              modulePath,
-              module,
+              module.resolve,
               'migration',
               `Version-${version}.js`
             ))(connection);
             // eslint-disable-next-line no-await-in-loop
-            await insertOnUpdate('migration')
+            await insertOnUpdate('migration', ['module'])
               .given({
-                module,
-                version,
-                status: 1
+                module: module.name,
+                version
               })
               .execute(connection);
           } catch (e) {
-            console.error(e.message);
+            console.error(e);
             process.exit(0);
           }
         }
 
         if (migrations.length === 0) {
-          await insertOnUpdate('migration')
+          await insertOnUpdate('migration', ['module'])
             .given({
-              module,
-              version: '1.0.0',
-              status: 1
+              module: module.name,
+              version: '1.0.0'
             })
             .execute(connection);
         }
       } else {
-        await insertOnUpdate('migration')
+        await insertOnUpdate('migration', ['module'])
           .given({
-            module,
-            version: '1.0.0',
-            status: 1
+            module: module.name,
+            version: '1.0.0'
           })
           .execute(connection);
       }
@@ -79,7 +75,7 @@ module.exports.migrate = async function migrate(
   }
 
   const salt = bcrypt.genSaltSync(10);
-  await insertOnUpdate('admin_user')
+  await insertOnUpdate('admin_user', ['email'])
     .given({
       status: 1,
       email: adminUser?.email || 'demo@demo.com',

package/bin/install/templates/config.json

@@ -1,4 +1,9 @@
 {
+  "shop" : {
+    "currency": "USD",
+    "language": "en",
+    "weightUnit": "kg"
+  },
   "catalog": {
     "product": {
       "image": {

package/bin/lib/bootstrap/migrate.js

@@ -1,7 +1,17 @@
 const path = require('path');
 const semver = require('semver');
-const { insertOnUpdate, select } = require('@evershop/mysql-query-builder');
-const { pool } = require('@evershop/evershop/src/lib/mysql/connection');
+const { red } = require('kleur');
+const {
+  insertOnUpdate,
+  select,
+  startTransaction,
+  commit,
+  rollback
+} = require('@evershop/postgres-query-builder');
+const {
+  pool,
+  getConnection
+} = require('@evershop/evershop/src/lib/postgres/connection');
 const { existsSync, readdirSync } = require('fs');
 
 async function getCurrentInstalledVersion(module) {
@@ -37,21 +47,32 @@ module.exports.migrate = async function migrate(module) {
     if (semver.lte(version, currentInstalledVersion)) {
       continue;
     }
+    const connection = await getConnection();
+    await startTransaction(connection);
     // eslint-disable-next-line no-await-in-loop
     // eslint-disable-next-line global-require
     /** We expect the migration script to provide a function as a default export */
-    await require(path.resolve(
-      module.path,
-      'migration',
-      `Version-${version}.js`
-    ))(pool);
-    // eslint-disable-next-line no-await-in-loop
-    await insertOnUpdate('migration')
-      .given({
-        module: module.name,
-        version,
-        status: 1
-      })
-      .execute(pool);
+    try {
+      await require(path.resolve(
+        module.path,
+        'migration',
+        `Version-${version}.js`
+      ))(connection);
+      // eslint-disable-next-line no-await-in-loop
+      await insertOnUpdate('migration', ['module'])
+        .given({
+          module: module.name,
+          version
+        })
+        .execute(connection, false);
+      await commit(connection);
+    } catch (e) {
+      await rollback(connection);
+      console.log(
+        red(`Migration failed for ${module.name}, version ${version}\n`),
+        e
+      );
+      process.exit(0);
+    }
   }
 };

package/bin/lib/buildEntry.js

@@ -65,7 +65,9 @@ module.exports.buildEntry = async function buildEntry(
       import React from 'react';
       import ReactDOM from 'react-dom';
       import Area from '@evershop/evershop/src/components/common/Area';
-      import Hydrate from '@evershop/evershop/src/components/common/react/client/Hydrate';
+      import Hydrate from '@evershop/evershop/src/components/common/react/client/${
+        route.isAdmin ? 'HydrateAdmin' : 'HydrateFrontStore'
+      }';
       `;
       contentClient += '\r\n';
       contentClient += `Area.defaultProps.components = ${inspect(areas, {
@@ -82,7 +84,7 @@ module.exports.buildEntry = async function buildEntry(
         await mkdir(path.resolve(subPath, 'client'), { recursive: true });
       }
       await writeFile(
-        path.resolve(subPath, 'client', 'entry.js'),
+        path.resolve(subPath, 'client', 'entry.jsx'),
         contentClient
       );
 
@@ -106,7 +108,7 @@ module.exports.buildEntry = async function buildEntry(
           await mkdir(path.resolve(subPath, 'server'), { recursive: true });
         }
         await writeFile(
-          path.resolve(subPath, 'server', 'entry.js'),
+          path.resolve(subPath, 'server', 'entry.jsx'),
           contentServer
         );
         await writeFile(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@evershop/evershop",
-  "version": "1.0.0-rc.2",
+  "version": "1.0.0-rc.3",
   "description": "The React Ecommerce platform. Built with React and MySQL. Open-source and free. Fast and customizable.",
   "files": [
     "bin",
@@ -38,7 +38,7 @@
     "@babel/preset-react": "^7.16.0",
     "@ckeditor/ckeditor5-build-classic": "^36.0.1",
     "@ckeditor/ckeditor5-react": "^5.1.0",
-    "@evershop/mysql-query-builder": "^1.3.9",
+    "@evershop/postgres-query-builder": "^1.0.2",
     "@graphql-tools/load-files": "^6.6.1",
     "@graphql-tools/merge": "^8.3.5",
     "@graphql-tools/schema": "^9.0.3",
@@ -83,9 +83,9 @@
     "luxon": "^2.0.2",
     "mini-css-extract-plugin": "^2.6.1",
     "multer": "^1.4.2",
-    "mysql2": "^3.1.2",
     "npm": "^8.18.0",
     "ora": "^5.4.1",
+    "pg": "^8.10.0",
     "postcss": "^8.4.18",
     "promise.allsettled": "^1.0.4",
     "prop-types": "^15.8.1",

package/src/components/admin/catalog/category/categoryEdit/AddProducts.jsx

@@ -0,0 +1,173 @@
+import { Card } from '@components/admin/cms/Card';
+import Spinner from '@components/common/Spinner';
+import Button from '@components/common/form/Button';
+import PropTypes from 'prop-types';
+import React from 'react';
+import { toast } from 'react-toastify';
+import { useQuery } from 'urql';
+import CheckIcon from '@heroicons/react/outline/CheckIcon';
+
+const SearchQuery = `
+  query Query ($query: String) {
+    products: searchProducts(query: $query) {
+      items {
+        productId
+        uuid
+        sku
+        categories {
+          categoryId
+        }
+        name
+        price {
+          regular {
+            text
+          }
+        }
+        image {
+          url: thumb
+        }
+      }
+      total
+    }
+  }
+`;
+
+function AddProducts({ addProductApi, categoryId, closeModal }) {
+  const [inputValue, setInputValue] = React.useState('');
+  const [addedProducts, setAddedProducts] = React.useState([]);
+
+  const [result, reexecuteQuery] = useQuery({
+    query: SearchQuery,
+    variables: { query: inputValue },
+    pause: true
+  });
+
+  const addProduct = async (productId) => {
+    const response = await fetch(addProductApi, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({
+        product_id: productId
+      }),
+      credentials: 'include'
+    });
+    const data = await response.json();
+    if (!data.success) {
+      toast.error(data.message);
+    } else {
+      setAddedProducts([...addedProducts, productId]);
+    }
+  };
+
+  React.useEffect(() => {
+    const timer = setTimeout(() => {
+      reexecuteQuery({ requestPolicy: 'network-only' });
+    }, 1500);
+
+    return () => clearTimeout(timer);
+  }, [inputValue]);
+
+  const { data, fetching, error } = result;
+  if (error) {
+    return (
+      <p>
+        Oh no...
+        {error.message}
+      </p>
+    );
+  }
+
+  return (
+    <Card title="Add Products">
+      <div className="modal-content">
+        <Card.Session>
+          <div>
+            <div className="border rounded border-divider mb-2">
+              <input
+                type="text"
+                value={inputValue}
+                placeholder="Search products"
+                onChange={(e) => setInputValue(e.target.value)}
+              />
+            </div>
+            {!data && (
+              <div className="p-3 border border-divider rounded flex justify-center items-center">
+                <Spinner width={25} height={25} />
+              </div>
+            )}
+            {!fetching && data && (
+              <>
+                <div className="divide-y">
+                  {data.products.items.length === 0 && (
+                    <div className="p-3 border border-divider rounded flex justify-center items-center">
+                      {inputValue ? (
+                        <p>No products found for query "{inputValue}"</p>
+                      ) : (
+                        <p>You have no products to display</p>
+                      )}
+                    </div>
+                  )}
+                  {data.products.items.map((product) => (
+                    <div
+                      key={product.uuid}
+                      className="grid grid-cols-8 gap-2 py-1 border-divider items-center"
+                    >
+                      <div className="col-span-1">
+                        <img src={product.image?.url} alt={product.name} />
+                      </div>
+                      <div className="col-span-5">
+                        <h3>{product.name}</h3>
+                        <p>{product.sku}</p>
+                      </div>
+                      <div className="col-span-2 text-right">
+                        {!(
+                          addedProducts.includes(product.uuid) ||
+                          product.categories.find(
+                            (c) => c.categoryId === categoryId
+                          )
+                        ) && (
+                          <button
+                            className="button secondary"
+                            onClick={async (e) => {
+                              e.preventDefault();
+                              await addProduct(product.uuid);
+                            }}
+                          >
+                            Add
+                          </button>
+                        )}
+                        {(addedProducts.includes(product.uuid) ||
+                          product.categories.find(
+                            (c) => c.categoryId === categoryId
+                          )) && (
+                          <span className="button primary">
+                            <CheckIcon width={20} height={20} />
+                          </span>
+                        )}
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              </>
+            )}
+          </div>
+        </Card.Session>
+      </div>
+      <Card.Session>
+        <div className="flex justify-end">
+          <Button title="Close" variant="secondary" onAction={closeModal} />
+        </div>
+      </Card.Session>
+    </Card>
+  );
+}
+
+AddProducts.propTypes = {
+  addProductApi: PropTypes.string.isRequired,
+  categoryId: PropTypes.number.isRequired,
+  closeModal: PropTypes.func.isRequired
+};
+
+export default AddProducts;