pacnpal/thrillwiki_django_no_react
1
1
Fork 0
mirror of https://github.com/pacnpal/thrillwiki_django_no_react.git synced 2025-12-21 01:51:09 -05:00
Code Issues Packages Projects Releases Wiki Activity

Restored to '20442f595c8df2c8347249ade7f015b7ae566474'

Browse Source 
Replit-Restored-To: 20442f595c8df2c8347249ade7f015b7ae566474
This commit is contained in:
pac7
2025-09-21 16:31:10 +00:00
committed by pacnpal
parent a75e6a2098
commit 988c2b2f06
7 changed files with 16 additions and 654 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
backend/static/js/alpine-components.js
View File

@@ -375,8 +375,6 @@ Alpine.data('authModal', (defaultMode = 'login') => ({
this.resetForms();
}
});
// No need for event listeners since x-init handles global exposure
},
async fetchSocialProviders() {
@@ -620,44 +618,6 @@ Alpine.store('toast', {
});
console.log('All Alpine.js components registered successfully');
// Ensure global authModal is available immediately
if (typeof window !== 'undefined') {
// Create a simple proxy that will find the authModal component when called
window.authModal = {
show: (mode = 'login') => {
console.log('Attempting to show auth modal:', mode);
// Find the authModal component in the DOM
const modalEl = document.querySelector('[x-data*="authModal"]');
if (modalEl && modalEl._x_dataStack && modalEl._x_dataStack[0]) {
const component = modalEl._x_dataStack[0];
if (component.show && typeof component.show === 'function') {
component.show(mode);
console.log('Auth modal opened successfully');
return;
}
}
// Fallback: try to find any component with a show method
const elements = document.querySelectorAll('[x-data]');
for (let el of elements) {
if (el._x_dataStack) {
for (let stack of el._x_dataStack) {
if (stack.show && stack.mode !== undefined) {
stack.show(mode);
console.log('Auth modal opened via fallback method');
return;
}
}
}
}
console.error('Could not find authModal component to open');
}
};
console.log('Global authModal proxy created');
}
}
// Try multiple registration approaches

3
backend/templates/components/auth/auth-modal.html
View File

@@ -12,10 +12,9 @@ Matches React frontend AuthDialog functionality with modal-based auth
x-data="authModal"
x-show="open"
x-cloak
x-init="window.authModal = $data; console.log('Auth modal initialized and exposed globally')"
x-init="window.authModal = $data"
class="fixed inset-0 z-50 flex items-center justify-center"
@keydown.escape.window="close()"
style="display: none;"
>
<!-- Modal Overlay -->
<div

26
backend/templates/components/layout/enhanced_header.html
View File

@@ -308,19 +308,23 @@ Includes: Browse menu, advanced search, theme toggle, user dropdown, mobile menu
</div>
</div>
{% else %}
<div class="flex items-center space-x-2">
<button
@click="window.authModal.show('login')"
class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-9 rounded-md px-3"
<div class="flex items-center space-x-1">
<div
hx-get="{% url 'account_login' %}"
hx-target="body"
hx-swap="beforeend"
class="cursor-pointer"
>
Sign In
</button>
<button
@click="window.authModal.show('register')"
class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3"
{% include 'components/ui/button.html' with variant='outline' size='sm' text='Login' %}
</div>
<div
hx-get="{% url 'account_signup' %}"
hx-target="body"
hx-swap="beforeend"
class="cursor-pointer"
>
Join
</button>
{% include 'components/ui/button.html' with variant='default' size='sm' text='Join' %}
</div>
</div>
{% endif %}