<%# locals: (rule:) %>

<div class="flex justify-between items-center gap-4 bg-white shadow-border-xs rounded-md p-4">
  <div class="text-sm space-y-1.5">
    <% if rule.conditions.any? %>
      <p class="flex items-center flex-wrap gap-1.5">
        <span class="px-2 py-1 border border-alpha-black-200 rounded-full">
          <% if rule.conditions.first.compound? %>
            If <%= rule.conditions.first.sub_conditions.first.filter.label %> <%= rule.conditions.first.sub_conditions.first.operator %> <%= rule.conditions.first.sub_conditions.first.value_display %>
          <% else %>
            If <%= rule.conditions.first.filter.label %> <%= rule.conditions.first.operator %> <%= rule.conditions.first.value_display %>
          <% end %>
        </span>

        <% if rule.conditions.count > 1 %>
          and <%= rule.conditions.count - 1 %> more <%= rule.conditions.count - 1 == 1 ? "condition" : "conditions" %>
        <% end %>
      </p>
    <% end %>

    <p class="flex items-center flex-wrap gap-1.5">
      <span class="px-2 py-1 border border-alpha-black-200 rounded-full">
        <% if rule.actions.first.value && rule.actions.first.options %>
          <%= rule.actions.first.executor.label %> to <%= rule.actions.first.value_display %>
        <% else %>
          <%= rule.actions.first.executor.label %>
        <% end %>
      </span>

      <% if rule.actions.count > 1 %>
        and <%= rule.actions.count - 1 %> more <%= rule.actions.count - 1 == 1 ? "action" : "actions" %>
      <% end %>
    </p>

    <p class="flex items-center flex-wrap gap-1.5">
      <% if rule.effective_date.nil? %>
        To all past and future <%= rule.resource_type.pluralize %>
      <% else %>
        To all <%= rule.resource_type.pluralize %> on or after <%= rule.effective_date %>
      <% end %>
    </p>
  </div>

  <div class="flex items-center gap-4">
    <%= styled_form_with model: rule, data: { controller: "auto-submit-form" } do |f| %>
      <%= f.toggle :active, { data: { auto_submit_form_target: "auto" } } %>
    <% end %>

    <%= render MenuComponent.new do |menu| %>
      <% menu.with_item(variant: "link", text: "Edit", href: edit_rule_path(rule), icon: "pencil", data: { turbo_frame: "modal" }) %>
      <% menu.with_item(variant: "link", text: "Re-apply rule", href: confirm_rule_path(rule), icon: "refresh-cw", data: { turbo_frame: "modal" }) %>
      <% menu.with_item(
        variant: "button",
        text: "Delete",
        href: rule_path(rule),
        icon: "trash-2",
        method: :delete,
        confirm: CustomConfirm.for_resource_deletion("rule")) %>
    <% end %>
  </div>
</div>
