Packages
phoenix_kit
1.7.69
1.7.210
1.7.209
1.7.208
1.7.207
1.7.206
1.7.205
1.7.204
1.7.203
1.7.202
1.7.201
1.7.200
1.7.199
1.7.198
1.7.197
1.7.196
1.7.194
1.7.193
1.7.192
1.7.191
1.7.190
1.7.189
1.7.187
1.7.186
1.7.185
1.7.184
1.7.183
1.7.182
1.7.181
1.7.180
1.7.179
1.7.178
1.7.177
1.7.176
1.7.175
1.7.174
1.7.173
1.7.172
1.7.171
1.7.170
1.7.169
1.7.168
1.7.167
1.7.166
1.7.165
1.7.164
1.7.162
1.7.161
1.7.160
1.7.159
1.7.157
1.7.156
1.7.155
1.7.154
1.7.153
1.7.152
1.7.151
1.7.150
1.7.149
1.7.146
1.7.145
1.7.144
1.7.143
1.7.138
1.7.133
1.7.132
1.7.131
1.7.130
1.7.128
1.7.126
1.7.125
1.7.121
1.7.120
1.7.119
1.7.118
1.7.117
1.7.116
1.7.115
1.7.114
1.7.113
1.7.112
1.7.111
1.7.110
1.7.109
1.7.108
1.7.107
1.7.106
1.7.105
1.7.104
1.7.103
1.7.102
1.7.101
1.7.100
1.7.99
1.7.98
1.7.97
1.7.96
1.7.95
1.7.94
1.7.93
1.7.92
1.7.91
1.7.90
1.7.89
1.7.88
1.7.87
1.7.86
1.7.85
1.7.84
1.7.83
1.7.82
1.7.81
1.7.80
1.7.79
1.7.78
1.7.77
1.7.76
1.7.75
1.7.74
1.7.71
1.7.70
1.7.69
1.7.66
1.7.65
1.7.64
1.7.63
1.7.62
1.7.61
1.7.59
1.7.58
1.7.57
1.7.56
1.7.55
1.7.54
1.7.53
1.7.52
1.7.51
1.7.49
1.7.44
1.7.43
1.7.42
1.7.41
1.7.39
1.7.38
1.7.37
1.7.36
1.7.34
1.7.33
1.7.31
1.7.30
1.7.29
1.7.28
1.7.27
1.7.26
1.7.25
1.7.24
1.7.23
1.7.22
1.7.21
1.7.20
1.7.19
1.7.18
1.7.17
1.7.16
1.7.15
1.7.14
1.7.13
1.7.12
1.7.11
1.7.10
1.7.9
1.7.8
1.7.7
1.7.6
1.7.5
1.7.4
1.7.3
1.7.2
1.7.1
1.7.0
1.6.20
1.6.19
1.6.18
1.6.17
1.6.16
1.6.15
1.6.14
1.6.13
1.6.12
1.6.11
1.6.10
1.6.9
1.6.8
1.6.7
1.6.6
1.6.5
1.6.4
1.6.3
1.5.2
1.5.1
1.5.0
1.4.9
1.4.8
1.4.7
1.4.6
1.4.5
1.4.4
1.4.3
1.4.2
1.4.1
1.4.0
1.3.2
1.3.1
1.3.0
1.2.10
1.2.9
1.2.8
1.2.7
1.2.5
1.2.4
1.2.2
1.2.1
1.2.0
1.1.0
1.0.0
A foundation for building Elixir Phoenix apps — SaaS, social networks, ERP systems, marketplaces, and more
Current section
Files
Jump to
Current section
Files
lib/modules/newsletters/web/broadcast_editor.html.heex
<PhoenixKitWeb.Components.LayoutWrapper.app_layout
flash={@flash}
phoenix_kit_current_scope={assigns[:phoenix_kit_current_scope]}
page_title={@page_title}
current_path={@url_path}
project_title={@project_title}
>
<div class="container flex-col mx-auto px-4 py-6">
<.admin_page_header
back={Routes.path("/admin/newsletters/broadcasts")}
title={@page_title}
subtitle="Compose and send a broadcast email to your newsletter list"
/>
<form id="broadcast-form" phx-change="validate" phx-submit="save_draft">
<div class="grid grid-cols-1 xl:grid-cols-2 gap-6">
<%!-- Left: Editor --%>
<div class="space-y-4">
<%!-- Subject --%>
<fieldset class="fieldset">
<label class="label">Subject</label>
<input
type="text"
name="subject"
value={@subject}
placeholder="Enter email subject..."
class="input w-full"
/>
</fieldset>
<%!-- List selector --%>
<fieldset class="fieldset">
<label class="label">Newsletter List</label>
<select name="list_uuid" class="select w-full">
<option value="">Select a list...</option>
<option :for={list <- @lists} value={list.uuid} selected={@list_uuid == list.uuid}>
{list.name} ({list.subscriber_count} subscribers)
</option>
</select>
</fieldset>
<%!-- Template selector --%>
<fieldset class="fieldset">
<label class="label">Email Template</label>
<select name="template_uuid" class="select w-full">
<option value="">No template (plain markdown)</option>
<option
:for={template <- @templates}
value={template.uuid}
selected={@template_uuid == template.uuid}
>
{PhoenixKit.Modules.Emails.Template.get_translation(template.display_name, "en") ||
template.name}
</option>
</select>
</fieldset>
<%!-- Markdown Editor --%>
<fieldset class="fieldset">
<label class="label">Content (Markdown)</label>
<.live_component
module={PhoenixKitWeb.Components.Core.MarkdownEditor}
id="broadcast-editor"
content={@markdown_content}
save_status={:saved}
show_formatting_toolbar={true}
protect_navigation={false}
height="400px"
placeholder="Write your broadcast content in Markdown..."
/>
</fieldset>
<%!-- Actions --%>
<div class="flex flex-col sm:flex-row gap-3 pt-2">
<button type="submit" class="btn btn-outline btn-sm" disabled={@saving}>
<%= if @saving do %>
<span class="loading loading-spinner loading-xs"></span>
<% end %>
Save Draft
</button>
<button
type="button"
phx-click="send_now"
class="btn btn-primary btn-sm"
disabled={@saving or @subject == "" or @list_uuid == ""}
>
<.icon name="hero-paper-airplane" class="w-4 h-4" /> Send Now
</button>
<div class="flex items-center gap-2 ml-auto">
<input
type="datetime-local"
name="scheduled_at"
value={@scheduled_at}
class="input input-sm"
/>
<button
type="button"
phx-click="schedule"
class="btn btn-secondary btn-sm"
disabled={@saving or @scheduled_at == "" or @subject == "" or @list_uuid == ""}
>
<.icon name="hero-clock" class="w-4 h-4" /> Schedule
</button>
</div>
</div>
</div>
<%!-- Right: Preview --%>
<div>
<label class="label">Preview</label>
<div
class="border border-base-300 rounded-lg overflow-hidden bg-white"
style="height: 580px;"
>
<%= if @preview_html != "" do %>
<iframe
srcdoc={@preview_html}
class="w-full h-full border-0"
sandbox="allow-same-origin"
>
</iframe>
<% else %>
<div class="flex items-center justify-center h-full text-base-content/40">
<div class="text-center">
<.icon name="hero-eye" class="w-10 h-10 mx-auto mb-2 opacity-40" />
<p class="text-sm">Preview will appear here as you type</p>
</div>
</div>
<% end %>
</div>
</div>
</div>
</form>
</div>
</PhoenixKitWeb.Components.LayoutWrapper.app_layout>