IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-12-01 13:09:33 -06:00
Code Issues Packages Projects Releases Wiki Activity

DEV: Use concat-class helper when setting class for DButton (#21998)

Browse Source 
Why this change?

Currently, we're interpolating within a string to set the class for the
`DButton` component. However, the interpolation and formatting of our
handlebars templates result in unnecessary spaces being added to the
class attribute.

```
<button class="sidebar-section-header sidebar-section-header-collapsable btn-flat

    btn
    no-text
    " aria-controls="sidebar-section-content-categories" aria-expanded="true" title="Toggle section" type="button">
  ...
</button>
```

This makes the HTML elements for buttons hard to read especially when
we're debugging issues in the console. After this change, this is what
we get:

```
<button class="sidebar-section-header sidebar-section-header-collapsable btn-flat btn no-text" aria-controls="sidebar-section-content-categories" aria-expanded="true" title="Toggle section" type="button">
   ...
</button>
```
This commit is contained in:
Alan Guo Xiang Tan 2023-06-12 09:29:21 +09:00 committed by GitHub
parent 7dab8e7e22
commit b4611114f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/assets/javascripts/discourse/app/components/d-button.hbs
View File

@ -1,11 +1,13 @@
{{! template-lint-disable no-down-event-binding }}
<button
{{! For legacy compatibility. Prefer passing class as attributes. }}
class="{{@class}}
{{if @isLoading 'is-loading'}}
{{if this.btnLink 'btn-link' 'btn'}}
{{if this.noText 'no-text'}}
{{this.btnType}}"
class={{concat-class
@class
(if @isLoading "is-loading")
(if this.btnLink "btn-link" "btn")
(if this.noText "no-text")
this.btnType
}}
{{! For legacy compatibility. Prefer passing these as html attributes. }}
id={{@id}}
form={{@form}}