[#60144] primerize wp types settings form

app/components/work_packages/types/settings_component.html.erb

@@ -0,0 +1,34 @@
+<%#-- 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.
+
+++#%>
+
+<%=
+  primer_form_with(**form_options) do |f|
+    render(WorkPackages::Types::SettingsForm.new(f))
+  end
+%>

app/components/work_packages/types/settings_component.rb

@@ -0,0 +1,46 @@
+# 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 WorkPackages
+  module Types
+    class SettingsComponent < ApplicationComponent
+      include OpPrimer::ComponentHelpers
+      include OpTurbo::Streamable
+
+      def form_options
+        {
+          url: model.new_record? ? types_path : type_path(id: model.id),
+          method: model.new_record? ? :post : :patch,
+          model:
+        }
+      end
+    end
+  end
+end

app/controllers/types_controller.rb

@@ -62,7 +62,7 @@ def edit
     end
   end
 
-  def create # rubocop:disable Metrics/AbcSize
+  def create
     CreateTypeService
       .new(current_user)
       .call(permitted_type_params, copy_workflow_from: params[:copy_workflow_from]) do |call|
@@ -72,9 +72,7 @@ def create # rubocop:disable Metrics/AbcSize
         redirect_to_type_tab_path(@type, t(:notice_successful_create))
       end
 
-      call.on_failure do |result|
-        flash[:error] = result.errors.full_messages.join("\n")
-        load_projects_and_types
+      call.on_failure do
         render action: :new, status: :unprocessable_entity
       end
     end

app/forms/work_packages/types/settings_form.rb

@@ -0,0 +1,108 @@
+# 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 WorkPackages
+  module Types
+    class SettingsForm < ApplicationForm
+      form do |subject_form|
+        subject_form.text_field(
+          name: :name,
+          label: label(:name),
+          placeholder: I18n.t(:label_name),
+          input_width: :large,
+          required: true,
+          disabled: model.is_standard?
+        )
+
+        subject_form.color_select_list(
+          name: :color_id,
+          label: Color.model_name.human,
+          caption: I18n.t("types.edit.settings.type_color_text"),
+          input_width: :large
+        )
+
+        if show_work_flow_copy?
+          subject_form.select_list(
+            name: :copy_workflow_from,
+            label: label(:copy_workflow_from),
+            include_blank: true,
+            input_width: :large
+          ) do |other_types|
+            work_package_types.each do |type|
+              other_types.option(value: type.id, label: type.name)
+            end
+          end
+        end
+
+        subject_form.rich_text_area(
+          name: :description,
+          label: label(:description),
+          input_width: :large,
+          rich_text_options: { showAttachments: false }
+        )
+
+        subject_form.check_box(
+          name: :is_milestone,
+          label: label(:is_milestone)
+        )
+
+        subject_form.check_box(
+          name: :is_in_roadmap,
+          label: label(:is_in_roadmap)
+        )
+
+        subject_form.check_box(
+          name: :is_default,
+          label: label(:is_default)
+        )
+
+        subject_form.submit(
+          name: :submit,
+          label: I18n.t(:button_save),
+          scheme: :primary
+        )
+      end
+
+      private
+
+      def label(attribute)
+        model.class.human_attribute_name(attribute)
+      end
+
+      def show_work_flow_copy?
+        model.new_record?
+      end
+
+      def work_package_types
+        Type.all
+      end
+    end
+  end
+end

app/helpers/types_helper.rb

@@ -34,9 +34,9 @@ def types_tabs
     tabs = [
       {
         name: "settings",
-        partial: "types/form/settings",
         path: edit_tab_type_path(id: @type.id, tab: :settings),
-        label: "types.edit.settings.tab"
+        label: "types.edit.settings.tab",
+        view_component: WorkPackages::Types::SettingsComponent
       },
       {
         name: "form_configuration",

app/views/types/new.html.erb

@@ -39,8 +39,4 @@ See COPYRIGHT and LICENSE files for more details.
   end
 %>
 
-<%= error_messages_for 'type' %>
-
-<%= form_for controller.type, builder: TabularFormBuilder, lang: current_language  do |f| %>
-  <%= render partial: 'types/form/settings', locals: { f: f } %>
-<% end %>
+<%= render WorkPackages::Types::SettingsComponent.new(@type) %>

lib/primer/open_project/forms/color_select.html.erb

@@ -2,7 +2,7 @@
   <%= content_tag(:div, **@field_wrap_arguments) do %>
     <%= builder.hidden_field :color_id %>
     <%= angular_component_tag("opce-colors-autocompleter",
-                              class: "colors-autocomplete form--select-container -middle",
+                              class: "colors-autocomplete form--select-container",
                               data: {
                                 colors:,
                                 classes: "ng-select--primerized",