crazygooddigital · aymanterra · Feb 17, 2021 · Feb 17, 2021
diff --git a/lib/plausible_web/controllers/stats_controller.ex b/lib/plausible_web/controllers/stats_controller.ex
@@ -7,6 +7,7 @@ defmodule PlausibleWeb.StatsController do
   plug PlausibleWeb.AuthorizeStatsPlug when action in [:stats, :csv_export]
   plug PlausibleWeb.UpgradeBillingPlug when action in [:stats]
   plug PlausibleWeb.EmbeddableStatsPlug when action in [:stats]
+  plug PlausibleWeb.SharedLinkThemeSelectionPlug when action in [:stats]
 
   plug PlausibleWeb.EmbeddableAuthSharedLinkPlug
        when action in [:shared_link, :authenticate_shared_link]
@@ -15,7 +16,16 @@ defmodule PlausibleWeb.StatsController do
     PlausibleWeb.Endpoint.host()
   end
 
-  def stats(%{assigns: %{site: site}} = conn, _params) do
+  def stats(
+        %{
+          assigns: %{
+            site: site,
+            valid_shared_link: valid_shared_link,
+            selected_theme: selected_theme
+          }
+        } = conn,
+        _params
+      ) do
     if Stats.has_pageviews?(site) do
       demo = site.domain == base_domain()
       offer_email_report = get_session(conn, site.domain <> "_offer_email_report")
@@ -30,7 +40,9 @@ defmodule PlausibleWeb.StatsController do
         has_goals: Plausible.Sites.has_goals?(site),
         title: "Plausible · " <> site.domain,
         offer_email_report: offer_email_report,
-        demo: demo
+        demo: demo,
+        valid_shared_link: valid_shared_link,
+        selected_theme: selected_theme
       )
     else
       conn

diff --git a/lib/plausible_web/plugs/embeddable_stats_plug.ex b/lib/plausible_web/plugs/embeddable_stats_plug.ex
@@ -1,6 +1,5 @@
 defmodule PlausibleWeb.EmbeddableStatsPlug do
   import Plug.Conn
-  use Plausible.Repo
 
   def init(options) do
     options

diff --git a/lib/plausible_web/plugs/shared_link_theme_selection_plug.ex b/lib/plausible_web/plugs/shared_link_theme_selection_plug.ex
@@ -0,0 +1,44 @@
+defmodule PlausibleWeb.SharedLinkThemeSelectionPlug do
+  import Plug.Conn
+
+  def init(options) do
+    options
+  end
+
+  def call(%{assigns: %{site: site}} = conn, _opts) do
+    if !site do
+      PlausibleWeb.ControllerHelpers.render_error(conn, 404) |> halt
+    else
+      shared_link_key = "shared_link_auth_" <> site.domain
+      shared_link_auth = get_session(conn, shared_link_key)
+
+      valid_shared_link =
+        shared_link_auth && shared_link_auth[:valid_until] > DateTime.to_unix(Timex.now())
+
+      if valid_shared_link do
+        theme_index = Enum.find_index(conn.path_info, fn x -> x == "theme" end)
+
+        selected_theme =
+          if(
+            theme_index,
+            do: Enum.at(conn.path_info, theme_index + 1),
+            else: get_session(conn, "selected_theme")
+          )
+
+        conn
+        |> put_session("selected_theme", selected_theme)
+        |> assign(:site, site)
+        |> assign(:valid_shared_link, valid_shared_link)
+        |> assign(:selected_theme, selected_theme)
+      else
+        selected_theme = nil
+
+        conn
+        |> delete_session("selected_theme")
+        |> assign(:site, site)
+        |> assign(:valid_shared_link, valid_shared_link)
+        |> assign(:selected_theme, selected_theme)
+      end
+    end
+  end
+end
diff --git a/lib/plausible_web/templates/layout/app.html.eex b/lib/plausible_web/templates/layout/app.html.eex
@@ -10,7 +10,7 @@
     <title><%= assigns[:title] || "Plausible · Simple, privacy-friendly alternative to Google Analytics" %></title>
     <link rel="stylesheet" href="<%= Routes.static_path(@conn, "/css/app.css") %>"/>
     <%= render("_tracking.html", assigns) %>
