<%=
  component_wrapper(data: wrapper_data_attributes) do
    flex_layout(mb: 3) do |flex|
      flex.with_row(classes: 'dragula-container', id: insert_target_modifier_id, data: { 'allowed-drop-type': 'section' }.merge(drop_target_config) ) do
        first_and_last = [@meeting.sections.first, @meeting.sections.last]
        render(
          MeetingSections::ShowComponent.with_collection(
            @meeting.sections,
            first_and_last:
          )
        )
      end
      if @meeting.agenda_items.empty? && @meeting.sections.empty?
        flex.with_row do
          render(border_box_container) do |border_box|
            if @form_hidden
              border_box.with_body(
                scheme: :default
              ) do
                render(Primer::Beta::Blankslate.new) do |component|
                  component.with_visual_icon(icon: :book)
                  component.with_heading(tag: :h2).with_content(t("text_meeting_empty_heading"))
                  component.with_description do
                    flex_layout do |flex|
                      flex.with_row(mb: 2) do
                        render(Primer::Beta::Text.new(color: :subtle)) { t("text_meeting_empty_description_1") }
                      end
                      flex.with_row do
                        render(Primer::Beta::Text.new(color: :subtle)) { t("text_meeting_empty_description_2") }
                      end
                    end
                  end
                end
              end
            end
            border_box.with_row(p: 0, border_top: 0) do
              render(MeetingAgendaItems::NewComponent.new(meeting: @meeting, hidden: @form_hidden, type: @form_type))
            end
          end
        end
      end
    end
  end
%>