gitcoinco/code_fund_ads

<%= render CardComponent.new do %>
  <%= render Card::BodyComponent.new do %>
    <%= form_tag images_path(imageable.to_gid_param), method: :post, multipart: true,
      data: {
      remote: true,
      success_url: images_path(imageable.to_gid_param),
      controller: "image-uploader",
      action: [
        "ajax:success@document->image-uploader#redirect",
        "direct-uploads:start@document->image-uploader#showUploadsStarted",
        "direct-upload:progress@document->image-uploader#showUploadProgress",
      ].join(" ")
    } do %>
      <%= file_field_tag "imageable[images][]", hidden: true,
            accept: ".jpg,.gif,.png,.svg", multiple: true, direct_upload: true,
            data: {target: "image-uploader.input", action: "change->image-uploader#upload"} %>
      <%= submit_tag "Submit", hidden: true, data: {target: "image-uploader.submitButton"} %>
      <div class="text-center">
        <h5 class="mb-0">Upload Images</h2>
        <p>Click on the button below to choose one or more images</p>
        <%= link_to "Select Images", "#",
              class: "btn btn-sm btn-primary mt-3",
              data: {
                target: "image-uploader.chooseButton",
                action: "click->image-uploader#choose",
                disable_with: "Uploading Images..."
              } %>
        <%= link_to "Cancel", images_path(imageable.to_gid_param), class: "btn btn-sm btn-light mt-3 ml-2" %>
      </div>
      <div hidden class="col-12 mt-3" data-target="image-uploader.progressBarTemplate">
        <div style="height: 32px; padding: 1px;" class="progress border border-primary bg-white">
          <div style="width: 0%; height: 28px; white-space: nowrap; border-radius: 3px;" role="progressbar" class="progress-bar">
            filename.jpg 34%
          </div>
        </div>
      </div>
    <% end %>
  <% end %>
<% end %>