-    <script type="text/javascript" data-pref="<%= @conn.assigns[:current_user] && @conn.assigns[:current_user].theme %>" src="<%= Routes.static_path(@conn, "/js/applyTheme.js") %>"></script>
+    <script type="text/javascript" data-pref="<%= Plug.Conn.get_session(@conn, "selected_theme") || (@conn.assigns[:current_user] && @conn.assigns[:current_user].theme) %>" src="<%= Routes.static_path(@conn, "/js/applyTheme.js") %>"></script>
   </head>
   <body class="flex flex-col h-full bg-gray-50 dark:bg-gray-850">
     <%= if !(@conn.assigns[:embed_mode] && @conn.assigns.site.embeddable) do %>

diff --git a/lib/plausible_web/templates/stats/stats.html.eex b/lib/plausible_web/templates/stats/stats.html.eex
@@ -4,6 +4,25 @@
       <%= link("Click here to enable weekly email reports →", to: "/#{URI.encode_www_form(@site.domain)}/settings#email-reports", class: "py-2 block") %>
     </div>
   <% end %>
+  <%= if @valid_shared_link do %>
+    <div>
+      <%= if @selected_theme == "dark" do %>
+        <div class="flex items-center space-x-3 mt-4">
+          <button onclick="location.href='<%="/#{URI.encode_www_form(@site.domain) <> theme_path(@conn, "light")}"%>'" class="bg-indigo-600 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring">
+            <span class="translate-x-5 inline-block h-5 w-5 rounded-full bg-white dark:bg-gray-800 shadow transform transition ease-in-out duration-200"></span>
+          </button>
+          <span class="text-sm leading-5 font-medium text-gray-900 dark:text-gray-100">Light/Dark Mode</span>
+        </div>
+      <% else %>
+        <div class="flex items-center space-x-3 mt-4">
+          <button onclick="location.href='<%="/#{URI.encode_www_form(@site.domain) <> theme_path(@conn, "dark")}"%>'" class="bg-gray-200 dark:bg-gray-700 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring">
+            <span class="translate-x-0 inline-block h-5 w-5 rounded-full bg-white dark:bg-gray-800 shadow transform transition ease-in-out duration-200"></span>
+          </button>
+          <span class="text-sm leading-5 font-medium text-gray-900 dark:text-gray-100">Light/Dark Mode</span>
+        </div>
+      <% end %>
+    </div>
+  <% end %>
   <div class="pt-6"></div>
   <div id="stats-react-container" data-domain="<%= @site.domain %>" data-offset="<%= Timex.Timezone.total_offset(Timex.Timezone.get(@site.timezone)) %>" data-has-goals="<%= @has_goals %>" data-logged-in="<%= [email protected][:current_user] %>" data-inserted-at="<%= @site.inserted_at %>"></div>
   <div id="modal_root"></div>

diff --git a/lib/plausible_web/views/stats_view.ex b/lib/plausible_web/views/stats_view.ex
@@ -44,6 +44,26 @@ defmodule PlausibleWeb.StatsView do
     """
   end
 
+  def theme_path(conn, theme) do
+    current_path_list = conn.path_params["path"]
+
+    theme_index = Enum.find_index(current_path_list, fn x -> x == "theme" end)
+
+    path_list =
+      if(
+        theme_index,
+        do:
+          List.insert_at(
+            List.delete_at(current_path_list, theme_index + 1),
+            theme_index + 1,
+            theme
+          ),
+        else: current_path_list ++ ["theme", theme]
+      )
+
+    "/" <> Enum.join(path_list, "/")
+  end
+
   defp bar_width(count, all) do
     max =
       Enum.max_by(all, fn