DRY view components in Rails views - ruby-on-rails

Question

I want to create abstract components for my views, that don't disclose the way they will be rendered.
The example is an tabbed nav box like the tabs from bootstrap
In my view I want to write s.th. like:
= tab_section(self) do
- tab 'tab1' do
%p tab1 content
= link_to example_var, "#top"
- tab 'tab2' do
%p tab2 content
= link_to 'http://example.com', "#top"
which should then be rendered to s.th. like this:
<ul>
<li>tab1</li>
<li>tab2</li>
</ul>
<div class='content'>
<div class='tab'>
<p>tab1 content</p>
<a href='#top'>this could also be an #var from the controller</a>
</div>
<div class='tab'>
<p>tab2 content</p>
<a href='#top'>http://example.com</a>
</div>
</div>
All my attempts to defer rendering of the tab 'content' failed. I created a minimal rails app demonstrating the three approaches I took.
Take a look at the application_helper.rb and the welcome#show view.
What is the correct way to do such thing?

Answer 1

I got some support and found the following solution:
The outer 'component' must be passed into the block to call the inner function upon:
= tab_section2 do |section|
- section.tab 'tab1' do
%p tab1 content
= link_to example_var, "#top"
- section.tab 'tab2' do
%p tab2 content
= link_to 'http://example.com', "#top"
Since we don't need to bind the block to the tab_section instance (previously done with instance_exec), we can yield the block directly.
def tab_section2(&blk)
raise "Y U NO SUPPLY block?" unless block_given?
ts = TabSection2.new(self, self)
yield(ts)
render :partial => '/tab2', locals: {section: ts}
end
The partial renders the output of the tabs render function:
%ul
- section.tabs.each do |tab|
%li= tab.name
.content
- section.tabs.each do |tab|
.tab
= tab.render.html_safe
Which is implemented as follows:
class Tab2
attr_reader :name, :blk
def initialize(name, context, &blk)
#context = context
#name = name
#blk = blk
end
def render
#context.capture_haml(&#blk)
end
end
class TabSection2
attr_reader :tabs
def initialize(context)
#context = context
#tabs = []
end
def tab(name, &blk)
raise "Y U NO SUPPLY block?" unless block_given?
#tabs << Tab2.new(name, #context, &blk)
end
end