Refactor user theme CSS to be provided by a stylesheet endpoint

Retrospring · Feb 1, 2023 · 679ecb9 · 679ecb9
1 parent da711dc
commit 679ecb9
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 8 deletions.
diff --git a/app/controllers/user_controller.rb b/app/controllers/user_controller.rb
@@ -1,11 +1,15 @@
 # frozen_string_literal: true
 
 class UserController < ApplicationController
-  before_action :set_user
+  include ThemeHelper
+
+  before_action :set_user, except: :show_theme
   before_action :hidden_social_graph_redirect, only: %i[followers followings]
   after_action :mark_notification_as_read, only: %i[show]
 
   def show
+    return show_theme if params[:format] == "css"
+
     @answers = @user.cursored_answers(last_id: params[:last_id])
     @answers_last_id = @answers.map(&:id).min
     @more_data_available = !@user.cursored_answers(last_id: @answers_last_id, size: 1).count.zero?
@@ -16,6 +20,16 @@ def show
     end
   end
 
+  def show_theme
+    theme = Theme.where(user: User.where("LOWER(screen_name) = ?", params[:username].downcase).select(:id)).first
+    return head :no_content if theme.nil?
+
+    expires_in 1.day
+    return if fresh_when theme, public: true
+
+    render plain: get_theme_css(theme), content_type: "text/css"
+  end
+
   def followers
     paginate_relationships(:cursored_follower_relationships)
     @users = @relationships.map(&:source)

diff --git a/app/helpers/theme_helper.rb b/app/helpers/theme_helper.rb
@@ -33,6 +33,11 @@ def render_theme
 
     return unless theme
 
+    css = get_theme_css(theme)
+    content_tag(:style, css)
+  end
+
+  def get_theme_css(theme)
     body = ":root {\n"
 
     theme.attributes.each do |k, v|
@@ -42,9 +47,7 @@ def render_theme
         body += "\t--#{var}: #{get_color_for_key(var, v)};\n"
       end
     end
-    body += "\t--turbolinks-progress-color: ##{lighten(theme.primary_color)}\n}"
-
-    content_tag(:style, body)
+    body + "\t--turbolinks-progress-color: ##{lighten(theme.primary_color)}\n}"
   end
 
   def get_color_for_key(key, color)

diff --git a/app/views/layouts/base.html.haml b/app/views/layouts/base.html.haml
@@ -5,10 +5,10 @@
     %meta{ 'http-equiv': 'X-UA-Compatible', content: 'IE=edge' }
     %meta{ name: 'viewport', content: 'width=device-width, initial-scale=1, user-scalable=no, viewport-fit=cover' }
     - if user_signed_in?
-      %meta{ name: 'theme-color', content: theme_color, media: '(min-width: 993px)' }
-      %meta{ name: 'theme-color', content: mobile_theme_color, media: '(max-width: 992px)' }
+      %meta{ name: 'theme-color', content: "var(--primary)", media: '(min-width: 993px)' }
+      %meta{ name: 'theme-color', content: "var(--background)", media: '(max-width: 992px)' }
     - else
-      %meta{ name: 'theme-color', content: theme_color }
+      %meta{ name: 'theme-color', content: "var(--primary)" }
     - if @user&.privacy_noindex? || @answer&.user&.privacy_noindex? || @question&.user&.privacy_noindex?
       %meta{ name: 'robots', content: 'noindex' }
     %link{ rel: 'manifest', href: '/manifest.json', crossorigin: 'use-credentials' }
@@ -19,6 +19,10 @@
     %link{ rel: 'icon', href: '/images/favicon/favicon-32.png', sizes: '32x32' }
     %title= yield(:title)
     = stylesheet_link_tag 'application', data: { 'turbo-track': 'reload' }
+    - if current_user&.show_foreign_themes?
+      %link{ rel: 'stylesheet', href: user_path(username: @user&.screen_name || @answer&.user&.screen_name || current_user&.screen_name, format: "css"), data: { turbo_track: "reload" } }
+    - elsif user_signed_in?
+      %link{ rel: 'stylesheet', href: user_path(username: current_user&.screen_name, format: "css"), data: { turbo_track: "reload" } }
     = javascript_include_tag 'application', data: { 'turbo-track': 'reload' }, defer: true
     = csrf_meta_tags
     = yield(:og)
@@ -43,4 +47,3 @@
               = `git rev-parse --short HEAD`.strip
           %p.text-danger Debug params:
           = debug params
-    = render_theme