<.admin_page_header back={PhoenixKit.Utils.Routes.path("/admin/modules")} title={gettext("Media Settings")} subtitle={ gettext( "Media is a core system module that is always enabled and cannot be disabled — it provides essential file management functionality across PhoenixKit. Configure its storage buckets and file processing settings here." ) } /> <%!-- System Dependencies Check --%> <%= if match?({:error, :not_installed}, @imagemagick_status) do %>

<.icon name="hero-exclamation-circle" class="w-5 h-5" />

{gettext("ImageMagick Not Installed")}

{gettext("ImageMagick is required for image processing and variant generation.")} {gettext("Without it, image resizing, cropping, and format conversion will not work.")}

{gettext("Installation:")}
macOS: brew install imagemagick
Ubuntu/Debian: sudo apt-get install imagemagick
CentOS/RHEL: sudo yum install ImageMagick

<% end %> <%= if match?({:error, :not_installed}, @ffmpeg_status) do %>

<.icon name="hero-exclamation-triangle" class="w-5 h-5" />

{gettext("FFmpeg Not Installed")}

{gettext( "FFmpeg is required for video processing, transcoding, and thumbnail generation." )} {gettext("Without it, video file processing will not work.")}

{gettext("Installation:")}
macOS: brew install ffmpeg
Ubuntu/Debian: sudo apt-get install ffmpeg
CentOS/RHEL: sudo yum install ffmpeg

<% end %> <%!-- Media Buckets --%>

<.icon name="hero-inbox-stack" class="w-6 h-6 mr-2" /> {gettext("Media Buckets")}

<.link navigate={PhoenixKit.Utils.Routes.path("/admin/settings/media/buckets/new")} class="btn btn-primary" > <.icon name="hero-plus" class="w-4 h-4 mr-1" /> {gettext("Add Bucket")}

<%= if Enum.empty?(@buckets) do %>

<.icon name="hero-exclamation-triangle" class="w-5 h-5" />

{gettext("No Media Buckets Configured")}

{gettext( "You need to create at least one media bucket before files can be uploaded." )} {gettext( "Buckets can be local directories or cloud storage providers (AWS S3, Backblaze B2, Cloudflare R2)." )}

<.link navigate={PhoenixKit.Utils.Routes.path("/admin/settings/media/buckets/new")} class="btn btn-warning btn-sm" > <.icon name="hero-plus" class="w-4 h-4 mr-1" /> {gettext( "Create Your First Bucket" )}

<% else %> <.table_default id="buckets-table" variant="zebra" toggleable={true} items={@buckets} card_title={fn bucket -> bucket.name end} card_fields={ fn bucket -> [ %{ label: gettext("Provider"), value: String.upcase(bucket.provider) }, %{ label: gettext("Priority"), value: if(bucket.priority == 0, do: gettext("Random"), else: to_string(bucket.priority) ) }, %{ label: gettext("Files"), value: "#{Map.get(@bucket_file_counts, bucket.uuid, 0)}" }, %{ label: gettext("Status"), value: if(bucket.enabled, do: gettext("Enabled"), else: gettext("Disabled")) } ] end } > <.table_default_header> <.table_default_row> <.table_default_header_cell>{gettext("Name")} <.table_default_header_cell>{gettext("Provider")} <.table_default_header_cell>{gettext("Priority")} <.table_default_header_cell>{gettext("Files")} <.table_default_header_cell>{gettext("Status")} <.table_default_header_cell>{gettext("Actions")} <.table_default_body> <%= for bucket <- @buckets do %> <.table_default_row> <.table_default_cell>

<%= case bucket.provider do %> <% "local" -> %> <.icon name="hero-folder" class="w-5 h-5 text-primary" /> <% "s3" -> %> <.icon name="hero-cloud" class="w-5 h-5 text-warning" /> <% "b2" -> %> <.icon name="hero-cube" class="w-5 h-5 text-info" /> <% "r2" -> %> <.icon name="hero-cloud-arrow-up" class="w-5 h-5 text-accent" /> <% "tigris" -> %> <.icon name="hero-globe-alt" class="w-5 h-5 text-secondary" /> <% _ -> %> <.icon name="hero-server" class="w-5 h-5 text-base-content/50" /> <% end %>

{bucket.name}

{get_bucket_full_path(bucket)}

<.table_default_cell> {String.upcase(bucket.provider)} <.table_default_cell> <%= if bucket.priority == 0 do %> {gettext("Random")} (0) <% else %> {bucket.priority} <% end %> <.table_default_cell> {Map.get(@bucket_file_counts, bucket.uuid, 0)} {gettext("files")} <.table_default_cell> <%= if bucket.enabled do %> {gettext("Enabled")} <% else %> {gettext("Disabled")} <% end %> <.table_default_cell> <.table_row_menu id={"bucket-menu-#{bucket.uuid}"} label={gettext("Bucket actions")} > <.table_row_menu_link navigate={ PhoenixKit.Utils.Routes.path( "/admin/settings/media/buckets/#{bucket.uuid}/edit" ) } icon="hero-pencil" label={gettext("Edit bucket")} /> <.table_row_menu_button phx-click="toggle_bucket" phx-value-id={bucket.uuid} icon={if bucket.enabled, do: "hero-eye-slash", else: "hero-eye"} label={if bucket.enabled, do: gettext("Disable"), else: gettext("Enable")} /> <.table_row_menu_button phx-click="delete_bucket" phx-value-id={bucket.uuid} data-confirm={ gettext( "Are you sure you want to delete this bucket? This will remove all location records." ) } icon="hero-trash" label={gettext("Delete bucket")} class="text-error" /> <% end %> <:card_actions :let={bucket}> <.link navigate={ PhoenixKit.Utils.Routes.path( "/admin/settings/media/buckets/#{bucket.uuid}/edit" ) } class="btn btn-xs btn-outline btn-info" > <.icon name="hero-pencil" class="w-3 h-3" /> {gettext("Edit")}

