[56339] Split content of Admin/Design page into separate tabs

app/components/admin/design_header_component.html.erb

@@ -0,0 +1,49 @@
+<%#-- copyright
+OpenProject is an open source project management software.
+Copyright (C) the OpenProject GmbH
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License version 3.
+
+OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
+Copyright (C) 2006-2013 Jean-Philippe Lang
+Copyright (C) 2010-2013 the ChiliProject Team
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License
+as published by the Free Software Foundation; either version 2
+of the License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program; if not, write to the Free Software
+Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+
+See COPYRIGHT and LICENSE files for more details.
+
+++#%>
+
+<% helpers.html_title t(:label_administration), t(:label_custom_style), @title %>
+<%=
+  render(Primer::OpenProject::PageHeader.new) do |header|
+    header.with_title { t(:label_custom_style) }
+    header.with_breadcrumbs([{ href: admin_index_path, text: t(:label_administration) },
+                             t(:label_custom_style)])
+    header.with_description { t(:label_custom_style_description) }
+    header.with_tab_nav(label: nil) do |tab_nav|
+      tab_nav.with_tab(selected: @selected == 1, href: custom_style_path) do |tab|
+        tab.with_text { t(:"admin.custom_styles.tab_interface") }
+      end
+      tab_nav.with_tab(selected: @selected == 2, href: custom_style_branding_path) do |tab|
+        tab.with_text { t(:"admin.custom_styles.tab_branding") }
+      end
+      tab_nav.with_tab(selected: @selected == 3, href: custom_style_pdf_export_styles_path) do |tab|
+        tab.with_text { t(:"admin.custom_styles.tab_pdf_export_styles") }
+      end
+    end
+  end
+%>

app/components/admin/design_header_component.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+#-- copyright
+# OpenProject is an open source project management software.
+# Copyright (C) the OpenProject GmbH
+#
+# This program is free software; you can redistribute it and/or
+# modify it under the terms of the GNU General Public License version 3.
+#
+# OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
+# Copyright (C) 2006-2013 Jean-Philippe Lang
+# Copyright (C) 2010-2013 the ChiliProject Team
+#
+# This program is free software; you can redistribute it and/or
+# modify it under the terms of the GNU General Public License
+# as published by the Free Software Foundation; either version 2
+# of the License, or (at your option) any later version.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU General Public License
+# along with this program; if not, write to the Free Software
+# Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+#
+# See COPYRIGHT and LICENSE files for more details.
+#++
+
+module Admin
+  class DesignHeaderComponent < ApplicationComponent
+    def initialize(title:, selected:)
+      super
+      raise "selected must 1, 2 or 3" if [1, 2, 3].exclude?(selected)
+
+      @title = title
+      @selected = selected
+    end
+  end
+end

app/controllers/custom_styles_controller.rb

@@ -52,10 +52,22 @@
 
   def upsale; end
 
+  def branding
+    @custom_style = CustomStyle.current || CustomStyle.new
+    @current_theme = @custom_style.theme
+    @theme_options = options_for_theme_select
+  end
+
+  def pdf_export_styles
+    @custom_style = CustomStyle.current || CustomStyle.new
+    @current_theme = @custom_style.theme
+    @theme_options = options_for_theme_select
+  end
+
   def create
     @custom_style = CustomStyle.create(custom_style_params)
     if @custom_style.valid?
-      redirect_to custom_style_path
+      redirect_back(fallback_location: root_path)
     else
       flash[:error] = @custom_style.errors.full_messages
       render action: :show
@@ -65,7 +77,7 @@
   def update
     @custom_style = get_or_create_custom_style
     if @custom_style.update(custom_style_params)
-      redirect_to custom_style_path
+      redirect_back(fallback_location: root_path)
     else
       flash[:error] = @custom_style.errors.full_messages
       render action: :show
@@ -81,7 +93,7 @@
       @custom_style.export_cover_text_color = color
       @custom_style.save
     end
-    redirect_to custom_style_path
+    redirect_back(fallback_location: root_path)
   end
 
   def logo_download
@@ -134,27 +146,22 @@
     redirect_to action: :show
   end
 
   def update_themes
     theme = OpenProject::CustomStyles::ColorThemes.themes.find { |t| t[:theme] == params[:theme] }
 
     call = ::Design::UpdateDesignService
       .new(theme)
       .call
 
     call.on_success do
       flash[:notice] = I18n.t(:notice_successful_update)
     end
 
     call.on_failure do
       flash[:error] = call.message
     end
-
-    redirect_to action: :show
-  end
-
-  def show_local_breadcrumb
-    false
+    redirect_back(fallback_location: root_path)
   end
 
   private
 
@@ -204,6 +211,6 @@
     end
 
     @custom_style.send(remove_method)
-    redirect_to custom_style_path
+    redirect_back(fallback_location: root_path)
   end
 end

app/views/custom_styles/branding.html.erb

