Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FEATURE: Support sub-subcategories in new edit sidebar categories modal (#21994) 

Why does this commit do?

This commit adds support for sub-subcategories in the new edit sidebar
categories modal added in fc296b9a81. Note
that sub-subcategories are enabled when `max_category_nesting` is set to
`3`.
This commit is contained in:
Alan Guo Xiang Tan 2023-06-08 11:15:01 +09:00 committed by GitHub
parent 699f3e7014
commit 2191b879c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 104 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
app/assets/javascripts/discourse/app/components/sidebar/categories-form-modal.hbs
View File

@ -3,69 +3,42 @@
@class="sidebar-categories-form-modal"
>
<form class="sidebar-categories-form">
{{#each this.siteCategories as |category|}}
{{#each this.categoryGroupings as |categories|}}
<div
class="sidebar-categories-form__row"
style={{html-safe (border-color category.color "left")}}
style={{html-safe (border-color categories.1.color "left")}}
>
<div
class="sidebar-categories-form__category-row"
data-category-id={{category.id}}
>
<label
class="sidebar-categories-form__category-label"
for={{concat "sidebar-categories-form__input--" category.id}}
{{#each categories as |category|}}
<div
class="sidebar-categories-form__category-row"
data-category-id={{category.id}}
data-category-level={{category.level}}
>
<div
class="sidebar-categories-form__category-badge sidebar-categories-form__category-badge--parent-category"
<label
class="sidebar-categories-form__category-label"
for={{concat "sidebar-categories-form__input--" category.id}}
>
{{category-badge category}}
</div>
<div class="sidebar-categories-form__category-badge">
{{category-badge category}}
</div>
<div class="sidebar-categories-form__category-description">
{{dir-span category.description_excerpt htmlSafe="true"}}
</div>
</label>
<Input
id={{concat "sidebar-categories-form__input--" category.id}}
class="sidebar-categories-form__input"
@type="checkbox"
@checked={{includes this.selectedSidebarCategoryIds category.id}}
{{on "click" (action "toggleCategory" category.id)}}
/>
</div>
{{#if (gt category.subcategories.length 0)}}
{{#each category.subcategories as |subcategory|}}
<div
class="sidebar-categories-form__category-row"
data-category-id={{subcategory.id}}
>
<label
class="sidebar-categories-form__category-label"
for={{concat "sidebar-categories-form__input--" subcategory.id}}
>
<div
class="sidebar-categories-form__category-badge sidebar-categories-form__category-badge--subcategory"
>
{{category-badge subcategory}}
{{#unless category.parentCategory}}
<div class="sidebar-categories-form__category-description">
{{dir-span category.description_excerpt htmlSafe="true"}}
</div>
</label>
{{/unless}}
</label>
<Input
id={{concat "sidebar-categories-form__input--" subcategory.id}}
class="sidebar-categories-form__input"
@type="checkbox"
@checked={{includes
this.selectedSidebarCategoryIds
subcategory.id
}}
{{on "click" (action "toggleCategory" subcategory.id)}}
/>
</div>
{{/each}}
{{/if}}
<Input
id={{concat "sidebar-categories-form__input--" category.id}}
class="sidebar-categories-form__input"
@type="checkbox"
@checked={{includes this.selectedSidebarCategoryIds category.id}}
{{on "click" (action "toggleCategory" category.id)}}
/>
</div>
{{/each}}
</div>
{{/each}}
</form>

27
app/assets/javascripts/discourse/app/components/sidebar/categories-form-modal.js
View File

@ -13,9 +13,30 @@ export default class extends Component {
...this.currentUser.sidebar_category_ids,
];
@tracked siteCategories = this.site.categoriesList.filter((category) => {
return !category.parent_category_id && !category.isUncategorizedCategory;
});
categoryGroupings = [];
constructor() {
super(...arguments);
this.site.sortedCategories.reduce(
(categoryGrouping, category, index, arr) => {
if (category.isUncategorizedCategory) {
return categoryGrouping;
}
categoryGrouping.push(category);
const nextCategory = arr[index + 1];
if (!nextCategory || nextCategory.level === 0) {
this.categoryGroupings.push(categoryGrouping);
return [];
}
return categoryGrouping;
},
[]
);
}
@action
toggleCategory(categoryId) {

6
app/assets/javascripts/discourse/app/models/category.js
View File

@ -70,7 +70,11 @@ const Category = RestModel.extend({
@discourseComputed("parentCategory.level")
level(parentLevel) {
return (parentLevel || -1) + 1;
if (!parentLevel) {
return parentLevel === 0 ? 1 : 0;
} else {
return parentLevel + 1;
}
},
@discourseComputed("subcategories")

23
app/assets/stylesheets/common/components/sidebar-categories-form.scss
View File

@ -21,22 +21,23 @@
padding: 0.5em 0;
}
.sidebar-categories-form__category-row:not(:first-child) {
border-top: 1px solid var(--primary-low);
.sidebar-categories-form__input {
align-self: center;
}
.sidebar-categories-form__category-row[data-category-level="0"] {
border-bottom: 1px solid var(--primary-low);
}
.sidebar-categories-form__category-row:nth-child(2) {
padding-left: 1em;
}
.sidebar-categories-form__category-row:nth-child(n + 3) {
.sidebar-categories-form__category-row[data-category-level="1"] {
margin-left: 1em;
}
.sidebar-categories-form__category-row[data-category-level="1"]:not(:nth-of-type(2)) {
border-top: 1px solid var(--primary-low);
}
.sidebar-categories-form__category-row[data-category-level="2"] {
margin-left: 2em;
border-top: 1px solid var(--primary-low);
}
.sidebar-categories-form__category-label {
display: flex;
flex-direction: column;

35
spec/system/editing_sidebar_categories_navigation_spec.rb
View File

@ -53,4 +53,39 @@ RSpec.describe "Editing sidebar categories navigation", type: :system do
expect(sidebar).to have_no_section_link(category_subcategory2.name)
expect(sidebar).to have_no_section_link(category2.name)
end
describe "when max_category_nesting has been set to 3" do
before { SiteSetting.max_category_nesting = 3 }
it "allows a user to edit sub-subcategories to be included in the sidebar categories section" do
category_subcategory_subcategory =
Fabricate(:category, parent_category_id: category_subcategory.id)
category_subcategory_subcategory2 =
Fabricate(:category, parent_category_id: category_subcategory.id)
category2_subcategory_subcategory =
Fabricate(:category, parent_category_id: category2_subcategory.id)
visit "/latest"
expect(sidebar).to have_categories_section
modal = sidebar.click_edit_categories_button
expect(modal).to have_right_title(I18n.t("js.sidebar.categories_form.title"))
modal
.toggle_category_checkbox(category_subcategory_subcategory)
.toggle_category_checkbox(category_subcategory_subcategory2)
.toggle_category_checkbox(category2_subcategory_subcategory)
.save
expect(modal).to be_closed
expect(sidebar).to have_section_link(category_subcategory_subcategory.name)
expect(sidebar).to have_section_link(category_subcategory_subcategory2.name)
expect(sidebar).to have_section_link(category2_subcategory_subcategory.name)
end
end
end