kaui 3.0.9 → 4.0.0

data/app/views/kaui/accounts/_close_account_modal.html.erb

@@ -1,71 +1,93 @@
-<div class="modal fade" id="closeAccountModal" tabindex="-1" role="dialog">
+<div class="modal fade close_account_modal" id="closeAccountModal" tabindex="-1" role="dialog">
   <div class="modal-dialog" role="document">
     <div class="modal-content column-block">
-      <div>
-        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-        <h1 class="modal-title">Close account</h1>
+      <div class="modal-header">
+        <h5 class="modal-title d-flex align-items-center gap-3">
+          <span class="icon-container">
+            <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M13.3334 5.83333C13.3334 7.67428 11.841 9.16667 10.0001 9.16667C8.15913 9.16667 6.66675 7.67428 6.66675 5.83333C6.66675 3.99238 8.15913 2.5 10.0001 2.5C11.841 2.5 13.3334 3.99238 13.3334 5.83333Z" stroke="#414651" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+              <path d="M15.8334 15.8332C15.8334 13.532 13.9679 11.6665 11.6667 11.6665H8.33341C6.03223 11.6665 4.16675 13.532 4.16675 15.8332V17.4998H15.8334V15.8332Z" stroke="#414651" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
+          </span>
+          Close account
+        </h5>
+        <button type="button" class="close close-button custom-hover" data-bs-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">
+            <%= image_tag("kaui/modal/close.svg", width: 20, height: 20) %>
+          </span>
+        </button>
       </div>
-      <div class="modal-body">
         <%= form_for :close, :url =>  '' , :method => :delete, :html => {:class => 'form-horizontal', :id => 'account-close-form'} do |f| %>
-            <div class='form-group'>
+      <div class="modal-body">
+            <div class='form-group mb-3'>
               <%= f.label :name, 'Name', :class => 'col-sm-4 control-label' %>
               <div class="col-sm-8">
                 <%= f.text_field :name, :class => 'form-control', :readonly => true %>
               </div>
             </div>
-            <div class='form-group'>
+            <div class='form-group mb-3'>
               <%= f.label :account_id, 'Account id', :class => 'col-sm-4 control-label' %>
               <div class="col-sm-8">
                 <%= f.text_field :account_id, :class => 'form-control', :readonly => true %>
               </div>
             </div>
             <div class="form-group">
-              <div class="col-sm-offset-4 col-sm-8">
-                <div class="row">
-                  <div class="col-sm-3">
-                    <label class="switch">
-                      <input name="options[]" id="cancelAllSubscriptions" type="checkbox" value="cancel_all_subscriptions">
-                      <span class="slider round"></span>
-                    </label>
-                  </div>
-                  <label class="col-sm-8 capitalize">Cancel all subscriptions.</label>
+              <div class="col-sm-4"></div>
+              <div class="col-sm-8 ml-3">
+                <div class="form-check">
+                  <input class="form-check-input" type="checkbox" name="options[]" id="cancelAllSubscriptions" value="cancel_all_subscriptions">
+                  <label class="form-check-label capitalize" for="cancelAllSubscriptions">
+                    Cancel all subscriptions.
+                  </label>
                 </div>
               </div>
             </div>
+
             <div class="form-group">
-              <div class="col-sm-offset-4 col-sm-8">
-                <div class="row">
-                  <div class="col-sm-3">
-                    <label class="switch">
-                      <input name="options[]" id="writeoffUnpaidInvoices" type="checkbox" value="writeoff_unpaid_invoices">
-                      <span class="slider round"></span>
-                    </label>
-                  </div>
-                  <label class="col-sm-8 capitalize">Write off unpaid invoices.</label>
+              <div class="col-sm-4"></div>
+              <div class="col-sm-8 ml-3">
+                <div class="form-check">
+                  <input class="form-check-input" type="checkbox" name="options[]" id="writeoffUnpaidInvoices" value="writeoff_unpaid_invoices">
+                  <label class="form-check-label capitalize" for="writeoffUnpaidInvoices">
+                    Write off unpaid invoices.
+                  </label>
                 </div>
               </div>
             </div>
+
             <div class="form-group">
-              <div class="col-sm-offset-4 col-sm-8">
-                <div class="row">
-                  <div class="col-sm-3">
-                    <label class="switch">
-                      <input name="options[]" id="itemAdjustUnpaidInvoices" type="checkbox" value="item_adjust_unpaid_invoices">
-                      <span class="slider round"></span>
-                    </label>
-                  </div>
-                  <label class="col-sm-8 capitalize">Item adjust unpaid invoices.</label>
+              <div class="col-sm-4"></div>
+              <div class="col-sm-8 ml-3">
+                <div class="form-check">
+                  <input class="form-check-input" type="checkbox" name="options[]" id="itemAdjustUnpaidInvoices" value="item_adjust_unpaid_invoices">
+                  <label class="form-check-label capitalize" for="itemAdjustUnpaidInvoices">
+                    Item adjust unpaid invoices.
+                  </label>
                 </div>
               </div>
             </div>
 
