From 9a2b6e21efd6c61a3fa37ddc673245d52b87ff25 Mon Sep 17 00:00:00 2001
From: Falk <falk.neumann@adfinis.com>
Date: Wed, 29 Jun 2022 15:29:37 +0200
Subject: [PATCH] feat(emeisOptions): add custom column option

---
 README.md                                     |  9 +++++++
 addon/controllers/permissions/index.js        | 10 +++++++-
 addon/controllers/roles/index.js              | 10 +++++++-
 addon/controllers/users/index.js              |  4 +++
 addon/helpers/optional-localized-value.js     | 20 +++++++++++++++
 addon/templates/permissions/index.hbs         | 10 ++++++++
 addon/templates/roles/index.hbs               | 11 +++++++-
 addon/templates/users/index.hbs               | 10 ++++++++
 app/helpers/optional-localized-value.js       |  1 +
 tests/dummy/app/services/emeis-options.js     |  8 ++++++
 tests/dummy/mirage/factories/user.js          |  6 ++++-
 .../helpers/optional-localized-value-test.js  | 25 +++++++++++++++++++
 12 files changed, 120 insertions(+), 4 deletions(-)
 create mode 100644 addon/helpers/optional-localized-value.js
 create mode 100644 app/helpers/optional-localized-value.js
 create mode 100644 tests/integration/helpers/optional-localized-value-test.js

diff --git a/README.md b/README.md
index 1664dbe0..09699219 100644
--- a/README.md
+++ b/README.md
@@ -114,6 +114,15 @@ export default class EmeisOptionsService extends Service {
       city: "optional",
       zip: "optional",
     },
+    // adds additional custom columns to this model's list view. *Scopes are not supported, since they are represented as a tree!*
+    customColumns: [
+      {
+        heading: "Funktion", // ember-intl or string
+        slug: "additional_column_function", // relative to "model.metainfo[slug]"
+        sortable: true, // whether sorting is supported for this column
+        localized: true, // whether to expect a plain value or a object with localized values
+      },
+    ],
     /*
     On each model edit view (e.g. users) you can define a custom component. The component will be rendered at the bottom of the edit view, but above the primary form buttons. Each component can be designed freely and the model will be passed into the component as `@model` argument. For a working demo have a look at our "dummy-button" at "dummy/app/components/dummy-button".
     */
diff --git a/addon/controllers/permissions/index.js b/addon/controllers/permissions/index.js
index fb4f0020..b5f834c8 100644
--- a/addon/controllers/permissions/index.js
+++ b/addon/controllers/permissions/index.js
@@ -1,3 +1,11 @@
+import { inject as service } from "@ember/service";
+
 import PaginationController from "ember-emeis/-private/controllers/pagination";
 
-export default class PermissionsIndexController extends PaginationController {}
+export default class PermissionsIndexController extends PaginationController {
+  @service emeisOptions;
+
+  get customColumns() {
+    return this.emeisOptions.permission?.customColumns;
+  }
+}
diff --git a/addon/controllers/roles/index.js b/addon/controllers/roles/index.js
index 669a3a6d..4d57ce5b 100644
--- a/addon/controllers/roles/index.js
+++ b/addon/controllers/roles/index.js
@@ -1,3 +1,11 @@
+import { inject as service } from "@ember/service";
+
 import PaginationController from "ember-emeis/-private/controllers/pagination";
 
