@newfold/wp-module-ecommerce NPM

wp-module-ecommerce

Next-generation WordPress eCommerce Experience for WordPress sites at Newfold Digital.

Module Responsibilities

Ecommerce module displays Home or Dashboard page for Brand plugin, with below options:
1. Live site preview for both, live and coming soon mode for WordPress site with view & edit site options
2. Next steps to setup your site helps customers to complete below tasks:
  - To add store info
  - Setup online payment options like PayPal, Stripe, RazorPay. Also choose offline payment options like, check payments, bank transfers & C.O.D
  - Setup shipping options like Shippo.
  - Configure tax settings
  - Add/import products
  - Customers who have selected novice as WordPress experience level will have access to Signup to BlueHost WP academy / Yoast academy for learning purpose.
  - There is also link for Customers to view list of Completed tasks
Ecommerce module also displays Store option which gives snapshot of recent customer activity with details like total sales, net sales, recent orders, products sold, visitors, views and also a link to detailed Analytics page of Woocommerce plugin.
Store page also, allows customers to Purchase/Enable/Manage and learn more about YITH extended plugins like:
1. YITH Booking and Appointment for WooCommerce
2. YITH WooCommerce AJAX Search
3. YITH WooCommerce Gift Cards
4. YITH WooCommerce Wishlist
5. YITH WooCommerce Customize My Account Page
6. YITH WooCommerce Ajax Product Filter.
Under Store we have a Products & Services submenu option which provides following options:
1. Easy access to Add new product/Import CSV of products into your store.
2. Option to setup bookings & appointments or offer gift cards on purchases via YITH extended plugins.
Next submenu under Store is Sales & Promotionswhere customer can setup different promotional offers on products in their store.
1. Here we display 13 different campaign setup options offered by WonderCart plugin under All Campaigns tab.
2. There is also a Settings tab where users can customize look & feel of how sales campaigns are displayed on their Store page.
Next submenu under Store is Payments where we store owner can setup payments option accepted on purchases at Store.
1. There 3 online payment options via payments gateways like PayPal, Stripe & RazorPay(only for India location).
2. We also offer offline payments option via cheque, bank transfer or cash on delivery.
Final submenu under Store is Store details with following options:
1. Store location and complete address, email address of store owner and currency in which products/services are displayed on the store.
2. Under shipping option tab on the store details page you can connect to Shipping partner like, Shippo (based on your store location).
3. Under tax settings tab, store owner can choose to enable/disable sales tax.

Critical Paths

Store page should give a brief overview of recent customer activity on Ecommerce website.
Store page displays section to setup Ecommerce features where users can purchase/enable/manage YITH extended plugins.
It is required to install & activate WooCommerce plugin for below plugins to work,
1. YITH PayPal Payment plugin for - facilitating payments via PayPal,
2. WonderCartplugin for - creating sales & promotional campaigns,
3. YITH Stripe Payments plugin for - facilitating payments via Stripe
4. Ecomdash plugin for - managing marketplace and ecommerce website sales.
Home page should display warnings enabled but not effective, requires WooCommerce in order to work. for above YITH plugins, incase WooCommerce isn't setup.
If WooCommerce plugin isn't setup, Store tab should ask users to first install & activate WooCommerce till then all the sub-menu options under Store menu should be disabled.
Products & Services tab should provide customers access to purchase services offered by YITH extended plugins like: YITH Booking and Appointment for WooCommerce and YITH WooCommerce Gift Cards.
Sales & Promotions submenu allows customers to install WonderCart plugin if it is not already installed & activated. Once WonderCart is activated it offers option to setup different promotional campaigns.
Payments tab facilitates Customers to connect their accounts to receive payments via popular online payment options like PayPal, Stripe and RazorPay. Customers can also choose to accept offline payment via options like: check payments, bank transfers & C.O.D.
Store details tab facilitates setup of Shippo third party shipping software for e-commerce businesses.

