122 lines
3.7 KiB
JavaScript
122 lines
3.7 KiB
JavaScript
// QuickCreateRuleController - Handles the quick create rule form functionality
|
|
import { Controller } from "@hotwired/stimulus"
|
|
|
|
export default class extends Controller {
|
|
static targets = ["form", "toggle", "ruleTypeSelect", "actionSelect", "patternFields", "rateLimitFields", "redirectFields", "helpText", "conditionsField", "expiresAtField"]
|
|
|
|
connect() {
|
|
console.log("QuickCreateRuleController connected")
|
|
this.initializeFieldVisibility()
|
|
}
|
|
|
|
toggle() {
|
|
console.log("Toggle method called")
|
|
console.log("Form target:", this.formTarget)
|
|
|
|
if (this.formTarget) {
|
|
this.formTarget.classList.toggle("hidden")
|
|
console.log("Toggled hidden class, now:", this.formTarget.classList.contains("hidden"))
|
|
|
|
if (this.formTarget.classList.contains("hidden")) {
|
|
this.resetForm()
|
|
} else {
|
|
// Form is being shown, clear the expires_at field for Safari
|
|
this.clearExpiresAtField()
|
|
}
|
|
} else {
|
|
console.error("Form target not found!")
|
|
}
|
|
}
|
|
|
|
updateRuleTypeFields() {
|
|
if (!this.hasRuleTypeSelectTarget || !this.hasActionSelectTarget) return
|
|
|
|
const ruleType = this.ruleTypeSelectTarget.value
|
|
const action = this.actionSelectTarget.value
|
|
|
|
// Hide all optional fields
|
|
this.hideOptionalFields()
|
|
|
|
// Show relevant fields based on rule type
|
|
if (["path_pattern"].includes(ruleType)) {
|
|
if (this.hasPatternFieldsTarget) {
|
|
this.patternFieldsTarget.classList.remove("hidden")
|
|
this.updatePatternHelpText(ruleType)
|
|
}
|
|
} else if (ruleType === "rate_limit") {
|
|
if (this.hasRateLimitFieldsTarget) {
|
|
this.rateLimitFieldsTarget.classList.remove("hidden")
|
|
}
|
|
}
|
|
|
|
// Show redirect fields if action is redirect
|
|
if (action === "redirect") {
|
|
if (this.hasRedirectFieldsTarget) {
|
|
this.redirectFieldsTarget.classList.remove("hidden")
|
|
}
|
|
}
|
|
}
|
|
|
|
updatePatternHelpText(ruleType) {
|
|
if (!this.hasHelpTextTarget || !this.hasConditionsFieldTarget) return
|
|
|
|
const helpTexts = {
|
|
path_pattern: {
|
|
text: "Regex pattern to match URL paths (e.g.,\\.env$|wp-admin|phpmyadmin)",
|
|
placeholder: "Example: \\.env$|\\.git|config\\.php|wp-admin"
|
|
}
|
|
}
|
|
|
|
const config = helpTexts[ruleType]
|
|
if (config) {
|
|
this.helpTextTarget.textContent = config.text
|
|
this.conditionsFieldTarget.placeholder = config.placeholder
|
|
}
|
|
}
|
|
|
|
hideOptionalFields() {
|
|
if (this.hasPatternFieldsTarget) this.patternFieldsTarget.classList.add("hidden")
|
|
if (this.hasRateLimitFieldsTarget) this.rateLimitFieldsTarget.classList.add("hidden")
|
|
if (this.hasRedirectFieldsTarget) this.redirectFieldsTarget.classList.add("hidden")
|
|
}
|
|
|
|
clearExpiresAtField() {
|
|
// Clear the expires_at field - much simpler with text field
|
|
if (this.hasExpiresAtFieldTarget) {
|
|
this.expiresAtFieldTarget.value = ''
|
|
}
|
|
}
|
|
|
|
resetForm() {
|
|
if (this.formTarget) {
|
|
// Find the actual form element within the form target div
|
|
const formElement = this.formTarget.querySelector('form')
|
|
if (formElement) {
|
|
formElement.reset()
|
|
|
|
// Explicitly clear the expires_at field since browser reset might not clear datetime-local fields properly
|
|
this.clearExpiresAtField()
|
|
|
|
// Reset rule type to default
|
|
if (this.hasRuleTypeSelectTarget) {
|
|
this.ruleTypeSelectTarget.value = "network"
|
|
this.updateRuleTypeFields()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Private methods
|
|
|
|
setupEventListeners() {
|
|
// Event listeners are handled via data-action attributes in the HTML
|
|
// No manual event listeners needed
|
|
}
|
|
|
|
initializeFieldVisibility() {
|
|
// Initialize field visibility on page load
|
|
if (this.hasRuleTypeSelectTarget) {
|
|
this.updateRuleTypeFields()
|
|
}
|
|
}
|
|
} |