<%!-- Settings Form --%>

{gettext("System Configuration")}

<.form :let={_form} for={@changeset} id="settings_form" phx-submit="save_settings" phx-change="validate_settings" class="space-y-6" > <%!-- Hidden fields for required settings from Users page --%> <%!-- Use @saved_settings to preserve database values, not @settings which may have incorrect form state --%> <.section_header icon="hero-identification" title={gettext("Site Identity")} /> <%!-- Project Title Setting --%>

{gettext("Project Title")} {gettext("Application name display")} <.input name="settings[project_title]" type="text" value={@settings["project_title"]} class="focus:input-primary" placeholder={gettext("Enter project title")} phx-debounce="500" /> <.unsaved_hint dirty={@settings["project_title"] != @saved_settings["project_title"]} saved={@saved_settings["project_title"]} />

<%!-- Project Logo --%>

{gettext("Project Logo")} <%= if (@settings["auth_logo_file_uuid"] || "") != "" do %>

<% else %> <% end %>

{gettext( "Logo displayed across the application. Falls back to the site icon, then the project title text." )} <%= if (@settings["auth_logo_file_uuid"] || "") == "" && (@settings["site_icon_file_uuid"] || "") != "" do %> {gettext("Currently using the site icon.")} <% end %>

<%!-- Browser Tab: site icon + default tab title as one identity group, with a live browser-chrome preview (WordPress site-icon style). --%>

{gettext("Browser Tab")} {gettext("Site icon and tab title")} <%!-- The favicon defaults to the project logo when unset (and vice versa) — mirror that fallback so the preview shows what the browser will actually render. --%> <% preview_icon_uuid = if (@settings["site_icon_file_uuid"] || "") != "", do: @settings["site_icon_file_uuid"], else: @settings["auth_logo_file_uuid"] %>

