From 71456382c47eadaa4bb98501bd3c7aafbfde1a52 Mon Sep 17 00:00:00 2001
From: Christopher Allford <6451942+ObliviousHarmony@users.noreply.github.com>
Date: Fri, 17 Jun 2022 15:32:29 -0700
Subject: [PATCH] Add Client Components Documentation To WooCommerce Core
 (#33507)

This commit adds documentation for WooCommerce's client component commands. This should make it easier to know what commands to run to work in these components.
---
 plugins/woocommerce/README.md                 | 44 +++++++++++++++++++
 .../changelog/docs-add-woocommerce-components |  5 +++
 2 files changed, 49 insertions(+)
 create mode 100644 plugins/woocommerce/changelog/docs-add-woocommerce-components

diff --git a/plugins/woocommerce/README.md b/plugins/woocommerce/README.md
index 8cac7772589..e0e3fec7f4c 100644
--- a/plugins/woocommerce/README.md
+++ b/plugins/woocommerce/README.md
@@ -28,6 +28,50 @@ pnpm -- wp-env start
 
 You should now be able to visit http://docker.local:8888/ and access WooCommerce environment.
 
+## Building Components
+
+There are two major client-side components included in WooCommerce Core that can be built, linted, and tested independently. We've organized these components
+in this way to take advantage of caching to prevent unnecessarily performing expensive rebuilds when only working in one of them.
+
+### `plugins/woocommerce/client/legacy`
+
+This directory contains the CSS and jQuery code for WooCommerce.
+
+```bash
+# Build the assets.
+pnpm -- turbo run build --filter=woocommerce/client/legacy
+# Lint the assets.
+pnpm -- turbo run lint --filter=woocommerce/client/legacy
+```
+
+### `plugins/woocommerce-admin`
+
+This directory contains the React-based admin interface.
+
+```bash
+# Build the React-based admin client.
+pnpm -- turbo run build --filter=woocommerce/client/admin
+# Lint the React-based admin client.
+pnpm -- turbo run lint --filter=woocommerce/client/admin
+# Test the React-based admin client.
+pnpm -- turbo run test --filter=woocommerce/client/admin
+```
+
+#### Helper Scripts
+
+Here is a collection of scripts that can help when developing the React-based admin interface.
+
+```bash
+# Create a develoment build of the React-based admin client.
+pnpm dev --filter=woocommerce/client/admin
+# Create and watch a development build of the React-based admin client.
+pnpm start --filter=woocommerce/client/admin
+# Watch the tests of the React-based admin client.
+pnpm test:watch --filter=woocommerce/client/admin
+# Run a type check over the React-based admin client's TypeScript files.
+pnpm ts:check --filter=woocommerce/client/admin
+```
+
 ## Documentation
 * [WooCommerce Documentation](https://docs.woocommerce.com/)
 * [WooCommerce Developer Documentation](https://github.com/woocommerce/woocommerce/wiki)
diff --git a/plugins/woocommerce/changelog/docs-add-woocommerce-components b/plugins/woocommerce/changelog/docs-add-woocommerce-components
new file mode 100644
index 00000000000..064b889a8e6
--- /dev/null
+++ b/plugins/woocommerce/changelog/docs-add-woocommerce-components
@@ -0,0 +1,5 @@
+Significance: patch
+Type: dev
+Comment: Documentation update
+
+