shift73k/lib/shift73k_web/live/shift_import_live/index.html.leex

71 lines
2.7 KiB
Plaintext

<div class="row justify-content-center">
<div class="col-12 col-md-10 col-xl-8">
<h2>
<%= icon_div @socket, "bi-box-arrow-in-left", [class: "icon baseline"] %>
Import Shifts
</h2>
<p class="lead">If you have an iCal/ics formatted calendar hosted elsewhere, provide its URL here to import its events.</p>
<div class="row justify-content-center">
<div class="col-12 col-sm-11 col-md-10 col-lg-9 col-xxl-8">
<%= form_for :ics_import, "#", [phx_change: "validate", phx_submit: "save"], fn iimf -> %>
<% show_url_error = @url_validated && !@url_valid || false %>
<% valid_class = @url_validated && "is-valid" || "" %>
<%= label iimf, :ics_url, "iCal/ics URL", class: "form-label" %>
<div class="inner-addon left-addon mb-3">
<%= icon_div @socket, "bi-link", [class: "icon is-left text-muted fs-5"] %>
<%= url_input iimf, :ics_url,
class: show_url_error && "form-control is-invalid" || "form-control #{valid_class}",
phx_debounce: 500,
aria_describedby: "ics-import-url-error"
%>
<%= if show_url_error do %>
<div class="invalid-feedback d-block" id="ics-import-url-error">
Must be a valid URL
</div>
<% end %>
</div>
<%= label iimf, :time_zone, class: "form-label" %>
<div class="inner-addon left-addon mb-3">
<%= icon_div @socket, "bi-map", [class: "icon is-left text-muted fs-5"] %>
<%= text_input iimf, :time_zone,
value: Shift73k.app_time_zone(),
class: @tz_valid && "form-control" || "form-control is-invalid",
phx_debounce: 250,
aria_describedby: "ics-import-tz-error",
list: "tz_list"
%>
<datalist id="tz_list">
<%= for tz_name <- Tzdata.zone_list() do %>
<option value="<%= tz_name %>"></option>
<% end %>
</datalist>
<div class="valid-feedback d-block text-primary">Type to search & select from list of known <%= link "IANA tz database", to: "https://en.wikipedia.org/wiki/List_of_tz_database_time_zones", target: "_blank" %> time zones</div>
<%= if !@tz_valid do %>
<div class="invalid-feedback d-block" id="ics-import-tz-error">
Invalid time zone
</div>
<% end %>
</div>
<div class="row">
<div class="col mb-3 text-end">
<%= submit "Submit", class: "btn btn-primary", disabled: !@tz_valid || !@url_valid %>
</div>
</div>
<% end %>
</div>
</div>
</div>
</div>