Merge pull request #3948 from 3scale/THREESCALE-9896_invoices-empty-s…

…tate

🦋 THREESCALE-9896: Account Settings > Billing > 3scale Invoices (Implement EmptyState)

app/controllers/provider/admin/account/invoices_controller.rb

@@ -6,6 +6,7 @@ class Provider::Admin::Account::InvoicesController < Provider::Admin::Account::B
   before_action :authorize_finance
   prepend_before_action :deny_on_premises
   activate_menu :account, :billing, :invoices
+  helper_method :empty_invoices?
 
   def index
     @invoices = current_account.invoices
@@ -21,5 +22,8 @@ def authorize_finance
     authorize! :read, Invoice
   end
 
+  def empty_invoices?
+    @invoices.blank?
+  end
 
 end

app/views/provider/admin/account/invoices/index.html.slim

@@ -0,0 +1,35 @@
+= content_for :page_header_title, 'Invoices'
+
+- content_for :javascripts do
+  / HACK: temporary reuse css of existing pack "table_toolbar". Once toolbar is implemented,
+  / import the whole pack with "javascript_packs_with_chunks_tag"
+  = stylesheet_packs_chunks_tag 'table_toolbar'
+
+- if empty_invoices?
+  = render partial: 'shared/empty_state', locals: { title: t('.empty_state.title'),
+                                                    body: t('.empty_state.body') }
+- else
+  table.pf-c-table.pf-m-grid-lg role="grid" aria-label="Invoices table"
+    thead
+      tr role="row"
+        th role="columnheader" scope="col" ID
+        th role="columnheader" scope="col" Month
+        th role="columnheader" scope="col" State
+        th role="columnheader" scope="col" Amount
+        th role="columnheader" scope="col" Download
+    tbody role="rowgroup"
+      - @invoices.each do |invoice|
+        = content_tag_for :tr, invoice, role: 'row' do
+          td role="cell" data-label="ID"
+            = link_to invoice.friendly_id, provider_admin_account_invoice_path(invoice), title: "Show #{invoice.friendly_id}"
+          td role="cell" data-label="Month"
+            = invoice.name
+            - if invoice.current?
+              |  (current)
+          td role="cell" data-label="State"
+            = h invoice.state
+          td role="cell" data-label="Amount"
+            = price_tag(invoice.cost)
+          td role="cell" data-label="Download"
+            - if invoice.pdf.file?
+              = link_to "PDF", invoice.pdf.expiring_url

app/views/provider/admin/account/invoices/show.html.slim

@@ -0,0 +1,9 @@
+= content_for :javascripts do
+  = javascript_packs_with_chunks_tag 'invoices_show'
+
+= render '/finance/provider/shared/invoice_title', invoice: @invoice
+
+.pf-l-grid.pf-m-gutter
+  = render '/finance/provider/shared/invoice_header', editable: false
+  = render '/finance/provider/shared/line_items', editable: false
+  = render '/finance/provider/shared/payment_transactions'

config/locales/en.yml

@@ -408,6 +408,11 @@ en:
             empty_state_title: No invitations
             empty_state_body: To add new members to your team, send them an invitation to join.
             empty_state_primary_title: Invite a team member
+        invoices:
+          index:
+            empty_state:
+              title: Nothing to see here
+              body: There are no invoices yet
         users:
           form:
             submit_button_label: 'Update User'

features/provider/admin/account/billing/invoices/index.feature

@@ -14,12 +14,13 @@ Feature: Account Settings > Billing > 3scale Invoices
       | Master API | Basic   | 31             |
       | Master API | Premium | 3100           |
 
-  Scenario: Empty view
+  Scenario: Empty state
     Given a provider signed up to plan "Premium"
     And the provider has no invoices
     When the provider logs in
     And they go to the 3scale invoices page
-    Then they should see "You have no invoices"
+    Then they should see "Nothing to see here"
+    And they should see "There are no invoices yet"
 
   Scenario: First invoice is generated after 1 day
     Given a provider signed up to plan "Premium"
@@ -45,7 +46,8 @@ Feature: Account Settings > Billing > 3scale Invoices
     And the provider logs in
     When time flies to 1st June 2009
     And they go to the 3scale invoices page
-    Then they should see "you have no invoices"
+    Then they should see "Nothing to see here"
+    And they should see "There are no invoices yet"
 
   Scenario: Invoices are correct when provider changes from Basic to Premium
     Given the time is 5th May 2009