Updated to LiveView 0.18

Author: dominicletz

README.md

@@ -2,6 +2,10 @@
 
 This application is an example of an Elixir LiveView based desktop application. It uses the elixir-desktop library and a local SQLite database to create a web-technology based desktop app.
 
+## Changes in 1.1
+
+- Updated to Phoenix 1.7 and LiveView 0.18
+
 ## Changes in 1.0
 
 - Updated to Phoenix 1.6 with esbuild+dart_scss

config/config.exs

@@ -17,7 +17,7 @@ config :dart_sass,
 
 config :logger,
   handle_otp_reports: true,
-  handle_sasl_reports: true,
+  handle_sasl_reports: false,
   backends: [:console]
 
 config :logger, :console,

lib/todo_web.ex

@@ -35,7 +35,9 @@ defmodule TodoWeb do
 
       # Import convenience functions from controllers
       import Phoenix.Controller,
-        only: [get_flash: 1, get_flash: 2, view_module: 1, view_template: 1]
+        only: [view_module: 1, view_template: 1]
+
+      alias Phoenix.Flash
 
       # Include shared imports and aliases for views
       unquote(view_helpers())
@@ -46,7 +48,7 @@ defmodule TodoWeb do
   def live_view do
     quote do
       use Phoenix.LiveView,
-        layout: {TodoWeb.LayoutView, "live.html"}
+        layout: {TodoWeb.LayoutView, :live}
 
       unquote(view_helpers())
       alias TodoWeb.Router.Helpers, as: Routes
@@ -86,6 +88,7 @@ defmodule TodoWeb do
 
       # Import LiveView helpers (live_render, live_component, live_patch, etc)
       import Phoenix.LiveView.Helpers
+      import Phoenix.Component
 
       # Import basic rendering functionality (render, render_layout, etc)
       import Phoenix.View

lib/todo_web/templates/layout/app.html.eex

@@ -1,5 +1,5 @@
 <main role="main" class="container">
-  <p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
-  <p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
+  <p class="alert alert-info" role="alert"><%= Flash.get(@conn, :info) %></p>
+  <p class="alert alert-danger" role="alert"><%= Flash.get(@conn, :error) %></p>
   <%= @inner_content %>
 </main>

mix.exs

@@ -1,14 +1,14 @@
 defmodule Todo.MixProject do
   use Mix.Project
 
-  @version "1.0.0"
+  @version "1.1.0"
   def project do
     [
       app: :todo_app,
       version: @version,
       elixir: "~> 1.10",
       elixirc_paths: elixirc_paths(Mix.env()),
-      compilers: [:phoenix | Mix.compilers()],
+      compilers: Mix.compilers(),
       start_permanent: Mix.env() == :prod,
       deps: deps(),
       aliases: aliases()
@@ -63,24 +63,25 @@ defmodule Todo.MixProject do
     deps_list = [
       {:ecto_sqlite3, "~> 0.8"},
       {:exqlite, github: "elixir-desktop/exqlite", override: true},
-      # {:desktop, path: "../desktop"},
-      {:desktop, "~> 1.4"},
+      {:desktop, path: "../desktop"},
+      # {:desktop, "~> 1.4"},
 
       # Phoenix
-      {:phoenix, "~> 1.6"},
-      {:phoenix_live_view, "~> 0.17.11"},
+      {:phoenix, "~> 1.7"},
+      {:phoenix_live_view, "~> 0.18"},
       {:phoenix_html, "~> 3.0"},
-      {:phoenix_live_reload, "~> 1.3", only: [:dev]},
-      {:gettext, "~> 0.18"},
-      {:plug_cowboy, "~> 2.5"},
-      {:jason, "~> 1.2"},
+      {:phoenix_view, "~> 2.0"},
+      {:phoenix_live_reload, "~> 1.4", only: [:dev]},
+      {:gettext, "~> 0.22"},
+      {:plug_cowboy, "~> 2.6"},
+      {:jason, "~> 1.4"},
 
       # Assets
-      {:esbuild, "~> 0.2", runtime: Mix.env() == :dev},
-      {:dart_sass, "~> 0.2", runtime: Mix.env() == :dev},
+      {:esbuild, "~> 0.7", runtime: Mix.env() == :dev},
+      {:dart_sass, "~> 0.5", runtime: Mix.env() == :dev},
 
       # Credo
-      {:credo, "~> 1.5", only: [:dev, :test], runtime: false}
+      {:credo, "~> 1.7", only: [:dev, :test], runtime: false}
     ]
 
     if Mix.target() in [:android, :ios] do

mix.lock

@@ -9,7 +9,7 @@
 msgid ""
 msgstr ""
 "Language: de\n"
-"Plural-Forms: nplurals=2\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
 #, elixir-format
 #: lib/todo_app/menubar.eex:14

priv/gettext/de/LC_MESSAGES/default.po

@@ -10,68 +10,68 @@
 msgid ""
 msgstr ""
 
-#, elixir-format
 #: lib/todo_app/menubar.eex:14
+#, elixir-format
 msgid "About"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menubar.eex:2 lib/todo_app/menubar.ex:14
+#: lib/todo_app/menu_bar.ex:14
+#, elixir-format, elixir-autogen
 msgid "File"
 msgstr ""
 
-#, elixir-format
 #: lib/todo_app/menubar.eex:13
+#, elixir-format
 msgid "Help"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menu.eex:2
+#: lib/todo_app/menu.html.heex:2
+#, elixir-format, elixir-autogen
 msgid "Open"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menu.eex:12 lib/todo_app/menubar.eex:11
-#: lib/todo_app/menubar.ex:22
+#: lib/todo_app/menu.html.heex:12
+#: lib/todo_app/menu_bar.ex:22
+#, elixir-format, elixir-autogen
 msgid "Quit"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menubar.ex:56
+#: lib/todo_app/menu_bar.ex:56
+#, elixir-format, elixir-autogen
 msgid "Sample Elixir Desktop App!"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menubar.ex:24
+#: lib/todo_app/menu_bar.ex:24
+#, elixir-format, elixir-autogen
 msgid "Extra"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menubar.ex:27
+#: lib/todo_app/menu_bar.ex:27
+#, elixir-format, elixir-autogen
 msgid "Open Browser"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menubar.ex:25
+#: lib/todo_app/menu_bar.ex:25
+#, elixir-format, elixir-autogen
 msgid "Show Notification"
 msgstr ""
 
-#, elixir-format
-#: lib/todo_app/menubar.ex:26
+#: lib/todo_app/menu_bar.ex:26
+#, elixir-format, elixir-autogen
 msgid "Show Observer"
 msgstr ""
 
-#, elixir-format
 #: lib/todo_web/templates/layout/root.html.leex:8
+#, elixir-format, elixir-autogen
 msgid " · Your Todos"
 msgstr ""
 
-#, elixir-format
 #: lib/todo_web/live/todo_live.html.leex:4
+#, elixir-format, elixir-autogen
 msgid "Add new todo item..."
 msgstr ""
 
-#, elixir-format
 #: lib/todo_web/live/todo_live.html.leex:2
+#, elixir-format, elixir-autogen
 msgid "My Todo List"
 msgstr ""