@@ -0,0 +1,143 @@
+<%#-- copyright
+OpenProject is an open source project management software.
+Copyright (C) the OpenProject GmbH
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License version 3.
+
+OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
+Copyright (C) 2006-2013 Jean-Philippe Lang
+Copyright (C) 2010-2013 the ChiliProject Team
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License
+as published by the Free Software Foundation; either version 2
+of the License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program; if not, write to the Free Software
+Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+
+See COPYRIGHT and LICENSE files for more details.
+
+++#%>
+
+<%=
+  render(Admin::DesignHeaderComponent.new(
+    title: t(:"admin.custom_styles.tab_branding"),
+    selected: 2,
+    ))
+%>
+<%= error_messages_for 'custom_style' %>
+<%= form_tag update_design_themes_path, method: :post, class: "form" do %>
+  <section class="form--section">
+    <fieldset class="form--fieldset">
+      <legend class="form--fieldset-legend"><%= I18n.t('admin.custom_styles.color_theme') %></legend>
+      <div class="form--field">
+        <div class="form--field-container">
+          <%= styled_select_tag 'theme',
+                                options_for_select(@theme_options, @current_theme),
+                                container_class: '-slim' %>
+        </div>
+      </div>
+
+      <%= styled_button_tag t(:button_save),
+                            data:({ confirm: t('admin.custom_styles.theme_warning') } unless @current_theme.present?) %>
+    </fieldset>
+  </section>
+<% end %>
+<%= form_for @custom_style, url: custom_style_path, html: { multipart: true, class: "form -vertical" } do |f| %>
+  <section class="form--section">
+    <fieldset class="form--fieldset">
+      <legend class="form--fieldset-legend"><%= I18n.t(:label_custom_logo) %></legend>
+      <% if @custom_style.id && @custom_style.logo.present? %>
+        <div>
+          <%# Don't use image_tag here due to asset host %>
+          <%= tag('img', src: custom_style_logo_path(digest: @custom_style.digest, filename: @custom_style.logo_identifier), class: 'custom-logo-preview') %>
+          <%= link_to t(:button_delete),
+                      custom_style_logo_delete_path,
+                      method: :delete,
+                      class: 'icon icon-delete confirm-form-submit' %>
+        </div>
+      <% end %>
+      <div class="grid-block">
+        <div class="form--field -required">
+          <div class="attachment_field form--field-container -vertical -shrink">
+            <div class="form--file-container">
+              <%= f.file_field :logo, required: true, class: "attachment_choose_file", size: "15" %>
+            </div>
+          </div>
+          <div class="form--field-instructions">
+            <%= t('text_custom_logo_instructions') %>
+          </div>
+        </div>
+      </div>
+      <%= styled_button_tag I18n.t(@custom_style.logo.present? ? :button_replace : :button_upload),
+                            class: "button #{@custom_style.logo.blank? ? '-with-icon icon-add' : ''}" %>
+    </fieldset>
+  </section>
+<% end %>
+<%= form_for @custom_style, url: custom_style_path, html: { multipart: true, class: "form -vertical" } do |f| %>
+  <section class="form--section">
+    <fieldset class="form--fieldset">
+      <legend class="form--fieldset-legend"><%= I18n.t(:label_custom_favicon) %></legend>
+
+      <% if @custom_style.id && @custom_style.favicon.present? %>
+        <div>
+          <%= tag('img', src: custom_style_favicon_path(digest: @custom_style.digest, filename: @custom_style.favicon_identifier), class: 'custom-favicon-preview') %>
+          <%= link_to t(:button_delete),
+                      custom_style_favicon_delete_path,
+                      method: :delete,
+                      class: 'icon icon-delete confirm-form-submit' %>
+        </div>
+      <% end %>
+      <div class="grid-block">
+        <div class="form--field -required">
+          <div class="attachment_field form--field-container -vertical -shrink">
+            <div class="form--file-container">
+              <%= f.file_field :favicon, required: true, class: "attachment_choose_file", size: "15" %>
+            </div>
+          </div>
+          <div class="form--field-instructions">
+            <%= t('text_custom_favicon_instructions') %>
+          </div>
+        </div>
+      </div>
+      <%= styled_button_tag t(@custom_style.favicon.present? ? :button_replace : :button_upload), class: "button #{@custom_style.favicon.blank? ? '-with-icon icon-add' : ''}" %>
+    </fieldset>
+  </section>
+<% end %>
+<%= form_for @custom_style, url: custom_style_path, html: { multipart: true, class: "form -vertical" } do |f| %>
+  <section class="form--section">
+    <fieldset class="form--fieldset">
+      <legend class="form--fieldset-legend"><%= I18n.t(:label_custom_touch_icon) %></legend>
+      <% if @custom_style.id && @custom_style.touch_icon.present? %>
+        <div>
+          <%= tag('img', src: custom_style_touch_icon_path(digest: @custom_style.digest, filename: @custom_style.touch_icon_identifier), class: 'custom-touch-icon-preview') %>
+          <%= link_to t(:button_delete),
+                      custom_style_touch_icon_delete_path,
+                      method: :delete,
+                      class: 'icon icon-delete confirm-form-submit' %>
+        </div>
+      <% end %>
+      <div class="grid-block">
+        <div class="form--field -required">
+          <div class="attachment_field form--field-container -vertical -shrink">
+            <div class="form--file-container">
+              <%= f.file_field :touch_icon, required: true, class: "attachment_choose_file", size: "15" %>
+            </div>
+          </div>
+          <div class="form--field-instructions">
+            <%= t('text_custom_touch_icon_instructions') %>
+          </div>
+        </div>
+      </div>
+      <%= styled_button_tag t(@custom_style.touch_icon.present? ? :button_replace : :button_upload), class: "button #{@custom_style.touch_icon.blank? ? '-with-icon icon-add' : ''}" %>
+    </fieldset>
+  </section>
+<% end %>