+
+
+
+ """
+ end
+
+ attr :navigate, :string, required: true
+ attr :icon, :string, required: true
+ attr :label, :string, required: true
+ attr :active, :boolean, default: false
+
+ defp sidebar_item(assigns) do
+ ~H"""
+ <.link navigate={@navigate} class="sidebar__item" aria-current={@active && "page"}>
+ <.icon name={@icon} size={20} /> {@label}
+
+ """
+ end
+
+ attr :navigate, :string, required: true
+ attr :icon, :string, required: true
+ attr :label, :string, required: true
+ attr :active, :boolean, default: false
+
+ defp bottom_nav_item(assigns) do
+ ~H"""
+ <.link navigate={@navigate} class="bottom-nav__item" aria-current={@active && "page"}>
+ <.icon name={@icon} size={22} />
+ {@label}
+
+ """
+ end
+
+ defp storage_percent(%{used_bytes: used, quota_bytes: quota})
+ when is_integer(used) and is_integer(quota) and quota > 0 do
+ (used / quota * 100) |> round() |> min(100) |> max(0)
+ end
+
+ defp storage_percent(_stats), do: 0
+
+ @doc """
+ Layout das telas públicas (setup, login, convite): céu noturno, estrelas e
+ horizonte aquecido.
+ """
+ attr :flash, :map, required: true
+ slot :inner_block, required: true
+
+ def auth(assigns) do
+ ~H"""
+ <.flash_group flash={@flash} />
+
+
+ {render_slot(@inner_block)}
+
+
+
+
+
+
+ """
+ end
+
+ @doc """
+ Barra superior de telas internas mobile: voltar, título centrado e ação.
+ """
+ attr :title, :string, required: true
+ attr :back, :string, required: true
+ slot :action
+
+ def app_bar(assigns) do
+ ~H"""
+
+ {render_slot(@inner_block)}
+
+ {@title}
+{render_slot(@action)}
+
+ {gettext("Conta")}
+ +
+ <.card class="row gap-4">
+ <.avatar name={@current_scope.ava.display_name || @current_scope.ava.username} />
+
+
+
+ <.badge :if={Maraca.zelador?(@current_scope.ava)} variant="zelador">{gettext("Zelador(a)")}
+
+
+ {@current_scope.ava.display_name || @current_scope.ava.username}
+{"@" <> @current_scope.ava.username}
+
+ <.list_row title={gettext("Membros")} meta={gettext("quem faz parte da comunidade")} navigate={~p"/membros"}>
+ <:leading><.service_square service="nhaman" icon="user" />
+ <:actions><.icon name="chevron-right" size={18} class="text-faint" />
+
+
+ <.list_row
+ :if={Maraca.zelador?(@current_scope.ava)}
+ title={gettext("Convidar pessoas")}
+ meta={gettext("link + QR code")}
+ navigate={~p"/membros/convidar"}
+ >
+ <:leading><.service_square service="ybira" icon="qr" />
+ <:actions><.icon name="chevron-right" size={18} class="text-faint" />
+
+
+ <.list_row
+ title={gettext("Armazenamento")}
+ meta={gettext("uso do disco e cota")}
+ navigate={~p"/armazenamento"}
+ >
+ <:leading><.service_square service="jaci" icon="disk" />
+ <:actions><.icon name="chevron-right" size={18} class="text-faint" />
+
+
+ <.list_row title={gettext("Lixeira")} meta={gettext("itens dos últimos 30 dias")} navigate={~p"/arquivos/lixeira"}>
+ <:leading><.service_square service="neutral" icon="trash" />
+ <:actions><.icon name="chevron-right" size={18} class="text-faint" />
+
+
+
+ <.link href={~p"/logout"} method="delete" class="btn btn--danger btn--md w-full">
+ <.icon name="logout" size={18} /> {gettext("Sair")}
+
+
+
+ + +
+
+ <.modal id="file-details" show={@show_details} on_cancel={JS.push("toggle-details")}>
+
+ <%= case media_kind(@file.mime_type) do %>
+ <% :image -> %>
+ ![{@file.original_filename}]({~p"/files/#{@file.public_id}"})
+ <% :video -> %>
+
+ <% :audio -> %>
+
+ <% :pdf -> %>
+
+ <% :text -> %>
+
+
+ <.card>
+ {@text_preview}
+
+ <.icon name="file" size={40} />
+
+ <% :other -> %>
+ {gettext("pré-visualização indisponível")}
+
+ <.icon name="file" size={40} />
+
+ <% end %>
+ {gettext("pré-visualização indisponível")}
+{@file.original_filename}
+{file_meta(@file)}
++ + +
{gettext("Detalhes")}
+
+
+ <.button variant="secondary" class="w-full mt-6" phx-click="toggle-details">
+ {gettext("Fechar")}
+
+
+
+ <.confirm_dialog
+ id="confirm-delete"
+ show={@show_confirm}
+ title={gettext("Excluir \"%{name}\"?", name: @file.original_filename)}
+ message={gettext("Vai para a lixeira. Dá para restaurar em até 30 dias.")}
+ on_confirm="confirm-delete"
+ on_cancel={JS.push("close-confirm")}
+ />
+
+
+ {gettext("Nome original")}
+{@file.original_filename}
+
+
+ {gettext("Tipo")}
+{@file.mime_type}
+
+
+ {gettext("Tamanho")}
+{format_bytes(@file.file_size_bytes)}
+
+
+ {gettext("SHA-256")}
+{@file.file_hash}
+
+
+ {gettext("Enviado em")}
+{Calendar.strftime(@file.inserted_at, "%d/%m/%Y %H:%M")}
+
+
+
+ {gettext("Arquivos")}
+
+ <.icon_button
+ name="info"
+ label={gettext("Espaço da comunidade")}
+ phx-click="open-modal"
+ phx-value-modal="storage-info"
+ />
+ <.icon_button name="trash" label={gettext("Lixeira")} navigate={~p"/arquivos/lixeira"} />
+ <.icon_button
+ name="folder-plus"
+ label={gettext("Nova pasta")}
+ phx-click="open-modal"
+ phx-value-modal="new-folder"
+ />
+ <.button variant="primary" size="md" navigate={upload_path(@folder_public_id)} class="hide-mobile">
+ <.icon name="upload" size={18} /> {gettext("Enviar")}
+
+
+
+ <.menu id="sort-menu" icon="list" label={gettext("Ordenar")}>
+ <:item click={JS.patch(browse_path(@folder_public_id, toggle_sort(:name, @sort), @view))}>
+ {gettext("Nome")}
+
+ <:item click={JS.patch(browse_path(@folder_public_id, toggle_sort(:date, @sort), @view))}>
+ {gettext("Data")}
+
+ <:item click={JS.patch(browse_path(@folder_public_id, toggle_sort(:size, @sort), @view))}>
+ {gettext("Tamanho")}
+
+
+
+
+
+
+
+
+
+ {sort_label(@sort)} <.icon name={sort_arrow_icon(@sort)} size={14} />
+
+ <.icon_button
+ name="grid"
+ label={gettext("Alternar grade/lista")}
+ phx-click={JS.patch(browse_path(@folder_public_id, @sort, if(@view == :grid, do: :list, else: :grid)))}
+ />
+
+ + {ngettext("%{count} item", "%{count} itens", @item_count)} +
+ +
+ <%= if @view == :grid do %>
+
+
+
+ <.link
+ :for={folder <- @folders}
+ navigate={~p"/arquivos/pasta/#{folder.public_id}"}
+ class="tile"
+ data-drop-folder={folder.public_id}
+ >
+ <.service_square service="ybira" icon="folder" size="lg" />
+
+ <% else %>
+ {folder.name}
+ + + +
+ <.link
+ :for={{dom_id, file} <- @streams.files}
+ id={dom_id}
+ navigate={~p"/arquivos/#{file.public_id}"}
+ class="tile"
+ >
+ <% {service, icon} = file_visual(file.mime_type) %>
+ <.service_square service={service} icon={icon} size="lg" />
+
+ {file.original_filename}
+ + +
+ <.list_row
+ :for={folder <- @folders}
+ title={folder.name}
+ meta={gettext("Pasta")}
+ navigate={~p"/arquivos/pasta/#{folder.public_id}"}
+ draggable="true"
+ data-drag-id={folder.public_id}
+ data-drag-kind="folder"
+ data-drop-folder={folder.public_id}
+ >
+ <:leading>
+ <.service_square service="ybira" icon="folder" />
+
+ <:actions>
+ <.item_menu kind="folder" id={folder.public_id} name={folder.name} />
+
+
+
+
+ <% end %>
+
+ <.list_row
+ :for={{dom_id, file} <- @streams.files}
+ id={dom_id}
+ title={file.original_filename}
+ meta={file_meta(file)}
+ navigate={~p"/arquivos/#{file.public_id}"}
+ draggable="true"
+ data-drag-id={file.public_id}
+ data-drag-kind="file"
+ >
+ <:leading>
+ <% {service, icon} = file_visual(file.mime_type) %>
+ <.service_square service={service} icon={icon} />
+
+ <:actions>
+ <.item_menu kind="file" id={file.public_id} name={file.original_filename} />
+
+
+
+
+
+
+ <.empty_state
+ :if={@item_count == 0}
+ icon="folder"
+ title={gettext("Pasta vazia")}
+ hint={gettext("Envie arquivos ou crie uma pasta para organizar.")}
+ >
+ <.button variant="primary" size="md" navigate={upload_path(@folder_public_id)}>
+ {gettext("Enviar arquivos")}
+
+
+
+ <.button variant="fab" navigate={upload_path(@folder_public_id)} aria-label={gettext("Enviar arquivos")}>
+ <.icon name="plus" />
+
+
+ <.modal id="new-folder-modal" show={@modal == "new-folder"} on_cancel={JS.push("close-modal")}>
+ {gettext("Carregando mais...")}
+{gettext("Nova pasta")}
+ + + + <.modal id="rename-modal" show={@modal == "rename"} on_cancel={JS.push("close-modal")}> +{gettext("Renomear")}
+ + + + <.modal id="move-modal" show={@modal == "move"} on_cancel={JS.push("close-modal")}> +{gettext("Mover para...")}
+{@move_target.name}
+
+
+
+
+
+
+ <.modal id="storage-info-modal" show={@modal == "storage-info"} on_cancel={JS.push("close-modal")}>
+ {gettext("Espaço da comunidade")}
++ {gettext("Tudo o que vocês enviam divide o mesmo espaço. É da comunidade inteira.")} +
+ + <%= if @storage_stats do %> + <.progress value={storage_percent(@storage_stats)} /> +
+
+ {gettext("%{used} de %{total} usados",
+ used: format_bytes(@storage_stats.used_bytes),
+ total: format_bytes(@storage_stats.quota_bytes)
+ )}
+
+
+ {gettext("%{free} livres", free: format_bytes(storage_free(@storage_stats)))}
+
+
+ + {gettext("Quando o espaço acabar, quem cuida da comunidade pode aumentar o limite.")} +
+ <.button variant="secondary" size="md" navigate={~p"/armazenamento"} class="w-full mt-4"> + {gettext("Ver detalhes")} + + <% else %> +{gettext("Não foi possível carregar o uso agora.")}
+ <% end %> + + + <.confirm_dialog + id="confirm-delete" + show={@confirm != nil} + title={confirm_title(@confirm)} + message={gettext("Vai para a lixeira. Dá para restaurar em até 30 dias.")} + on_confirm="confirm-delete" + on_cancel={JS.push("close-modal")} + /> +{gettext("Fotos")}
+ + <.segmented> + <:option patch={~p"/fotos"} current={@live_action == :grid}>{gettext("Grade")} + <:option patch={~p"/fotos/linha-do-tempo"} current={@live_action == :timeline}> + {gettext("Linha do tempo")} + + + +
+
+
+
+ <.link
+ :for={{dom_id, photo} <- @streams.photos}
+ id={dom_id}
+ patch={~p"/fotos/#{photo.public_id}"}
+ class="photo-grid__item"
+ aria-label={photo.original_filename}
+ >
+ ![{photo.original_filename}]({~p"/files/#{photo.public_id}/thumbnail/sm"})
+
+
+
+
+ <.icon name="play" size={28} />
+
+
+
+
+ <.empty_state
+ :if={@loaded && @photo_ids == []}
+ icon="image"
+ title={gettext("Nenhuma foto ainda")}
+ hint={gettext("As imagens que a comunidade enviar aparecem aqui.")}
+ >
+ <.button variant="primary" size="md" navigate={~p"/arquivos/enviar"}>
+ {gettext("Enviar fotos")}
+
+
+ {gettext("Carregando mais...")}
+
+
+
+
+
+
+ + {group_title(group.date)}, {ngettext("%{count} foto", "%{count} fotos", length(group.photos))} +
+
+ <.link
+ :for={photo <- group.photos}
+ patch={~p"/fotos/#{photo.public_id}"}
+ class="photo-grid__item"
+ aria-label={photo.original_filename}
+ >
+
+
+
+
+ <.icon name="play" size={28} />
+
+
+
+
+ <.empty_state
+ :if={@groups == []}
+ icon="image"
+ title={gettext("Nenhuma foto ainda")}
+ hint={gettext("As imagens que a comunidade enviar aparecem aqui.")}
+ />
+ {gettext("Carregando mais...")}
+
+
+ <.icon_button name="close" label={gettext("Fechar")} phx-click="close" />
+
+
+
+
+ <.confirm_dialog
+ :if={@current}
+ id="confirm-delete-photo"
+ show={@show_confirm}
+ title={gettext("Excluir \"%{name}\"?", name: @current.original_filename)}
+ message={gettext("Vai para a lixeira. Dá para restaurar em até 30 dias.")}
+ on_confirm="confirm-delete"
+ on_cancel={JS.push("close-confirm")}
+ />
+
+ <.modal :if={@current} id="photo-details" show={@show_details} on_cancel={JS.push("toggle-details")}>
+
+
+ <.icon_button
+ name="link"
+ label={gettext("Copiar link")}
+ id="viewer-copy-link"
+ phx-hook="Clipboard"
+ data-copy={url(~p"/files/#{@current.public_id}")}
+ />
+ {photo_date(@current)}
++ {gettext("%{index} de %{total}", index: viewer_index(@photo_ids, @current), total: length(@photo_ids))} +
+
+
+ ![{@current.original_filename}]({~p"/files/#{@current.public_id}/thumbnail/md"})
+
+
+
+
+ {@current.original_filename}
+ + +{gettext("Detalhes")}
+
+
+ <.button variant="secondary" class="w-full mt-6" phx-click="toggle-details">
+ {gettext("Fechar")}
+
+
+
+
+ {gettext("Nome original")}
+{@current.original_filename}
+
+
+ {gettext("Tipo")}
+{@current.mime_type}
+
+
+ {gettext("Tamanho")}
+{format_bytes(@current.file_size_bytes)}
+
+
+ {gettext("SHA-256")}
+{@current.file_hash}
+
+
+ {gettext("Enviado em")}
+{Calendar.strftime(@current.inserted_at, "%d/%m/%Y %H:%M")}
+
+
+
+ <.card :if={@storage_stats} class="mb-6">
+
+
+ <.link navigate={~p"/conta"} aria-label={gettext("Sua conta")}>
+ <.avatar name={@current_scope.ava.display_name || @current_scope.ava.username} />
+
+ {greeting()}
+{@current_scope.tekoa.name}
+
+
+ <.progress :if={segments(@by_kind, @storage_stats) != []} segments={segments(@by_kind, @storage_stats)} />
+ <.progress :if={segments(@by_kind, @storage_stats) == []} value={0} />
+ {gettext("Armazenamento")}
++ {format_bytes(@storage_stats.quota_bytes - @storage_stats.used_bytes)} {gettext("livres")} +
++ {gettext("%{used} de %{total} usados", + used: format_bytes(@storage_stats.used_bytes), + total: format_bytes(@storage_stats.quota_bytes) + )} +
+ + +{gettext("Recentes")}
+
+ <.list_row
+ :for={file <- @recent}
+ title={file.original_filename}
+ meta={recent_meta(file)}
+ navigate={~p"/arquivos/#{file.public_id}"}
+ >
+ <:leading>
+ <% {service, icon} = file_visual(file.mime_type) %>
+ <.service_square service={service} icon={icon} />
+
+ <:actions>
+ <.icon name="chevron-right" size={18} class="text-faint" />
+
+
+
+
+ <.empty_state
+ :if={@recent == []}
+ icon="upload"
+ title={gettext("Nada por aqui ainda")}
+ hint={gettext("Envie o primeiro arquivo da comunidade.")}
+ >
+ <.button variant="primary" size="md" navigate={~p"/arquivos/enviar"}>
+ {gettext("Enviar arquivos")}
+
+
+
+ <.icon name="spark" size={40} class="spark" />
+
+
+
+ {gettext("Você foi convidado!")}
++ {gettext("Crie sua conta para entrar na nuvem da comunidade.")} +
+
+ <%= if @invite_url do %>
+
+ {qr_svg(@invite_url)}
+ + {gettext("Aponte a câmera ou compartilhe o link abaixo")} +
+ +
+
+
+ <.button
+ id="copy-invite"
+ variant="primary"
+ class="w-full"
+ phx-hook="Clipboard"
+ data-copy={@invite_url}
+ >
+ {gettext("Copiar link")}
+
+ <.button
+ id="share-invite"
+ variant="secondary"
+ class="w-full"
+ phx-hook="Share"
+ data-url={@invite_url}
+ data-title={gettext("Convite para a nuvem da comunidade")}
+ >
+ {gettext("Compartilhar convite")}
+
+
+ {gettext("Link do convite")}
+
+ {@invite_url}
+ <.icon name="link" size={18} class="text-brand" />
+
+ + {gettext("Este convite expira em 7 dias, revogável a qualquer momento.")} +
+ <% else %> + + <% end %> +
+ <.icon name="spark" size={40} class="spark" />
+
+
+
+
+ Tainá
+{gettext("Bem-vindo de volta")}
+{gettext("Entre com seu nome na nuvem da sua comunidade.")}
+
+
+ {gettext("ou")} +
+
+
+ <.button variant="secondary" class="w-full" phx-click="toggle-invite-help">
+ {gettext("Tenho um convite")}
+
+
+ <.modal id="invite-help" show={@show_invite_help} on_cancel={JS.push("toggle-invite-help")}>
+ + {gettext("ou")} +
+
{gettext("Como entrar com um convite")}
++ {gettext( + "Quem administra a comunidade te manda um link (ou um QR code). É só abrir o link neste aparelho. A criação da conta acontece lá." + )} +
+ <.button variant="secondary" class="w-full" phx-click="toggle-invite-help"> + {gettext("Entendi")} + + +
+
+
+
+
+ <.modal id="reset-link-modal" show={@reset_link != nil} on_cancel={JS.push("close-reset")}>
+
+
+
+ + {ngettext("%{count} pessoa", "%{count} pessoas", length(@members))} +
+ <.link + :if={Maraca.zelador?(@current_scope.ava)} + navigate={~p"/membros/convidar"} + class="type-label text-brand" + > + {gettext("Convidar")} + +
+ <.list_row
+ :for={member <- filtered(@members, @query)}
+ title={display_name(member)}
+ meta={member_meta(member, @current_scope)}
+ >
+ <:leading>
+ <.avatar name={display_name(member)} inactive={is_nil(member.activated_at)} />
+
+ <:actions>
+ <.badge :if={member.role == :zelador} variant="zelador">{gettext("Zelador(a)")}
+ <.icon_button
+ :if={can_reset?(member, @current_scope)}
+ name="link"
+ label={gettext("Gerar link de redefinição de senha")}
+ phx-click="reset-link"
+ phx-value-id={member.public_id}
+ />
+
+
+
+
+ <.empty_state
+ :if={filtered(@members, @query) == []}
+ icon="user"
+ title={gettext("Ninguém por aqui")}
+ hint={gettext("Nenhuma pessoa corresponde à busca.")}
+ />
+ {gettext("Link de redefinição de senha")}
++ {gettext( + "Entregue este link para %{name} pelo mesmo canal do convite. Com ele, a pessoa cria uma senha nova. O link expira em 1 hora.", + name: @reset_member + )} +
+
+ {@reset_link}
+ <.icon name="link" size={18} class="text-brand" />
+
+ <.button id="copy-reset" variant="primary" class="w-full" phx-hook="Clipboard" data-copy={@reset_link}>
+ {gettext("Copiar link")}
+
+
+
+ <.icon name="shield" size={40} class="spark" />
+
+
+
+ {gettext("Redefinir senha")}
++ {gettext("Crie uma senha nova para voltar a entrar.")} +
+
+
+
+
+ <.icon name="spark" size={48} class="spark" />
+
+
+
+ Tainá
++ {gettext("A estrela da manhã da sua comunidade. Arquivos e fotos, na sua casa, sob seu controle.")} +
+ <.steps current={1} /> +{gettext("Passo 1 de 3: sua comunidade")}
+
+ <.icon_button name="chevron-left" label={gettext("Voltar")} phx-click="back" />
+
+
+
+
+
+
+ {gettext("Crie a conta de quem cuida")}
++ {gettext("Você é o primeiro zelador desta comunidade. Guarde bem este acesso. Ele cuida da máquina.")} +
+ <.steps current={2} /> +{gettext("Passo 2 de 3: quem cuida")}
+
+ <.icon_button name="chevron-left" label={gettext("Voltar")} phx-click="back" />
+
+
+
+
+ {gettext("Onde guardar os arquivos")}
++ {gettext("Escolha o disco onde a comunidade vai morar. Dá pra mudar depois nas configurações.")} +
+ <.steps current={3} /> +{gettext("Passo 3 de 3: armazenamento")}
+
+
+
+ <.icon name="shield" size={22} class="text-success" />
+
+
+
+
+
+ + {gettext("Disco interno")}{if @free_space, do: ", #{format_bytes(@free_space)} #{gettext("livres")}"} +
+{@storage_root} ({gettext("recomendado")})
+
+ <.icon name="download" size={22} class="text-muted" />
+
+
+ <.card class="mt-2">
+
+
+
+ {gettext("Disco USB externo")}
+{gettext("Em breve. Conecte e monte o dispositivo")}
+{gettext("Resumo")}
++ {@data["community_name"]}, {gettext("zelador(a)")} {@data["username"]}, {gettext("disco interno")} +
+ + + + + +
+ <.card raised class="p-6">
+
+
+ <.modal id="quota-modal" show={@show_quota_modal} on_cancel={JS.push("toggle-quota-modal")}>
+ {format_bytes(@stats.used_bytes)}
+
+
+ <.progress :if={segments(@by_kind, @stats) != []} segments={segments(@by_kind, @stats)} />
+ <.progress :if={segments(@by_kind, @stats) == []} value={0} />
+ + {gettext("de %{total} usados", total: format_bytes(@stats.quota_bytes))} +
++ {format_bytes(@stats.quota_bytes - @stats.used_bytes)} {gettext("livres")} +
+{gettext("Uso por tipo")}
+ + +
+
+
+ -b end)} class="list-row">
+
+
+
+
+ {kind_label(kind)}
+{format_bytes(bytes)}
+
+
+ {gettext("Cota da comunidade")}
+ +{gettext("Cota da comunidade")}
+ + +
+ <.card class="row gap-3">
+ <.icon name="clock" size={20} class="text-warning" />
+
+ + {gettext("Itens são apagados para sempre após %{count} dias na lixeira.", count: 30)} +
+ + ++ {ngettext("%{count} item", "%{count} itens", length(@items))} +
+ +
+ <.list_row
+ :for={file <- @items}
+ title={file.original_filename}
+ meta={trash_meta(file)}
+ meta_class={warning?(file) && "text-warning"}
+ >
+ <:leading>
+ <% {_service, icon} = file_visual(file.mime_type) %>
+ <.service_square service="neutral" icon={icon} />
+
+ <:actions>
+ <.icon_button
+ name="restore"
+ label={gettext("Restaurar")}
+ phx-click="restore"
+ phx-value-id={file.public_id}
+ />
+
+
+
+
+
+
+
+ <.empty_state
+ :if={@items == []}
+ icon="trash"
+ title={gettext("Lixeira vazia")}
+ hint={gettext("Nada esperando para ser apagado.")}
+ />
+ {gettext("Carregando mais...")}
+
+
+
+
+
+
+
+ + {gettext("Enviando (%{count})", count: length(@uploads.files.entries))} +
+
+ <.list_row :for={entry <- @uploads.files.entries} title={entry.client_name}>
+ <:leading>
+ <% {service, icon} = file_visual(entry.client_type || "") %>
+ <.service_square service={service} icon={icon} />
+
+ <:actions>
+ {entry.progress}%
+ <.icon_button name="close" label={gettext("Cancelar envio")} phx-click="cancel" phx-value-ref={entry.ref} />
+
+
+
+
+ <.progress value={entry.progress} />
+
+ + {upload_config_error(err)} +
+
+
+
+ {gettext("Falharam (%{count})", count: length(@failed))}
+
+ <.list_row :for={{name, reason} <- @failed} title={name} meta={reason} meta_class="text-error">
+ <:leading>
+ <.service_square service="neutral" icon="alert" />
+
+
+
+
+
+
+ {gettext("Concluído (%{count})", count: length(@done))}
+
+ <.list_row
+ :for={file <- @done}
+ title={file.original_filename}
+ meta={gettext("Concluído")}
+ meta_class="text-success"
+ >
+ <:leading>
+ <% {service, icon} = file_visual(file.mime_type) %>
+ <.service_square service={service} icon={icon} />
+
+ <:actions>
+ <.icon name="check" size={20} class="text-success" />
+
+
+
+ <.progress value={100} color="success" />
+
+ <.button variant="primary" class="w-full" navigate={back_path(@folder)}>
+ {gettext("Concluir")}
+
+
+
+