[Enhancement] Add "Copy JSON" action button to help when troubleshooting (#224)

* [WIP] [skip ci]

* Added 'copy JSON' button to all dropdowns; hopefully fixed some CSS silliness

lib/pinchflat_web/controllers/sources/source_html/actions_dropdown.html.heex

@@ -3,15 +3,32 @@
     <span
       x-data="{ copied: false }"
       x-on:click={"
-                window.copyTextToClipboard('#{rss_feed_url(@conn, @source)}')
-                copied = true
-                setTimeout(() => copied = false, 4000)
-              "}
+        copyWithCallbacks(
+          '#{rss_feed_url(@conn, @source)}', 
+          () => copied = true, 
+          () => copied = false
+        )
+      "}
     >
       Copy RSS Feed
       <span x-show="copied" x-transition.duration.150ms><.icon name="hero-check" class="ml-2 h-4 w-4" /></span>
     </span>
   </:option>
+  <:option>
+    <span x-data="{ copied: false }" x-on:click={~s"
+        copyWithCallbacks(
+          `#{Jason.Formatter.pretty_print(Phoenix.json_library().encode!(@source))}`, 
+          () => copied = true, 
+          () => copied = false
+        )
+      "}>
+      Copy JSON
+      <span x-show="copied" x-transition.duration.150ms><.icon name="hero-check" class="ml-2 h-4 w-4" /></span>
+    </span>
+  </:option>
+  <:option>
+    <div class="h-px w-full bg-bodydark2"></div>
+  </:option>
   <:option :if={@source.download_media}>
     <.link
       href={~p"/sources/#{@source}/force_download"}

lib/pinchflat_web/controllers/sources/source_html/edit.html.heex

@@ -8,7 +8,7 @@
 </div>
 
 <div class="rounded-sm border border-stroke bg-white px-5 pb-2.5 pt-6 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:pb-1">
-  <div class="max-w-full overflow-x-auto">
+  <div class="max-w-full">
     <div class="flex flex-col gap-10">
       <.source_form changeset={@changeset} media_profiles={@media_profiles} action={~p"/sources/#{@source}"} />
     </div>

lib/pinchflat_web/controllers/sources/source_html/new.html.heex

@@ -6,7 +6,7 @@
 </div>
 
 <div class="rounded-sm border border-stroke bg-white px-5 pb-2.5 pt-6 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:pb-1">
-  <div class="max-w-full overflow-x-auto">
+  <div class="max-w-full">
     <div class="flex flex-col gap-10">
       <.source_form changeset={@changeset} media_profiles={@media_profiles} action={~p"/sources"} />
     </div>

lib/pinchflat_web/controllers/sources/source_html/show.html.heex

@@ -17,7 +17,7 @@
   </nav>
 </div>
 <div class="rounded-sm border border-stroke bg-white px-5 py-5 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5">
-  <div class="max-w-full overflow-x-auto">
+  <div class="max-w-full">
     <.tabbed_layout>
       <:tab_append>
         <.actions_dropdown source={@source} conn={@conn} />