mirror of
https://github.com/we-promise/sure.git
synced 2026-04-09 07:14:47 +00:00
868a0ae4d8
* Add family moniker selection and dynamic UI labels Introduce a Family moniker persisted in the database with allowed values Family/Group, add required onboarding selection for it, and thread moniker-aware copy through key user-facing views and locales. Also add helper methods and tests for onboarding form presence and family moniker behavior. * Small copy edits/change moniker question order * Conditional Group/Family onboarding flow fixes * Fix label * Grouping of fields * Profile Info page Group/Family changes * Only admins can change Group/Family moniker * Repetitive defaults * Moniker in Account model * Moniker in User model * Auth fix * Sure product is also a moniker --------- Signed-off-by: Juan José Mata <juanjo.mata@gmail.com>
96 lines
4.2 KiB
Plaintext
96 lines
4.2 KiB
Plaintext
<%
|
|
header_title @invitation ? t(".join_family_title", family: @invitation.family.name, moniker: @invitation.family.moniker_label) : t(".title")
|
|
%>
|
|
|
|
<% if self_hosted_first_login? %>
|
|
<div class="fixed inset-0 w-full h-fit bg-container p-5 border-b border-secondary flex flex-col gap-3 items-center text-center mb-12">
|
|
<h2 class="font-bold text-primary text-xl"><%= t(".welcome_title", product_name: product_name) %></h2>
|
|
<p class="text-secondary text-secondary text-sm"><%= t(".welcome_body") %></p>
|
|
</div>
|
|
<% elsif @invitation %>
|
|
<div class="space-y-1 mb-6 text-center">
|
|
<p class="text-secondary">
|
|
<%= t(".invitation_message",
|
|
inviter: @invitation.inviter.display_name,
|
|
role: t(".role_#{@invitation.role}", default: @invitation.role.to_s.humanize.downcase)) %>
|
|
</p>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if @user.errors.present? %>
|
|
<div class="text-red-600 flex items-center gap-2">
|
|
<%= icon("circle-alert") %>
|
|
<p class="text-sm"><%= @user.errors.full_messages.to_sentence %></p>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%= styled_form_with model: @user, url: registration_path, class: "space-y-4" do |form| %>
|
|
<%= form.email_field :email,
|
|
autofocus: false,
|
|
autocomplete: "email",
|
|
required: "required",
|
|
placeholder: "you@example.com",
|
|
label: true,
|
|
disabled: @invitation.present? %>
|
|
|
|
<% if invite_code_required? && !@invitation %>
|
|
<%= form.text_field :invite_code, required: "required", label: true, value: params[:invite] %>
|
|
<% end %>
|
|
|
|
<%= form.hidden_field :invitation, value: @invitation&.token %>
|
|
|
|
<div data-controller="password-validator">
|
|
<div data-controller="password-visibility" class="relative">
|
|
<%= form.password_field :password,
|
|
autocomplete: "new-password",
|
|
required: "required",
|
|
placeholder: t(".password_placeholder"),
|
|
label: true,
|
|
maxlength: 72,
|
|
data: {
|
|
password_validator_target: "input",
|
|
password_visibility_target: "input",
|
|
action: "input->password-validator#validate"
|
|
} %>
|
|
<button type="button"
|
|
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-700 focus:outline-none"
|
|
data-action="click->password-visibility#toggle">
|
|
<div data-password-visibility-target="showIcon">
|
|
<%= icon("eye") %>
|
|
</div>
|
|
<div data-password-visibility-target="hideIcon">
|
|
<%= icon("eye-off") %>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="flex gap-4 my-4">
|
|
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="length"></div>
|
|
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="case"></div>
|
|
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="number"></div>
|
|
<div class="h-1 bg-gray-200 rounded-full flex-grow" data-password-validator-target="blockLine" data-requirement-type="special"></div>
|
|
</div>
|
|
|
|
<div class="space-y-1 my-4">
|
|
<div class="flex items-center gap-2 text-secondary text-sm" data-password-validator-target="requirementType" data-requirement-type="length">
|
|
<%= icon("check", size: "sm") %>
|
|
<span><%= t(".password_requirements.length") %></span>
|
|
</div>
|
|
<div class="flex items-center gap-2 text-secondary text-sm" data-password-validator-target="requirementType" data-requirement-type="case">
|
|
<%= icon("check", size: "sm") %>
|
|
<span><%= t(".password_requirements.case") %></span>
|
|
</div>
|
|
<div class="flex items-center gap-2 text-secondary text-sm" data-password-validator-target="requirementType" data-requirement-type="number">
|
|
<%= icon("check", size: "sm") %>
|
|
<span><%= t(".password_requirements.number") %></span>
|
|
</div>
|
|
<div class="flex items-center gap-2 text-secondary text-sm" data-password-validator-target="requirementType" data-requirement-type="special">
|
|
<%= icon("check", size: "sm") %>
|
|
<span><%= t(".password_requirements.special") %></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<%= form.submit t(".submit") %>
|
|
<% end %>
|