Expand create transaction form.

resources/views/v2/partials/form/transaction/amount.blade.php

@@ -1,14 +1,14 @@
 <div class="row mb-3">
+    <!-- select for currency -->
     <div class="col-sm-3">
-        <template x-if="loadingCurrencies">
-                                                    <span class="form-control-plaintext"><em
-                                                            class="fa-solid fa-spinner fa-spin"></em></span>
+        <!-- is loading currencies -->
+        <template x-if="formStates.loadingCurrencies">
+            <span class="form-control-plaintext"><em class="fa-solid fa-spinner fa-spin"></em></span>
         </template>
-        <template x-if="!loadingCurrencies">
-            <select class="form-control" :id="'currency_code_' + index"
-                    x-model="transaction.currency_code"
-            >
-                <template x-for="currency in nativeCurrencies">
+        <!-- is no longer loading currencies -->
+        <template x-if="!formStates.loadingCurrencies">
+            <select class="form-control" :id="'currency_code_' + index" x-model="transaction.currency_code">
+                <template x-for="currency in formData.nativeCurrencies">
                     <option :selected="currency.id == defaultCurrency.id"
                             :label="currency.name" :value="currency.code"
                             x-text="currency.name"></option>
@@ -16,12 +16,13 @@
             </select>
         </template>
     </div>
+    <!-- actual amount -->
     <div class="col-sm-9">
         <input type="number" step="any" min="0"
                :id="'amount_' + index"
                :data-index="index"
                :class="{'is-invalid': transaction.errors.amount.length > 0, 'input-mask' : true, 'form-control': true}"
-               x-model="transaction.amount" data-inputmask="currency"
+               x-model="transaction.amount"
                @change="changedAmount"
                placeholder="0.00">
         <template x-if="transaction.errors.amount.length > 0">

resources/views/v2/partials/form/transaction/attachments.blade.php

@@ -1,14 +1,16 @@
-<div class="row mb-3">
-    <label :for="'attachments_' + index"
-           class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-file-import"></i>
-    </label>
-    <div class="col-sm-10">
-        <input type="file" multiple
-               class="form-control attachments"
-               :id="'attachments_' + index"
-               :data-index="index"
-               name="attachments[]"
-               placeholder="{{ __('firefly.category')  }}">
+@if(true === $optionalFields['attachments'])
+    <div class="row mb-3">
+        <label :for="'attachments_' + index"
+               class="col-sm-1 col-form-label d-none d-sm-block">
+            <em title="{{ __('firefly.attachments') }}" class="fa-solid fa-file-import"></em>
+        </label>
+        <div class="col-sm-10">
+            <input type="file" multiple
+                   class="form-control attachments"
+                   :id="'attachments_' + index"
+                   :data-index="index"
+                   name="attachments[]"
+                   >
+        </div>
     </div>
-</div>
+@endif

resources/views/v2/partials/form/transaction/budget.blade.php

@@ -1,20 +1,19 @@
-<template x-if="transactionType != 'deposit' && transactionType != 'transfer'">
+<template x-if="groupProperties.transactionType != 'deposit' && groupProperties.transactionType != 'transfer'">
     <div class="row mb-3">
         <label :for="'budget_id_' + index"
                class="col-sm-1 col-form-label d-none d-sm-block">
-            <i class="fa-solid fa-chart-pie"></i>
+            <em title="{{ __('firefly.budget') }}" class="fa-solid fa-chart-pie"></em>
         </label>
         <div class="col-sm-10">
-            <template x-if="loadingBudgets">
-                                                        <span class="form-control-plaintext"><em
-                                                                class="fa-solid fa-spinner fa-spin"></em></span>
+            <template x-if="formStates.loadingBudgets">
+                <span class="form-control-plaintext"><em class="fa-solid fa-spinner fa-spin"></em></span>
             </template>
-            <template x-if="!loadingBudgets">
+            <template x-if="!formStates.loadingBudgets">
                 <select class="form-control"
                         :id="'budget_id_' + index"
                         x-model="transaction.budget_id"
                 >
-                    <template x-for="budget in budgets">
+                    <template x-for="budget in formData.budgets">
                         <option :label="budget.name" :value="budget.id"
                                 x-text="budget.name"></option>
                     </template>

