Open ajhollid opened 4 days ago
The changes in the Login.jsx
component enhance the login process by introducing a loading state. A LoadingButton
from @mui/lab
is now used for the submission action, providing visual feedback during login requests. The component accesses the authentication state via the useSelector
hook, allowing it to reflect the loading status. Minor adjustments ensure the new button maintains the previous visual style, while the overall structure of the login steps remains unchanged.
File Path | Change Summary |
---|---|
Client/src/Pages/Auth/Login.jsx | - Added LoadingButton for login submission.- Integrated useSelector to access authState .- Minor adjustments to button properties for visual consistency. |
Client/src/Utils/Theme/globalTheme.js | - Modified MuiButton style overrides for disabled state to exclude buttons with loadingIndicator class.- Improved organization by separating MuiButton styles from MuiIconButton styles. |
sequenceDiagram
participant User
participant StepTwo
participant ReduxStore
User->>StepTwo: Click Login
StepTwo->>ReduxStore: Dispatch login action
ReduxStore-->>StepTwo: Update authState.isLoading to true
StepTwo->>User: Show LoadingButton
Note over StepTwo: Login request in progress
ReduxStore-->>StepTwo: Update authState.isLoading to false
StepTwo->>User: Hide LoadingButton
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?
This PR replaces the regular button on the login page with a
LoadingButton
to indicate loading is in progress.Button
withLoadingButton
LoadingButton
to indicate loadingScreencast from 2024-11-27 13-58-56.webm