datocms-plugin-commercelayer 1.0.1 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/README.md +30 -9
  2. package/build/asset-manifest.json +3 -3
  3. package/build/index.html +1 -1
  4. package/build/static/js/main.be32b834.js +3 -0
  5. package/build/static/js/{main.f5c0d024.js.LICENSE.txt → main.be32b834.js.LICENSE.txt} +0 -0
  6. package/build/static/js/main.be32b834.js.map +1 -0
  7. package/docs/SKU-search.png +0 -0
  8. package/docs/SKU-selection.png +0 -0
  9. package/docs/SKU-visualization.png +0 -0
  10. package/docs/app-credentials.png +0 -0
  11. package/docs/cover.png +0 -0
  12. package/docs/field-presentation.png +0 -0
  13. package/docs/field-settings.jpg +0 -0
  14. package/docs/field-type.png +0 -0
  15. package/docs/new-app.png +0 -0
  16. package/docs/plugin-settings.jpg +0 -0
  17. package/package.json +1 -1
  18. package/build/static/js/main.f5c0d024.js +0 -3
  19. package/build/static/js/main.f5c0d024.js.map +0 -1
  20. package/docs/application.jpg +0 -0
  21. package/docs/credentials.jpg +0 -0
  22. package/docs/demo.mp4 +0 -0
  23. package/docs/settings.png +0 -0
package/README.md CHANGED
@@ -2,20 +2,41 @@
2
2
 
3
3
  A plugin that allows users to search and select Commerce Layer SKUs.
4
4
 
5
- ## Credentials (Commerce Layer)
5
+ ## App credentials (Commerce Layer)
6
6
 
7
- Go in your Commerce Layer project > Settings > Applications and create a new `datocms` application. It should look something like this:
7
+ To use this plugin first you need to create a Commerce Layer OAuth application and take note of its credentials. If you don't have a Commerce Layer account you can sign up for free [here](https://dashboard.commercelayer.io/sign_up) and follow the [onboarding tutorial](https://docs.commercelayer.io/developers/welcome/onboarding-tutorial) to create an organization and seed it with test data. Once successfully signed in to the Commerce Layer admin dashboard, go into your organization's _Integrations_ section and create a new integration app with role _Read only_:
8
8
 
9
- ![Application](docs/application.jpg)
9
+ ![New application](docs/new-app.png)
10
10
 
11
- Get the application's Base endpoint and Client ID:
11
+ Now you can access the application's base endpoint, cliend ID, and client secret:
12
12
 
13
- ![Credentials](docs/credentials.jpg)
13
+ ![Application credentials](docs/app-credentials.png)
14
14
 
15
- ## Configuration (DatoCMS)
15
+ > **BACKWORD COMPATIBILITY** — Please note that if you are upgrading from a previous version (older than `v2.0.0`) you neeed to change your plugin settings to use an integration app because old datocms Commerce Layer apps have been dismissed and don't work with the new versions of the plugin.
16
16
 
17
- Please specify your Commerce Layer parameters in the plugin settings:
17
+ Go in your Commerce Layer dashboard > Organization > Integration and create a new `datocms` application. It should look something like this:
18
18
 
19
- ![Demo](docs/settings.png)
19
+ ## Plugin configuration (DatoCMS)
20
20
 
21
- You can either hook this plugin manually to your single-line fields, or specifying an automatic match rule based on the API key.
21
+ You can search the plugin from the DatoCMS admin dashboard or install it form the [marketplace](https://www.datocms.com/marketplace/plugins/i/datocms-plugin-commercelayer). Once installed, you need to configure the plugin with the credentials you get from Commerce Layer app you previously created:
22
+
23
+ ![Plugin settings](docs/plugin-settings.jpg)
24
+
25
+ You can either hook this plugin manually to your single-line fields, or specify an identifier and use it to create an automatic match rule (e.g. via regex).
26
+
27
+ ## Usage
28
+
29
+ To use the plugin you need to add a single-line field to you model in DatoCMS and select _Commerce Layer SKU_ from the dropdown menu in the _Presentation tab_:
30
+
31
+ ![Field type](docs/field-type.png)
32
+ ![Field settings](docs/field-settings.jpg)
33
+ ![Field presentation](docs/field-presentation.png)
34
+
35
+ Now you can browse your Commerce Layer organization SKUs, search and select them from the UI. You can also create and add new SKUs by clicking the button that redirects to Commerce Layer admin UI:
36
+
37
+ ![SKU search](docs/SKU-search.png)
38
+ ![SKU selection](docs/SKU-selection.png)
39
+
40
+ The selected SKU's main information will then show in the related record:
41
+
42
+ ![SKU visualization](docs/SKU-visualization.png)
package/build/asset-manifest.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "files": {
3
3
  "main.css": "./static/css/main.aa1f469f.css",
4
- "main.js": "./static/js/main.f5c0d024.js",
4
+ "main.js": "./static/js/main.be32b834.js",
5
5
  "index.html": "./index.html",
6
6
  "main.aa1f469f.css.map": "./static/css/main.aa1f469f.css.map",
7
- "main.f5c0d024.js.map": "./static/js/main.f5c0d024.js.map"
7
+ "main.be32b834.js.map": "./static/js/main.be32b834.js.map"
8
8
  },
9
9
  "entrypoints": [
10
10
  "static/css/main.aa1f469f.css",
11
- "static/js/main.f5c0d024.js"
11
+ "static/js/main.be32b834.js"
12
12
  ]
13
13
  }
package/build/index.html CHANGED
@@ -1 +1 @@
1
- <!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><script defer="defer" src="./static/js/main.f5c0d024.js"></script><link href="./static/css/main.aa1f469f.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
1
+ <!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><script defer="defer" src="./static/js/main.be32b834.js"></script><link href="./static/css/main.aa1f469f.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>