From d59f914ebb816399088c3ebf5ee3abb43e346b26 Mon Sep 17 00:00:00 2001 From: Bach Vo Date: Fri, 31 Mar 2023 17:42:58 -0700 Subject: [PATCH 1/5] create rfc for dynamic query params --- text/0900-dynamic-query-params.md | 84 +++++++++++++++++++++++++++++++ 1 file changed, 84 insertions(+) create mode 100644 text/0900-dynamic-query-params.md diff --git a/text/0900-dynamic-query-params.md b/text/0900-dynamic-query-params.md new file mode 100644 index 0000000000..52e25853d7 --- /dev/null +++ b/text/0900-dynamic-query-params.md @@ -0,0 +1,84 @@ +--- +stage: # FIXME +start-date: 2023-03-31T00:00:00.000Z +release-date: # FIXME +release-versions: # FIXME +teams: + - framework +prs: # FIXME +project-link: # FIXME +meta: # FIXME +--- + +# Setting dynamic query params in Controllers + +## Summary + +The current way developers bind query params to the Ember app is by defining the `queryParams` property on the Controller with hard coded values. It will be useful for developers who leverage a server-driven UI to dynamically bind query params to the Ember app. + +## Motivation + +With the current implementation of how query params work inside of an Ember app, developers are forced to have pre-knowledge of what query params are able to be binded to the app and hard code these values in the Controller. This may work for an app that is rigid in its interface, however there are use-cases where a server-driven UI can define the query params dynamically based on the user profile. + +Take for instance a simple filter bar where the filter options are known in advance. Hard coding values can work for this use-case because there is a limited amount of options and these options are generic for all users. + +```js +// controller/simple/filter-bar.js +queryParams = ['keywords', 'location', 'company'] +``` + +Now let's expand this use-case and dynamically generate the simple filter bar into a complex filter, where the filter options are server-driven and tailored specifically to each user. The filter options are not known in advance and it will currently break how query params work in an Ember app. + +```js +// controller/complex/filter-bar.js + +// this will not work in Ember today +queryParams = this.model.filterOptions +``` + +## Detailed design + +I propose that we enable Ember the option to dynamically bind query params based on server-driven requirements. + +* Allow the Route's `setupController` to dynamically bind query params to the Controller's `queryParams` field +* Keep the current option to statically bind query params to the Controller's `queryParams` field + +Example: + +```js +// route/complex/filter-bar.js +setupController(controller, model) { + controller.queryParams = model.filterOptions +} +``` + +In addition to enabling server-driven query params, this will unlock the ability for servers to generate query params using AI. For example the system has detected that the user profile is a Nurse and generates the list of filters tailored to the Nursing profession. + +## How we teach this + +Update the [Ember Docs](https://guides.emberjs.com) that contain the following passage: + +_Note that you can't make queryParams be a dynamically generated property (neither computed property, nor property getter); they have to be values._ - [Ember query-params](https://guides.emberjs.com/release/routing/query-params/) + +This will need to be changed to: + +_You can bind query params dynamically using the Route's `setupController` to set the `queryParams` property to the controller_ + +```js +// route/index.js +setupController(controller, model) { + controller.queryParams = model.queryParams +} +``` + +## Drawbacks + +Dynamically setting query params could make the code less clear which query params are binded to the controller. + +## Alternatives + +We can decide not to do anything, but this leaves the problem where server-driven UI teams cannot scale at the same pace as Ember. + +## Unresolved questions + +--- From 9ccc208d11be3a0f01033ea08e6d1a5af13c9c99 Mon Sep 17 00:00:00 2001 From: Bach Vo Date: Fri, 31 Mar 2023 17:54:34 -0700 Subject: [PATCH 2/5] update text --- text/0900-dynamic-query-params.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/text/0900-dynamic-query-params.md b/text/0900-dynamic-query-params.md index 52e25853d7..1322cb2b24 100644 --- a/text/0900-dynamic-query-params.md +++ b/text/0900-dynamic-query-params.md @@ -81,4 +81,4 @@ We can decide not to do anything, but this leaves the problem where server-drive ## Unresolved questions ---- +None. From 255e142ca0f2751f526aec513083a63e8218e24f Mon Sep 17 00:00:00 2001 From: Bach Vo Date: Fri, 31 Mar 2023 17:56:48 -0700 Subject: [PATCH 3/5] update stage --- text/0900-dynamic-query-params.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/text/0900-dynamic-query-params.md b/text/0900-dynamic-query-params.md index 1322cb2b24..196a5828cd 100644 --- a/text/0900-dynamic-query-params.md +++ b/text/0900-dynamic-query-params.md @@ -1,5 +1,5 @@ --- -stage: # FIXME +stage: Proposed start-date: 2023-03-31T00:00:00.000Z release-date: # FIXME release-versions: # FIXME From dc33e8df7ed62e00641468fb29a7073766390761 Mon Sep 17 00:00:00 2001 From: Bach Vo Date: Fri, 31 Mar 2023 18:09:32 -0700 Subject: [PATCH 4/5] update rfc number --- ...{0900-dynamic-query-params.md => 0000-dynamic-query-params.md} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename text/{0900-dynamic-query-params.md => 0000-dynamic-query-params.md} (100%) diff --git a/text/0900-dynamic-query-params.md b/text/0000-dynamic-query-params.md similarity index 100% rename from text/0900-dynamic-query-params.md rename to text/0000-dynamic-query-params.md From 1cfddad006af1f303070483ccfaea5ae5c6edc2e Mon Sep 17 00:00:00 2001 From: Bach Vo Date: Fri, 31 Mar 2023 18:17:40 -0700 Subject: [PATCH 5/5] link to specifying query params doc --- text/0000-dynamic-query-params.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/text/0000-dynamic-query-params.md b/text/0000-dynamic-query-params.md index 196a5828cd..05b77084e5 100644 --- a/text/0000-dynamic-query-params.md +++ b/text/0000-dynamic-query-params.md @@ -14,7 +14,7 @@ meta: # FIXME ## Summary -The current way developers bind query params to the Ember app is by defining the `queryParams` property on the Controller with hard coded values. It will be useful for developers who leverage a server-driven UI to dynamically bind query params to the Ember app. +The current way developers bind query params to the Ember app is by defining the `queryParams` property on the Controller with hard coded values. See Ember docs on [Specifying Query Parameters](https://guides.emberjs.com/release/routing/query-params/#toc_specifying-query-parameters) section. It will be useful for developers who leverage a server-driven UI to dynamically bind query params to the Ember app. ## Motivation