foreman_acd 0.6.0 → 0.9.1

data/app/lib/actions/foreman_acd/run_configurator.rb

@@ -15,15 +15,19 @@ module Actions
           app_instance = ::ForemanAcd::AppInstance.find(input.fetch(:id))
           app_configurator = ::ForemanAcd::AppConfigurator.new(app_instance)
 
-          jobs = app_configurator.configure
-          ::Foreman::Logging.logger('foreman_acd').info "Creating #{jobs.count} job(s) to configure the app #{app_instance}"
-
-          # TODO: would it be better to create a sub task for each job we need to run?
-          jobs.each(&:trigger)
+          result, job = app_configurator.configure
+          if result.success
+            ::Foreman::Logging.logger('foreman_acd').info "Creating job to configure the app #{app_instance}"
+            job.trigger!
+            output[:configure_job_id] = job.job_invocation.id
+          else
+            ::Foreman::Logging.logger('foreman_acd').error "Could not create the job to configure the app #{app_instance}: #{result.error}"
+          end
         rescue StandardError => e
-          ::Foreman::Logging.logger('foreman_acd').error "Error while configuring application instance: #{e}"
-          output[:error] = e.to_s
+          ::Foreman::Logging.logger('foreman_acd').error "Error while configuring application instance '#{app_instance.name}': #{e}"
+
           output[:status] = 'FAILURE'
+          raise "Error while configuring hosts via ansible playbook for application instance '#{app_instance.name}': (#{e.message})"
         end
       end
 

data/app/models/concerns/foreman_acd/host_managed_extensions.rb

@@ -5,47 +5,60 @@ module ForemanAcd
   module HostManagedExtensions
     extend ActiveSupport::Concern
 
-    RUN_CONFIGURATOR_DELAY = 240
-
     def self.prepended(base)
       base.instance_eval do
-        before_provision :initiate_acd_app_configurator, :if => :deployed_via_acd?
-      end
-    end
+        before_provision :initiate_acd_app_configurator_after_host_deployment, :if => :deployed_via_acd?
+        before_destroy :check_deletable, :prepend => true, :if => :deployed_via_acd?
 
-    private
+        has_many :app_instances, :through => :foreman_hosts, :class_name => 'ForemanAcd::AppInstance'
 
-    def deployed_via_acd?
-      find_app_instance_host
-      @app_instance_host.present?
+        scoped_search :relation => :app_instances,
+                      :on => :name,
+                      :rename => :acd_app_instance,
+                      :only_explicit => true,
+                      :complete_value => true,
+                      :operators => ['= '],
+                      :ext_method => :find_by_acd_app_instance_name
+      end
+
+      base.singleton_class.prepend ClassMethods
     end
 
-    def find_app_instance_host
-      @app_instance_host = ForemanAcd::ForemanHost.find_by(:host_id => id)
+    # New class methods for Host::Managed
+    module ClassMethods
+      def find_by_acd_app_instance_name(_key, operator, acd_instance_name)
+        cond = sanitize_sql_for_conditions(["acd_app_instances.name #{operator} ?", value_to_sql(operator, acd_instance_name)])
+        hosts = ForemanAcd::AppInstance.where(cond).joins(:foreman_hosts).pluck(:host_id)
+        if hosts.empty?
+          { :condition => '1=0' }
+        else
+          { :conditions => Host::Managed.arel_table[:id].in(hosts).to_sql }
+        end
+      end
     end
 
-    def initiate_acd_app_configurator
-      return false if @app_instance_host.blank?
+    def deployed_via_acd?
+      find_foreman_host
+      @foreman_host.present?
+    end
 
-      run_it = true
-      @app_instance_host.app_instance.foreman_hosts.each do |foreman_host|
-        # if there is ONE host, which is still in build phase we don't let the app_configuator run
-        next unless foreman_host.host.build?
-        ::Foreman::Logging.logger('foreman_acd').info("Another host (#{foreman_host.host.name} is still in build-phase. Wait for it...")
-        run_it = false
-        break
-      end
+    private
 
-      return unless run_it
+    def check_deletable
+      return if @foreman_host.blank?
+      ::Foreman::Logging.logger('foreman_acd').warn "Could not delete host '#{name}' because it is used in Applications > App Instances '#{@foreman_host.app_instance.name}'"
+      raise _("Could not delete host '%{host_name}' because it is used in Applications > App Instances '%{app_instance_name}'") % {
+        :host_name => name, :app_instance_name => @foreman_host.app_instance.name
+      }
+    end
 
-      ::Foreman::Logging.logger('foreman_acd').info("All hosts of app (#{@app_instance_host.app_instance.name}) were built. Schedule app configurator...")
-      start_acd_app_configurator
+    def find_foreman_host
+      @foreman_host = ForemanAcd::ForemanHost.find_by(:host_id => id)
     end
 
-    def start_acd_app_configurator
-      ForemanTasks.delay(::Actions::ForemanAcd::RunConfigurator,
-                         { :start_at => Time.zone.now + RUN_CONFIGURATOR_DELAY },
-                         @app_instance_host.app_instance)
+    def initiate_acd_app_configurator_after_host_deployment
+      return if @foreman_host.blank?
+      ForemanAcd.initiate_acd_app_configurator(@foreman_host.app_instance)
     end
   end
 end

data/app/models/foreman_acd/acd_provider.rb

@@ -2,7 +2,7 @@
 
 module ForemanAcd
   # Implement a RemoteExecutionProvider
-  class AcdProvider < RemoteExecutionProvider
+  class AcdProvider < ::RemoteExecutionProvider
     class << self
       def supports_effective_user?
         true
@@ -25,6 +25,12 @@ module ForemanAcd
       def ssh_key_passphrase(_host); end
 
       def sudo_password(_host); end
+
+      # Workaround till infrastructure jobs on proxies are possible. See
+      # configure in services/foreman_acd/app_configurator.rb for more details.
+      # def required_proxy_selector_for(_template)
+      #   AcdProxyProxySelector.new
+      # end
     end
   end
 end

data/app/models/foreman_acd/ansible_playbook.rb

@@ -12,6 +12,7 @@ module ForemanAcd
     self.table_name = 'acd_ansible_playbooks'
     has_many :app_definitions, :inverse_of => :ansible_playbook, :foreign_key => 'acd_ansible_playbook_id', :dependent => :restrict_with_error
     validates :name, :presence => true, :uniqueness => true
+    validates :scm_type, :presence => true
     scoped_search :on => :name
 
     default_scope do
@@ -44,7 +45,7 @@ module ForemanAcd
 
     def content
       case scm_type
-      when 'directory'
+      when 'directory' || 'git'
         File.read(File.join(path, playfile))
       else
         raise NotImplementedError.new "scm_type #{scm_type.inspect} not supported!"

data/app/models/foreman_acd/app_instance.rb

@@ -11,6 +11,7 @@ module ForemanAcd
 
     self.table_name = 'acd_app_instances'
     belongs_to :last_deploy_task, :class_name => 'ForemanTasks::Task'
+    belongs_to :initial_configure_task, :class_name => 'ForemanTasks::Task'
     validates :name, :presence => true, :uniqueness => true
     validates :app_definition, :presence => true
     belongs_to :app_definition, :inverse_of => :app_instances
@@ -32,7 +33,7 @@ module ForemanAcd
     end
 
     def clean_all_hosts
-      remember_host_ids = foreman_hosts.map(&:host_id)
+      remember_host_ids = foreman_hosts.select(&:fresh_host?).map(&:host_id)
 
       # Clean the app instance association first
       foreman_hosts.update_all(:host_id => nil)
@@ -43,18 +44,62 @@ module ForemanAcd
 
     def clean_hosts_by_id(ids = [])
       # Clean the app instance association first
-      foreman_hosts.where(:host_id => ids).update_all(:host_id => nil)
+      foreman_hosts.where(:host_id => ids, :is_existing_host => false).update_all(:host_id => nil)
 
       # Remove all hosts afterwards
       delete_hosts(ids)
     end
 
+    def hosts_deployment_finished?
+      return true if all_hosts_deployed?
+
+      ::Foreman::Logging.logger('foreman_acd').info('Another host is still in build-phase. Wait for it...')
+      false
+    end
+
+    def deployment_state
+      return :new if last_deploy_task.nil?
+      return :initiated if !last_deploy_task.nil? && last_deploy_task.ended_at.nil?
+
+      state = if all_hosts_deployed?
+                :finished
+              elsif last_deploy_task.ended_at? && last_deploy_task.result != 'success'
+                :failed
+              else
+                :pending
+              end
+      state
+    end
+
+    def initial_configure_job
+      return nil if initial_configure_task.nil?
+      return JobInvocation.find(initial_configure_task.output['configure_job_id']) if initial_configure_task.output.key?('configure_job_id') &&
+                                                                                      !initial_configure_task.output['configure_job_id'].nil?
+      nil
+    end
+
+    def initial_configure_state
+      return :unconfigured if initial_configure_job.nil? && initial_configure_task.nil?
+      return :scheduled if initial_configure_job.nil?
+      return :pending unless initial_configure_job.finished?
+      initial_configure_job.status_label.to_sym
+    end
+
+    private
+
+    def all_hosts_deployed?
+      foreman_hosts.each do |foreman_host|
+        return false if foreman_host.host.nil? || foreman_host.host.build?
+      end
+      true
+    end
+
     def delete_hosts(ids = [])
       return if ids.empty?
       ids.each do |host_id|
         h = ::Host.find(host_id) unless host_id.nil?
         if h
-          Katello::RegistrationManager.unregister_host(h, :unregistering => false) if ForemanAcd::Engine.with_katello?
+          Katello::RegistrationManager.unregister_host(h, :unregistering => false) if ForemanAcd.with_katello?
           h.destroy
         end
       end

data/app/models/foreman_acd/foreman_host.rb

@@ -16,6 +16,14 @@ module ForemanAcd
       _('Foreman Host')
     end
 
+    def fresh_host?
+      !is_existing_host
+    end
+
+    def existing_host?
+      is_existing_host
+    end
+
     def self.permission_name
       'foreman_hosts'
     end

data/app/services/foreman_acd/acd_proxy_proxy_selector.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module ForemanAcd
+  # AcdProxy Selector implementing a RemoteExecutionProxySelector which
+  # only returns the Smart Proxy of the given host
+  class AcdProxyProxySelector < ::RemoteExecutionProxySelector
+    def determine_proxy(*args)
+      host, _provider = args
+
+      # We already did the determine_proxy in app_configurator. We want that REX
+      # isn't doing the determination of the proxy twice.
+      # Therefore, we will just return the host, which is the proxy!
+
+      ::SmartProxy.find_by(:name => host.name)
+    end
+  end
+end

data/app/services/foreman_acd/app_configurator.rb

@@ -19,12 +19,36 @@ module ForemanAcd
 
       begin
         proxy_hosts = {}
-        jobs = []
+        job = nil
+        result = OpenStruct.new
 
         hosts = @app_instance.foreman_hosts
+
+        # Important: This uses the REX Proxy Selector and not
+        #  the AcdProxySelection because the AcdProxySelector
+        #  does not find the proxy but only return the given
+        #  host. This is required because we want to run the
+        #  ansible playbook for a group of hosts on the smart proxy.
+        #  So the process need to be:
+        #  1. get the proxy which is required to connect to host a,b,c
+        #  2. run the job on the proxy
+        #  In 2. we need to make sure that REX doesn't try to find the
+        #  proxy which is necessary to connect to the proxy
         proxy_selector = RemoteExecutionProxySelector.new
         hosts.each do |h|
-          proxy = proxy_selector.determine_proxy(h.host, 'ACD')
+          begin
+            unless h.host
+              result.success = false
+              result.error = 'App Instance is not deployed'
+              return [result, job]
+            end
+            proxy = proxy_selector.determine_proxy(h.host, 'ACD')
+            result.success = true
+          rescue NoMethodError => e
+            result.success = false
+            result.error = "#{e}, Install/Update smart-proxies for ACD"
+            return [result, job]
+          end
           proxy_hosts[proxy.name] = [] unless proxy_hosts.key?(proxy.name)
           proxy_hosts[proxy.name] << h
         end
@@ -32,23 +56,43 @@ module ForemanAcd
         # TODO: just for testing...
         # proxy_hosts = { Host.first.name => [ Host.first.id] }
 
-        # we need to compose multiple jobs. for each proxy one job.
+        proxy_inventories = {}
+        proxy_host_ids =  []
         proxy_hosts.each do |proxy_name, foreman_hosts|
-          # create the inventory file
-          inventory = ForemanAcd::InventoryCreator.new(@app_instance, foreman_hosts).create_inventory
-          job_input['inventory'] = YAML.dump(inventory)
-
-          composer = JobInvocationComposer.for_feature(
-            :run_acd_ansible_playbook,
-            [Host.find_by(:name => proxy_name).id],
-            job_input.to_hash
-          )
-          jobs << composer
+          proxy_inventories[proxy_name] = ForemanAcd::InventoryCreator.new(@app_instance, foreman_hosts).create_inventory
+
+          # Workaround till infrastructure jobs on proxies are possible. See
+          #     https://community.theforeman.org/t/infrastructure-roles/22001/33
+          #
+          # Why do we use 'foreman_hosts.first.host'? REX is 'host-centric'. During
+          # job execution, REX will try to find the proxy on which the job should be executed.
+          # We throw the first host at REX's feet so that the resolution of the
+          # proxy works (... which we have already done above).
+          # ACD on the smart proxy side will call the ansible-playbook for ALL hosts
+          # which are behind this smart proxy.
+          #
+          # Additionally, we disable that  AcdProxyProxySelector is used.
+          # See required_proxy_selector_for in models/foreman_acd/acd_provider.rb
+          proxy_host_ids << foreman_hosts.first.host.id
+
+          # Actually, we want this:
+          # proxy_host_ids << Host.find_by(:name => proxy_name).id
         end
+
+        job_input['inventory'] = YAML.dump(proxy_inventories)
+        composer = JobInvocationComposer.for_feature(
+          :run_acd_ansible_playbook,
+          proxy_host_ids,
+          job_input.to_hash
+        )
+        job = composer
       rescue StandardError => e
-        logger.error("Failed to configure hosts: #{e.class}: #{e.message}\n#{e.backtrace.join($INPUT_RECORD_SEPARATOR)}")
+        result.success = false
+        result.error = _('Failed to configure hosts: %{err_msg}' % { :err_msg => e.message })
+        logger.error('Failed to configure hosts: %{err_class}: %{err_msg}' % { :err_class => e.class, :err_msg => e.message })
+        job = nil
       end
-      jobs
+      [result, job]
     end
   end
 end

data/app/services/foreman_acd/app_deployer.rb

@@ -9,15 +9,30 @@ module ForemanAcd
       @app_instance = app_instance
     end
 
-    def deploy
+    def deploy(safe_deploy)
       output = []
       services = JSON.parse(@app_instance.app_definition.services)
       all_hosts = []
 
-      @app_instance.foreman_hosts.each do |foreman_host|
+      foreman_hosts = if safe_deploy
+                        @app_instance.foreman_hosts.find(safe_deploy)
+                      else
+                        @app_instance.foreman_hosts
+                      end
+
+      foreman_hosts.each do |foreman_host|
         service_data = services.select { |k| k['id'] == foreman_host.service.to_i }.first
-        host_params = set_host_params(foreman_host, service_data)
 
+        # Handle already deployed hosts
+        if foreman_host.existing_host?
+          domain = Hostgroup.find(service_data['hostgroup']).domain.name
+          fqdn = "#{foreman_host.hostname}.#{domain}"
+          h =  Host.find_by(:name => fqdn)
+          foreman_host.update!(:host_id => h.id)
+          next
+        end
+
+        host_params = set_host_params(foreman_host, service_data)
         host = foreman_host.host.presence
 
         is_rebuild = false
@@ -39,7 +54,10 @@ module ForemanAcd
         end
 
         # REMOVE ME (but very nice for testing)
-        # host.mac = "00:11:22:33:44:55"
+        # prng = Random.new
+        # x = prng.rand(100)
+        # y = prng.rand(100)
+        # host.mac = "00:11:22:33:#{x}:#{y}"
 
         apply_compute_profile(host)
         host.suggest_default_pxe_loader
@@ -67,6 +85,11 @@ module ForemanAcd
           output << msg
         end
       end
+
+      # Try to start the configuration, too. In case of a app instance including only already deployed hosts
+      # this would start the configuration job then.
+      ForemanAcd.initiate_acd_app_configurator(@app_instance)
+
       output
     end
 

data/app/services/foreman_acd/inventory_creator.rb

@@ -32,10 +32,11 @@ module ForemanAcd
 
         children[ansible_group] = { 'hosts' => {} } unless children.key?(host_service['ansibleGroup'])
 
