feat: add WebSocket URL for client and update GoogleLoginButton text to 'Loading...' for better user feedback

This commit is contained in:
sebseb7
2025-07-30 16:02:11 +02:00
parent afcdbb29c9
commit 14787cbd74
3 changed files with 9 additions and 8 deletions

View File

@@ -187,7 +187,7 @@ class GoogleLoginButton extends Component {
}; };
render() { render() {
const { disabled, style, className, text = (this.props.t ? this.props.t('auth.loginWithGoogle') : 'Mit Google anmelden') } = this.props; const { disabled, style, className, text = 'Loading...'} = this.props;
const { isInitializing, isPrompting } = this.state; const { isInitializing, isPrompting } = this.state;
const isLoading = isInitializing || isPrompting || (this.context && !this.context.isLoaded); const isLoading = isInitializing || isPrompting || (this.context && !this.context.isLoaded);

View File

@@ -23,6 +23,7 @@ import CartSyncDialog from './CartSyncDialog.js';
import { localAndArchiveServer, mergeCarts } from '../utils/cartUtils.js'; import { localAndArchiveServer, mergeCarts } from '../utils/cartUtils.js';
import config from '../config.js'; import config from '../config.js';
import { withI18n } from '../i18n/withTranslation.js'; import { withI18n } from '../i18n/withTranslation.js';
import GoogleIcon from '@mui/icons-material/Google';
// Lazy load GoogleAuthProvider // Lazy load GoogleAuthProvider
const GoogleAuthProvider = lazy(() => import('../providers/GoogleAuthProvider.js')); const GoogleAuthProvider = lazy(() => import('../providers/GoogleAuthProvider.js'));
@@ -614,27 +615,26 @@ export class LoginComponent extends Component {
)} )}
{showGoogleAuth && ( {showGoogleAuth && (
<div>
<Suspense fallback={ <Suspense fallback={
<Button <Button
variant="contained" variant="contained"
startIcon={<PersonIcon />} startIcon={<GoogleIcon />}
sx={{ width: '100%', backgroundColor: '#4285F4', color: 'white' }} disabled
fullWidth
style={{backgroundColor: '#4285F4', color: 'white' }}
> >
Mit Google anmelden Loading...
</Button> </Button>
}> }>
<GoogleAuthProvider clientId={config.googleClientId}> <GoogleAuthProvider clientId={config.googleClientId}>
<GoogleLoginButton <GoogleLoginButton
onSuccess={this.handleGoogleLoginSuccess} onSuccess={this.handleGoogleLoginSuccess}
onError={this.handleGoogleLoginError} onError={this.handleGoogleLoginError}
text="Mit Google anmelden"
style={{ width: '100%', backgroundColor: '#4285F4' }} style={{ width: '100%', backgroundColor: '#4285F4' }}
autoInitiate={true} autoInitiate={true}
/> />
</GoogleAuthProvider> </GoogleAuthProvider>
</Suspense> </Suspense>
</div>
)} )}
</Box> </Box>

View File

@@ -679,6 +679,7 @@ export default {
}, },
client: { client: {
logging: 'verbose', logging: 'verbose',
webSocketURL: 'wss://dev.seedheads.de/ws',
overlay: { overlay: {
errors: true, errors: true,
warnings: true, // Disable warnings overlay to reduce noise warnings: true, // Disable warnings overlay to reduce noise