chore: install and run styler

.formatter.exs

@@ -1,6 +1,6 @@
 [
   import_deps: [:ecto, :ecto_sql, :phoenix],
   subdirectories: ["priv/*/migrations"],
-  plugins: [Phoenix.LiveView.HTMLFormatter],
+  plugins: [Styler, Phoenix.LiveView.HTMLFormatter],
   inputs: ["*.{heex,ex,exs}", "{config,lib,test}/**/*.{heex,ex,exs}", "priv/*/seeds.exs"]
 ]

config/config.exs

@@ -7,11 +7,6 @@
 # General application configuration
 import Config
 
-config :cms,
-  namespace: CMS,
-  ecto_repos: [CMS.Repo],
-  generators: [timestamp_type: :utc_datetime, binary_id: true]
-
 # Configures the endpoint
 config :cms, CMSWeb.Endpoint,
   url: [host: "localhost"],
@@ -23,28 +18,20 @@ config :cms, CMSWeb.Endpoint,
   pubsub_server: CMS.PubSub,
   live_view: [signing_salt: "afQxdsCJ"]
 
+config :cms,
+  namespace: CMS,
+  ecto_repos: [CMS.Repo],
+  generators: [timestamp_type: :utc_datetime, binary_id: true]
+
 # Configure esbuild (the version is required)
 config :esbuild,
   version: "0.17.11",
   cms: [
-    args:
-      ~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*),
+    args: ~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*),
     cd: Path.expand("../assets", __DIR__),
     env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)}
   ]
 
-# Configure tailwind (the version is required)
-config :tailwind,
-  version: "3.4.3",
-  cms: [
-    args: ~w(
-      --config=tailwind.config.js
-      --input=css/app.css
-      --output=../priv/static/assets/app.css
-    ),
-    cd: Path.expand("../assets", __DIR__)
-  ]
-
 # Configures Elixir's Logger
 config :logger, :console,
   format: "$time $metadata[$level] $message\n",
@@ -53,6 +40,19 @@ config :logger, :console,
 # Use Jason for JSON parsing in Phoenix
 config :phoenix, :json_library, Jason
 
-# Import environment specific config. This must remain at the bottom
-# of this file so it overrides the configuration defined above.
+# Configure tailwind (the version is required)
+config :tailwind,
+  version: "3.4.3",
+  cms: [
+    args: ~w(
+      --config=tailwind.config.js
+      --input=css/app.css
+      --output=../priv/static/assets/app.css
+    ),
+
+    # Import environment specific config. This must remain at the bottom
+    # of this file so it overrides the configuration defined above.
+    cd: Path.expand("../assets", __DIR__)
+  ]
+
 import_config "#{config_env()}.exs"

config/dev.exs

@@ -1,6 +1,13 @@
 import Config
 
 # Configure your database
+# For development, we disable any cache and enable
+# debugging and code reloading.
+#
+# The watchers configuration can be used to run external
+# watchers to your application. For example, we can use it
+# to bundle .js and .css sources.
+# Binding to loopback ipv4 address prevents access from other machines.
 config :cms, CMS.Repo,
   username: "postgres",
   password: "postgres",
@@ -10,13 +17,6 @@ config :cms, CMS.Repo,
   show_sensitive_data_on_connection_error: true,
   pool_size: 10
 
-# For development, we disable any cache and enable
-# debugging and code reloading.
-#
-# The watchers configuration can be used to run external
-# watchers to your application. For example, we can use it
-# to bundle .js and .css sources.
-# Binding to loopback ipv4 address prevents access from other machines.
 config :cms, CMSWeb.Endpoint,
   # Change to `ip: {0, 0, 0, 0}` to allow access from other machines.
   http: [ip: {127, 0, 0, 1}, port: 4000],
@@ -29,29 +29,6 @@ config :cms, CMSWeb.Endpoint,
     tailwind: {Tailwind, :install_and_run, [:cms, ~w(--watch)]}
   ]
 
-# ## SSL Support
-#
-# In order to use HTTPS in development, a self-signed
-# certificate can be generated by running the following
-# Mix task:
-#
-#     mix phx.gen.cert
-#
-# Run `mix help phx.gen.cert` for more information.
-#
-# The `http:` config above can be replaced with:
-#
-#     https: [
-#       port: 4001,
-#       cipher_suite: :strong,
-#       keyfile: "priv/cert/selfsigned_key.pem",
-#       certfile: "priv/cert/selfsigned.pem"
-#     ],
-#
-# If desired, both `http:` and `https:` keys can be
-# configured to run both http and https servers on
-# different ports.
-
 # Watch static and templates for browser reloading.
 config :cms, CMSWeb.Endpoint,
   live_reload: [
@@ -61,21 +38,45 @@ config :cms, CMSWeb.Endpoint,
     ]
   ]
 
