This PR is the first step towards replacing our `{{user-selector}}` and eventually deprecating and removing it from our codebase. Some of `{{user-selector}}` problems are:
1. It's called `{{user-selector}}`, but in reality in can also select groups and emails.
2. It's an Ember component, yet it doesn't have a handlebars template and uses jQuery to render itself and modify the DOM. An example of this problem is when you want to clear the selected users programmatically, see [this](6c155dba77/app/assets/javascripts/discourse/app/components/user-selector.js (L179-L185)).
3. We now have select kit which does very similar things but a lot better.
This PR introduces `{{email-group-user-chooser}}` which is meant to replace `{{user-selector}}`. It extends select kit and has the same features that `{{user-selector}}` has. `{{user-selector}}` is still used in a few places in core, but they'll all be replaced with the new component in a separate commit.
Once `{{user-selector}}` is not used anywhere in core, it'll be deprecated and then removed after the 2.7 release.
47 lines
1.2 KiB
JavaScript
47 lines
1.2 KiB
JavaScript
import UserChooserComponent from "select-kit/components/user-chooser";
|
|
|
|
export default UserChooserComponent.extend({
|
|
pluginApiIdentifiers: ["email-group-user-chooser"],
|
|
classNames: ["email-group-user-chooser"],
|
|
valueProperty: "id",
|
|
nameProperty: "name",
|
|
|
|
modifyComponentForRow() {
|
|
return "email-group-user-chooser-row";
|
|
},
|
|
|
|
selectKitOptions: {
|
|
headerComponent: "email-group-user-chooser-header",
|
|
autoWrap: false,
|
|
},
|
|
|
|
search() {
|
|
const superPromise = this._super(...arguments);
|
|
if (!superPromise) {
|
|
return;
|
|
}
|
|
return superPromise.then((results) => {
|
|
if (!results || results.length === 0) {
|
|
return;
|
|
}
|
|
return results.map((item) => {
|
|
const reconstructed = {};
|
|
if (item.username) {
|
|
reconstructed.id = item.username;
|
|
if (item.username.includes("@")) {
|
|
reconstructed.isEmail = true;
|
|
} else {
|
|
reconstructed.isUser = true;
|
|
reconstructed.name = item.name;
|
|
}
|
|
} else if (item.name) {
|
|
reconstructed.id = item.name;
|
|
reconstructed.name = item.full_name;
|
|
reconstructed.isGroup = true;
|
|
}
|
|
return Object.assign({}, item, reconstructed);
|
|
});
|
|
});
|
|
},
|
|
});
|