discourse/app/assets/javascripts/admin/controllers
Tarek Khalil f8480ed911
FEATURE: Exposing a way to add a generic report filter (#6816)
* FEATURE: Exposing a way to add a generic report filter

## Why do we need this change?

Part of the work discussed [here](https://meta.discourse.org/t/gain-understanding-of-file-uploads-usage/104994), and implemented a first spike [here](https://github.com/discourse/discourse/pull/6809), I am trying to expose a single generic filter selector per report.

## How does this work?

We basically expose a simple, single generic filter that is computed and displayed based on backend values passed into the report.

This would be a simple contract between the frontend and the backend.

**Backend changes:** we simply need to return a list of dropdown / select options, and enable the report's newly introduced `custom_filtering` property.

For example, for our [Top Uploads](https://github.com/discourse/discourse/pull/6809/files#diff-3f97cbb8726f3310e0b0c386dbe89e22R1423) report, it can look like this on the backend:

```ruby
report.custom_filtering = true
report.custom_filter_options = [{ id: "any", name: "Any" }, { id: "jpg", name: "JPEG" } ]
```

In our javascript report HTTP call, it will look like:

```js
{
  "custom_filtering": true,
  "custom_filter_options": [
    {
      "id": "any",
      "name": "Any"
    },
    {
      "id": "jpg",
      "name": "JPG"
    }
  ]
}
```

**Frontend changes:** We introduced a generic `filter` param and a `combo-box` which hooks up into the existing framework for fetching a report.

This works alright, with the limitation of being a single custom filter per report. If we wanted to add, for an instance a `filesize filter`, this will not work for us. _I went through with this approach because it is hard to predict and build abstractions for requirements or problems we don't have yet, or might not have._

## How does it look like?

![a1ktg1odde](https://user-images.githubusercontent.com/45508821/50485875-f17edb80-09ee-11e9-92dd-1454ab041fbb.gif)

## More on the bigger picture

The major concern here I have is the solution I introduced might serve the `think small` version of the reporting work, but I don't think it serves the `think big`, I will try to shed some light into why.

Within the current design, It is hard to maintain QueryParams for dynamically generated params (based on the idea of introducing more than one custom filter per report).

To allow ourselves to have more than one generic filter, we will need to:

a. Use the Route's model to retrieve the report's payload (we are now dependent on changes of the QueryParams via computed properties)
b. After retrieving the payload, we can use the `setupController` to define our dynamic QueryParams based on the custom filters definitions we received from the backend
c. Load a custom filter specific Ember component based on the definitions we received from the backend
2019-03-15 12:15:38 +00:00
..
modals DEV: Add additional hook for theme-creator 2019-02-28 10:48:30 +00:00
admin-api-keys.js.es6 DEV: refactoring api-keys (#6931) 2019-01-23 17:40:05 +01:00
admin-backups-index.js.es6 DEV: refactoring admin-backups-index (#6933) 2019-01-23 17:40:24 +01:00
admin-backups-logs.js.es6 DEV: s/Em/Ember (#6874) 2019-01-11 17:54:23 +01:00
admin-backups.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-badges-show.js.es6 FIX: ember3 regression, uses model as bufferedProperty for badges (#6875) 2019-01-11 00:46:03 +01:00
admin-badges.js.es6 Fixes some Ember Deprecations for 1.13: 2016-10-21 11:06:07 -04:00
admin-customize-colors-show.js.es6 DEV: s/Em/Ember (#6874) 2019-01-11 17:54:23 +01:00
admin-customize-colors.js.es6 REFACTOR: admin-customize-color (#7018) 2019-02-19 09:31:11 +01:00
admin-customize-email-templates-edit.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-customize-email-templates.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-customize-themes-edit.js.es6 FEATURE: Added settings/translations support to theme editor UI (#7026) 2019-02-19 12:56:01 +00:00
admin-customize-themes-show.js.es6 UX: Don't link to theme source unless it's http(s) 2019-02-28 17:01:59 +00:00
admin-customize-themes.js.es6 UX: List popular themes and components in admin panel (#6997) 2019-02-20 14:58:31 -05:00
admin-dashboard-next-general.js.es6 UX: new site setting to define activity metrics displayed on dashboard 2018-12-26 10:29:07 +01:00
admin-dashboard-next-moderation.js.es6 UX: Rename Most Disagreed Flaggers report to "User Flagging Ratio" 2018-11-12 16:23:37 -05:00
admin-dashboard-next-reports.js.es6 UX: Adding reports dashboard tab, new layout, report descriptions (#6790) 2018-12-19 14:44:43 +01:00
admin-dashboard-next.js.es6 FEATURE: part 2 of dashboard improvements 2018-07-19 14:33:11 -04:00
admin-dashboard.js.es6 FEATURE: Improve backup stats on admin dashboard 2018-12-17 11:35:11 +01:00
admin-email-advanced-test.js.es6 DEV: Apply code review. 2018-12-05 21:56:18 +01:00
admin-email-bounced.js.es6 FIX: prevents double network calls and other quirks on admin emails (#7074) 2019-02-26 17:53:52 +01:00
admin-email-index.js.es6 FIX: send test email doesn't show a status 2019-02-25 17:42:58 +05:30
admin-email-logs.js.es6 FIX: prevents double network calls and other quirks on admin emails (#7074) 2019-02-26 17:53:52 +01:00
admin-email-preview-digest.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-email-received.js.es6 FIX: prevents double network calls and other quirks on admin emails (#7074) 2019-02-26 17:53:52 +01:00
admin-email-rejected.js.es6 FIX: prevents double network calls and other quirks on admin emails (#7074) 2019-02-26 17:53:52 +01:00
admin-email-sent.js.es6 FIX: prevents double network calls and other quirks on admin emails (#7074) 2019-02-26 17:53:52 +01:00
admin-email-skipped.js.es6 FIX: prevents double network calls and other quirks on admin emails (#7074) 2019-02-26 17:53:52 +01:00
admin-embedding.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-emojis.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-logs-screened-emails.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-logs-screened-ip-addresses.js.es6 DEV: refactoring admin-logs-screened-ip-addresses (#6932) 2019-01-23 17:40:37 +01:00
admin-logs-screened-urls.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-logs-staff-action-logs.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-permalinks.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-plugins.js.es6 FEATURE: responsive admin pages 2018-07-03 11:14:53 +08:00
admin-reports-show.js.es6 FEATURE: Exposing a way to add a generic report filter (#6816) 2019-03-15 12:15:38 +00:00
admin-search-logs-index.js.es6 UX: Default search log index to yearly. 2019-01-08 13:40:38 +08:00
admin-search-logs-term.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-site-settings-category.js.es6 rename `visible` to `visibleSiteSettings` 2018-12-13 13:00:13 +11:00
admin-site-settings.js.es6 rename `visible` to `visibleSiteSettings` 2018-12-13 13:00:13 +11:00
admin-site-text-edit.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-site-text-index.js.es6 DEV: Remove `d-checkbox` component 2019-02-21 09:54:54 -05:00
admin-user-badges.js.es6 FIX: show error msg on grant badge if message available from backend (#6801) 2018-12-31 10:46:39 +01:00
admin-user-fields.js.es6 DEV: s/Em/Ember (#6874) 2019-01-11 17:54:23 +01:00
admin-user-index.js.es6 UX: Default user facing routes to `/g` instead of `/groups`. (#7042) 2019-02-21 13:44:25 +08:00
admin-user.js.es6 Remove ObjectController, Discouse Controllers + Presence 2015-08-13 10:49:08 -04:00
admin-users-list-show.js.es6 FIX: users list show was loading multiple times with different params (#7058) 2019-02-26 10:43:24 +01:00
admin-watched-words-action.js.es6 DEV: s/Em/Ember (#6874) 2019-01-11 17:54:23 +01:00
admin-watched-words.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-web-hooks-show-events.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin-web-hooks-show.js.es6 DEV: upgrades from Ember 2.13 to Ember 3.5.1 (#6808) 2019-01-10 11:06:01 +01:00
admin-web-hooks.js.es6 DEV: introduces prettier for es6 files 2018-06-15 17:03:24 +02:00
admin.js.es6 UX: Add link to Groups in admin dashboard. (#6480) 2018-10-12 10:34:47 +11:00