Skip to content

fix: fix switch case for inline loading not working #3163

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: next
Choose a base branch
from

Conversation

tom-wegener
Copy link

switch case compares the value in the case via === which does not work with || or &&

inline loading did not work since the switch case had some problems but it should be fixed now

Found it while doing visual tests for #3162

Changelog

Changed

  • inline loading did not work since the switch case had some problems but it should be fixed now.

@tom-wegener tom-wegener requested a review from a team as a code owner July 24, 2025 08:43
Copy link

netlify bot commented Jul 24, 2025

Deploy Preview for carbon-angular-next ready!

Name Link
🔨 Latest commit 6125962
🔍 Latest deploy log https://app.netlify.com/projects/carbon-angular-next/deploys/688348984c2612000805df5b
😎 Deploy Preview https://deploy-preview-3163--carbon-angular-next.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link

netlify bot commented Jul 24, 2025

Deploy Preview for carbon-components-angular ready!

Name Link
🔨 Latest commit 6125962
🔍 Latest deploy log https://app.netlify.com/projects/carbon-components-angular/deploys/68834898a791500008abd7c1
😎 Deploy Preview https://deploy-preview-3163--carbon-components-angular.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Comment on lines 37 to 38
@switch (true) {
@case (state === InlineLoadingState.Inactive || state === InlineLoadingState.Active) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can probably just use a @if/else if condition instead. If you want to continue to use switch case, you can create a template for the content of state === InlineLoadingState.Inactive || state === InlineLoadingState.Active condition and use that condition for both case.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, fair. I've switched to if else because it is less hidden than working that into a condition.

<div
class="cds--loading cds--loading--small"
[ngClass]="{
'cds--loading--stop': state === InlineLoadingState.Inactive
'cds--loading--stop': state === InlineLoadingState.Inctive
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
'cds--loading--stop': state === InlineLoadingState.Inctive
'cds--loading--stop': state === InlineLoadingState.Inactive

Comment on lines 67 to 68
@switch(true) {
@case(state === InlineLoadingState.Inactive || state === InlineLoadingState.Active) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same as above

switch case compares the value in the case via === which does not work
with || or &&
@tom-wegener tom-wegener force-pushed the fix-inline-loading-component branch from e218bc2 to 6125962 Compare July 25, 2025 09:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants