Final touches for Quickstarts

app/controllers/frontend_controller.rb

@@ -37,6 +37,8 @@ class FrontendController < ApplicationController
 
   layout :pick_buyer_or_provider_layout
 
+  helper_method :quickstarts_presenter
+
   private
 
   def disable_x_content_type
@@ -168,4 +170,17 @@ def render_wrong_domain_error
   def set_display_currency
     ThreeScale::MoneyHelper.display_currency = current_account.currency if current_account
   end
+
+  def quickstarts_presenter
+    return if @quickstarts_presenter
+
+    current_api = if @backend_api&.id
+                    @backend_api
+                  elsif @service&.id
+                    @service
+                  else
+                    current_account.default_service
+                  end
+    @quickstarts_presenter = QuickstartsPresenter.new(current_api)
+  end
 end

app/javascript/packs/quickstarts/container.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { QuickStartContainerWrapper as QuickStartContainer } from 'QuickStarts/components/QuickStartContainer'
+import { getActiveQuickstart } from 'QuickStarts/utils/progressTracker'
 import { safeFromJsonString } from 'utilities/json-utils'
 
 document.addEventListener('DOMContentLoaded', () => {
@@ -12,9 +13,22 @@ document.addEventListener('DOMContentLoaded', () => {
   }
 
   const { links, renderCatalog } = container.dataset
+  const parsedRenderCatalog = safeFromJsonString<boolean>(renderCatalog)
+  const willRenderQuickStartContainer = getActiveQuickstart() || parsedRenderCatalog
+
+  if (!willRenderQuickStartContainer) {
+    container.remove()
+    return
+  }
 
   QuickStartContainer({
     links: safeFromJsonString<Array<[string, string, string]>>(links) || [],
-    renderCatalog: safeFromJsonString<boolean>(renderCatalog)
+    renderCatalog: parsedRenderCatalog
   }, containerId)
+
+  const wrapperContainer = document.getElementById('wrapper')
+  const quickStartsContainer = document.querySelector('.pfext-quick-start-drawer__body')
+
+  // $FlowIgnore HACK of the year: We need QuickStartContainer to wrap the whole #wrapper for the Drawer to work properly.
+  quickStartsContainer.after(wrapperContainer)
 })

app/javascript/src/QuickStarts/utils/progressTracker.js

@@ -0,0 +1,13 @@
+// @flow
+
+/**
+ * This is a collection of wrappers around localStorage to ease getting information about Quickstarts state
+ */
+
+function getActiveQuickstart (): null | string {
+  // $FlowIgnore[incompatible-type] getItem returns string null
+  const data: null | string = localStorage.getItem('quickstartId')
+  return (data && data.length && JSON.parse(data)) || null
+}
+
+export { getActiveQuickstart }

app/lib/logic/rolling_updates.rb

@@ -296,12 +296,6 @@ def enabled?
         end
       end
 
-      class QuickStarts < Base
-        def missing_config
-          false
-        end
-      end
-
       class Unknown < Base
         def missing_config
           false

app/presenters/quickstarts_presenter.rb

@@ -11,6 +11,7 @@ def initialize(current_api)
 
   attr_reader :current_api
 
+  # Consumed by app/javascript/src/QuickStarts/utils/replaceLinksExtension.js
   def links
     [
       ['create-a-product-link', new_admin_service_path, 'Create a product'],

app/views/shared/provider/_quickstarts_container.html.slim

@@ -1,11 +1,2 @@
-#quick-start-container data-render-catalog=(active_menu == :quickstarts).to_s data-links=QuickstartsPresenter.new(current_api).links
+#quick-start-container data-render-catalog=(active_menu == :quickstarts).to_s data-links=quickstarts_presenter.links
   = javascript_pack_tag 'quickstarts/container'
-
-javascript:
-  document.addEventListener('DOMContentLoaded', () => {
-    // HACK of the year: We need QuickStartContainer to wrap the whole #wrapper for the Drawer to work properly.
-    const wrapperContainer = document.getElementById('wrapper')
-    const quickStartsContainer = document.querySelector('.pfext-quick-start-drawer__body')
-
-    quickStartsContainer.after(wrapperContainer)
-  })

config/examples/features.yml

@@ -17,7 +17,7 @@ features: &default
   logging:
     audits_to_stdout: true
   quickstarts:
-    enabled: false
+    enabled: true
   email_configuration:
     enabled: false
 

features/provider/header.feature

@@ -4,6 +4,7 @@ Feature: Header buttons and menus
     Given a provider is logged in
 
   Scenario: Help menu dropdown
+    Given quickstarts is disabled
     Then the help menu should have the following items:
       | Customer Portal  |
       | 3scale API Docs  |

features/step_definitions/provider/admin/quickstarts_steps.rb

@@ -65,7 +65,7 @@
 
   find("[data-test='tile #{test_quickstart_id}']").click
 
-  assert_selector "[data-testid='qs-drawer-#{test_quickstart_id.underscore.camelize(:lower)}']"
+  assert_selector '[data-test="quickstart drawer"]'
   assert_selector('[data-testid="qs-drawer-side-note-action"]', text: 'Restart')
 end
 

spec/javascripts/QuickStarts/utils/progressTracker.spec.js

@@ -0,0 +1,14 @@
+// @flow
+
+import { getActiveQuickstart } from 'QuickStarts/utils/progressTracker'
+
+it('should return null when there is no active quickstart', () => {
+  localStorage.removeItem('quickstartId')
+  expect(getActiveQuickstart()).toBe(null)
+
+  localStorage['quickstartId'] = '""'
+  expect(getActiveQuickstart()).toBe(null)
+
+  localStorage['quickstartId'] = '"creating-a-method-quick-start"'
+  expect(getActiveQuickstart()).not.toBe(null)
+})