Installation

1. Add the Newfold Satis to your `composer.json`.

composer config repositories.newfold composer https://newfold-labs.github.io/satis

2. Require the `newfold-labs/wp-module-ecommerce` package.

composer require newfold-labs/wp-module-ecommerce

3. Install the `@newfold/wp-module-ecommerce` npm package.

Previously, this module's package was hosted at github and these instructions were required GH Packages Setup. Now the package is hosted at npmjs and this referenced setup is no longer relevant. Find the npmjs package at https://www.npmjs.com/package/@newfold/wp-module-ecommerce and install just as any other public package. Note the newfold org namespace for npmjs and the newfold-labs org namespace for github and satis.

npm install @newfold/wp-module-ecommerce

Usage

In your React component you can import the eCommerce module as so,

import { NewfoldECommerce } from "@newfold/wp-module-ecommerce";

function EcommercePage(props) {
  return <NewfoldECommerce {...props} />;
}

Steps to create new release for Ecommerce module

We have switched to npmjs packages for publishing newer versions of the ecommerce module.

If you're doing something that will not break anything or not adding any new dependency. But, only doing basic stuff like bug fixes, copy changes etc. Change which doesn't really impact the plugin in bigger way you can put them under the last number of versions.

If you're doing something, like adding a new library, or changing something in the way the plugin can use our module then it's better to upgrade the minor version which is the 2nd digit of version.

In rare scenarios, like UI redesign where the change is bigger or a major refactor, we update the 1st digit of version.

Changes to Ecommerce Module

Merge approved PRs into trunk branch
Run, npm run set-version-bump (this will auto update version in package and bootstrap file, perform a build, and update translation files)
Commit above change in separate commit (commit message: Bump to new version value)
Go to https://github.com/newfold-labs/wp-module-ecommerce/releases
Click on Draft a new release button (Note: Saving as draft, pipeline is not running.)
By default, you'll always create a release from target: trunk branch. In case we are making changes to crazydomains then we must switch to the legacy branch do the fixes there and create a release from target: legacy branch as it currently runs older version
Give V dot version that you want to release and click on create a new tag.
Click Generate release notes button it will basically collect all the pull requests that came in from the previous release to now and then just create a summary. (It won't track any direct comments to the trunk. It will just only track pull request)
Keep Set as the latest release checkbox checked as it is by default.
Click Publish a release button.
Go to https://newfold-labs.github.io/satis/ Satis is a PHP registry for our packages.
We have set up an integration within our workflow itself so once workflow completes, we trigger alert to Satis that newer version of ecommerce module is released and rebuild Satis so that it can show newer version in packages (Repo: https://github.com/newfold-labs/satis/actions)
The newer version will appear in 5 to 10 minutes of rebuilding.
We do not have permission to rerun Satis build, so in case it fails PRESS1 team can help.
You can check the status of Statis build & Publish workflow here https://github.com/newfold-labs/wp-module-ecommerce/actions
On successful completion you can see latest js package here https://www.npmjs.com/package/@newfold/wp-module-ecommerce

Changes to Bluehost plugin repo

Note: if no plugin changes are required we can let dependabot create a PR for the php module and the js package. If any plugin changs are required, please do the following in a branch on the respective plugin repo:

In composer.json file, update version of newfold-labs/wp-module-ecommerce to latest
In package.json file, @newfold/wp-module-ecommerce version number to latest
Run command, npm i --legacy-peer-deps
Package-lock.json should auto update.
Once Satis starts showing updated version run below command for composer update, $ composer update newfold-labs/wp-module-ecommerce -W
We need to create a branch (naming convention: dependencies/newfold-labs/wp-module-ecommerce-version_number).
Currently we don't have the permission to publish directly to the BlueHost plugin so, we need to create a fork basically of the repo then push it to that fork and then create a pull request against the develop branch.
The new release process is thus completed.