resources/views/v2/partials/form/transaction/category.blade.php

@@ -1,7 +1,6 @@
 <div class="row mb-3">
-    <label :for="'category_name_' + index"
-           class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-bookmark"></i>
+    <label :for="'category_name_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
+        <em title="{{ __('firefly.category') }}" class="fa-solid fa-bookmark"></em>
     </label>
     <div class="col-sm-10">
         <input type="search"

resources/views/v2/partials/form/transaction/date-fields.blade.php

@@ -1,16 +1,18 @@
-<template x-for="dateField in dateFields">
-    <div class="row mb-1">
-        <label :for="dateField + '_date_' + index"
-               class="col-sm-1 col-form-label d-none d-sm-block">
-            <i class="fa-solid fa-calendar-alt" :title="dateField"></i>
-        </label>
-        <div class="col-sm-10">
-            <input type="date"
-                   class="form-control"
-                   :id="dateField + '_date_' + index"
-                   x-model="transaction[dateField]"
-                   :data-index="index"
-                   placeholder="">
+@foreach($optionalDateFields as $name => $enabled)
+    @if($enabled)
+        <div class="row mb-1">
+            <label :for="'{{ $name }}_' + index"
+                   class="col-sm-1 col-form-label d-none d-sm-block">
+                <em class="fa-solid fa-calendar-alt" title="{{ __('firefly.pref_optional_tj_' . $name) }}"></em>
+            </label>
+            <div class="col-sm-10">
+                <input type="date"
+                       class="form-control"
+                       :id="'{{ $name }}_' + index"
+                       x-model="transaction.{{ $name }}"
+                       :data-index="index"
+                       placeholder="">
+            </div>
         </div>
-    </div>
-</template>
+    @endif
+@endforeach

resources/views/v2/partials/form/transaction/date-time.blade.php

@@ -1,10 +1,10 @@
 <div class="row mb-3">
-    <label for="date_0" class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-calendar"></i>
+    <label :for="'date_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
+        <em title="{{ __('firefly.date_and_time') }}" class="fa-solid fa-calendar"></em>
     </label>
     <div class="col-sm-10">
         <input type="datetime-local" class="form-control" :id="'date_' + index"
-               @change="detectTransactionType"
+               @change="changedDateTime"
                x-model="transaction.date"
         >
     </div>

resources/views/v2/partials/form/transaction/description.blade.php

@@ -1,11 +1,11 @@
 <div class="row mb-3">
     <label :for="'description_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
-        <em title="TODO explain me" class="fa-solid fa-font"></em>
+        <em title="{{ __('firefly.description') }}" class="fa-solid fa-font"></em>
     </label>
     <div class="col-sm-10">
         <input type="text" class="form-control ac-description"
                :id="'description_' + index"
-               @change="detectTransactionType"
+               @change="changedDescription"
                x-model="transaction.description"
                :data-index="index"
                placeholder="{{ __('firefly.description')  }}">

resources/views/v2/partials/form/transaction/destination-account.blade.php

@@ -1,12 +1,13 @@
 <div class="row mb-3">
     <label :for="'dest_' + index"
            class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-arrow-left"></i>
+        <em title="{{ __('firefly.destination_account') }}" class="fa-solid fa-arrow-left"></em>
     </label>
     <div class="col-sm-10">
         <input type="text"
                class="form-control ac-dest"
                :id="'dest_' + index"
+               @changed="changedDestinationAccount"
                x-model="transaction.destination_account.alpine_name"
                :data-index="index"
                placeholder="{{ __('firefly.destination_account')  }}">

resources/views/v2/partials/form/transaction/external-url.blade.php

@@ -1,7 +1,8 @@
+@if(true === $optionalFields['external_url'])
 <div class="row mb-3">
     <label :for="'external_url_' + index"
            class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-link"></i>
+        <em title="{{ __('firefly.external_url') }}" class="fa-solid fa-link"></em>
     </label>
     <div class="col-sm-10">
         <input type="text"
@@ -19,3 +20,4 @@
         </template>
     </div>
 </div>
+@endif

resources/views/v2/partials/form/transaction/foreign-amount.blade.php