-        ansible_vars = JSON.parse(foreman_host.ansibleParameters).map { |v| { v['name'] => v['value'] } }.reduce({}, :merge!)
+        ansible_vars = JSON.parse(foreman_host.ansibleParameters).map { |v| { v['name'] => get_param_value(foreman_host.host, v['value']) } }.reduce({}, :merge!)
 
         # in case there is no ansible_user defined, set "root" as default.
         ansible_vars['ansible_user'] = 'root' unless ansible_vars.key?('ansible_user')
+        ansible_vars['ansible_ssh_private_key_file'] = ansible_or_rex_ssh_private_key(foreman_host.host)
 
         children[ansible_group]['hosts'][foreman_host.host.name] = ansible_vars
       end
@@ -45,6 +46,29 @@ module ForemanAcd
 
     private
 
+    def get_param_value(host, value)
+      search_param = value.match(/PARAM\[([^\s]*)\]/)
+      return value if search_param.nil?
+
+      resolved_value = host.host_param(search_param[1])
+      logger.warn "Could not resolve ansible host param value #{value} for host #{host}" if resolved_value.nil?
+
+      resolved_value
+    end
+
+    def ansible_or_rex_ssh_private_key(host)
+      ansible_private_file = host_setting(host, 'ansible_ssh_private_key_file')
+      if !ansible_private_file.empty?
+        ansible_private_file
+      else
+        ForemanRemoteExecutionCore.settings[:ssh_identity_key_file]
+      end
+    end
+
+    def host_setting(host, setting)
+      host.params[setting] || Setting[setting]
+    end
+
     def inventory_all_vars
       JSON.parse(@app_instance.ansible_vars_all).map do |a|
         { a['name'] => a['value'] }

data/app/views/foreman_acd/ansible_playbooks/_form.html.erb

@@ -1,3 +1,39 @@
+<% content_for(:javascripts) do %>
+  <%= webpacked_plugins_js_for :foreman_acd %>
+<% end %>
+<% content_for(:stylesheets) do %>
+  <%= webpacked_plugins_css_for :foreman_acd %>
+<% end %>
+
+<%
+    if @ansible_playbook.new_record?
+    json = {
+      "scmTypes": {"directory" => "directory", "git" => "git"},
+      "mode": "newPlaybook",
+      "organization": current_organization,
+      "location": current_location,
+      "path": "",
+      "gitUrl": "",
+      "gitCommit": "",
+      "scmType": "",
+      "appDefinitions": [],
+    }
+
+    else
+      json = {
+      "scmTypes": {"directory" => "directory", "git" => "git"},
+      "mode": "editPlaybook",
+      "organization": current_organization,
+      "location": current_location,
+      "path": @ansible_playbook.path,
+      "gitUrl": @ansible_playbook.git_url,
+      "gitCommit": @ansible_playbook.git_commit,
+      "scmType": @ansible_playbook.scm_type,
+      "appDefinitions": @ansible_playbook.app_definitions
+      }
+    end
+%>
+
 <%= form_for @ansible_playbook, :url => (@ansible_playbook.new_record? ? ansible_playbooks_path : ansible_playbook_path(:id => @ansible_playbook.id)) do |f| %>
   <%= base_errors_for @ansible_playbook %>
 
@@ -13,18 +49,16 @@
 
   <div class="tab-content">
     <div class="tab-pane active" id="primary">
+    
       <%= text_f f, :name %>
       <%= text_f f, :description %>
-      <%= f.hidden_field :scm_type, :value => 'directory' %>
-      <% # TODO:
-         # select_f(f, :scm_type, %w[Directory GIT], :downcase, :to_s)
-      %>
-      <%= text_f f, :path, :required => true %>
+      <div id='ansible_playbook'>
+       <%= react_component('SyncGitRepo', :data => json,)  %>
+      </div>
       <%= text_f f, :playfile, :required => true %>
     </div>
-
+    
     <%= render 'taxonomies/loc_org_tabs', :f => f, :obj => @ansible_playbook %>
   </div>
-
   <%= submit_or_cancel f %>
 <% end %>

data/app/views/foreman_acd/app_definitions/_form.html.erb

@@ -24,6 +24,10 @@
   if @app_definition.ansible_vars_all.present?
     json["ansibleVarsAll"] = JSON.parse(@app_definition.ansible_vars_all)
   end
+
+   json["supportedPlugins"] = {}
+   json["supportedPlugins"]["puppet"] = defined?(ForemanPuppet) != nil
+   json["supportedPlugins"]["katello"] = defined?(Katello) != nil
 %>
 
 <%= form_for @app_definition, :url => (@app_definition.new_record? ? app_definitions_path : app_definition_path(:id => @app_definition.id)) do |f| %>
@@ -44,7 +48,7 @@
       <%= text_f f, :description %>
 
       <div id='app_definition'></div>
-      <%=  mount_react_component('ApplicationDefinition', "#app_definition", json.to_json) %>
+      <%=  react_component('ApplicationDefinition', :data => json) %>
     </div>
 
     <%= render 'taxonomies/loc_org_tabs', :f => f, :obj => @app_definition %>

data/app/views/foreman_acd/app_definitions/import.html.erb

@@ -1,3 +1,22 @@
+<%= javascript_include_tag *webpack_asset_paths('foreman_acd', extension: 'js') %>
+<%
+  json = {
+    "organization": current_organization,
+    "location": current_location,
+    "hostgroups": @hostgroups,
+    "foremanDataUrl": ui_acd_foreman_data_path("__id__"),
+    "ansibleDataUrl": ui_acd_ansible_data_path("__id__"),
+    "services": [],
+    "ansibleVarsAll": [],
+  }
+
+  if @app_definition.new_record?
+    json["mode"] = "newDefinition"
+  else
+    json["mode"] = "editDefinition"
+  end
+%>
+
 <% title _('Import Application Definition') %>
 
 <%= form_for @app_definition, :url => (app_definitions_path), :html => { :multipart => true } do |f| %>
@@ -10,7 +29,7 @@
     <div class="tab-pane active" id="primary">
       <%= text_f f, :name %>
       <%= text_f f, :description %>
-      <%= file_field_f f, :app_definition_file, :label_help => _("Application Definition file") %>
+      <%= react_component('ApplicationDefinitionImport', json,)  %>
     </div>
   </div>
 

data/app/views/foreman_acd/app_definitions/index.html.erb

@@ -1,15 +1,12 @@
 <% title _('Application Definitions') %>
 
-<% title_actions button_group(
-  new_link(_('New Application Definition')),
-  display_link_if_authorized(_("Import"), hash_for_import_app_definitions_path, :class => 'btn btn-default', :style => "display: none;") 
-) %>
+<% title_actions new_link(_('New Application Definition')), display_link_if_authorized(_("Import"), hash_for_import_app_definitions_path, :class => 'btn btn-default')  %>
 
 <table class="table table-bordered table-striped">
   <tr>
     <th><%= sort :name, :as => s_('AppDefinition|Name') %></th>
     <th><%= _('Description') %></th>
-    <th></th>
+    <th><%= _('Actions') %></th>
   </tr>
   <% for app_definition in @app_definitions %>
     <tr>
@@ -19,7 +16,7 @@
         <%= action_buttons(
           display_delete_if_authorized(hash_for_app_definition_path(:id => app_definition),
                                        :data => { 'confirm': _('Delete %s?') % app_definition.name }),
-          # TODO: add export feature again if app-def + ansible playbook can be exported together display_link_if_authorized(_("Export"), hash_for_export_app_definition_path(:id => app_definition))
+          display_link_if_authorized(_("Export"), hash_for_export_app_definition_path(:id => app_definition))
         ) %>
       </td>
     </tr>

data/app/views/foreman_acd/app_instances/_form.html.erb

@@ -24,6 +24,10 @@
         "ansibleVarsAll": @app_instance.ansible_vars_all.blank? ? [] : JSON.parse(@app_instance.ansible_vars_all),
       }
     end
+
+    json["supportedPlugins"] = {}
+    json["supportedPlugins"]["puppet"] = defined?(ForemanPuppet) != nil
+    json["supportedPlugins"]["katello"] = defined?(Katello) != nil
 %>
 
 <%= form_for @app_instance, :url => (@app_instance.new_record? ? app_instances_path : app_instance_path(:id => @app_instance.id)) do |f| %>
@@ -38,7 +42,7 @@
       <%= text_f f, :description %>
 
       <div id='app_instance'></div>
-        <%=  mount_react_component('ApplicationInstance', "#app_instance", json.to_json) %>
+        <%=  react_component('ApplicationInstance', :data => json) %>
       </div>
     </div>
   </div>