<%!-- Live preview: tab strip. The title updates as you type (the form's phx-change refreshes @settings). --%>

<%= if (preview_icon_uuid || "") != "" do %>

<% else %> <.icon name="hero-globe-alt" class="w-4 h-4 text-base-content/30 shrink-0" /> <% end %> {if (@settings["default_tab_title"] || "") != "", do: @settings["default_tab_title"], else: @settings["project_title"] || "My Site"} <.icon name="hero-x-mark" class="w-3 h-3 text-base-content/40 shrink-0 ml-auto" />

<.icon name="hero-plus" class="w-3.5 h-3.5" />

<%!-- Address bar --%>

<.icon name="hero-arrow-left" class="w-3.5 h-3.5" /> <.icon name="hero-arrow-right" class="w-3.5 h-3.5" /> <.icon name="hero-arrow-path" class="w-3.5 h-3.5" />

<.icon name="hero-lock-closed" class="w-3 h-3 text-base-content/40 shrink-0" /> {site_host()}

<%!-- Controls --%>

<%= if (@settings["site_icon_file_uuid"] || "") != "" do %> {gettext("Site

<% else %>

{gettext("Square, at least 512×512 pixels.")} <%= if (@settings["auth_logo_file_uuid"] || "") != "" do %> {gettext("Currently using the project logo.")} <% end %>

<% end %>

{gettext("Default Tab Title")} <.input name="settings[default_tab_title]" type="text" value={@settings["default_tab_title"]} class="focus:input-primary" placeholder={@settings["project_title"] || gettext("e.g. Welcome to My Site")} phx-debounce="300" />

{gettext( "Shown when a page doesn't set its own title. Leave empty to use the project title." )}

{gettext( "The icon appears in browser tabs, bookmarks, and on phone home screens." )}

<.section_header icon="hero-globe-alt" title={gettext("Site Address")} /> <%!-- Site Address URL Setting --%>

{gettext("Site Address (URL)")} {gettext("Public base URL of this application")} <.input name="settings[site_url]" type="url" value={@settings["site_url"]} class="focus:input-primary" placeholder="https://site.com" phx-debounce="500" /> <.unsaved_hint dirty={@settings["site_url"] != @saved_settings["site_url"]} saved={ if @saved_settings["site_url"] != "", do: @saved_settings["site_url"], else: gettext("(empty)") } />

<.section_header icon="hero-adjustments-horizontal" title={gettext("Features")} /> <%!-- Notifications --%>

{gettext("Notifications")} {gettext("Per-user inbox driven by the activity feed")} <.checkbox name="settings[notifications_enabled]" checked={@settings["notifications_enabled"] == "true"} label={gettext("Enable user notifications")} > <:description> {gettext( "When on, users receive a bell notification whenever an activity targets them (e.g., their post is liked)." )} <%!-- Default notification destination (catch-all click target) --%> {gettext("Default notification link")} <.input type="text" name="settings[notification_default_link]" value={@settings["notification_default_link"] || "/dashboard"} placeholder="/dashboard" class="input-sm max-w-md" />

{gettext( "Where a notification opens when it has no link of its own. Defaults to /dashboard (every signed-in user can reach it). Clear the field to make such notifications non-clickable instead. The URL prefix and locale are added automatically." )}

<.section_header icon="hero-pencil-square" title={gettext("Content Editor")} />

<%!-- Default Editor Mode Setting --%>

{gettext("Default Editor Mode")} {gettext("Mode every content editor opens in")} <.select name="settings[editor_default_mode]" value={@settings["editor_default_mode"]} options={@setting_options["editor_default_mode"]} class="focus-within:select-primary" />

{gettext( "Applies site-wide wherever the rich-text editor is rendered (posts, comments). Users can still switch modes inside the editor." )}

<.unsaved_hint dirty={@settings["editor_default_mode"] != @saved_settings["editor_default_mode"]} saved={ get_option_label( @saved_settings["editor_default_mode"], @setting_options["editor_default_mode"] ) } />

<.section_header icon="hero-clock" title={gettext("Date & Time")} />

<%!-- Week Start Day Setting --%>

{gettext("Week Start On")} {gettext("First day of the week")} <.select name="settings[week_start_day]" value={@settings["week_start_day"]} options={@setting_options["week_start_day"]} class="focus-within:select-primary" /> <.unsaved_hint dirty={@settings["week_start_day"] != @saved_settings["week_start_day"]} saved={ get_option_label( @saved_settings["week_start_day"], @setting_options["week_start_day"] ) } />

<%!-- Time Zone Setting --%>

{gettext("Time Zone")} {gettext("System default timezone")} <.select name="settings[time_zone]" value={@settings["time_zone"]} options={@setting_options["time_zone"]} class="focus-within:select-primary" /> <.unsaved_hint dirty={@settings["time_zone"] != @saved_settings["time_zone"]} saved={get_timezone_label(@saved_settings["time_zone"], @setting_options)} />

<%!-- Date Format Setting --%>

{gettext("Date Format")} {gettext("How dates are displayed")} <.select name="settings[date_format]" value={@settings["date_format"]} options={@setting_options["date_format"]} class="focus-within:select-primary" />

{gettext("Example:")} {get_current_date_example(@settings["date_format"])}

<.unsaved_hint dirty={@settings["date_format"] != @saved_settings["date_format"]} saved={ get_option_label( @saved_settings["date_format"], @setting_options["date_format"] ) } />

<%!-- Time Format Setting --%>

{gettext("Time Format")} {gettext("How times are displayed")} <.select name="settings[time_format]" value={@settings["time_format"]} options={@setting_options["time_format"]} class="focus-within:select-primary" />

{gettext("Example:")} {get_current_time_example(@settings["time_format"])}

<.unsaved_hint dirty={@settings["time_format"] != @saved_settings["time_format"]} saved={ get_option_label( @saved_settings["time_format"], @setting_options["time_format"] ) } />

<%!-- Action Buttons --%>

<%!-- Footnote --%>

<.icon name="hero-information-circle" class="w-4 h-4 shrink-0 mt-0.5" />

{gettext( "Changes apply system-wide after \"Save All Settings\". Registration and user defaults are managed on the Users page." )}