soem changes

This commit is contained in:
zack 2024-11-14 13:05:48 -05:00
parent e3da619b0a
commit 49677f2d9b
No known key found for this signature in database
GPG key ID: 5F873416BCF59F35
8 changed files with 225 additions and 117 deletions

View file

@ -56,7 +56,7 @@ defmodule ZoeyscomputerWeb.CodeBlock do
</div>
<% end %>
<div class="overflow-x-scroll bg-ctp-mantle">
<div class="bg-ctp-mantle">
<div class="relative bg-ctp-crust">
<%= if @line_numbers do %>
<div class="absolute bg-ctp-crust left-0 top-0 bottom-0 ctp-bg-crust min-w-12 flex flex-col items-end py-4 ctp-text-surface2 select-none">
@ -72,7 +72,10 @@ defmodule ZoeyscomputerWeb.CodeBlock do
</div>
<% end %>
<div class={["bg-ctp-mantle overflow-x-scroll pb-0.5", @line_numbers && "pl-12"]}>
<div class={[
"bg-ctp-mantle overflow-x-scroll scrollbar scrollbar-track-ctp-base scrollbar-thumb-ctp-mauve pb-0.5",
@line_numbers && "pl-12"
]}>
<pre
class="p-4 leading-6 text-sm mb-4"
id={"code-block-#{id}"}

View file

@ -70,7 +70,7 @@ defmodule ZoeyscomputerWeb.CoreComponents do
phx-window-keydown={JS.exec("data-cancel", to: "##{@id}")}
phx-key="escape"
phx-click-away={JS.exec("data-cancel", to: "##{@id}")}
class="shadow-zinc-700/10 ring-zinc-700/10 relative hidden rounded-2xl bg-ctp-base p-14 shadow-lg ring-1 transition"
class="shadow-ctp-mauve/10 ring-ctp-mauve/10 relative hidden rounded-2xl bg-ctp-base p-14 shadow-lg ring-1 transition"
>
<div class="absolute top-6 right-5">
<button
@ -340,7 +340,7 @@ defmodule ZoeyscomputerWeb.CoreComponents do
<select
id={@id}
name={@name}
class="mt-2 block w-full rounded-md border border-gray-300 bg-ctp-base shadow-sm focus:border-zinc-400 focus:ring-0 sm:text-sm"
class="mt-2 block w-full rounded-md border border-gray-300 bg-ctp-base shadow-sm focus:border-ctp-blue focus:ring-0 sm:text-sm"
multiple={@multiple}
{@rest}
>
@ -361,7 +361,7 @@ defmodule ZoeyscomputerWeb.CoreComponents do
name={@name}
class={[
"mt-2 block w-full bg-ctp-base rounded-lg text-ctp-text focus:ring-0 sm:text-sm sm:leading-6 min-h-[6rem]",
@errors == [] && "border-ctp-surface2 focus:border-zinc-400",
@errors == [] && "border-ctp-surface2 focus:border-ctp-overlay0",
@errors != [] && "border-rose-400 focus:border-rose-400"
]}
{@rest}
@ -500,7 +500,7 @@ defmodule ZoeyscomputerWeb.CoreComponents do
~H"""
<div class="overflow-y-auto px-4 sm:overflow-visible sm:px-0">
<table class="w-[40rem] mt-11 sm:w-full">
<thead class="text-sm text-left leading-6 text-zinc-500">
<thead class="text-sm text-left leading-6 text-ctp-text">
<tr>
<th :for={col <- @col} class="p-0 pb-4 pr-6 font-normal"><%= col[:label] %></th>
<th :if={@action != []} class="relative p-0 pb-4">
@ -511,27 +511,35 @@ defmodule ZoeyscomputerWeb.CoreComponents do
<tbody
id={@id}
phx-update={match?(%Phoenix.LiveView.LiveStream{}, @rows) && "stream"}
class="relative divide-y divide-zinc-100 border-t border-zinc-200 text-sm leading-6 text-ctp-overlay1"
class="relative divide-y divide-ctp-overlay0 border-t border-ctp-overlay1 text-sm leading-6 text-ctp-overlay1"
>
<tr :for={row <- @rows} id={@row_id && @row_id.(row)} class="group hover:bg-zinc-50">
<tr
:for={row <- @rows}
id={@row_id && @row_id.(row)}
class="group hover:bg-ctp-mauve hover:scale-105 transition-all duration-250"
>
<td
:for={{col, i} <- Enum.with_index(@col)}
phx-click={@row_click && @row_click.(row)}
class={["relative p-0", @row_click && "hover:cursor-pointer"]}
>
<div class="block py-4 pr-6">
<span class="absolute -inset-y-px right-0 -left-4 group-hover:bg-zinc-50 sm:rounded-l-xl" />
<span class={["relative", i == 0 && "font-semibold text-ctp-overlay2"]}>
<span class="absolute -inset-y-px right-0 -left-4 group-hover:bg-ctp-mauve sm:rounded-l-xl" />
<span class={[
"relative",
i == 0 && "font-semibold text-ctp-overlay2 group-hover:text-ctp-crust"
]}>
<%= render_slot(col, @row_item.(row)) %>
</span>
</div>
</td>
<td :if={@action != []} class="relative w-14 p-0">
<div class="relative whitespace-nowrap py-4 text-right text-sm font-medium">
<span class="absolute -inset-y-px -right-4 left-0 group-hover:bg-zinc-50 sm:rounded-r-xl" />
<span class="absolute -inset-y-px -right-4 left-0 group-hover:bg-ctp-mauve sm:rounded-r-xl" />
<span
:for={action <- @action}
class="relative ml-4 font-semibold leading-6 text-ctp-overlay2 hover:text-ctp-overlay1"
class="relative ml-4 font-semibold leading-6 text-ctp-overlay2 group-hover:text-ctp-crust"
>
<%= render_slot(action, @row_item.(row)) %>
</span>
@ -561,9 +569,9 @@ defmodule ZoeyscomputerWeb.CoreComponents do
def list(assigns) do
~H"""
<div class="mt-14">
<dl class="-my-4 divide-y divide-zinc-100">
<dl class="-my-4 divide-y divide-ctp-overlay0">
<div :for={item <- @item} class="flex gap-4 py-4 text-sm leading-6 sm:gap-8">
<dt class="w-1/4 flex-none text-zinc-500"><%= item.title %></dt>
<dt class="w-1/4 flex-none text-ctp-text"><%= item.title %></dt>
<dd class="text-ctp-overlay1"><%= render_slot(item) %></dd>
</div>
</dl>

