1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-09 23:45:21 +02:00

Allow CSV file upload in import flow (#986)

* Add .tool-versions to gitignore

* Add dropzone js for drag and drop file uploads

* UI for csv file uploads for import

* dropzone controller and use lucide_icon instead of svg

* Preview for file chosen

* File upload

* Remove dropzone

* Normalize I18n keys and fix lint issues

* Add system tests

* Cleanup

* Remove unwanted
This commit is contained in:
Tony Vincent 2024-07-16 15:23:45 +02:00 committed by GitHub
parent 41f9e23f8c
commit cdbca5aff3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 307 additions and 41 deletions

View file

@ -8,33 +8,18 @@
<p class="text-gray-500 text-sm"><%= t(".description") %></p>
</div>
<%= form_with model: @import, url: load_import_path(@import) do |form| %>
<div>
<%= form.text_area :raw_csv_str,
rows: 10,
required: true,
placeholder: "Paste your CSV file contents here",
class: "rounded-md w-full border text-sm border-alpha-black-100 bg-white placeholder:text-gray-400 p-4" %>
</div>
<%= form.submit t(".next"), class: "px-4 py-2 block w-full rounded-lg bg-gray-900 text-white text-sm font-medium cursor-pointer hover:bg-gray-700", data: { turbo_confirm: (@import.raw_csv_str? ? { title: t(".confirm_title"), body: t(".confirm_body"), accept: t(".confirm_accept") } : nil) } %>
<% end %>
<div class="bg-alpha-black-25 rounded-xl p-1">
<div class="text-gray-500 p-2 mb-2">
<div class="flex gap-2 mb-2">
<%= lucide_icon("info", class: "w-5 h-5 shrink-0") %>
<p class="text-sm"><%= t(".instructions") %></p>
<div data-controller="tabs" data-tabs-active-class="bg-white" data-tabs-default-tab-value="csv-upload-tab">
<div class="flex justify-center mb-4">
<div class="bg-gray-50 rounded-lg inline-flex p-1 space-x-2 text-sm text-gray-900 font-medium">
<button data-id="csv-upload-tab" class="p-2 rounded-lg" data-tabs-target="btn" data-action="click->tabs#select">Upload CSV</button>
<button data-id="csv-paste-tab" class="p-2 rounded-lg" data-tabs-target="btn" data-action="click->tabs#select">Copy & Paste</button>
</div>
<ul class="list-disc text-sm pl-10">
<li><%= t(".requirement1") %></li>
<li><%= t(".requirement2") %></li>
<li><%= t(".requirement3") %></li>
</ul>
</div>
<%= render partial: "imports/sample_table" %>
<div data-tabs-target="tab" id="csv-upload-tab">
<%= render partial: "imports/csv_upload", locals: { import: @import } %>
</div>
<div data-tabs-target="tab" id="csv-paste-tab" class="hidden">
<%= render partial: "imports/csv_paste", locals: { import: @import } %>
</div>
</div>
</div>