Media

Manage user media and uploads

<%!-- Upload Section (Hidden by default) --%> <%= if @show_upload do %>

Upload Media

<%= if @has_buckets do %>

Upload images, videos, or PDFs. Files are automatically processed and optimized.

<.file_upload upload={@uploads.media_files} label="Upload Media Files" icon="hero-cloud-arrow-up" accept_description="JPG, PNG, WebP, MP4, WebM, PDF" max_size_description="100MB per file" /> <% else %>

<.icon name="hero-exclamation-triangle" class="stroke-current shrink-0 h-6 w-6" />

No Storage Buckets Configured

You need to configure at least one storage bucket before you can upload files. <.link navigate={PhoenixKit.Utils.Routes.path("/admin/settings/media")} class="link link-primary font-semibold" > Configure Storage Buckets

<% end %>

<% end %> <%!-- Uploaded Files --%> <%= if @total_count > 0 do %>

Uploaded Files ({@total_count})

<%= unless @show_upload do %> <% end %>

<.pagination_info page={@current_page} per_page={@per_page} total_count={@total_count} />

<%= for file <- @uploaded_files do %> <.link navigate={PhoenixKit.Utils.Routes.path("/admin/media/#{file.file_id}")} class="group relative aspect-square bg-base-300 rounded-lg overflow-hidden cursor-pointer hover:shadow-lg transition-shadow" > <% image_url = if file.file_type == "video" do file.urls["video_thumbnail"] else file.urls["medium"] || file.urls["thumbnail"] || file.urls["original"] end %> <%= if image_url do %> {file.filename}

<% else %>

<.icon name={file_icon(file.file_type)} class="w-12 h-12 mb-2" />

{String.upcase(file.file_type)}

<% end %> <%!-- Video indicator icon --%> <%= if file.file_type == "video" do %>

<.icon name="hero-play-solid" class="w-4 h-4" />

<% end %> <%!-- File size in corner --%>

{format_file_size(file.size)}

<% end %>

<%!-- Pagination Controls --%> <%= if @total_count > @per_page do %> <.pagination current_page={@current_page} total_pages={@total_pages} base_path={@url_path} /> <% end %>

<% else %>

Uploaded Files

No media uploaded yet. Upload your first file above!

<% end %>