Remove unnecessary savebutton vue component and create SaveButton Macro

templates/components/save_button.html

@@ -0,0 +1,6 @@
+{% macro SaveButton(text, additional_classes="") -%}
+  {% set class = "usa-button usa-button-primary" + additional_classes %}
+  <button type="submit" class="{{ class }}" tabindex="0" v-bind:disabled="disabled">
+    {{ text }}
+  </button>
+{%- endmacro %}

templates/fragments/admin/portfolio_members.html

@@ -1,5 +1,6 @@
 {% from "components/icon.html" import Icon %}
 {% from "components/options_input.html" import OptionsInput %}
+{% from 'components/save_button.html' import SaveButton %}
 
 {% from "components/modal.html" import Modal %}
 {% from "components/alert.html" import Alert %}

templates/fragments/edit_user_form.html

@@ -3,6 +3,7 @@
 {% from "components/date_input.html" import DateInput %}
 {% from "components/phone_input.html" import PhoneInput %}
 {% from "components/date_picker.html" import DatePicker %}
+{% from 'components/save_button.html' import SaveButton %}
 
 <base-form inline-template>
   <form method="POST" action='{{ form_action }}'>
@@ -34,11 +35,7 @@
     </div>
 
     <div class='action-group'>
-      <savebutton
-        text='{{ "fragments.edit_user_form.save_details_button" | translate }}'
-        classes="usa-button-big"
-        :disabled="disabled">
-      </savebutton>
+      {{ SaveButton(text=("fragments.edit_user_form.save_details_button" | translate), additional_classes="usa-button-big" )}}
     </div>
   </form>
 </base-form>

templates/portfolios/admin.html

@@ -4,6 +4,7 @@
 {% from "components/icon.html" import Icon %}
 {% from "components/text_input.html" import TextInput %}
 {% from "components/multi_step_modal_form.html" import MultiStepModalForm %}
+{% from 'components/save_button.html' import SaveButton %}
 
 {% set secondary_breadcrumb = "navigation.portfolio_navigation.portfolio_admin" | translate %}
 
@@ -24,7 +25,7 @@
               </div>
 
                 <div class='edit-portfolio-name action-group'>
-                  <savebutton text="Save" classes="usa-button-big" :disabled="disabled"></savebutton>
+                  {{ SaveButton(text='Save', additional_classes='usa-button-big') }}
                 </div>
               </div>
                 <div class='defense-row'>

templates/portfolios/applications/new.html

@@ -4,6 +4,7 @@
 {% from "components/icon.html" import Icon %}
 {% from "components/modal.html" import Modal %}
 {% from "components/text_input.html" import TextInput %}
+{% from 'components/save_button.html' import SaveButton %}
 
 {% set secondary_breadcrumb = 'portfolios.applications.new_application_title' | translate %}
 
@@ -76,10 +77,7 @@
       </div>
 
       <div class="action-group">
-        <savebutton
-          text="{{ 'portfolios.applications.create_button_text' | translate }}"
-          :disabled="disabled">
-        </savebutton>
+        {{ SaveButton(text=('portfolios.applications.create_button_text' | translate)) }}
       </div>
     </form>
   </new-application>

templates/portfolios/task_orders/invitations.html

@@ -6,6 +6,7 @@
 {% from "components/icon.html" import Icon %}
 {% from "components/text_input.html" import TextInput %}
 {% from "components/confirmation_button.html" import ConfirmationButton %}
+{% from 'components/save_button.html' import SaveButton %}
 
 
 {% macro Link(text, icon_name, onClick=None, url='#', classes='') %}
@@ -59,7 +60,7 @@
             {{ Icon("x") }}
             <span>Cancel</span>
           </a>
-          <savebutton text="Save Changes" :disabled="disabled"></savebutton>
+          {{ SaveButton(text='Save Changes') }}
         </div>
       </div>
     </template>

templates/portfolios/task_orders/review.html

@@ -10,7 +10,7 @@
 {% from "components/alert.html" import Alert %}
 {% from "components/review_field.html" import ReviewField %}
 {% from "components/upload_input.html" import UploadInput %}
-
+{% from 'components/save_button.html' import SaveButton %}
 
 {% block content %}
 <ko-review inline-template v-bind:initial-data='{{ form.data|tojson }}'>
@@ -103,7 +103,7 @@
       {% endblock %}
 
       <div class='action-group'>
-        <savebutton text="Continue" :disabled="disabled"></savebutton>
+        {{ SaveButton(text="Continue") }}
       </div>
 
     </form>

templates/portfolios/task_orders/so_review.html

@@ -2,6 +2,7 @@
 
 {% from "components/text_input.html" import TextInput %}
 {% from "components/multi_checkbox_input.html" import MultiCheckboxInput %}
+{% from 'components/save_button.html' import SaveButton %}
 
 {% block content %}
 
@@ -31,7 +32,7 @@
           {{ MultiCheckboxInput(form.required_distribution) }}
 
           <div class="action-group">
-            <savebutton text="Continue" :disabled="disabled"></savebutton>
+            {{ SaveButton(text='Continue') }}
           </div>
         </form>
       </div>

templates/task_orders/signing/signature_requested.html

@@ -3,6 +3,7 @@
 {% from "components/text_input.html" import TextInput %}
 {% from "components/checkbox_input.html" import CheckboxInput %}
 {% from "components/icon.html" import Icon %}
+{% from 'components/save_button.html' import SaveButton %}
 
 {% block content %}
 <base-form inline-template>
@@ -38,7 +39,7 @@
           </div>
         </div>
         <div class="action-group">
-          <savebutton text="{{ 'common.sign' | translate }}" :disabled="disabled"></savebutton>
+          {{ SaveButton(text=('common.sign' | translate)) }}
           <a
             href="{{ url_for("portfolios.ko_review", portfolio_id=portfolio_id, task_order_id=task_order_id) }}"
             class="action-group__action icon-link">