feat: Restoring import events section

app/controllers/events/import.js

@@ -1,6 +1,6 @@
 import Controller from '@ember/controller';
 import { run } from '@ember/runloop';
-import { action } from '@ember/object';
+import { action, computed } from '@ember/object';
 
 export default class extends Controller {
   importStatus = '';
@@ -9,6 +9,28 @@ export default class extends Controller {
   file         = false;
   fileName     = '';
 
+  @computed()
+  get columns() {
+    return [
+      {
+        name      : 'State',
+        valuePath : 'resultStatus'
+      },
+      {
+        name      : 'Message',
+        valuePath : 'result'
+
+      },
+      {
+        name            : 'Started',
+        valuePath       : 'startsAt',
+        cellComponent   : 'ui-table/cell/cell-simple-date',
+        headerComponent : 'tables/headers/sort',
+        isSortable      : true
+      }
+    ];
+  }
+
   importTask(taskUrl) {
     run.later(() => {
       this.loader

app/routes/events/import.js

@@ -1,16 +1,25 @@
 import Route from '@ember/routing/route';
 
-export default Route.extend({
+import EmberTableRouteMixin from 'open-event-frontend/mixins/ember-table-route';
+export default class extends Route.extend(EmberTableRouteMixin) {
   titleToken() {
     return this.l10n.t('Import');
-  },
-  async model() {
+  }
+
+  async model(params) {
+    const searchField = 'result';
+    let filterOptions = [];
+    filterOptions = this.applySearchFilters(filterOptions, params, searchField);
+    let queryString = {
+      filter         : filterOptions,
+      'page[size]'   : params.per_page || 10,
+      'page[number]' : params.per_page || 1
+    };
+    queryString = this.applySortFilters(queryString, params);
 
-    const data = await this.store.findAll('importJob');
 
     return {
-      data,
-      objectType: 'importJob'
+      importJobs: await this.asArray(this.store.query('importJob', queryString))
     };
   }
-});
+}

app/templates/components/events/imports-history-section.hbs

@@ -1,60 +1,16 @@
 <div class="sixteen wide column">
-  <h3 class="ui dividing header">{{t 'Previous Events'}}</h3>
-  <div>
-    {{t 'Show'}} &nbsp;
-    <select class="ui dropdown">
-      <option value="10">10</option>
-      <option value="25">25</option>
-      <option value="25">50</option>
-      <option value="25">100</option>
-    </select>
-    &nbsp;
-    {{t 'entries'}}
-    <div class="ui search-box icon input">
-      <i class="search icon"></i>
-      <input type="text" placeholder="{{t 'Search'}}...">
-    </div>
+  <h3 class="ui dividing header">{{t 'Imported Events'}}</h3>
   </div>
-  <div class="ui segment">
-    <div class="ui two column centered grid">
-      <div class="ui column">
-        <div class="ui disabled header">
-          <h3> {{t 'Import Events - Currently Under Maintenance'}}</h3>
-        </div>
-      </div>
-    </div>
-  </div>
-  {{!-- <table class="ui very basic table">
-    <thead>
-      <tr>
-        <th>{{t 'State'}}</th>
-        <th>{{t 'Message'}}</th>
-        <th>{{t 'Started'}}</th>
-      </tr>
-    </thead>
-    <tbody>
-      {{#each data as |job|}}
-        <tr>
-          <td>{{job.resultStatus}}</td>
-          <td>{{job.result}}</td>
-          <td>{{header-date job.startsAt}}</td>
-        </tr>
-      {{/each}}
-    </tbody>
-    <tfoot>
-      <tr>
-        <th colspan="3">
-          <div class="ui pagination menu {{unless device.isMobile 'right floated'}}">
-            <a class="icon item">
-              {{t 'Previous'}}
-            </a>
-            <a class="item">1</a>
-            <a class="icon item">
-              {{t 'Next'}}
-            </a>
-          </div>
-        </th>
-      </tr>
-    </tfoot>
-  </table> --}}
-</div>
+{{tables/default  columns=columns
+                  rows=data.data
+                  currentPage=page
+                  pageSize=per_page
+                  searchQuery=search
+                  sortBy=sort_by
+                  sortDir=sort_dir
+                  metaData=data.meta
+                  filterOptions=filterOptions
+                  widthConstraint="eq-container"
+                  resizeMode="fluid"
+                  fillMode="equal-column"
+}}    

app/templates/events/import.hbs

@@ -1,3 +1,3 @@
 {{events/event-import-section uploadFile=(action 'uploadFile') importStatus=importStatus importError=importError isImporting=isImporting file=file}}
-<br><br>
-{{events/imports-history-section data=model.data}}
+<div class="ui hidden divider"></div>
+{{events/imports-history-section data=model.importJobs columns=columns page=page per_page=per_page search=search sort_by=sort_by sort_dir=sort_dir filterOptions=filterOptions}}