From 47ef3e19ec0e6673d02de75e4da55caaf1d29036 Mon Sep 17 00:00:00 2001
From: yelinz <yelin.zhang@adfinis.com>
Date: Fri, 14 May 2021 10:29:53 +0200
Subject: [PATCH] fix(docs): add user documentation for workitembutton

---
 .../templates/components/work-item-button.hbs |  4 +-
 tests/dummy/app/router.js                     |  1 +
 tests/dummy/app/templates/docs.hbs            |  1 +
 tests/dummy/app/templates/docs/buttons.md     | 44 +++++++++++++++++++
 tests/dummy/app/templates/docs/queries.md     | 10 ++---
 translations/dummy/en.yaml                    |  1 +
 6 files changed, 54 insertions(+), 7 deletions(-)
 create mode 100644 tests/dummy/app/templates/docs/buttons.md

diff --git a/addon/templates/components/work-item-button.hbs b/addon/templates/components/work-item-button.hbs
index f87b23f88..816950d51 100644
--- a/addon/templates/components/work-item-button.hbs
+++ b/addon/templates/components/work-item-button.hbs
@@ -1,9 +1,9 @@
 <UkButton
   ...attributes
   @type={{@type}}
-  @disabled={{or @loading this.mutate.isRunning}}
+  @disabled={{or @disabled @loading this.mutate.isRunning}}
   @active={{@active}}
-  @loading={{or @disabled @loading this.mutate.isRunning}}
+  @loading={{or @loading this.mutate.isRunning}}
   @color={{or @color "default"}}
   @size={{@size}}
   @title={{@title}}
diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js
index b865fc56c..b9c671fe5 100644
--- a/tests/dummy/app/router.js
+++ b/tests/dummy/app/router.js
@@ -14,6 +14,7 @@ Router.map(function () {
     this.route("testing");
     this.route("queries");
     this.route("migration");
+    this.route("buttons");
   });
 
   this.route("demo", function () {
diff --git a/tests/dummy/app/templates/docs.hbs b/tests/dummy/app/templates/docs.hbs
index 0af55f72c..67f00f258 100644
--- a/tests/dummy/app/templates/docs.hbs
+++ b/tests/dummy/app/templates/docs.hbs
@@ -5,6 +5,7 @@
     {{nav.item (t "dummy.testing") "docs.testing"}}
     {{nav.item (t "dummy.queries.title") "docs.queries"}}
     {{nav.item (t "dummy.migration") "docs.migration"}}
+    {{nav.item (t "dummy.buttons") "docs.buttons"}}
   {{/viewer.nav}}
 
   {{#viewer.main}}
diff --git a/tests/dummy/app/templates/docs/buttons.md b/tests/dummy/app/templates/docs/buttons.md
new file mode 100644
index 000000000..c846ef382
--- /dev/null
+++ b/tests/dummy/app/templates/docs/buttons.md
@@ -0,0 +1,44 @@
+# Buttons
+
+`ember-caluma` provides buttons for mutating the state of work items.
+
+## Usage
+
+### WorkItemButton
+
+The text of the button is per default the mutation name, it can be overwritten with either the `label` parameter or using the component in block form.
+
+```hbs
+<WorkItemButton
+  @mutation="complete"
+  @workItemId="bb94ad56-d650-4c21-ba51-7c4230aef4b8"
+/>
+
+<WorkItemButton
+  @label="Lorem Ipsum"
+  @mutation="complete"
+  @workItemId="bb94ad56-d650-4c21-ba51-7c4230aef4b8"
+/>
+
+<WorkItemButton
+  @mutation="complete"
+  @workItemId="bb94ad56-d650-4c21-ba51-7c4230aef4b8"
+>
+  Lorem Ipsum
+</WorkItemButton>
+```
+
+ The WorkItemButton component has 3 parameters:
+
+ - `mutation` The state mutation to be used either `complete`, `skip` or `cancel`.
+ - `workItemId` Id of the work item which should be mutated.
+ - `label` (Optional) Overwrites the button text.
+
+ Additionally there are many optional parameters for the underlying [UkButton](https://adfinis-sygroup.github.io/ember-uikit/#/docs/components/button) component, refer to the UkButton component documentation to see what exactly they do:
+
+ - `type`
+ - `disabled`
+ - `loading` 
+ - `color`
+ - `size`
+ - `title`
diff --git a/tests/dummy/app/templates/docs/queries.md b/tests/dummy/app/templates/docs/queries.md
index 416beeba3..6e42d448f 100644
--- a/tests/dummy/app/templates/docs/queries.md
+++ b/tests/dummy/app/templates/docs/queries.md
@@ -44,11 +44,11 @@ public methods:
 
 - `fetch` To initially fetch the first page of the query. This will reset all existing items in the query. `fetch` takes the following optional arguments:
 
-| Name           | Type     | Description                                                                                                                                                                 |
-| -------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
-| `filter`       | `String  | Object`                                                                                                                                                                     | According to the `gql` filter type defined in the query you're using. |
-| `order`        | `String  | Object`                                                                                                                                                                     | According to the `gql` order type defined in the query you're using.  |
-| `queryOptions` | `Object` | Pass options to `apollo.query`. For more information on what options exist, [see here](https://www.apollographql.com/docs/react/api/core/ApolloClient/#ApolloClient.query). |
+| Name           | Type              | Description                                                  |
+| -------------- | ----------------- | ------------------------------------------------------------ |
+| `filter`       | `String \| Object` | According to the `gql` filter type defined in the query you're using. |
+| `order`        | `String \| Object` | According to the `gql` order type defined in the query you're using. |
+| `queryOptions` | `Object`          | Pass options to `apollo.query`. For more information on what options exist, [see here](https://www.apollographql.com/docs/react/api/core/ApolloClient/#ApolloClient.query). |
 
 - `fetchMore` This will load the next page of your data.
 
diff --git a/translations/dummy/en.yaml b/translations/dummy/en.yaml
index 74ca98b5e..f733f9125 100644
--- a/translations/dummy/en.yaml
+++ b/translations/dummy/en.yaml
@@ -9,3 +9,4 @@ dummy:
     load: "Load"
     loadMore: "Load more"
     getWorkItems: "getWorkItems"
+  buttons: "Buttons"