View file

@ -1,4 +1,6 @@
defmodule ZoeyscomputerWeb.ImageLive.FormComponent do
import Mogrify
alias Zoeyscomputer.IdGenerator
use ZoeyscomputerWeb, :live_component
alias Zoeyscomputer.Images
@ -19,7 +21,24 @@ defmodule ZoeyscomputerWeb.ImageLive.FormComponent do
phx-change="validate"
phx-submit="save"
>
<.input field={@form[:file]} type="text" label="File" />
<.live_file_input upload={@uploads.image} />
<section phx-drop-target={@uploads.image.ref}>
<%= for entry <- @uploads.image.entries do %>
<article class="upload-entry">
<figure>
<.live_img_preview entry={entry} />
<figcaption><%= entry.client_name %></figcaption>
</figure>
<progress class="w-full" value={entry.progress} max="100">
<%= entry.progress %>
</progress>
</article>
<% end %>
<%= for err <- upload_errors(@uploads.image) do %>
<p class="alert alert-danger"><%= error_to_string(err) %></p>
<% end %>
</section>
<:actions>
<.button phx-disable-with="Saving...">Save Image</.button>
</:actions>
@ -28,8 +47,18 @@ defmodule ZoeyscomputerWeb.ImageLive.FormComponent do
"""
end
defp error_to_string(:too_large), do: "Too Large"
defp error_to_string(:not_accepted), do: "Not Accepted"
defp error_to_string(:too_manu_files), do: "Too many files!"
@impl true
def update(%{image: image} = assigns, socket) do
socket =
socket
|> assign(:uploaded_files, [])
|> allow_upload(:image, accept: ~w(.jpg .jpeg .png), max_entries: 2)
{:ok,
socket
|> assign(assigns)
@ -44,8 +73,29 @@ defmodule ZoeyscomputerWeb.ImageLive.FormComponent do
{:noreply, assign(socket, form: to_form(changeset, action: :validate))}
end
def handle_event("save", %{"image" => image_params}, socket) do
save_image(socket, socket.assigns.action, image_params)
@impl true
def handle_event("save", _params, socket) do
uploaded_files =
consume_uploaded_entries(socket, :image, fn %{path: path}, _entry ->
dest = Path.join("/tmp/", Path.basename(path))
File.cp(path, dest)
handle_upload(dest)
end)
update(socket, :uploaded_files, &(&1 ++ uploaded_files))
save_image(socket, socket.assigns.action, %{file: uploaded_files})
end
@impl true
def handle_event("validate", _params, socket) do
{:noreply, socket}
end
@impl true
def handle_event("cancel-upload", %{"ref" => ref}, socket) do
{:noreply, cancel_upload(socket, :image, ref)}
end
defp save_image(socket, :edit, image_params) do
@ -63,6 +113,27 @@ defmodule ZoeyscomputerWeb.ImageLive.FormComponent do
end
end
defp handle_upload(path) do
id = IdGenerator.generate()
key = "uploads/#{id}.png"
bucket = "imgs"
try do
image = open(path) |> format("png") |> save()
IO.inspect(image)
{:ok, new_file_binary} = File.read(image.path)
case ExAws.S3.put_object(bucket, key, new_file_binary, %{content_type: "image/png"})
|> ExAws.request() do
{:ok, _response} -> {:ok, id}
{:error, reason} -> {:error, reason}
end
after
File.rm(path)
end
end
defp save_image(socket, :new, image_params) do
case Images.create_image(image_params) do
{:ok, image} ->

View file

@ -7,6 +7,7 @@ defmodule ZoeyscomputerWeb.ImageLive.Index do
@impl true
def mount(_params, _session, socket) do
current_user = socket.assigns.current_user
{:ok, stream(socket, :images, Images.list_images_by_user(current_user))}
end