Packages

phoenix_kit

1.7.80
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
phoenix_kit lib modules posts web group_edit.html.heex
Raw

lib/modules/posts/web/group_edit.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 flex-col mx-auto px-4 py-6">
<%!-- Header Section --%>
<.admin_page_header back={Routes.path("/admin/posts/groups")}>
<h1 class="text-xl sm:text-2xl lg:text-3xl font-bold text-base-content">{@page_title}</h1>
<p class="text-sm text-base-content/60 mt-0.5">
<%= if @group.uuid do %>
Edit your group details and settings
<% else %>
Create a new collection to organize your posts
<% end %>
</p>
</.admin_page_header>
<%!-- Main Content --%>
<div class="max-w-3xl mx-auto">
<div class="card bg-base-100 shadow-xl">
<div class="card-body">
<.form
for={@form}
id="group-form"
phx-change="validate"
phx-submit="save"
class="space-y-6"
>
<%!-- Group Name --%>
<div class="form-control">
<label class="label">
<span class="label-text font-medium">Group Name *</span>
</label>
<.input
field={@form[:name]}
type="text"
placeholder="e.g., Product Updates, Travel Photos, Recipes"
required
/>
<label class="label">
<span class="label-text-alt text-base-content/70">
A descriptive name for this collection
</span>
</label>
</div>
<%!-- Description --%>
<div class="form-control">
<label class="label">
<span class="label-text font-medium">Description</span>
</label>
<.textarea
field={@form[:description]}
placeholder="Optional description of what this group contains..."
rows="3"
/>
<label class="label">
<span class="label-text-alt text-base-content/70">
Help yourself remember what this group is for
</span>
</label>
</div>
<%!-- Slug --%>
<div class="form-control">
<label class="label">
<span class="label-text font-medium">URL Slug *</span>
</label>
<.input
field={@form[:slug]}
type="text"
placeholder="auto-generated-from-name"
required
/>
<label class="label">
<span class="label-text-alt text-base-content/70">
URL-friendly identifier. Leave empty to auto-generate from name.
</span>
</label>
<%!-- Slug Format Help --%>
<div class="alert alert-info mt-2">
<.icon name="hero-information-circle" class="w-5 h-5" />
<div class="text-sm">
<p class="font-semibold mb-1">Slug Format:</p>
<p class="text-xs">
Only lowercase letters, numbers, and hyphens. Must be unique among your groups.
</p>
<div class="mt-2 space-y-1">
<p class="text-xs text-success">
✓ Valid: <code>my-collection</code>, <code>photos-2025</code>,
<code>recipes</code>
</p>
<p class="text-xs text-error">
✗ Invalid: <code>My Collection</code>, <code>photos_2025</code>,
<code>-recipes</code>
</p>
</div>
</div>
</div>
</div>
<%!-- Visibility --%>
<div class="form-control">
<label class="label">
<span class="label-text font-medium">Visibility</span>
</label>
<.select
field={@form[:visibility]}
options={[
{"Public - Visible to everyone", "public"},
{"Private - Only visible to you", "private"}
]}
/>
<label class="label">
<span class="label-text-alt text-base-content/70">
Control who can see this group and its posts
</span>
</label>
</div>
<%!-- Info Box for Existing Group --%>
<%= if @group.uuid do %>
<div class="alert">
<.icon name="hero-information-circle" class="w-5 h-5" />
<div class="text-sm">
<p class="font-semibold">Editing Existing Group</p>
<p class="text-xs mt-1">
Created on {Calendar.strftime(@group.inserted_at, "%B %d, %Y")}
</p>
</div>
</div>
<% end %>
<%!-- Action Buttons --%>
<div class="flex flex-col sm:flex-row gap-4 justify-end">
<button
type="button"
phx-click="cancel"
class="btn btn-ghost btn-outline"
>
<.icon name="hero-x-mark" class="w-4 h-4 mr-2" /> Cancel
</button>
<button
type="submit"
class="btn btn-primary"
phx-disable-with="Saving..."
>
<.icon name="hero-check" class="w-4 h-4 mr-2" />
{if @group.uuid, do: "Update Group", else: "Create Group"}
</button>
</div>
</.form>
</div>
</div>
</div>
</div>
</PhoenixKitWeb.Components.LayoutWrapper.app_layout>