Page size select component

ui/app/components/page-size-select.js

@@ -0,0 +1,10 @@
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
+
+export default Component.extend({
+  tagName: '',
+
+  userSettings: service(),
+
+  pageSizeOptions: Object.freeze([10, 25, 50]),
+});

ui/app/templates/components/page-size-select.hbs

@@ -0,0 +1,11 @@
+<div class="field is-horizontal">
+  <span class="field-label is-small">Per page</span>
+  <PowerSelect
+    @tagName="div"
+    class="field-body"
+    @options={{pageSizeOptions}}
+    @selected={{userSettings.pageSize}}
+    @onChange={{action (mut userSettings.pageSize)}} as |option|>
+    {{option}}
+  </PowerSelect>
+</div>