Docker/Maybe
Docker/Maybe
1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-07-22 14:49:38 +02:00
Code Issues Releases Activity Actions 1

Add rule option to change transaction name (#2175)

Browse source 
* Add change name rule for transaction

* Use HTML template in the ERB, clone and inject those templates from the stimulus controller

* Put back the ai_enabled check

* Update docs

* Example of what no case statement would look like

* Remove action_type and needs_value now that controller is injecting templates/hiding action target

* add "to" to template, improve no-option selection, ensure text box is cleared
This commit is contained in:
Alex Hatzenbuhler 2025-05-06 11:11:56 -05:00 • committed by GitHub
parent c0267d5665
commit 60c3a04a48
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 129 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

82
app/javascript/controllers/rule/actions_controller.js
View file

@ -3,7 +3,12 @@ import { Controller } from "@hotwired/stimulus";
// Connects to data-controller="rule--actions"
export default class extends Controller {
static values = { actionExecutors: Array };
static targets = ["destroyField", "actionValue"];
static targets = [
"destroyField",
"actionValue",
"selectTemplate",
"textTemplate"
];
remove(e) {
if (e.params.destroy) {
@ -19,38 +24,67 @@ export default class extends Controller {
(executor) => executor.key === e.target.value,
);
// Clear any existing input elements first
this.#clearFormFields();
if (actionExecutor.type === "select") {
this.#updateValueSelectFor(actionExecutor);
this.#showAndEnableValueSelect();
this.#buildSelectFor(actionExecutor);
} else if (actionExecutor.type === "text") {
this.#buildTextInputFor();
} else {
this.#hideAndDisableValueSelect();
// Hide for any type that doesn't need a value (e.g. function)
this.#hideActionValue();
}
}
get valueSelectEl() {
return this.actionValueTarget.querySelector("select");
}
#showAndEnableValueSelect() {
this.actionValueTarget.classList.remove("hidden");
this.valueSelectEl.disabled = false;
}
#hideAndDisableValueSelect() {
#hideActionValue() {
this.actionValueTarget.classList.add("hidden");
this.valueSelectEl.disabled = true;
}
#updateValueSelectFor(actionExecutor) {
// Clear existing options
this.valueSelectEl.innerHTML = "";
#clearFormFields() {
// Remove all children from actionValueTarget
this.actionValueTarget.innerHTML = "";
}
// Add new options
for (const option of actionExecutor.options) {
const optionEl = document.createElement("option");
optionEl.value = option[1];
optionEl.textContent = option[0];
this.valueSelectEl.appendChild(optionEl);
#buildSelectFor(actionExecutor) {
// Clone the select template
const template = this.selectTemplateTarget.content.cloneNode(true);
const selectEl = template.querySelector("select");
// Add options to the select element
if (selectEl) {
selectEl.innerHTML = "";
if (!actionExecutor.options || actionExecutor.options.length === 0) {
selectEl.disabled = true;
const optionEl = document.createElement("option");
optionEl.textContent = "(none)";
selectEl.appendChild(optionEl);
} else {
selectEl.disabled = false;
for (const option of actionExecutor.options) {
const optionEl = document.createElement("option");
optionEl.value = option[1];
optionEl.textContent = option[0];
selectEl.appendChild(optionEl);
}
}
}
// Add the template content to the actionValue target and ensure it's visible
this.actionValueTarget.appendChild(template);
this.actionValueTarget.classList.remove("hidden");
}
#buildTextInputFor() {
// Clone the text template
const template = this.textTemplateTarget.content.cloneNode(true);
// Ensure the input is always empty
const inputEl = template.querySelector("input");
if (inputEl) inputEl.value = "";
// Add the template content to the actionValue target and ensure it's visible
this.actionValueTarget.appendChild(template);
this.actionValueTarget.classList.remove("hidden");
}
}