import { Controller } from "@hotwired/stimulus"; // Controller for handling user logout functionality // Sends a DELETE request to the server to sign out the user export default class extends Controller { // Define controller values static values = { url: String, // Optional URL for logout endpoint }; // Log when the controller is mounted connect() { // Display a message when the controller is mounted console.log("LogoutController mounted", this.element); } // Handle the sign out action signOut(event) { event.preventDefault(); console.log("User clicked on logout button."); // Ensure user wants to disconnect with a confirmation request // if (this.hasUrlValue && !confirm(this.element.dataset.confirm)) { return; } // Retrieve the csrf token from header for security const csrfToken = document.querySelector("[name='csrf-token']").content; // Define url to redirect user when action is valid let url = this.hasUrlValue ? this.urlValue : this.element.href; // Ensure the URL is using the correct path prefix if (url && !url.includes('/auth/sign_out')) { url = url.replace('/users/sign_out', '/auth/sign_out'); } // Use fetch to send logout request fetch(url, { method: "DELETE", headers: { "X-CSRF-Token": csrfToken, Accept: "application/json", "Content-Type": "application/json", }, credentials: "same-origin", }) .then((response) => { // console.log(this.element.dataset.redirectUrlValue); // By default, we does not return anything. // By default the response does not include any url. // Redirect to default login page (redirectUrlValue) if (response.redirected) { window.location.href = response.url; } else if (this.element.dataset.redirectUrlValue) { window.location.href = this.element.dataset.redirectUrlValue; return; } window.location.href = "/"; }) .catch((error) => { console.error("Error during sign out:", error); }); } }