+# ## SSL Support
+#
+
 # Enable dev routes for dashboard and mailbox
+# In order to use HTTPS in development, a self-signed
+# certificate can be generated by running the following
+# Mix task:
+#
 config :cms, dev_routes: true
 
 # Do not include metadata nor timestamps in development logs
+#     mix phx.gen.cert
+#
+# Run `mix help phx.gen.cert` for more information.
+#
 config :logger, :console, format: "[$level] $message\n"
 
-# Set a higher stacktrace during development. Avoid configuring such
-# in production as building large stacktraces may be expensive.
-config :phoenix, :stacktrace_depth, 20
-
 # Initialize plugs at runtime for faster development compilation
+# The `http:` config above can be replaced with:
+#
+#     https: [
 config :phoenix, :plug_init_mode, :runtime
 
+# Set a higher stacktrace during development. Avoid configuring such
+#       port: 4001,
+# in production as building large stacktraces may be expensive.
+#       cipher_suite: :strong,
+#       keyfile: "priv/cert/selfsigned_key.pem",
+#       certfile: "priv/cert/selfsigned.pem"
+config :phoenix, :stacktrace_depth, 20
+
 config :phoenix_live_view,
   # Include HEEx debug annotations as HTML comments in rendered markup
+  #     ],
+  #
   debug_heex_annotations: true,
   # Enable helpful, but potentially expensive runtime checks
+  # If desired, both `http:` and `https:` keys can be
+  # configured to run both http and https servers on
+  # different ports.
+
   enable_expensive_runtime_checks: true

config/runtime.exs

@@ -30,12 +30,6 @@ if config_env() == :prod do
 
   maybe_ipv6 = if System.get_env("ECTO_IPV6") in ~w(true 1), do: [:inet6], else: []
 
-  config :cms, CMS.Repo,
-    # ssl: true,
-    url: database_url,
-    pool_size: String.to_integer(System.get_env("POOL_SIZE") || "10"),
-    socket_options: maybe_ipv6
-
   # The secret key base is used to sign/encrypt cookies and other secrets.
   # A default value is used in config/dev.exs and config/test.exs but you
   # want to use a different value for prod and you most likely don't want
@@ -51,7 +45,11 @@ if config_env() == :prod do
   host = System.get_env("PHX_HOST") || "example.com"
   port = String.to_integer(System.get_env("PORT") || "4000")
 
-  config :cms, :dns_cluster_query, System.get_env("DNS_CLUSTER_QUERY")
+  config :cms, CMS.Repo,
+    # ssl: true,
+    url: database_url,
+    pool_size: String.to_integer(System.get_env("POOL_SIZE") || "10"),
+    socket_options: maybe_ipv6
 
   config :cms, CMSWeb.Endpoint,
     url: [host: host, port: 443, scheme: "https"],
@@ -65,6 +63,8 @@ if config_env() == :prod do
     ],
     secret_key_base: secret_key_base
 
+  config :cms, :dns_cluster_query, System.get_env("DNS_CLUSTER_QUERY")
+
   # ## SSL Support
   #
   # To get SSL working, you will need to add the `https` key

lib/cms_web.ex

@@ -23,10 +23,11 @@ defmodule CMSWeb do
     quote do
       use Phoenix.Router, helpers: false
 
-      # Import common connection and controller functions to use in pipelines
-      import Plug.Conn
       import Phoenix.Controller
       import Phoenix.LiveView.Router
+
+      # Import common connection and controller functions to use in pipelines
+      import Plug.Conn
     end
   end
 
@@ -80,10 +81,10 @@ defmodule CMSWeb do
 
   defp html_helpers do
     quote do
+      import CMSWeb.CoreComponents
       # HTML escaping functionality
       import Phoenix.HTML
       # Core UI components
-      import CMSWeb.CoreComponents
 
       # Shortcut for generating JS commands
       alias Phoenix.LiveView.JS

lib/cms_web/telemetry.ex

@@ -1,5 +1,7 @@
 defmodule CMSWeb.Telemetry do
+  @moduledoc false
   use Supervisor
+
   import Telemetry.Metrics
 
   def start_link(arg) do
@@ -70,8 +72,7 @@ defmodule CMSWeb.Telemetry do
       ),
       summary("cms.repo.query.idle_time",
         unit: {:native, :millisecond},
-        description:
-          "The time the connection spent waiting before being checked out for the query"
+        description: "The time the connection spent waiting before being checked out for the query"
       ),
 
       # VM Metrics

mix.exs

