DEV: select-kit 2 (#7998)

This new iteration of select-kit focuses on following best principales and disallowing mutations inside select-kit components. A best effort has been made to avoid breaking changes, however if you content was a flat array, eg: ["foo", "bar"] You will need to set valueProperty=null and nameProperty=null on the component.

Also almost every component should have an `onChange` handler now to decide what to do with the updated data. **select-kit will not mutate your data by itself anymore**

plugins/poll/assets/javascripts/controllers/poll-ui-builder.js.es6

@@ -1,5 +1,5 @@
 import Controller from "@ember/controller";
-import computed, { observes } from "discourse-common/utils/decorators";
+import discourseComputed, { observes } from "discourse-common/utils/decorators";
 import EmberObject from "@ember/object";
 
 export const BAR_CHART_TYPE = "bar";
@@ -19,12 +19,15 @@ export default Controller.extend({
     { name: PIE_CHART_TYPE.capitalize(), value: PIE_CHART_TYPE }
   ],
 
+  pollType: null,
+  pollResult: null,
+
   init() {
     this._super(...arguments);
     this._setupPoll();
   },
 
-  @computed("regularPollType", "numberPollType", "multiplePollType")
+  @discourseComputed("regularPollType", "numberPollType", "multiplePollType")
   pollTypes(regularPollType, numberPollType, multiplePollType) {
     return [
       {
@@ -42,12 +45,12 @@ export default Controller.extend({
     ];
   },
 
-  @computed("chartType", "pollType", "numberPollType")
+  @discourseComputed("chartType", "pollType", "numberPollType")
   isPie(chartType, pollType, numberPollType) {
     return pollType !== numberPollType && chartType === PIE_CHART_TYPE;
   },
 
-  @computed(
+  @discourseComputed(
     "alwaysPollResult",
     "votePollResult",
     "closedPollResult",
@@ -73,7 +76,7 @@ export default Controller.extend({
         value: closedPollResult
       }
     ];
-    if (this.currentUser.staff) {
+    if (this.get("currentUser.staff")) {
       options.push({
         name: I18n.t("poll.ui_builder.poll_result.staff"),
         value: staffPollResult
@@ -82,34 +85,34 @@ export default Controller.extend({
     return options;
   },
 
-  @computed("site.groups")
+  @discourseComputed("site.groups")
   siteGroups(groups) {
     const values = [{ name: "", value: null }];
     groups.forEach(g => values.push({ name: g.name, value: g.name }));
     return values;
   },
 
-  @computed("pollType", "regularPollType")
+  @discourseComputed("pollType", "regularPollType")
   isRegular(pollType, regularPollType) {
     return pollType === regularPollType;
   },
 
-  @computed("pollType", "pollOptionsCount", "multiplePollType")
+  @discourseComputed("pollType", "pollOptionsCount", "multiplePollType")
   isMultiple(pollType, count, multiplePollType) {
     return pollType === multiplePollType && count > 0;
   },
 
-  @computed("pollType", "numberPollType")
+  @discourseComputed("pollType", "numberPollType")
   isNumber(pollType, numberPollType) {
     return pollType === numberPollType;
   },
 
-  @computed("isRegular")
+  @discourseComputed("isRegular")
   showMinMax(isRegular) {
     return !isRegular;
   },
 
-  @computed("pollOptions")
+  @discourseComputed("pollOptions")
   pollOptionsCount(pollOptions) {
     if (pollOptions.length === 0) return 0;
 
@@ -122,7 +125,7 @@ export default Controller.extend({
     return length;
   },
 
-  @observes("isMultiple", "isNumber", "pollOptionsCount")
+  @observes("pollType", "pollOptionsCount")
   _setPollMax() {
     const isMultiple = this.isMultiple;
     const isNumber = this.isNumber;
@@ -135,7 +138,7 @@ export default Controller.extend({
     }
   },
 
-  @computed("isRegular", "isMultiple", "isNumber", "pollOptionsCount")
+  @discourseComputed("isRegular", "isMultiple", "isNumber", "pollOptionsCount")
   pollMinOptions(isRegular, isMultiple, isNumber, count) {
     if (isRegular) return;
 
@@ -149,7 +152,7 @@ export default Controller.extend({
     }
   },
 
-  @computed(
+  @discourseComputed(
     "isRegular",
     "isMultiple",
     "isNumber",
@@ -175,13 +178,13 @@ export default Controller.extend({
     }
   },
 
-  @computed("isNumber", "pollMax")
+  @discourseComputed("isNumber", "pollMax")
   pollStepOptions(isNumber, pollMax) {
     if (!isNumber) return;
     return this._comboboxOptions(1, (parseInt(pollMax, 10) || 1) + 1);
   },
 
-  @computed(
+  @discourseComputed(
     "isNumber",
     "showMinMax",
     "pollType",
@@ -259,7 +262,7 @@ export default Controller.extend({
     return output;
   },
 
-  @computed(
+  @discourseComputed(
     "pollOptionsCount",
     "isRegular",
     "isMultiple",
@@ -275,7 +278,7 @@ export default Controller.extend({
     );
   },
 
-  @computed("pollMin", "pollMax")
+  @discourseComputed("pollMin", "pollMax")
   minMaxValueValidation(pollMin, pollMax) {
     let options = { ok: true };
 
@@ -289,7 +292,7 @@ export default Controller.extend({
     return EmberObject.create(options);
   },
 
-  @computed("pollStep")
+  @discourseComputed("pollStep")
   minStepValueValidation(pollStep) {
     let options = { ok: true };
 
@@ -303,7 +306,7 @@ export default Controller.extend({
     return EmberObject.create(options);
   },
 
-  @computed("disableInsert")
+  @discourseComputed("disableInsert")
   minNumOfOptionsValidation(disableInsert) {
     let options = { ok: true };
 
@@ -325,7 +328,7 @@ export default Controller.extend({
 
   _setupPoll() {
     this.setProperties({
-      pollType: null,
+      pollType: this.get("pollTypes.firstObject.value"),
       publicPoll: false,
       pollOptions: "",
       pollMin: 1,