Add long urls for Artikel

lib/outlook/artikel.ex

@@ -18,4 +18,16 @@ defmodule Outlook.Artikel do
    Repo.one(from t in Translation, where: t.id == ^id and t.public == true)
    |> Repo.preload([article: :author])
   end
+
+  def get_artikel_by_tid(tid) do
+    artikel = tid
+    |> String.split(~r/--(?=[0-9A-Za-z])/)
+    |> List.last()
+    |> String.to_integer(36)
+    |> get_artikel!()
+    case artikel do
+      %Translation{} -> {:ok, artikel}
+      _ -> {:error, "Artikel does not exist, or isn't public."}
+    end
+  end
 end

lib/outlook/translations/translation.ex

@@ -4,7 +4,7 @@ defmodule Outlook.Translations.Translation do
 
   alias Outlook.Accounts.User
   alias Outlook.Articles.Article
-  alias Outlook.Translations.TranslationUnitsMap
+  alias Outlook.Translations.{TranslationUnitsMap,Translation}
 
   schema "translations" do
     field :content, TranslationUnitsMap
@@ -32,4 +32,30 @@ defmodule Outlook.Translations.Translation do
         name: :article_id_lang_unique_index)
     |> foreign_key_constraint(:article_id)
   end
+
+  def translate_unicode(str) do
+    mapping = %{"Ä" => "Ae",
+                "Ö" => "Oe",
+                "Ü" => "Ue",
+                "ä" => "ae",
+                "ö" => "oe",
+                "ü" => "ue",
+                "ß" => "ss"}
+    {:ok, re} = "[#{Map.keys(mapping) |> Enum.join}]" |> Regex.compile("u")
+    Regex.replace(re, str, fn(c) -> mapping[c] end)
+  end
+
+  def spit_title(title) do
+    title
+    |> translate_unicode()
+    # |> String.replace(~r/[^-0-9A-Za-z ]/u, "_")
+    |> String.replace(~r/[^\w\s-]/u, "")
+    |> String.replace(~r/(\s|-)+/u, "-")
+  end
+
+  defimpl Phoenix.Param, for: Translation do
+    def to_param(%{id: id, title: title}) do
+      "#{Translation.spit_title(title)}--#{Integer.to_string(id, 36) |> String.downcase()}"
+    end
+  end
 end

lib/outlook_web/components/public_components.ex

@@ -3,6 +3,12 @@ defmodule OutlookWeb.PublicComponents do
     Provides components for showing and listing artikel and autoren.
   """
   use Phoenix.Component
+  import OutlookWeb.ViewHelpers
+
+  use Phoenix.VerifiedRoutes,
+    endpoint: OutlookWeb.Endpoint,
+    router: OutlookWeb.Router,
+    statics: OutlookWeb.static_paths()
   import Phoenix.HTML
 
   alias Phoenix.LiveView.JS
@@ -25,7 +31,7 @@ defmodule OutlookWeb.PublicComponents do
 
   def artikel(assigns) do
     ~H"""
-    <.link navigate={"/artikel/#{@artikel.id}"}>
+    <.link navigate={~p"/artikel/#{@artikel}"}>
       <div class="my-2 px-2 rounded border-2 border-solid border-gray-300 dark:border-stone-800">
         <h4 class="font-bold  text-stone-800 dark:text-stone-300 py-2"><%= @artikel.title %></h4>
         <div :if={@show_author}><small><%= @artikel.article.author.name %></small></div>

lib/outlook_web/live/article_live/show.html.heex

@@ -16,7 +16,7 @@
   </:actions>
 </.header>
 
-<.table id="translations" rows={@article.translations} row_click={&JS.navigate(~p"/translations/#{&1}")}>
+<.table id="translations" rows={@article.translations} row_click={&JS.navigate(~p"/translations/#{(&1).id}")}>
   <:col :let={translation} label="Language"><%= translation.language %></:col>
   <:col :let={translation} label="Title"><%= translation.title %></:col>
   <:col :let={translation} label="Teaser"><%= translation.teaser %></:col>
@@ -24,9 +24,9 @@
   <:col :let={translation} label="Public"><%= translation.public %></:col>
   <:action :let={translation}>
     <div class="sr-only">
-      <.link navigate={~p"/translations/#{translation}"}>Show</.link>
+      <.link navigate={~p"/translations/#{translation.id}"}>Show</.link>
     </div>
-    <.link navigate={~p"/translations/#{translation}/edit"}>Edit</.link>
+    <.link navigate={~p"/translations/#{translation.id}/edit"}>Edit</.link>
   </:action>
   <%!-- <:action :let={translation}>
     <.link phx-click={JS.push("delete", value: %{id: translation.id})} data-confirm="Are you sure?">

lib/outlook_web/live/translation_live/index.html.heex

@@ -2,7 +2,7 @@
   Listing Translations
 </.header>
 
-<.table id="translations" rows={@translations} row_click={&JS.navigate(~p"/translations/#{&1}")}>
+<.table id="translations" rows={@translations} row_click={&JS.navigate(~p(/translations/#{(&1).id}))}>
   <:col :let={translation} label="Language"><%= translation.language %></:col>
   <:col :let={translation} label="Title"><%= translation.title %></:col>
   <:col :let={translation} label="Teaser"><%= translation.teaser %></:col>
@@ -12,9 +12,9 @@
   <:col :let={translation} label="Unauthorized"><%= translation.unauthorized %></:col>
   <:action :let={translation}>
     <div class="sr-only">
-      <.link navigate={~p"/translations/#{translation}"}>Show</.link>
+      <.link navigate={~p"/translations/#{translation.id}"}>Show</.link>
     </div>
-    <.link navigate={~p"/translations/#{translation}/edit"}>Edit</.link>
+    <.link navigate={~p"/translations/#{translation.id}/edit"}>Edit</.link>
   </:action>
   <:action :let={translation}>
     <.link phx-click={JS.push("delete", value: %{id: translation.id})} data-confirm="Are you sure?">

lib/outlook_web/live/translation_live/show.html.heex

@@ -2,7 +2,7 @@
   Translation <%= @translation.id %>
   <:subtitle>This is a translation record from your database.</:subtitle>
   <:actions>
-    <.link navigate={~p"/translations/#{@translation}/edit"} phx-click={JS.push_focus()}>
+    <.link navigate={~p"/translations/#{@translation.id}/edit"} phx-click={JS.push_focus()}>
       <.button>Edit translation</.button>
     </.link>
   </:actions>

lib/outlook_web/router.ex

@@ -34,7 +34,7 @@ defmodule OutlookWeb.Router do
     get "/", ArtikelController, :index
 
     resources "/autoren", AutorController, only: [:index, :show]
-    resources "/artikel", ArtikelController, only: [:index, :show]
+    resources "/artikel", ArtikelController, only: [:index, :show], param: "tid"
   end
 
   # Other scopes may use custom stacks.