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**

test/javascripts/components/select-kit/pinned-options-test.js.es6

@@ -0,0 +1,38 @@
+import selectKit from "helpers/select-kit-helper";
+import componentTest from "helpers/component-test";
+import Topic from "discourse/models/topic";
+
+const buildTopic = function() {
+  return Topic.create({
+    id: 1234,
+    title: "Qunit Test Topic",
+    deleted: false,
+    pinned: true
+  });
+};
+
+moduleForComponent("select-kit/pinned-options", {
+  integration: true,
+  beforeEach: function() {
+    this.set("subject", selectKit());
+  }
+});
+
+componentTest("updating the content refreshes the list", {
+  template: "{{pinned-options value=pinned topic=topic}}",
+
+  beforeEach() {
+    this.siteSettings.automatically_unpin_topics = false;
+    this.set("topic", buildTopic());
+    this.set("pinned", "pinned");
+  },
+
+  async test(assert) {
+    assert.equal(this.subject.header().name(), "pinned");
+
+    // we do it manually as clearPin is an ajax call
+    await this.set("pinned", false);
+
+    assert.equal(this.subject.header().name(), "unpinned");
+  }
+});