@@ -44,17 +44,15 @@ defmodule CMS.MixProject do
       {:esbuild, "~> 0.8", runtime: Mix.env() == :dev},
       {:tailwind, "~> 0.2", runtime: Mix.env() == :dev},
       {:heroicons,
-       github: "tailwindlabs/heroicons",
-       tag: "v2.1.1",
-       sparse: "optimized",
-       app: false,
-       compile: false,
-       depth: 1},
+       github: "tailwindlabs/heroicons", tag: "v2.1.1", sparse: "optimized", app: false, compile: false, depth: 1},
       {:telemetry_metrics, "~> 1.0"},
       {:telemetry_poller, "~> 1.0"},
       {:jason, "~> 1.2"},
       {:dns_cluster, "~> 0.1.1"},
-      {:bandit, "~> 1.5"}
+      {:bandit, "~> 1.5"},
+
+      # dev/test only
+      {:styler, "~> 1.4", only: [:dev, :test], runtime: false}
     ]
   end
 

mix.lock

@@ -24,6 +24,7 @@
   "plug": {:hex, :plug, "1.16.1", "40c74619c12f82736d2214557dedec2e9762029b2438d6d175c5074c933edc9d", [:mix], [{:mime, "~> 1.0 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2 or ~> 2.0", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.3 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "a13ff6b9006b03d7e33874945b2755253841b238c34071ed85b0e86057f8cddc"},
   "plug_crypto": {:hex, :plug_crypto, "2.1.0", "f44309c2b06d249c27c8d3f65cfe08158ade08418cf540fd4f72d4d6863abb7b", [:mix], [], "hexpm", "131216a4b030b8f8ce0f26038bc4421ae60e4bb95c5cf5395e1421437824c4fa"},
   "postgrex": {:hex, :postgrex, "0.20.0", "363ed03ab4757f6bc47942eff7720640795eb557e1935951c1626f0d303a3aed", [:mix], [{:db_connection, "~> 2.1", [hex: :db_connection, repo: "hexpm", optional: false]}, {:decimal, "~> 1.5 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:table, "~> 0.1.0", [hex: :table, repo: "hexpm", optional: true]}], "hexpm", "d36ef8b36f323d29505314f704e21a1a038e2dc387c6409ee0cd24144e187c0f"},
+  "styler": {:hex, :styler, "1.4.0", "5944723d08afe4d38210b674d7e97dd1137a75968a85a633983cc308e86dc5f2", [:mix], [], "hexpm", "07de0e89c27490c8e469bb814d77ddaaa3283d7d8038501021d80a7705cf13e9"},
   "tailwind": {:hex, :tailwind, "0.2.4", "5706ec47182d4e7045901302bf3a333e80f3d1af65c442ba9a9eed152fb26c2e", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}], "hexpm", "c6e4a82b8727bab593700c998a4d98cf3d8025678bfde059aed71d0000c3e463"},
   "telemetry": {:hex, :telemetry, "1.3.0", "fedebbae410d715cf8e7062c96a1ef32ec22e764197f70cda73d82778d61e7a2", [:rebar3], [], "hexpm", "7015fc8919dbe63764f4b4b87a95b7c0996bd539e0d499be6ec9d7f3875b79e6"},
   "telemetry_metrics": {:hex, :telemetry_metrics, "1.1.0", "5bd5f3b5637e0abea0426b947e3ce5dd304f8b3bc6617039e2b5a008adc02f8f", [:mix], [{:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "e7b79e8ddfde70adb6db8a6623d1778ec66401f366e9a8f5dd0955c56bc8ce67"},

test/support/conn_case.ex

@@ -19,15 +19,14 @@ defmodule CMSWeb.ConnCase do
 
   using do
     quote do
+      use CMSWeb, :verified_routes
+      import CMSWeb.ConnCase
+      import Phoenix.ConnTest
+      import Plug.Conn
       # The default endpoint for testing
       @endpoint CMSWeb.Endpoint
 
-      use CMSWeb, :verified_routes
-
       # Import conveniences for testing with connections
-      import Plug.Conn
-      import Phoenix.ConnTest
-      import CMSWeb.ConnCase
     end
   end
 

test/support/data_case.ex

@@ -16,14 +16,16 @@ defmodule CMS.DataCase do
 
   use ExUnit.CaseTemplate
 
+  alias Ecto.Adapters.SQL.Sandbox
+
   using do
     quote do
-      alias CMS.Repo
-
+      import CMS.DataCase
       import Ecto
       import Ecto.Changeset
       import Ecto.Query
-      import CMS.DataCase
+
+      alias CMS.Repo
     end
   end
 
@@ -36,8 +38,8 @@ defmodule CMS.DataCase do
   Sets up the sandbox based on the test tags.
   """
   def setup_sandbox(tags) do
-    pid = Ecto.Adapters.SQL.Sandbox.start_owner!(CMS.Repo, shared: not tags[:async])
-    on_exit(fn -> Ecto.Adapters.SQL.Sandbox.stop_owner(pid) end)
+    pid = Sandbox.start_owner!(CMS.Repo, shared: not tags[:async])
+    on_exit(fn -> Sandbox.stop_owner(pid) end)
   end
 
   @doc """