Update everything and more

.credo.exs

@@ -1,3 +1,5 @@
+alias Credo.Check.Refactor.ABCSize
+
 %{
   configs: [
     %{
@@ -41,7 +43,7 @@
           {Credo.Check.Readability.VariableNames, []},
 
           # Refactoring Opportunities
-          {Credo.Check.Refactor.ABCSize, max_size: 40},
+          {ABCSize, max_size: 40},
           {Credo.Check.Refactor.Apply, []},
           {Credo.Check.Refactor.CyclomaticComplexity, []},
           {Credo.Check.Refactor.FunctionArity, []},
@@ -107,7 +109,7 @@
           {Credo.Check.Readability.UnnecessaryAliasExpansion, []},
           {Credo.Check.Readability.WithCustomTaggedTuple, []},
           {Credo.Check.Readability.WithSingleClause, []},
-          {Credo.Check.Refactor.ABCSize, []},
+          {ABCSize, []},
           {Credo.Check.Refactor.AppendSingleItem, []},
           {Credo.Check.Refactor.CaseTrivialMatches, false},
           {Credo.Check.Refactor.CondStatements, []},

.dockerignore

@@ -3,6 +3,7 @@ _build/
 assets/node_modules/
 deps/
 test/
+priv/plts
 priv/static/assets/
 
 .*

.gitignore

@@ -16,10 +16,8 @@ npm-debug.log
 /assets/node_modules
 
 # Ignore assets that are produced by build tools
-/priv/static/assets
-
-# Ignore digested assets cache.
-/priv/static/cache_manifest.json
+/priv/static/*
+!/priv/static/favicon.svg
 
 # Local environment variable files
 .env.local

.tool-versions

@@ -1,3 +1,3 @@
-erlang 26.0.2
-elixir 1.15.5-otp-26
-nodejs 20.5.1
+erlang 27.3.2
+elixir 1.18.3-otp-27
+nodejs 22.17.1

Dockerfile

@@ -1,7 +1,15 @@
+ARG NODEJS_VERSION=22-bookworm-slim
+ARG ELIXIR_VERSION=1.18.1
+ARG OTP_VERSION=27.2
+ARG DEBIAN_VERSION=bookworm-20241223-slim
+
+ARG BUILDER_IMAGE="hexpm/elixir:${ELIXIR_VERSION}-erlang-${OTP_VERSION}-debian-${DEBIAN_VERSION}"
+ARG RUNNER_IMAGE="debian:${DEBIAN_VERSION}"
+
 # -----------------------------------------------
 # Stage: npm dependencies
 # -----------------------------------------------
-FROM node:20.5-bookworm-slim AS npm-builder
+FROM node:${NODEJS_VERSION} AS npm-builder
 
 # Install Debian dependencies
 RUN apt-get update -y && \
@@ -16,44 +24,51 @@ COPY assets assets
 RUN npm ci --prefix assets
 
 # -----------------------------------------------
-# Stage: hex dependencies
+# Stage: hex dependencies + OTP release
 # -----------------------------------------------
-FROM hexpm/elixir:1.15.5-erlang-26.0.2-debian-bookworm-20230612-slim AS otp-builder
+FROM ${BUILDER_IMAGE} AS hex-builder
 
-# Install Debian dependencies
+# install build dependencies
 RUN apt-get update -y && \
     apt-get install -y build-essential git && \
     apt-get clean && \
     rm -f /var/lib/apt/lists/*_*
 
+# prepare build dir
 WORKDIR /app
 
-# Install Erlang dependencies
-RUN mix local.rebar --force && \
-    mix local.hex --force
+ENV MIX_ENV=prod
+ENV ERL_FLAGS="+JPperf true"
+
+# install hex + rebar
+RUN mix local.hex --force && \
+    mix local.rebar --force
 
+# set build ENV
 ENV MIX_ENV="prod"
 
-# Install mix dependencies
+# install mix dependencies
 COPY mix.exs mix.lock ./
 RUN mix deps.get --only $MIX_ENV
 
-# Copy compile-time config files before we compile dependencies
+# copy compile-time config files before we compile dependencies
 # to ensure any relevant config change will trigger the dependencies
 # to be re-compiled.
 RUN mkdir config
 COPY config/config.exs config/${MIX_ENV}.exs config/
-
-# Compile mix dependencies
 RUN mix deps.compile
 
-# Compile assets
+# install Esbuild so it is cached
+RUN mix esbuild.install --if-missing
+
+COPY lib lib
 COPY --from=npm-builder /app/assets assets
 COPY priv priv
+
+# Compile assets
 RUN mix assets.deploy
 
-# Compile code
-COPY lib lib
+# Compile the release
 RUN mix compile
 
 # Changes to config/runtime.exs don't require recompiling the code
@@ -65,25 +80,27 @@ RUN mix release
 # -----------------------------------------------
 # Stage: Bundle release in a docker image
 # -----------------------------------------------
-FROM debian:bookworm-20230612-slim
+FROM ${RUNNER_IMAGE}
 
 RUN apt-get update -y && \
-    apt-get install -y libstdc++6 openssl libncurses5 locales && \
-    apt-get clean && \
-    rm -f /var/lib/apt/lists/*_*
+  apt-get install -y curl jq libstdc++6 openssl libncurses5 locales && \
+  apt-get clean && \
+  rm -f /var/lib/apt/lists/*_*
 
 # Set the locale
 RUN sed -i '/en_US.UTF-8/s/^# //g' /etc/locale.gen && locale-gen
 
-ENV LANG en_US.UTF-8
-ENV LANGUAGE en_US:en
-ENV LC_ALL en_US.UTF-8
-
 WORKDIR "/app"
 RUN chown nobody /app
 
+# set runner ENV
+ENV LANG=en_US.UTF-8
+ENV LANGUAGE=en_US:en
+ENV LC_ALL=en_US.UTF-8
+ENV MIX_ENV="prod"
+
 # Only copy the final release from the build stage
-COPY --from=otp-builder --chown=nobody:root /app/_build/prod/rel/elixir_boilerplate ./
+COPY --from=hex-builder --chown=nobody:root /app/_build/${MIX_ENV}/rel/elixir_boilerplate ./
 
 USER nobody
 

Makefile

@@ -88,7 +88,7 @@ sync-translations: ## Synchronize translations with Accent
 
 .PHONY: test
 test: ## Run the test suite
-	mix test
+	mix test --warnings-as-errors
 
 # Check, lint and format targets
 # ------------------------------

assets/css/app.css

@@ -1,10 +1,4 @@
-.home {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  padding: 40px;
-  text-align: center;
+body {
   font-family:
     system-ui,
     -apple-system,
@@ -19,6 +13,15 @@
     'Segoe UI Emoji',
     'Segoe UI Symbol',
     'Noto Color Emoji';
+}
+
+.home {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: 40px;
+  text-align: center;
   line-height: 1.4;
 }
 
@@ -36,8 +39,25 @@
 }
 
 .flash-messages {
+  display: flex;
   position: fixed;
-  top: 0;
-  right: 0;
+  z-index: 1000;
+  top: 5px;
+  right: 5px;
+  flex-direction: column;
+  gap: 5px;
+}
+
+#flash-success {
+  padding: 10px;
+  border: 1px solid rgb(62, 146, 62);
+  background-color: #90d690;
+  color: #123c12;
+}
+
+#flash-error {
   padding: 10px;
+  border: 1px solid rgb(144, 35, 35);
+  background-color: #d68d8d;
+  color: #3c1212;
 }

assets/js/app.ts

@@ -0,0 +1,24 @@
+import '../css/app.css';
+
+import 'phoenix_html';
+
+import * as phoenix from 'phoenix';
+import {LiveSocket} from 'phoenix_live_view';
+
+interface Hook {
+  mounted?(): void;
+  destroyed?(): void;
+}
+
+const Hooks: Record<string, Hook> = {};
+
+const csrfToken = document
+  .querySelector("meta[name='csrf-token']")
+  ?.getAttribute('content');
+
+const liveSocket = new LiveSocket('/live', phoenix.Socket, {
+  hooks: Hooks,
+  params: {_csrf_token: csrfToken} // eslint-disable-line camelcase
+});
+
+liveSocket.connect();