generated from AdobeDocs/dev-site-documentation-template
-
Notifications
You must be signed in to change notification settings - Fork 18
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update Admin UI SDK documentation for 1.4.0 release #160
Merged
Merged
Changes from all commits
Commits
Show all changes
6 commits
Select commit
Hold shift + click to select a range
4692be2
Update documentation for Admin UI SDK 1.4.0 release
asalloum5 f4bd29f
Code review updates
asalloum5 567b08a
Apply suggestions from code review
asalloum5 211a6e6
Move customer page
asalloum5 27cc0b0
Merge branch 'main' into ui-sdk-140
keharper b65cea8
Fixed broken links
keharper File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
120 changes: 120 additions & 0 deletions
120
src/pages/admin-ui-sdk/extension-points/customer/grid-columns.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,120 @@ | ||
--- | ||
title: customer grid columns | ||
description: Customize the customers page in the Adobe Commerce Admin. | ||
keywords: | ||
- App Builder | ||
- Extensibility | ||
--- | ||
|
||
# customer grid columns | ||
|
||
The `customer grid columns` extension point enables you to add columns to the grid on the **Customers** > **All Customers** page in the Adobe Commerce Admin. This extension point requires an [API Mesh](https://developer.adobe.com/graphql-mesh-gateway/gateway) for Adobe Developer App Builder instance to retrieve the data to be added to the custom columns. | ||
|
||
You can use the [`aio api-mesh:describe` command](https://developer.adobe.com/graphql-mesh-gateway/gateway/command-reference/#aio-api-meshdescribe) to retrieve the values of the API key and mesh ID. The key is appended to the mesh endpoint URL. | ||
|
||
## Example customization | ||
|
||
The following example creates custom columns labeled `First App Column` and `Second App Column`. | ||
|
||
```javascript | ||
customer: { | ||
getGridColumns() { | ||
return { | ||
data:{ | ||
meshId:'MESH_ID', | ||
apiKey: 'API_KEY' | ||
}, | ||
properties:[ | ||
{ | ||
label: 'First App Column', | ||
columnId: 'first_column', | ||
type: 'string', | ||
align: 'left' | ||
}, | ||
{ | ||
label: 'Second App Column', | ||
columnId: 'second_column', | ||
type: 'integer', | ||
align: 'left' | ||
} | ||
] | ||
} | ||
} | ||
} | ||
``` | ||
|
||
### Sample API Mesh configuration file | ||
|
||
The following sample mesh configuration file defines the external source that contains the data to populate in the custom columns. | ||
|
||
```json | ||
{ | ||
"meshConfig": { | ||
"sources": [ | ||
{ | ||
"name": "customers", | ||
"handler": { | ||
"JsonSchema": { | ||
"baseUrl": "https://www.example.com", | ||
"operations": [ | ||
{ | ||
"type": "Query", | ||
"field": "customers", | ||
"path": "/graphql", | ||
"method": "GET", | ||
"responseSchema": "./schema.json" | ||
} | ||
] | ||
} | ||
} | ||
} | ||
] | ||
} | ||
} | ||
``` | ||
|
||
### Sample schema file | ||
|
||
This sample `schema.json` file is referenced in the mesh configuration file. It defines the response of the external `customerGridColumns` query that fetches column data. | ||
|
||
```json | ||
{ | ||
"$schema": "http://json-schema.org/draft-04/schema#", | ||
"type": "object", | ||
"properties": { | ||
"customerGridColumns": { | ||
"type": "object", | ||
"patternProperties": { | ||
"^0": { | ||
"type": "object", | ||
"properties": { | ||
"first_column": { | ||
"type": "string" | ||
}, | ||
"second_column": { | ||
"type": "integer" | ||
}, | ||
"third_column": { | ||
"type": "integer" | ||
} | ||
} | ||
} | ||
} | ||
} | ||
}, | ||
"required": [ | ||
"customerGridColumns" | ||
] | ||
} | ||
``` | ||
|
||
## Parameters | ||
|
||
| Field | Type | Required | Description | | ||
| --- | --- | --- | --- | | ||
| `data.apiKey` | string | Yes | The API key assigned to the GraphQL mesh. | | ||
| `data.meshId` | string | Yes | The ID of the mesh used to retrieve the column data.| | ||
| `properties.align` | string | Yes | The alignment of the values in the column. One of `left`, `right`, `center`. | | ||
| `properties.columnId` | string | Yes | The identifier used in the external dataset to identify the column. | | ||
| `properties.label` | string | Yes | The label of the column to display. | | ||
| `properties.type` | string | Yes | The data type of the values in the column. Supported values: `boolean`, `date`, `float`, `integer`, `string`. Date values must be ISO 8601-compliant. | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
--- | ||
title: Customer extension points | ||
description: Learn how to make modifications to the Customers page in the Adobe Commerce Admin. | ||
keywords: | ||
- App Builder | ||
- Extensibility | ||
--- | ||
|
||
# Customer extension points | ||
|
||
The Adobe Commerce Admin UI SDK enables you to make modifications to the following elements on the **Customer** > **All Customers** page in the Adobe Commerce Admin: | ||
|
||
* Add custom [columns](grid-columns.md) to the customer grid. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Will people upgrading to 1.4.0 need to make these updates?
Is a sample
server.js
file provided? If yes, it might be better to point to it rather than trying to keep this up to date.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The non updated version will still work as expected. I agree it's better to have a file that we update in the repository, let me double check if we already publish it, if not I can do so.