improve page-create

This commit is contained in:
2026-02-03 16:25:31 +01:00
parent b5e94e73c5
commit 016be73c6c
2 changed files with 53 additions and 20 deletions

View File

@@ -42,7 +42,7 @@
- Keine externe Abhängigkeit, keine Lizenzkosten
- Client löst SHA256-Challenge (Difficulty 4, ~1-3 Sek)
- Bei Account-Erstellung (immer)
- Bei Anzeigen-Erstellung (immer)
- Bei Anzeigen-Erstellung (nur neue Accounts ohne bisherige Listings)
- Bei Login (nur nach 3+ Fehlversuchen)
- Implementierung: `js/services/pow-captcha.js`, `js/components/pow-captcha.js`

View File

@@ -28,6 +28,7 @@ class PageCreate extends HTMLElement {
this.imagePreviews = []
this.categories = []
this.submitting = false
this.isNewAccount = true
}
loadDraft() {
@@ -60,28 +61,56 @@ class PageCreate extends HTMLElement {
this.hasDraft = !!localStorage.getItem(STORAGE_KEY)
await this.loadCategories()
await this.checkAccountStatus()
this.render()
this.unsubscribe = i18n.subscribe(() => this.render())
}
async checkAccountStatus() {
try {
// Check if user has any published listings
const user = await auth.getUser()
if (user?.id) {
const listings = await directus.get('/items/listings', {
filter: { user_created: { _eq: user.id } },
limit: 1
})
this.isNewAccount = !listings.data || listings.data.length === 0
}
} catch (e) {
// Default to new account (show captcha)
this.isNewAccount = true
}
}
showLoginRequired() {
// Show login modal directly
const authModal = document.querySelector('auth-modal')
if (authModal) {
authModal.show('login')
authModal.addEventListener('login', async () => {
// After login, load the create page
this.hasDraft = !!localStorage.getItem(STORAGE_KEY)
await this.loadCategories()
this.render()
this.unsubscribe = i18n.subscribe(() => this.render())
}, { once: true })
authModal.addEventListener('close', () => {
// If closed without login, go back
if (!auth.isLoggedIn()) {
router.back()
}
}, { once: true })
}
// Show minimal loading state while modal is open
this.innerHTML = /* html */`
<div class="create-page">
<div class="login-required">
<h2>${t('auth.loginRequired')}</h2>
<button class="btn btn-primary btn-lg" id="login-btn">${t('auth.login')}</button>
<p>${t('auth.loginRequired')}</p>
</div>
</div>
`
this.querySelector('#login-btn')?.addEventListener('click', () => {
const authModal = document.querySelector('auth-modal')
if (authModal) {
authModal.show('login')
authModal.addEventListener('login', () => {
this.connectedCallback()
}, { once: true })
}
})
}
async loadCategories() {
@@ -249,9 +278,11 @@ class PageCreate extends HTMLElement {
<p class="field-hint">${t('create.moneroHint')}</p>
</div>
<div class="form-group">
<pow-captcha id="pow-captcha"></pow-captcha>
</div>
${this.isNewAccount ? `
<div class="form-group">
<pow-captcha id="pow-captcha"></pow-captcha>
</div>
` : ''}
<div class="form-actions">
<button type="button" class="btn btn-outline btn-lg" id="cancel-btn">
@@ -386,11 +417,13 @@ class PageCreate extends HTMLElement {
if (this.submitting) return
// Validate PoW Captcha
const captcha = this.querySelector('#pow-captcha')
if (!captcha?.isSolved()) {
this.showError(t('captcha.error'))
return
// Validate PoW Captcha (only for new accounts)
if (this.isNewAccount) {
const captcha = this.querySelector('#pow-captcha')
if (!captcha?.isSolved()) {
this.showError(t('captcha.error'))
return
}
}
// Validate Monero address