{gettext("Total Buckets")}

{length(@buckets)}

{gettext("Configured media locations")}

{gettext("Active Buckets")}

{Enum.count(@buckets, & &1.enabled)}

{gettext("Currently in use")}

{gettext("Default Bucket")}

<%= if @default_bucket_uuid do %> {gettext("Set")} <% else %> {gettext("None")} <% end %>

{gettext("Primary media location")}

<% end %>

<%!-- Media Configuration --%>

<.icon name="hero-cog-6-tooth" class="w-6 h-6 mr-2" /> {gettext("Media Configuration")}

<.form for={%{"form_redundancy" => @form_redundancy}} phx-change="update_storage_form" class="grid grid-cols-1 md:grid-cols-2 gap-6" > <%!-- Redundancy Settings --%>

{gettext("Redundancy Copies")} {gettext("Number of copies to store")}

<%= if @active_buckets_count == 0 do %>

<.icon name="hero-exclamation-triangle" class="w-4 h-4" /> {gettext("No active buckets available. Enable buckets to configure redundancy.")}

<% else %> <%= if @form_redundancy > @max_redundancy do %>

<.icon name="hero-exclamation-triangle" class="w-4 h-4" /> {gettext( "Current setting (%{count} copies) exceeds available buckets (%{max}).", count: @form_redundancy, max: @max_redundancy )} {gettext("Reduce redundancy or enable more buckets.")}

<% end %> @max_redundancy, do: "input-warning", else: ""}"} />

{gettext("Enter number of copies")} (1-{@max_redundancy}). <%= if @max_redundancy == 1 do %> {gettext( "Only 1 active bucket available. Add more buckets to enable redundancy." )} <% else %> {gettext("Maximum %{count} copies based on %{buckets} active bucket(s).", count: @max_redundancy, buckets: @active_buckets_count )} <% end %>

<% end %>

<%!-- Auto-Variant Generation --%>

{gettext("Auto-Generate Variants")} {gettext("Automatically resize images and videos to configured dimensions")}

<%!-- Deep Zoom Tile Generation --%>

{gettext("Deep Zoom Tile Generation")} {gettext( "Lazily generate DZI tile pyramids when users zoom deeply into images. With this off the MediaBrowser still swaps between medium/large variants while zooming, but never generates tiles or hits the lazy tile endpoint. ImageMagick is required when enabled." )}

<%!-- Annotated Thumbnails --%>

{gettext("Annotated Thumbnails")} {gettext( "Bake Etcher annotation shapes (rectangles, marker strokes, etc.) into a file's grid thumbnail, regenerated in the background when annotations change. With this off the grid shows the plain thumbnail and no annotated variant is generated. ImageMagick is required when enabled." )}

<%!-- Max Upload Size --%>

{gettext("Max Upload Size (MB)")} {gettext("Maximum file size allowed per upload")}

{gettext("Current limit: %{size} MB", size: @form_max_upload_size_mb)}

<%!-- Apply Button --%> <% storage_form_clean = @form_redundancy == @redundancy_copies and @form_auto_generate_variants == @auto_generate_variants and @form_tile_generation_enabled == @tile_generation_enabled and @form_annotated_thumbnails_enabled == @annotated_thumbnails_enabled and @form_max_upload_size_mb == @max_upload_size_mb %>

<%= if storage_form_clean do %> {gettext("No changes to apply")} <% else %> {gettext("Changes will be saved immediately")} <% end %>

<%!-- Quick Actions --%>

{gettext("Quick Actions")}

<%!-- Each action is wrapped in a daisyUI tooltip (rather than putting the tooltip on the button) so the hover description also works on the disabled "Media Stats" button — a disabled button has `pointer-events: none` and would otherwise swallow hover. Each button also carries a trailing info icon as the visible "what does this do?" affordance. --%>

<%!-- Manage Dimensions --%> <%!-- Media Stats (coming soon) --%> <%!-- Sync Files / Health dashboard --%> <%!-- Find Orphaned Files --%> <%!-- Repair Media Module --%>

<%!-- Help Section --%>

<.icon name="hero-light-bulb" class="w-5 h-5" />

{gettext("Media System Architecture")}

{gettext( "The media system is designed for distributed file management with automatic redundancy." )} {gettext( "Files are tracked in PostgreSQL with support for multiple media locations (local, S3, remote servers)." )} {gettext( "When a file is requested, the system automatically tries each location until it successfully retrieves the file." )}