@@ -1,17 +1,15 @@
-<template x-if="foreignAmountEnabled">
+<template x-if="formBehaviour.foreignCurrencyEnabled">
     <div class="row mb-3">
         <div class="col-sm-3">
             <label class="form-label">&nbsp;</label>
-            <template x-if="loadingCurrencies">
-                                                        <span class="form-control-plaintext"><em
-                                                                class="fa-solid fa-spinner fa-spin"></em></span>
+            <template x-if="formStates.loadingCurrencies">
+                <span class="form-control-plaintext"><em class="fa-solid fa-spinner fa-spin"></em></span>
             </template>
-            <template x-if="!loadingCurrencies">
+            <template x-if="!formStates.loadingCurrencies">
                 <select class="form-control"
                         :id="'foreign_currency_code_' + index"
-                        x-model="transaction.foreign_currency_code"
-                >
-                    <template x-for="currency in foreignCurrencies">
+                        x-model="transaction.foreign_currency_code">
+                    <template x-for="currency in formData.foreignCurrencies">
                         <option :label="currency.name" :value="currency.code"
                                 x-text="currency.name"></option>
                     </template>
@@ -19,26 +17,21 @@
             </template>
         </div>
         <div class="col-sm-9">
-            <template x-if="transactionType != 'transfer'">
-                <label class="small form-label">Amount in foreign amount, if
-                    any</label>
+            <template x-if="groupProperties.transactionType != 'transfer'">
+                <label class="small form-label">{{ __('firefly.amount_foreign_if') }}</label>
             </template>
-            <template x-if="transactionType == 'transfer'">
-                <label class="small form-label">Amount in currency of
-                    destination
-                    account</label>
+            <template x-if="groupProperties.transactionType == 'transfer'">
+                <label class="small form-label">{{ __('firefly.amount_destination_account') }}</label>
             </template>
             <input type="number" step="any" min="0"
                    :id="'amount_' + index"
                    :data-index="index"
                    :class="{'is-invalid': transaction.errors.foreign_amount.length > 0, 'input-mask' : true, 'form-control': true}"
                    x-model="transaction.foreign_amount"
-                   data-inputmask="currency"
                    @change="changedAmount"
                    placeholder="0.00">
             <template x-if="transaction.errors.foreign_amount.length > 0">
-                <div class="invalid-feedback"
-                     x-text="transaction.errors.foreign_amount[0]"></div>
+                <div class="invalid-feedback" x-text="transaction.errors.foreign_amount[0]"></div>
             </template>
         </div>
     </div>

resources/views/v2/partials/form/transaction/internal-reference.blade.php

@@ -1,7 +1,8 @@
+@if(true === $optionalFields['internal_reference'])
 <div class="row mb-3">
     <label :for="'internal_reference_' + index"
            class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-anchor"></i>
+        <em title="{{ __('firefly.internal_reference') }}" class="fa-solid fa-anchor"></em>
     </label>
     <div class="col-sm-10">
         <input type="search"
@@ -12,3 +13,4 @@
                placeholder="{{ __('firefly.internal_reference')  }}">
     </div>
 </div>
+@endif

resources/views/v2/partials/form/transaction/location.blade.php

@@ -1,18 +1,18 @@
+@if(true === $optionalFields['location'])
 <div class="row mb-3">
-    <label :for="'map_' + index"
-           class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-earth-europe"></i>
+    <label :for="'map_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
+        <em title="{{ __('firefly.location') }}" class="fa-solid fa-earth-europe"></em>
     </label>
     <div class="col-sm-10">
         <div :id="'location_map_' + index" style="height:300px;" :data-index="index"></div>
         <span class="muted small">
-                                                    <template x-if="!transaction.hasLocation">
-                                                        <span>Tap the map to add a location</span>
-                                                    </template>
-                                                    <template x-if="transaction.hasLocation">
-                                                        <a :data-index="index" href="#" @click="clearLocation">Clear point</a>
-                                                        </template>
-                                                </span>
+            <template x-if="!transaction.hasLocation">
+                <span>{{ __('firefly.click_tap_location') }}</span>
+            </template>
+            <template x-if="transaction.hasLocation">
+                <a :data-index="index" href="#" @click="clearLocation">{{ __('firefly.clear_location') }}</a>
+            </template>
+        </span>
     </div>
