IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

FEATURE: Add filter box to the themes/components list (#13767)

Browse Source
This commit is contained in:
Osama Sayegh
2021-07-19 04:33:58 +03:00
committed by GitHub
parent 6d999fb087
commit 1c82989f77
5 changed files with 246 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
app/assets/javascripts/admin/addon/components/themes-list.js
View File

@@ -1,8 +1,9 @@
import { COMPONENTS, THEMES } from "admin/models/theme";
import { equal, gt } from "@ember/object/computed";
import { equal, gt, gte } from "@ember/object/computed";
import Component from "@ember/component";
import discourseComputed from "discourse-common/utils/decorators";
import { inject as service } from "@ember/service";
import { action } from "@ember/object";
export default Component.extend({
router: service(),
@@ -10,10 +11,12 @@ export default Component.extend({
COMPONENTS,
classNames: ["themes-list"],
filterTerm: null,
hasThemes: gt("themesList.length", 0),
hasActiveThemes: gt("activeThemes.length", 0),
hasInactiveThemes: gt("inactiveThemes.length", 0),
showFilter: gte("themesList.length", 10),
themesTabActive: equal("currentTab", THEMES),
componentsTabActive: equal("currentTab", COMPONENTS),
@@ -31,28 +34,36 @@ export default Component.extend({
"themesList",
"currentTab",
"themesList.@each.user_selectable",
"themesList.@each.default"
"themesList.@each.default",
"filterTerm"
)
inactiveThemes(themes) {
let results;
if (this.componentsTabActive) {
return themes.filter((theme) => theme.get("parent_themes.length") <= 0);
results = themes.filter(
(theme) => theme.get("parent_themes.length") <= 0
);
} else {
results = themes.filter(
(theme) => !theme.get("user_selectable") && !theme.get("default")
);
}
return themes.filter(
(theme) => !theme.get("user_selectable") && !theme.get("default")
);
return this._filterThemes(results, this.filterTerm);
},
@discourseComputed(
"themesList",
"currentTab",
"themesList.@each.user_selectable",
"themesList.@each.default"
"themesList.@each.default",
"filterTerm"
)
activeThemes(themes) {
let results;
if (this.componentsTabActive) {
return themes.filter((theme) => theme.get("parent_themes.length") > 0);
results = themes.filter((theme) => theme.get("parent_themes.length") > 0);
} else {
return themes
results = themes
.filter((theme) => theme.get("user_selectable") || theme.get("default"))
.sort((a, b) => {
if (a.get("default") && !b.get("default")) {
@@ -66,16 +77,29 @@ export default Component.extend({
.localeCompare(b.get("name").toLowerCase());
});
}
return this._filterThemes(results, this.filterTerm);
},
actions: {
changeView(newTab) {
if (newTab !== this.currentTab) {
this.set("currentTab", newTab);
_filterThemes(themes, term) {
term = term?.trim()?.toLowerCase();
if (!term) {
return themes;
}
return themes.filter(({ name }) => name.toLowerCase().includes(term));
},
@action
changeView(newTab) {
if (newTab !== this.currentTab) {
this.set("currentTab", newTab);
if (!this.showFilter) {
this.set("filterTerm", null);
}
},
navigateToTheme(theme) {
this.router.transitionTo("adminCustomizeThemes.show", theme);
},
}
},
@action
navigateToTheme(theme) {
this.router.transitionTo("adminCustomizeThemes.show", theme);
},
});