feat: Checkout worflow using Stripe working.

This commit is contained in:
kbe
2025-08-30 21:28:22 +02:00
parent b493027c86
commit 48c648e2ca
7 changed files with 300 additions and 112 deletions

View File

@@ -1,41 +1,46 @@
import { Controller } from "@hotwired/stimulus"
import { Controller } from "@hotwired/stimulus";
// Controller for handling flash messages
// Automatically dismisses messages after a timeout and handles manual closing
export default class extends Controller {
// Define targets for the controller
static targets = ["message"]
static targets = ["message"];
// Initialize the controller when it connects to the DOM
connect() {
console.log("FlashMessageController mounted", this.element);
// console.log("FlashMessageController mounted", this.element);
console.log("FlashMessageController mounted");
// Initialize Lucide icons for this element if available
if (typeof lucide !== 'undefined') {
if (typeof lucide !== "undefined") {
lucide.createIcons({ within: this.element });
}
// Auto-dismiss after 2 seconds
this.timeout = setTimeout(() => {
this.close()
}, 5000)
this.close();
}, 5000);
}
// Clean up the timeout when the controller disconnects
disconnect() {
if (this.timeout) {
clearTimeout(this.timeout)
clearTimeout(this.timeout);
}
}
// Close the flash message with a fade-out animation
close() {
// Add opacity transition classes
this.element.classList.add('opacity-0', 'transition-opacity', 'duration-300')
this.element.classList.add(
"opacity-0",
"transition-opacity",
"duration-300",
);
// Remove element after transition completes
setTimeout(() => {
this.element.remove()
}, 300)
this.element.remove();
}, 300);
}
}