-
 </div>
+@endif

resources/views/v2/partials/form/transaction/notes.blade.php

@@ -1,11 +1,13 @@
+@if(true === $optionalFields['notes'])
 <div class="row mb-3">
-    <label :for="'notes_' + index"
-           class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-font"></i>
+    <label :for="'notes_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
+        <em title="{{ __('firefly.notes') }}" class="fa-solid fa-font"></em>
     </label>
     <div class="col-sm-10">
-                                                <textarea class="form-control" :id="'notes_' + index"
-                                                          x-model="transaction.notes"
-                                                          placeholder="{{ __('firefly.notes')  }}"></textarea>
+        <textarea class="form-control"
+                  :id="'notes_' + index"
+                  x-model="transaction.notes"
+                  placeholder="{{ __('firefly.notes')  }}"></textarea>
     </div>
 </div>
+@endif

resources/views/v2/partials/form/transaction/piggy-bank.blade.php

@@ -1,20 +1,18 @@
-<template
-    x-if="transactionType != 'deposit' && transactionType != 'withdrawal'">
+<template x-if="groupProperties.transactionType != 'deposit' && groupProperties.transactionType != 'withdrawal'">
     <div class="row mb-3">
         <label :for="'piggy_bank_id_' + index"
                class="col-sm-1 col-form-label d-none d-sm-block">
-            <i class="fa-solid fa-piggy-bank"></i>
+            <em title="{{ __('firefly.piggy_bank') }}" class="fa-solid fa-piggy-bank"></em>
         </label>
         <div class="col-sm-10">
-            <template x-if="loadingPiggyBanks">
-                                                        <span class="form-control-plaintext"><em
-                                                                class="fa-solid fa-spinner fa-spin"></em></span>
+            <template x-if="formStates.loadingPiggyBanks">
+                <span class="form-control-plaintext"><em class="fa-solid fa-spinner fa-spin"></em></span>
             </template>
-            <template x-if="!loadingPiggyBanks">
+            <template x-if="!formStates.loadingPiggyBanks">
                 <select class="form-control"
                         :id="'piggy_bank_id_' + index"
                         x-model="transaction.piggy_bank_id">
-                    <template x-for="group in piggyBanks">
+                    <template x-for="group in formData.piggyBanks">
                         <optgroup :label="group.name">
                             <template x-for="piggyBank in group.piggyBanks">
                                 <option :label="piggyBank.name"

resources/views/v2/partials/form/transaction/source-account.blade.php

@@ -1,7 +1,7 @@
 <div class="row mb-3">
     <label :for="'source_' + index"
            class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-arrow-right"></i>
+        <em title="{{ __('firefly.source_account') }}" class="fa-solid fa-arrow-right"></em>
     </label>
     <div class="col-sm-10">
         <input type="text"
@@ -9,6 +9,7 @@
                :id="'source_' + index"
                x-model="transaction.source_account.alpine_name"
                :data-index="index"
+               @changed="changedSourceAccount"
                placeholder="{{ __('firefly.source_account')  }}">
     </div>
 </div>

resources/views/v2/partials/form/transaction/submission-options.blade.php

@@ -1,31 +1,39 @@
+<!-- RETURN HERE AFTER CREATE TRANSACTION -->
+<template x-if="'create' === formBehaviour.formType">
+    <div class="form-check">
+        <input class="form-check-input" x-model="formStates.returnHereButton" type="checkbox" id="returnButton">
+        <label class="form-check-label" for="returnButton">{{ __('firefly.create_another') }}</label>
+    </div>
+</template>
+
+<!-- RESET AFTER -->
+<template x-if="'create' === formBehaviour.formType">
+    <div class="form-check">
+        <input class="form-check-input" x-model="formStates.resetButton" type="checkbox" id="resetButton" :disabled="!formStates.returnHereButton">
+        <label class="form-check-label" for="resetButton">{{ __('firefly.reset_after') }}</label>
+    </div>
+</template>
+<!-- RETURN HERE AFTER EDIT TRANSACTION -->
+<template x-if="'edit' === formBehaviour.formType">
+    <div class="form-check">
+        <input class="form-check-input" x-model="formStates.returnHereButton" type="checkbox" id="returnButton">
+        <label class="form-check-label" for="returnButton">{{ __('firefly.after_update_create_another') }}</label>
+    </div>
+</template>
+<!-- CLONE INSTEAD OF EDIT CURRENT TRANSACTION -->
+<template x-if="'edit' === formBehaviour.formType">
+    <div class="form-check">
+        <input class="form-check-input" x-model="formStates.saveAsNewButton" type="checkbox" id="saveAsNewButton">
+        <label class="form-check-label" for="saveAsNewButton">{{ __('firefly.store_as_new') }}</label>
+    </div>
+</template>
+
 <div class="form-check">
