feat(emeis-options): make user filter optionally visible

README.md

@@ -127,7 +127,13 @@ export default class EmeisOptionsService extends Service {
     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".
     */
     customComponent: DummyButton,
-    /* Exclusively on USER model - define a custom component which will get displayed next to the 'inacitve' pill on top of the user detail view. Ideally this will be an inline element.
+    /* 
+    Exclusively on USER model - Optionally hide the "active" / "inactive" filter buttons on top of the user list. You can pass
+    a function, boolean or string as value.
+    */
+    filtersVisible: () => true,
+    /* 
+    Exclusively on USER model - define a custom component which will get displayed next to the 'inacitve' pill on top of the user detail view. Ideally this will be an inline element.
      */
     statusComponent: DummyStatus,
   };

addon/controllers/users/index.js

@@ -31,6 +31,10 @@ export default class UsersIndexController extends PaginationController {
     return this.emeisOptions.navigationEntries?.includes("scopes");
   }
 
+  get filtersVisible() {
+    return this.emeisOptions.users?.filtersVisible ?? true;
+  }
+
   get filters() {
     return { isActive: this.filter_active };
   }

addon/helpers/evaluate-to-boolean.js

@@ -0,0 +1,14 @@
+import { helper } from "@ember/component/helper";
+
+export default helper(function evaluateToBoolean([expression, ...parameter]) {
+  if (typeof expression === "boolean") {
+    return expression;
+  }
+  if (typeof expression === "function") {
+    return expression(...parameter);
+  }
+  if (typeof expression === "string") {
+    return expression === "true";
+  }
+  return false;
+});

addon/templates/users/index.hbs

@@ -10,24 +10,26 @@
   @include={{array "acls.role" "acls.scope"}}
   as |table|
 >
