<% due_date_editable = can_update_my_module_due_date?(my_module) %>

<span class="date-text" data-editable="<%= due_date_editable %>">
  <span id="dueDateLabelContainer" class="view-block">
    <%= render partial: "due_date_label" , locals: { my_module: my_module, due_date_editable: due_date_editable  } %>
  </span>
  <% if due_date_editable %>
    <div class="datetime-picker-container" id="due-date">
      <div id="calendarDueDateContainer">
        <input type="hidden" ref="input" v-model="date" data-simple-format="true" id="calendarDueDate" data-default="<%= l(my_module.due_date, format: :default) if my_module.due_date %>
        " />
        <date-time-picker class="w-full" ref="vueDateTime" :teleport="false" @change="updateDate" value-type="stringWithoutTimezone" mode="datetime" :placeholder="'<%= t('my_modules.details.no_due_date_placeholder') %>'"></date-time-picker>
      </div>
      <span class="sn-icon sn-icon-close clear-date" data-toggle='clear-date-time-picker' data-target='calendarDueDate'></span>
    </div>
  <% end %>
</span>
