-
-
Notifications
You must be signed in to change notification settings - Fork 369
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
feat: add build loading awareness in the terminal(#1117) #1118
Conversation
- Import loading awareness animation for build process - Start loading animation when build and rebuild starts - Stop loading animation when build succeeds or fails
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is pretty cool!!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The current convention is a bit extreme on not using "let" :-?
Can we make a const state like this instead:
const state = {
loadingInterval: null as NodeJS.Timeout | null,
isLoading: false,
dotCount: 0
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks like a pretty cool feature!
if (isLoading) return | ||
isLoading = true | ||
let dots = 0 | ||
const baseString = "🔄 Building" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
let's pull this outside, since it's a literal string
if (event.type === "buildFailure") { | ||
stopLoading() |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nice!
let isLoading = false | ||
|
||
export const startLoading = () => { | ||
if (isLoading) return |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: let's use bracket
} | ||
|
||
export const stopLoading = () => { | ||
if (!isLoading) return |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: brakcet
- Move state management to a single state object - Extract LOADING_TEXT to constants - Add consistent bracket style
@louisgv Thanks for the review! I've addressed all the suggestions:
Please let me know if there's anything else that needs to be adjusted. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 👍
Details
This PR enhances the build process feedback by implementing a loading animation in the terminal. It addresses the issue of unclear build status during development, especially for longer builds or multiple hot reloads.
Specifically, this PR:
This change aims to solve the problem described in issue #1117, where it was difficult to determine if a build was in progress or completed, especially after multiple hot reloads.
I'm open to any feedback or suggestions for improvement. If you have any questions or if there's anything you'd like me to modify, please leave a comment.
Code of Conduct
Contacts