-export default class RolesIndexController extends PaginationController {}
+export default class RolesIndexController extends PaginationController {
+  @service emeisOptions;
+
+  get customColumns() {
+    return this.emeisOptions.role?.customColumns;
+  }
+}
diff --git a/addon/controllers/users/index.js b/addon/controllers/users/index.js
index 83d4adb8..62bfc308 100644
--- a/addon/controllers/users/index.js
+++ b/addon/controllers/users/index.js
@@ -11,6 +11,10 @@ export default class UsersIndexController extends PaginationController {
   @service notification;
   @service intl;
 
+  get customColumns() {
+    return this.emeisOptions.user?.customColumns;
+  }
+
   get emailAsUsername() {
     return this.emeisOptions.emailAsUsername;
   }
diff --git a/addon/helpers/optional-localized-value.js b/addon/helpers/optional-localized-value.js
new file mode 100644
index 00000000..501cdbe4
--- /dev/null
+++ b/addon/helpers/optional-localized-value.js
@@ -0,0 +1,20 @@
+import Helper from "@ember/component/helper";
+import { inject as service } from "@ember/service";
+
+export default class OptionalLocalizedValue extends Helper {
+  @service intl;
+  @service emeisOptions;
+
+  getFieldLocale(modelName) {
+    return modelName
+      ? this.emeisOptions.forceLocale?.[modelName]
+      : undefined || this.intl.localizedFieldLocale || this.intl.primaryLocale;
+  }
+
+  compute([field, modelName]) {
+    if (typeof field === "string") {
+      return field;
+    }
+    return field[this.getFieldLocale(modelName)];
+  }
+}
diff --git a/addon/templates/permissions/index.hbs b/addon/templates/permissions/index.hbs
index 50311f20..85cbd30b 100644
--- a/addon/templates/permissions/index.hbs
+++ b/addon/templates/permissions/index.hbs
@@ -15,6 +15,11 @@
     <th>
       {{t "emeis.permissions.headings.description"}}
     </th>
+    {{#each this.customColumns as |extraColumn|}}
+      <Column @sort={{if extraColumn.sort extraColumn.slug}}>
+        {{optional-translate extraColumn.heading}}
+      </Column>
+    {{/each}}
   </table.head>
   <table.body as |body|>
     <body.row>
@@ -36,6 +41,11 @@
         <td class="uk-width-expand" data-test-permission-desc={{permission.id}}>
           {{permission.description}}
         </td>
+        {{#each this.customColumns as |extraColumn|}}
+          <td class="uk-width-expand" data-test-custom-column={{extraColumn.slug}}>
+              {{optional-localized-value (get permission.metainfo extraColumn.slug) "permission"}}
+          </td>
+        {{/each}}
       {{/let}}
     </body.row>
   </table.body>
diff --git a/addon/templates/roles/index.hbs b/addon/templates/roles/index.hbs
index 1faf4754..35be6af1 100644
--- a/addon/templates/roles/index.hbs
+++ b/addon/templates/roles/index.hbs
@@ -15,6 +15,11 @@
     <th>
       {{t "emeis.roles.headings.description"}}
     </th>
+    {{#each this.customColumns as |extraColumn|}}
+      <Column @sort={{if extraColumn.sort extraColumn.slug}}>
+        {{optional-translate extraColumn.heading}}
+      </Column>
+    {{/each}}
   </table.head>
   <table.body as |body|>
     <body.row>
@@ -28,10 +33,14 @@
         <td class="uk-width-1-4" data-test-role-slug={{role.id}}>
           {{role.slug}}
         </td>
-
         <td class="uk-width-expand" data-test-role-desc={{role.id}}>
           {{role.description}}
         </td>
+        {{#each this.customColumns as |extraColumn|}}
+          <td class="uk-width-expand" data-test-custom-column={{extraColumn.slug}}>
+              {{optional-localized-value (get role.metainfo extraColumn.slug) "role"}}
+          </td>
+        {{/each}}
       {{/let}}
     </body.row>
   </table.body>
diff --git a/addon/templates/users/index.hbs b/addon/templates/users/index.hbs
index 8b0187e0..1c3c1a20 100644
--- a/addon/templates/users/index.hbs
+++ b/addon/templates/users/index.hbs
@@ -24,6 +24,11 @@
     <Column @sort="email">
       {{t "emeis.users.headings.email"}}
     </Column>
+    {{#each this.customColumns as |extraColumn|}}
+      <Column @sort={{if extraColumn.sort extraColumn.slug}}>
+        {{optional-translate extraColumn.heading}}
+      </Column>
+    {{/each}}
     <Column>
       {{t "emeis.roles.title"}}
     </Column>
@@ -56,6 +61,11 @@
         <td class="uk-link-text {{unless user.isActive "text-line-through"}}" data-test-user-email={{user.id}}>
           {{user.email}}
         </td>
+        {{#each this.customColumns as |extraColumn|}}
+          <td class="uk-link-text {{unless user.isActive "text-line-through"}}" data-test-custom-column={{extraColumn.slug}}>
+              {{optional-localized-value (get user.metainfo extraColumn.slug) "user"}}
+          </td>
+        {{/each}}
         <td class="uk-link-text {{unless user.isActive "text-line-through"}}">
           <ul class="uk-list uk-list-divider">
             {{#each user.acls as |acl|}}
diff --git a/app/helpers/optional-localized-value.js b/app/helpers/optional-localized-value.js
new file mode 100644
index 00000000..b6eb62e9
--- /dev/null
+++ b/app/helpers/optional-localized-value.js
@@ -0,0 +1 @@
+export { default } from "ember-emeis/helpers/optional-localized-value";
diff --git a/tests/dummy/app/services/emeis-options.js b/tests/dummy/app/services/emeis-options.js
index 247eada6..0005defa 100644
--- a/tests/dummy/app/services/emeis-options.js
+++ b/tests/dummy/app/services/emeis-options.js
@@ -20,6 +20,14 @@ export default class EmeisOptionsService extends Service {
     //   phone: "optional",
     //   language: "optional",
     // }
+    customColumns: [
+      {
+        heading: "Funktion", // ember-intl or string
+        slug: "additional_column_function", // relative to "model.metainfo[slug]"
+        sortable: true, // whether sorting is supported for this column
+        localized: true, // whether to expect a plain value or a object with localized values
+      },
+    ],
     customComponent: TestButtonComponent,
     metaFields: [
       {
diff --git a/tests/dummy/mirage/factories/user.js b/tests/dummy/mirage/factories/user.js
index df1fa733..a37c6e1c 100644
--- a/tests/dummy/mirage/factories/user.js
+++ b/tests/dummy/mirage/factories/user.js
@@ -14,6 +14,10 @@ export default Factory.extend({
   address: () => faker.address.streetAddress(),
   city: () => localize(faker.address.city()),
   zip: () => faker.datatype.number(),
-  metainfo: () => {},
+  metainfo: () => {
+    return {
+      additional_column_function: faker.company.bsNoun(),
+    };
+  },
   isActive: () => faker.datatype.boolean(),
 });
diff --git a/tests/integration/helpers/optional-localized-value-test.js b/tests/integration/helpers/optional-localized-value-test.js
new file mode 100644
index 00000000..0ea42d97
--- /dev/null
+++ b/tests/integration/helpers/optional-localized-value-test.js
@@ -0,0 +1,25 @@
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import { setupIntl } from "ember-intl/test-support";
+import { setupRenderingTest } from "ember-qunit";
+import { module, test } from "qunit";
+
+module("Integration | Helper | optional-localized-value", function (hooks) {
+  setupRenderingTest(hooks);
+  setupIntl(hooks, ["en"]);
+
+  test("it renders a localized field", async function (assert) {
+    this.set("inputValue", { en: "english", de: "deutsch" });
+
+    await render(hbs`{{optional-localized-value this.inputValue}}`);
+
+    assert.dom(this.element).hasText("english");
+  });
+  test("it renders a unlocalized field", async function (assert) {
+    this.set("inputValue", "1234-string");
+
+    await render(hbs`{{optional-localized-value this.inputValue}}`);
+
+    assert.dom(this.element).hasText("1234-string");
+  });
+});