From b28d962a2837f862e3ac933fd1e96ee99c01dd35 Mon Sep 17 00:00:00 2001 From: Constantin Simonis Date: Wed, 29 Jan 2025 19:07:31 +0100 Subject: [PATCH] prettier --- assets/app.js | 4 +- assets/bootstrap.js | 2 +- assets/controllers.json | 26 ++-- .../controllers/csrf_protection_controller.js | 136 +++++++++++------- assets/controllers/form_controller.js | 85 ++++++----- assets/styles/app.css | 1 - 6 files changed, 145 insertions(+), 109 deletions(-) diff --git a/assets/app.js b/assets/app.js index 06118dd..030f427 100644 --- a/assets/app.js +++ b/assets/app.js @@ -1,2 +1,2 @@ -import './bootstrap.js'; -import './styles/app.css'; +import "./bootstrap.js"; +import "./styles/app.css"; diff --git a/assets/bootstrap.js b/assets/bootstrap.js index b22f20c..e0691e2 100644 --- a/assets/bootstrap.js +++ b/assets/bootstrap.js @@ -1,3 +1,3 @@ -import { startStimulusApp } from '@symfony/stimulus-bundle'; +import { startStimulusApp } from "@symfony/stimulus-bundle"; const app = startStimulusApp(); diff --git a/assets/controllers.json b/assets/controllers.json index 29ea244..103b202 100644 --- a/assets/controllers.json +++ b/assets/controllers.json @@ -1,15 +1,15 @@ { - "controllers": { - "@symfony/ux-turbo": { - "turbo-core": { - "enabled": true, - "fetch": "eager" - }, - "mercure-turbo-stream": { - "enabled": false, - "fetch": "eager" - } - } - }, - "entrypoints": [] + "controllers": { + "@symfony/ux-turbo": { + "turbo-core": { + "enabled": true, + "fetch": "eager" + }, + "mercure-turbo-stream": { + "enabled": false, + "fetch": "eager" + } + } + }, + "entrypoints": [] } diff --git a/assets/controllers/csrf_protection_controller.js b/assets/controllers/csrf_protection_controller.js index 2811f21..601a088 100644 --- a/assets/controllers/csrf_protection_controller.js +++ b/assets/controllers/csrf_protection_controller.js @@ -2,78 +2,116 @@ const nameCheck = /^[-_a-zA-Z0-9]{4,22}$/; const tokenCheck = /^[-_\/+a-zA-Z0-9]{24,}$/; // Generate and double-submit a CSRF token in a form field and a cookie, as defined by Symfony's SameOriginCsrfTokenManager -document.addEventListener('submit', function (event) { +document.addEventListener( + "submit", + function (event) { generateCsrfToken(event.target); -}, true); + }, + true, +); // When @hotwired/turbo handles form submissions, send the CSRF token in a header in addition to a cookie // The `framework.csrf_protection.check_header` config option needs to be enabled for the header to be checked -document.addEventListener('turbo:submit-start', function (event) { - const h = generateCsrfHeaders(event.detail.formSubmission.formElement); - Object.keys(h).map(function (k) { - event.detail.formSubmission.fetchRequest.headers[k] = h[k]; - }); +document.addEventListener("turbo:submit-start", function (event) { + const h = generateCsrfHeaders(event.detail.formSubmission.formElement); + Object.keys(h).map(function (k) { + event.detail.formSubmission.fetchRequest.headers[k] = h[k]; + }); }); // When @hotwired/turbo handles form submissions, remove the CSRF cookie once a form has been submitted -document.addEventListener('turbo:submit-end', function (event) { - removeCsrfToken(event.detail.formSubmission.formElement); +document.addEventListener("turbo:submit-end", function (event) { + removeCsrfToken(event.detail.formSubmission.formElement); }); -export function generateCsrfToken (formElement) { - const csrfField = formElement.querySelector('input[data-controller="csrf-protection"], input[name="_csrf_token"]'); +export function generateCsrfToken(formElement) { + const csrfField = formElement.querySelector( + 'input[data-controller="csrf-protection"], input[name="_csrf_token"]', + ); - if (!csrfField) { - return; - } + if (!csrfField) { + return; + } - let csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); - let csrfToken = csrfField.value; + let csrfCookie = csrfField.getAttribute("data-csrf-protection-cookie-value"); + let csrfToken = csrfField.value; - if (!csrfCookie && nameCheck.test(csrfToken)) { - csrfField.setAttribute('data-csrf-protection-cookie-value', csrfCookie = csrfToken); - csrfField.defaultValue = csrfToken = btoa(String.fromCharCode.apply(null, (window.crypto || window.msCrypto).getRandomValues(new Uint8Array(18)))); - csrfField.dispatchEvent(new Event('change', { bubbles: true })); - } + if (!csrfCookie && nameCheck.test(csrfToken)) { + csrfField.setAttribute( + "data-csrf-protection-cookie-value", + (csrfCookie = csrfToken), + ); + csrfField.defaultValue = csrfToken = btoa( + String.fromCharCode.apply( + null, + (window.crypto || window.msCrypto).getRandomValues(new Uint8Array(18)), + ), + ); + csrfField.dispatchEvent(new Event("change", { bubbles: true })); + } - if (csrfCookie && tokenCheck.test(csrfToken)) { - const cookie = csrfCookie + '_' + csrfToken + '=' + csrfCookie + '; path=/; samesite=strict'; - document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie; - } + if (csrfCookie && tokenCheck.test(csrfToken)) { + const cookie = + csrfCookie + + "_" + + csrfToken + + "=" + + csrfCookie + + "; path=/; samesite=strict"; + document.cookie = + window.location.protocol === "https:" + ? "__Host-" + cookie + "; secure" + : cookie; + } } -export function generateCsrfHeaders (formElement) { - const headers = {}; - const csrfField = formElement.querySelector('input[data-controller="csrf-protection"], input[name="_csrf_token"]'); - - if (!csrfField) { - return headers; - } - - const csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); - - if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { - headers[csrfCookie] = csrfField.value; - } +export function generateCsrfHeaders(formElement) { + const headers = {}; + const csrfField = formElement.querySelector( + 'input[data-controller="csrf-protection"], input[name="_csrf_token"]', + ); + if (!csrfField) { return headers; + } + + const csrfCookie = csrfField.getAttribute( + "data-csrf-protection-cookie-value", + ); + + if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { + headers[csrfCookie] = csrfField.value; + } + + return headers; } -export function removeCsrfToken (formElement) { - const csrfField = formElement.querySelector('input[data-controller="csrf-protection"], input[name="_csrf_token"]'); +export function removeCsrfToken(formElement) { + const csrfField = formElement.querySelector( + 'input[data-controller="csrf-protection"], input[name="_csrf_token"]', + ); - if (!csrfField) { - return; - } + if (!csrfField) { + return; + } - const csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); + const csrfCookie = csrfField.getAttribute( + "data-csrf-protection-cookie-value", + ); - if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { - const cookie = csrfCookie + '_' + csrfField.value + '=0; path=/; samesite=strict; max-age=0'; + if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { + const cookie = + csrfCookie + + "_" + + csrfField.value + + "=0; path=/; samesite=strict; max-age=0"; - document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie; - } + document.cookie = + window.location.protocol === "https:" + ? "__Host-" + cookie + "; secure" + : cookie; + } } /* stimulusFetch: 'lazy' */ -export default 'csrf-protection-controller'; +export default "csrf-protection-controller"; diff --git a/assets/controllers/form_controller.js b/assets/controllers/form_controller.js index 19b48c3..8f83c96 100644 --- a/assets/controllers/form_controller.js +++ b/assets/controllers/form_controller.js @@ -1,55 +1,54 @@ -import {Controller} from "@hotwired/stimulus"; - +import { Controller } from "@hotwired/stimulus"; export default class extends Controller { - addEntry(event) { - event.preventDefault(); + addEntry(event) { + event.preventDefault(); - const formClone = this.element.querySelector('form').cloneNode(true); + const formClone = this.element.querySelector("form").cloneNode(true); - formClone.querySelectorAll("select").forEach(input => { - input.value = "1"; - }); - formClone.querySelector('input').value = ''; + formClone.querySelectorAll("select").forEach((input) => { + input.value = "1"; + }); + formClone.querySelector("input").value = ""; - this.element.querySelector('.forms').appendChild(formClone); + this.element.querySelector(".forms").appendChild(formClone); + } + + removeEntry(event) { + event.preventDefault(); + + if (document.querySelector(".forms").childElementCount === 1) { + return; } - removeEntry(event) { - event.preventDefault(); + event.target.closest("form").remove(); + } - if (document.querySelector('.forms').childElementCount === 1) { - return; - } + submit(event) { + event.preventDefault(); - event.target.closest('form').remove(); - } + const forms = document.querySelectorAll("form"); + const formData = this.getFormData(forms); - submit(event) { - event.preventDefault(); + fetch("/ticket/submit", { + method: "POST", + body: JSON.stringify(formData), + headers: { + "Content-Type": "application/json", + }, + }).then((response) => { + if (!response.ok) { + alert("An error occurred"); + } + }); + } - const forms = document.querySelectorAll('form'); - const formData = this.getFormData(forms); + getFormData(forms) { + const formData = []; + forms.forEach((form) => { + formData.push(Object.fromEntries(new FormData(form).entries())); + }); - fetch('/ticket/submit', { - method: 'POST', - body: JSON.stringify(formData), - headers: { - 'Content-Type': 'application/json' - } - }).then(response => { - if (!response.ok) { - alert('An error occurred'); - } - }); - } - - getFormData(forms) { - const formData = []; - forms.forEach(form => { - formData.push(Object.fromEntries(new FormData(form).entries())); - }) - - return formData; - } -} \ No newline at end of file + return formData; + } +} diff --git a/assets/styles/app.css b/assets/styles/app.css index a90f074..b5c61c9 100644 --- a/assets/styles/app.css +++ b/assets/styles/app.css @@ -1,4 +1,3 @@ @tailwind base; @tailwind components; @tailwind utilities; -