feat: make registration automatic on first visit

- Auto-register on mount if no saved credentials exist
- Remove manual register button
- Show "Registering..." loading state instead
- Automatically progress to username claim step after registration

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-12-05 19:09:17 +01:00
parent c889549362
commit 0a975f4bcf

View File

@@ -41,23 +41,33 @@ export default function App() {
const [serviceHandle, setServiceHandle] = useState(null);
const chatEndRef = useRef(null);
// Load saved data
// Load saved data and auto-register
useEffect(() => {
const savedCreds = localStorage.getItem('rondevu-chat-credentials');
const savedUsername = localStorage.getItem('rondevu-chat-username');
const savedContacts = localStorage.getItem('rondevu-chat-contacts');
const initialize = async () => {
let clientInstance;
if (savedCreds) {
try {
const creds = JSON.parse(savedCreds);
setCredentials(creds);
setClient(new Rondevu({ baseUrl: API_URL, credentials: creds }));
clientInstance = new Rondevu({ baseUrl: API_URL, credentials: creds });
setClient(clientInstance);
} catch (err) {
console.error('Failed to load credentials:', err);
setClient(new Rondevu({ baseUrl: API_URL }));
clientInstance = new Rondevu({ baseUrl: API_URL });
setClient(clientInstance);
// Auto-register if saved creds are invalid
await autoRegister(clientInstance);
}
} else {
setClient(new Rondevu({ baseUrl: API_URL }));
// No saved credentials - auto-register
clientInstance = new Rondevu({ baseUrl: API_URL });
setClient(clientInstance);
await autoRegister(clientInstance);
}
if (savedUsername) {
@@ -72,6 +82,23 @@ export default function App() {
console.error('Failed to load contacts:', err);
}
}
};
const autoRegister = async (clientInstance) => {
try {
const creds = await clientInstance.register();
setCredentials(creds);
localStorage.setItem('rondevu-chat-credentials', JSON.stringify(creds));
const newClient = new Rondevu({ baseUrl: API_URL, credentials: creds });
setClient(newClient);
setSetupStep('claim');
} catch (err) {
console.error('Auto-registration failed:', err);
toast.error(`Registration failed: ${err.message}`);
}
};
initialize();
}, []);
// Auto-scroll chat
@@ -111,21 +138,6 @@ export default function App() {
return () => clearInterval(interval);
}, [contacts, setupStep, client]);
// Register
const handleRegister = async () => {
if (!client) return;
try {
const creds = await client.register();
setCredentials(creds);
localStorage.setItem('rondevu-chat-credentials', JSON.stringify(creds));
setClient(new Rondevu({ baseUrl: API_URL, credentials: creds }));
setSetupStep('claim');
toast.success('Registered!');
} catch (err) {
toast.error(`Error: ${err.message}`);
}
};
// Claim username
const handleClaimUsername = async () => {
if (!client || !usernameInput) return;
@@ -409,10 +421,7 @@ export default function App() {
{setupStep === 'register' && (
<div>
<p style={styles.setupDesc}>Get started by registering with the server</p>
<button onClick={handleRegister} style={styles.setupButton}>
Register
</button>
<p style={styles.setupDesc}>Registering...</p>
</div>
)}