-    <input class="form-check-input" x-model="returnHereButton" type="checkbox"
-           id="returnButton">
-    <label class="form-check-label" for="returnButton">
-        Return here to create a new transaction
-    </label>
+    <input class="form-check-input" type="checkbox" id="rulesButton" :checked="formStates.rulesButton">
+    <label class="form-check-label" for="rulesButton">{{ __('firefly.apply_rules_checkbox') }}</label>
 </div>
 
 <div class="form-check">
-    <input class="form-check-input" x-model="resetButton" type="checkbox"
-           id="resetButton" :disabled="!returnHereButton">
-    <label class="form-check-label" for="resetButton">
-        Reset the form after returning
-    </label>
-</div>
-
-<div class="form-check">
-    <input class="form-check-input" type="checkbox" id="rulesButton"
-           :checked="rulesButton">
-    <label class="form-check-label" for="rulesButton">
-        Run rules on this transaction
-    </label>
-</div>
-
-<div class="form-check">
-    <input class="form-check-input" type="checkbox" id="webhookButton"
-           :checked="webhookButton">
-    <label class="form-check-label" for="webhookButton">
-        Run webhooks on this transaction
-    </label>
+    <input class="form-check-input" type="checkbox" id="webhookButton" :checked="formStates.webhookButton">
+    <label class="form-check-label" for="webhookButton">{{ __('firefly.fire_webhooks_checkbox') }}</label>
 </div>

resources/views/v2/partials/form/transaction/subscription.blade.php

@@ -1,19 +1,17 @@
-<template x-if="transactionType != 'transfer' && transactionType != 'deposit'">
+<template x-if="groupProperties.transactionType != 'transfer' && groupProperties.transactionType != 'deposit'">
     <div class="row mb-3">
-        <label :for="'bill_id_' + index"
-               class="col-sm-1 col-form-label d-none d-sm-block">
-            <i class="fa-solid fa-calendar"></i>
+        <label :for="'bill_id_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
+            <em title="{{ __('firefly.subscription') }}" class="fa-solid fa-calendar"></em>
         </label>
         <div class="col-sm-10">
-            <template x-if="loadingSubscriptions">
-                                                        <span class="form-control-plaintext"><em
-                                                                class="fa-solid fa-spinner fa-spin"></em></span>
+            <template x-if="formStates.loadingSubscriptions">
+                <span class="form-control-plaintext"><em class="fa-solid fa-spinner fa-spin"></em></span>
             </template>
-            <template x-if="!loadingSubscriptions">
+            <template x-if="!formStates.loadingSubscriptions">
                 <select class="form-control"
                         :id="'bill_id_' + index"
                         x-model="transaction.bill_id">
-                    <template x-for="group in subscriptions">
+                    <template x-for="group in formData.subscriptions">
                         <optgroup :label="group.name">
                             <template
                                 x-for="subscription in group.subscriptions">

resources/views/v2/partials/form/transaction/tags.blade.php

@@ -1,7 +1,7 @@
 <div class="row mb-3">
     <label :for="'tags_' + index"
            class="col-sm-1 col-form-label d-none d-sm-block">
-        <i class="fa-solid fa-tag"></i>
+        <em title="{{ __('firefly.tags') }}" class="fa-solid fa-tag"></em>
     </label>
     <div class="col-sm-10">
         <select
@@ -10,7 +10,7 @@
             x-model="transaction.tags"
             :name="'tags['+index+'][]'"
             multiple>
-            <option value="">Type a tag...</option>
+            <option value="">{{ __('firefly.select_tag') }}</option>
         </select>
     </div>
 </div>