-            <div class="form-group">
-              <div class="col-sm-offset-4 col-sm-8">
-                <%= submit_tag 'Close', :class => 'btn btn-danger' %>
-              </div>
-            </div>
+          </div>
+          <div class="modal-footer">
+            <%= render "kaui/components/button/button", {
+              label: 'Cancel',
+              variant: "outline-secondary d-inline-flex align-items-center gap-1",
+              type: "button",
+              html_class: "kaui-button custom-hover",
+              html_options: {
+                data: {
+                  bs_dismiss: "modal"
+                }
+              }
+            } %>
+            <%= render "kaui/components/button/button", {
+              label: 'Close Account',
+              variant: "outline-secondary d-inline-flex align-items-center gap-1",
+              type: "submit",
+              html_class: "kaui-dropdown custom-hover"
+            } %>
+          </div>
         <% end %>
-      </div>
     </div><!-- /.modal-content -->
   </div><!-- /.modal-dialog -->
 </div><!-- /.modal -->

data/app/views/kaui/accounts/_form_account.html.erb

@@ -0,0 +1,157 @@
+<% # Unclear why this url/method hack is needed %>
+<%= form_for @account, :url => @account.persisted? ? account_path(@account.account_id) : accounts_path, :method => @account.persisted? ? :put : :post, :html => {:class => 'form-horizontal'} do |f| %>
+<%= f.hidden_field :payment_method_id %>
+
+<div class="form-group d-flex pb-3">
+    <%= f.label :name, 'User name', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :name, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :first_name_length, :class => 'col-sm-3 control-label' do %>
+    First name length
+    <% end %>
+    <div class="col-sm-9 position-relative">
+        <%= f.text_field :first_name_length,
+                         :pattern => '^[0-9]*$',
+                         :title => 'Format: Can only contain digits; Description: Identify where the first name ends and last name starts.',
+                         :class => 'form-control' %>
+        <%= link_to('https://www.w3.org/International/questions/qa-personal-names',target: '_blank', rel: 'nofollow') do %>
+        <i class="fa fa-question-circle-o question-circle" aria-hidden="true"></i>
+        <% end %>
+    </div>
+</div>
+<% unless @account.persisted? %>
+<div class="form-group d-flex pb-3">
+    <%= f.label :external_key, 'External key', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :external_key, :class => 'form-control' %>
+        <div class="account_external_key_invalid_msg text-danger">
+            Warning! External key already in use.
+        </div>
+    </div>
+</div>
+<% else %>
+<%= f.hidden_field :external_key %>
+<% end %>
+<div class="form-group d-flex pb-3 border-bottom mb-3">
+    <%= f.label :email, 'Email', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.email_field :email, :class => 'form-control' %>
+    </div>
+</div>
+<% unless @account.persisted? %>
+<div class="form-group d-flex pb-3">
+    <%= f.label :bill_cycle_day_local, 'Bill cycle day', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.number_field :bill_cycle_day_local, :class => 'form-control', :min => 0, max: 31 %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :currency, 'Currency', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.select :currency, currencies, {:selected => 'USD'}, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :time_zone, 'Timezone', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.select :time_zone, ActiveSupport::TimeZone.all.collect { |tz| [tz.to_s, tz.tzinfo.name] }, {:selected => 'Etc/UTC'}, :class => 'form-control' %>
+    </div>
+</div>
+<% else %>
+<%= f.hidden_field :bill_cycle_day_local %>
+<%= f.hidden_field :currency %>
+<%= f.hidden_field :time_zone %>
+<% end %>
+<div class="form-group d-flex pb-3 border-bottom mb-3">
+    <%= f.label :locale, 'Locale', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.select :locale, all_available_locales, {:selected => (@account.locale || 'en_US'), :disabled => '---------------'}, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :address1, 'Address line 1', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :address1, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :address2, 'Address line 2', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :address2, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :postal_code, 'Zip code', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :postal_code, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :company, 'Company', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :company, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :city, 'City', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :city, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :state, 'State', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.select :state, all_us_states, {:include_blank => '', :selected => @account.state}, :class => 'form-control select-state' %>
+        <%= f.text_field :state, :class => 'form-control text-state', :style => 'display: none;' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :country, 'Country', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.country_select :country, {:priority_countries => %w(US CA), :selected => @account.country, :sort_provided => false}, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3">
+    <%= f.label :phone, 'Phone', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.number_field :phone, :class => 'form-control' %>
+    </div>
+</div>
+<div class="form-group d-flex pb-3 <%= 'border-bottom mb-3' if @account.persisted? %>">
+    <%= f.label :notes, 'Notes', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-9">
+        <%= f.text_field :notes, :class => 'form-control' %>
+    </div>
+</div>
+<% unless @account.persisted? %>
+<div class="form-group d-flex pb-3 border-bottom mb-3">
+    <%= f.label '', :class => 'col-sm-3 control-label' %>
+    <div class="col-sm-offset-3 col-sm-9">
+        <div class="checkbox">
+            <%= f.label :is_migrated do %>
+            <%= f.check_box :is_migrated, {:checked => @account.is_migrated} %>Migrated
+            <% end %>
+        </div>
+    </div>
+</div>
+<% else %>
+<%= f.hidden_field :is_migrated %>
+<% end %>
+<%= f.hidden_field :is_payment_delegated_to_parent %>
+<%= f.hidden_field :parent_account_id %>
+<div class="form-group d-flex justify-content-end pb-3">
+    <%= render "kaui/components/button/button", {
+      label: 'Save Account',
+      variant: "outline-secondary d-inline-flex align-items-center gap-1",
+      type: "submit",
+      html_class: "kaui-dropdown custom-hover",
+      html_options: {
+        id: "saveButton"
+      }
+    } %>
+</div>
+
+<% end %>