-  <table.filters as |Filter|>
-    <Filter.radio-buttons
-          @name="active"
-          @label={{t "emeis.filters.active.title"}}
-          @selected={{this.filter_active}}
-          @options={{array
-            (hash value=true label=(t "emeis.filters.active.on"))
-            (hash value=false label=(t "emeis.filters.active.off"))
-          }}
-          @onChange={{fn this.updateFilter "active"}}
-        />
-  </table.filters>
+  {{#if (evaluate-to-boolean this.filtersVisible)}}
+    <table.filters as |Filter|>
+      <Filter.radio-buttons
+        @name="active"
+        @label={{t "emeis.filters.active.title"}}
+        @selected={{this.filter_active}}
+        @options={{array
+          (hash value=true label=(t "emeis.filters.active.on"))
+          (hash value=false label=(t "emeis.filters.active.off"))
+        }}
+        @onChange={{fn this.updateFilter "active"}}
+      />
+    </table.filters>
+  {{/if}}
   <table.head as |Column|>
     {{#unless this.emailAsUsername}}
       <Column @sort="username">
         {{t "emeis.users.headings.username"}}
       </Column>
-      {{/unless}}
+    {{/unless}}
     <Column @sort="last_name">
       {{t "emeis.users.headings.lastName"}}
     </Column>
@@ -38,7 +40,14 @@
       {{t "emeis.users.headings.email"}}
     </Column>
     {{#each this.customColumns as |extraColumn|}}
-      <Column @sort={{if extraColumn.sortable (concat "metainfo__" extraColumn.slug) ""}} data-test-custom-column={{extraColumn.slug}}>
+      <Column
+        @sort={{if
+          extraColumn.sortable
+          (concat "metainfo__" extraColumn.slug)
+          ""
+        }}
+        data-test-custom-column={{extraColumn.slug}}
+      >
         {{optional-translate extraColumn.heading}}
       </Column>
     {{/each}}
@@ -48,74 +57,108 @@
     <Column>
       {{t "emeis.scopes.title"}}
     </Column>
-    <Column>
-    </Column>
+    <Column />
   </table.head>
   <table.body as |body|>
     <body.row>
       {{#let body.model as |user|}}
         {{#if this.emailAsUsername}}
           <td>
-            <LinkTo @route="users.edit" @model={{user}} class="uk-link-text {{unless user.isActive "text-line-through"}}">
+            <LinkTo
+              @route="users.edit"
+              @model={{user}}
+              class="uk-link-text {{unless user.isActive 'text-line-through'}}"
+            >
               {{user.lastName}}
             </LinkTo>
           </td>
-          <td class="uk-link-text {{unless user.isActive "text-line-through"}}">{{user.firstName}}</td>
+          <td
+            class="uk-link-text {{unless user.isActive 'text-line-through'}}"
+          >{{user.firstName}}</td>
         {{else}}
           <td data-test-user-username={{user.id}}>
-            <LinkTo @route="users.edit" @model={{user}} class="uk-link-text {{unless user.isActive "text-line-through"}}">
+            <LinkTo
+              @route="users.edit"
+              @model={{user}}
+              class="uk-link-text {{unless user.isActive 'text-line-through'}}"
+            >
               {{user.username}}
             </LinkTo>
           </td>
-          <td class="uk-link-text {{unless user.isActive "text-line-through"}}">{{user.lastName}}</td>
-          <td class="uk-link-text {{unless user.isActive "text-line-through"}}">{{user.firstName}}</td>
+          <td
+            class="uk-link-text {{unless user.isActive 'text-line-through'}}"
+          >{{user.lastName}}</td>
+          <td
+            class="uk-link-text {{unless user.isActive 'text-line-through'}}"
+          >{{user.firstName}}</td>
         {{/if}}
 
-        <td class="uk-link-text {{unless user.isActive "text-line-through"}}" data-test-user-email={{user.id}}>
+        <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-row={{extraColumn.slug}}>
-              {{optional-localized-value (get user.metainfo extraColumn.slug) "user"}}
+          <td
+            class="uk-link-text {{unless user.isActive 'text-line-through'}}"
+            data-test-custom-row={{extraColumn.slug}}
+          >
+            {{optional-localized-value
+              (get user.metainfo extraColumn.slug)
+              "user"
+            }}
           </td>
         {{/each}}
-        <td class="uk-link-text {{unless user.isActive "text-line-through"}}">
+        <td class="uk-link-text {{unless user.isActive 'text-line-through'}}">
           <ul class="uk-list uk-list-divider">
             {{#each user.acls as |acl|}}
               <li>
                 {{#if this.linkToRole}}
-                  <LinkTo @route="roles.edit" @model={{acl.role}} class="uk-link-text">
+                  <LinkTo
+                    @route="roles.edit"
+                    @model={{acl.role}}
+                    class="uk-link-text"
+                  >
                     {{acl.role.name}}
                   </LinkTo>
                 {{else}}
                   {{acl.role.name}}
                 {{/if}}
               </li>
             {{else}}
-            -
+              -
             {{/each}}
           </ul>
         </td>
-        <td class="uk-link-text {{unless user.isActive "text-line-through"}}">
+        <td class="uk-link-text {{unless user.isActive 'text-line-through'}}">
           <ul class="uk-list uk-list-divider">
             {{#each user.acls as |acl|}}
               <li>
                 {{#if this.linkToScope}}
-                  <LinkTo @route="scopes.edit" @model={{acl.scope}} class="uk-link-text">
+                  <LinkTo
+                    @route="scopes.edit"
+                    @model={{acl.scope}}
+                    class="uk-link-text"
+                  >
                     {{acl.scope.fullName}}
                   </LinkTo>
                 {{else}}
-                    {{acl.scope.fullName}}
+                  {{acl.scope.fullName}}
                 {{/if}}
               </li>
             {{else}}
-            -
+              -
             {{/each}}
           </ul>
         </td>
         <td class="uk-text-right small-padding-right">
-          <LinkTo @route="users.edit" @model={{user}} class="uk-link-reset uk-margin-small-right">
-            <UkIcon @icon="pencil"/>
+          <LinkTo
+            @route="users.edit"
+            @model={{user}}
+            class="uk-link-reset uk-margin-small-right"
+          >
+            <UkIcon @icon="pencil" />
           </LinkTo>
           {{#if (can-delete "user" user)}}
             <UkButton @color="link" @onClick={{perform this.delete user}}>

app/helpers/evaluate-to-boolean.js

@@ -0,0 +1 @@
+export { default } from "ember-emeis/helpers/evaluate-to-boolean";

tests/dummy/app/services/emeis-options.js

@@ -30,6 +30,7 @@ export default class EmeisOptionsService extends Service {
       },
     ],
     customComponent: TestButtonComponent,
+    filtersVisible: () => true,
     metaFields: [
       {
         slug: "megameta",

tests/integration/helpers/evaluate-to-boolean-test.js

@@ -0,0 +1,88 @@
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import { setupRenderingTest } from "ember-qunit";
+import { module, test } from "qunit";
+
+module("Integration | Helper | evaluateToBoolean", function (hooks) {
+  setupRenderingTest(hooks);
+
+  test("evaluates booleans (true)", async function (assert) {
+    this.set("inputValue", true);
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("true");
+  });
+
+  test("evaluates booleans (false)", async function (assert) {
+    this.set("inputValue", false);
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("false");
+  });
+
+  test("evaluates string (true)", async function (assert) {
+    this.set("inputValue", "true");
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("true");
+  });
+
+  test("evaluates string (false)", async function (assert) {
+    this.set("inputValue", "false");
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("false");
+  });
+
+  test("evaluates function (true)", async function (assert) {
+    this.set("inputValue", () => true);
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("true");
+  });
+
+  test("evaluates function (false)", async function (assert) {
+    this.set("inputValue", () => false);
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("false");
+  });
+
+  test("evaluates function with parameter (false)", async function (assert) {
+    this.set("inputValue", (p) => p === 1);
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue 2) "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("false");
+  });
+
+  test("evaluates function with multiple parameters (true)", async function (assert) {
+    this.set("inputValue", (p1, p2) => p1 !== p2);
+
+    await render(
+      hbs`{{if (evaluate-to-boolean this.inputValue 1 "a") "true" "false"}}`
+    );
+
+    assert.dom(this.element).hasText("true");
+  });
+});