primer_view_components 0.0.50 → 0.0.54

data/lib/primer/view_components/linters/argument_mappers/label.rb

@@ -27,12 +27,11 @@ module ERBLint
         ATTRIBUTES = %w[title].freeze
 
         def attribute_to_args(attribute)
-          Helpers::ErbBlock.raise_if_erb_block(attribute)
-          { title: attribute.value.to_json }
+          { title: erb_helper.convert(attribute) }
         end
 
         def classes_to_args(classes)
-          classes.split(" ").each_with_object({}) do |class_name, acc|
+          classes.each_with_object({ classes: [] }) do |class_name, acc|
             next if class_name == "Label"
 
             if SCHEME_MAPPINGS[class_name] && acc[:scheme].nil?
@@ -40,7 +39,7 @@ module ERBLint
             elsif VARIANT_MAPPINGS[class_name] && acc[:variant].nil?
               acc[:variant] = VARIANT_MAPPINGS[class_name]
             else
-              raise ConversionError, "Cannot convert class \"#{class_name}\""
+              acc[:classes] << class_name
             end
           end
         end

data/lib/primer/view_components/linters/argument_mappers/system_arguments.rb

@@ -11,9 +11,11 @@ module ERBLint
         STRING_PARAMETERS = %w[aria- data-].freeze
         TEST_SELECTOR_REGEX = /test_selector\((?<selector>.+)\)$/.freeze
 
-        attr_reader :attribute
+        attr_reader :attribute, :erb_helper
+
         def initialize(attribute)
           @attribute = attribute
+          @erb_helper = Helpers::ErbBlock.new
         end
 
         def to_args
@@ -29,13 +31,9 @@ module ERBLint
 
             { test_selector: m[:selector].tr("'", '"') }
           elsif attr_name == "data-test-selector"
-            Helpers::ErbBlock.raise_if_erb_block(attribute)
-
-            { test_selector: attribute.value.to_json }
+            { test_selector: erb_helper.convert(attribute) }
           elsif attr_name.start_with?(*STRING_PARAMETERS)
-            Helpers::ErbBlock.raise_if_erb_block(attribute)
-
-            { "\"#{attr_name}\"" => attribute.value.to_json }
+            { "\"#{attr_name}\"" => erb_helper.convert(attribute) }
           else
             raise ConversionError, "Cannot convert attribute \"#{attr_name}\""
           end

data/lib/primer/view_components/linters/autocorrectable.rb

@@ -4,9 +4,11 @@ require_relative "argument_mappers/conversion_error"
 
 module ERBLint
   module Linters
-    # Helper methods for autocorrectable ERB linters.
+    # Provides the autocorrection functionality for the linter. Once included, you should define the following constants:
+    # * `ARGUMENT_MAPPER` - required - The class responsible for transforming classes and attributes into arguments for the component.
+    # * `COMPONENT` - required - The component name for the linter. It will be used to generate the correction.
     module Autocorrectable
-      def map_arguments(tag)
+      def map_arguments(tag, _tag_tree)
         self.class::ARGUMENT_MAPPER.new(tag).to_s
       rescue ArgumentMappers::ConversionError
         nil
@@ -20,10 +22,10 @@ module ERBLint
         "#{correction} do %>"
       end
 
-      def message(args)
+      def message(args, processed_source)
         return self.class::MESSAGE if args.nil?
 
-        "#{self.class::MESSAGE}\n\nTry using:\n\n#{correction(args)}\n\nInstead of:\n"
+        "#{self.class::MESSAGE}\nTry using:\n\n#{correction(args)}\n\nYou can also run erblint in autocorrect mode:\n\nbundle exec erblint -a #{processed_source.filename}\n"
       end
     end
   end

data/lib/primer/view_components/linters/{helpers.rb → base_linter.rb}

@@ -4,10 +4,16 @@ require "json"
 require "openssl"
 require "primer/view_components/constants"
 
+# :nocov:
+
 module ERBLint
   module Linters
-    # Helper methods for linting ERB.
-    module Helpers
+    # Provides the basic linter logic. When inherited, you should define:
+    # * `TAGS` - required - The HTML tags that the component supports. It will be used by the linter to match elements.
+    # * `MESSAGE` - required - The message shown when there's an offense.
+    # * `CLASSES` - optional - The CSS classes that the component needs. The linter will only match elements with one of those classes.
+    # * `REQUIRED_ARGUMENTS` - optional - A list of HTML attributes that are required by the component.
+    class BaseLinter < Linter
       # from https://github.com/Shopify/erb-lint/blob/6179ee2d9d681a6ec4dd02351a1e30eefa748d3d/lib/erb_lint/linters/self_closing_tag.rb
       SELF_CLOSING_TAGS = %w[
         area base br col command embed hr input keygen
@@ -15,33 +21,44 @@ module ERBLint
       ].freeze
 
       DUMP_FILE = ".erblint-counter-ignore.json"
+      DISALLOWED_CLASSES = [].freeze
+      CLASSES = [].freeze
+      REQUIRED_ARGUMENTS = [].freeze
+
+      class ConfigSchema < LinterConfig
+        property :override_ignores_if_correctable, accepts: [true, false], default: false, reader: :override_ignores_if_correctable?
+      end
 
-      def self.included(base)
+      def self.inherited(base)
+        super
         base.include(ERBLint::LinterRegistry)
+        base.config_schema = ConfigSchema
       end
 
       def run(processed_source)
         @total_offenses = 0
         @offenses_not_corrected = 0
-        tags = tags(processed_source)
-        tag_tree = build_tag_tree(tags)
+        (tags, tag_tree) = build_tag_tree(processed_source)
 
         tags.each do |tag|
           next if tag.closing?
           next unless self.class::TAGS&.include?(tag.name)
 
           classes = tag.attributes["class"]&.value&.split(" ") || []
-
           tag_tree[tag][:offense] = false
 
+          next if (classes & self.class::DISALLOWED_CLASSES).any?
           next unless self.class::CLASSES.blank? || (classes & self.class::CLASSES).any?
 
-          args = map_arguments(tag)
+          args = map_arguments(tag, tag_tree[tag])
           correction = correction(args)
 
+          attributes = tag.attributes.each.map(&:name).join(" ")
+          matches_required_attributes = self.class::REQUIRED_ARGUMENTS.blank? || self.class::REQUIRED_ARGUMENTS.all? { |arg| attributes.match?(arg) }
+
           tag_tree[tag][:offense] = true
-          tag_tree[tag][:correctable] = !correction.nil?
-          tag_tree[tag][:message] = message(args)
+          tag_tree[tag][:correctable] = matches_required_attributes && !correction.nil?
+          tag_tree[tag][:message] = message(args, processed_source)
           tag_tree[tag][:correction] = correction
         end
 
@@ -51,8 +68,7 @@ module ERBLint
           @total_offenses += 1
           # We always fix the offenses using blocks. The closing tag corresponds to `<% end %>`.
           if h[:correctable]
-            add_offense(tag.loc, h[:message], h[:correction])
-            add_offense(h[:closing].loc, h[:message], "<% end %>")
+            add_correction(tag, h)
           else
             @offenses_not_corrected += 1
             generate_offense(self.class, processed_source, tag, h[:message])
@@ -78,11 +94,16 @@ module ERBLint
 
       private
 
+      def add_correction(tag, tag_tree)
+        add_offense(tag.loc, tag_tree[:message], tag_tree[:correction])
+        add_offense(tag_tree[:closing].loc, tag_tree[:message], "<% end %>")
+      end
+
       # Override this function to convert the HTML element attributes to argument for a component.
       #
       # @return [Hash] if possible to map all attributes to arguments.
       # @return [Nil] if cannot map to arguments.
-      def map_arguments(_tag)
+      def map_arguments(_tag, _tag_tree)
         nil
       end
 
@@ -97,7 +118,7 @@ module ERBLint
       # Override this function to customize the linter message.
       #
       # @return [String] message to show on linter error.
-      def message(_tag)
+      def message(_tag, _processed_source)
         self.class::MESSAGE
       end
 
@@ -118,31 +139,44 @@ module ERBLint
       # This assumes that the AST provided represents valid HTML, where each tag has a corresponding closing tag.
       # From the tags, we build a structured tree which represents the tag hierarchy.
       # With this, we are able to know where the tags start and end.
-      def build_tag_tree(tags)
+      def build_tag_tree(processed_source)
+        nodes = processed_source.ast.children
         tag_tree = {}
+        tags = []
         current_opened_tag = nil
 
-        tags.each do |tag|
-          if tag.closing?
-            if current_opened_tag && tag.name == current_opened_tag.name
-              tag_tree[current_opened_tag][:closing] = tag
-              current_opened_tag = tag_tree[current_opened_tag][:parent]
-            end
+        nodes.each do |node|
+          if node.type == :tag
+            # get the tag from previously calculated list so the references are the same
+            tag = BetterHtml::Tree::Tag.from_node(node)
+            tags << tag
 
-            next
-          end
+            if tag.closing?
+              if current_opened_tag && tag.name == current_opened_tag.name
+                tag_tree[current_opened_tag][:closing] = tag
+                current_opened_tag = tag_tree[current_opened_tag][:parent]
+              end
+
+              next
+            end
 
-          self_closing = self_closing?(tag)
+            self_closing = self_closing?(tag)
 
-          tag_tree[tag] = {
-            closing: self_closing ? tag : nil,
-            parent: current_opened_tag
-          }
+            tag_tree[tag] = {
+              tag: tag,
+              closing: self_closing ? tag : nil,
+              parent: current_opened_tag,
+              children: []
+            }
 
-          current_opened_tag = tag unless self_closing
+            tag_tree[current_opened_tag][:children] << tag_tree[tag] if current_opened_tag
+            current_opened_tag = tag unless self_closing
+          elsif current_opened_tag
+            tag_tree[current_opened_tag][:children] << node
+          end
         end
 
-        tag_tree
+        [tags, tag_tree]
       end
 
       def self_closing?(tag)
@@ -169,6 +203,12 @@ module ERBLint
           end
         end
 
+        # Unless explicitly set, we don't want to mark correctable offenses if the counter is correct.
+        if !@config.override_ignores_if_correctable? && expected_count == @total_offenses
+          clear_offenses
+          return
+        end
+
         if @offenses_not_corrected.zero?
           # have to adjust to get `\n` so we delete the whole line
           add_offense(processed_source.to_source_range(comment_node.loc.adjust(end_pos: 1)), "Unused erblint:count comment for #{rule_name}", "") if comment_node

data/lib/primer/view_components/linters/button_component_migration_counter.rb

@@ -1,14 +1,13 @@
 # frozen_string_literal: true
 
-require_relative "helpers"
+require_relative "base_linter"
 require_relative "autocorrectable"
 require_relative "argument_mappers/button"
 
 module ERBLint
   module Linters
     # Counts the number of times a HTML button is used instead of the component.
-    class ButtonComponentMigrationCounter < Linter
-      include Helpers
+    class ButtonComponentMigrationCounter < BaseLinter
       include Autocorrectable
 
       TAGS = Primer::ViewComponents::Constants.get(
@@ -16,6 +15,8 @@ module ERBLint
         constant: "TAG_OPTIONS"
       ).freeze
 
+      # CloseButton component has preference when this class is seen in conjuction with `btn`.
+      DISALLOWED_CLASSES = %w[close-button].freeze
       CLASSES = %w[btn btn-link].freeze
       MESSAGE = "We are migrating buttons to use [Primer::ButtonComponent](https://primer.style/view-components/components/button), please try to use that instead of raw HTML."
       ARGUMENT_MAPPER = ArgumentMappers::Button

data/lib/primer/view_components/linters/clipboard_copy_component_migration_counter.rb

@@ -1,18 +1,17 @@
 # frozen_string_literal: true
 
-require_relative "helpers"
+require_relative "base_linter"
 require_relative "autocorrectable"
 require_relative "argument_mappers/clipboard_copy"
 
 module ERBLint
   module Linters
     # Counts the number of times a HTML clipboard-copy is used instead of the component.
-    class ClipboardCopyComponentMigrationCounter < Linter
-      include Helpers
+    class ClipboardCopyComponentMigrationCounter < BaseLinter
       include Autocorrectable
 
       TAGS = %w[clipboard-copy].freeze
-      CLASSES = %w[].freeze
+      REQUIRED_ARGUMENTS = [/for|value/, "aria-label"].freeze
       MESSAGE = "We are migrating clipboard-copy to use [Primer::ClipboardCopy](https://primer.style/view-components/components/clipboardcopy), please try to use that instead of raw HTML."
       ARGUMENT_MAPPER = ArgumentMappers::ClipboardCopy
       COMPONENT = "Primer::ClipboardCopy"

data/lib/primer/view_components/linters/close_button_component_migration_counter.rb

@@ -1,16 +1,123 @@
 # frozen_string_literal: true
 
-require_relative "helpers"
+require_relative "base_linter"
+require_relative "autocorrectable"
+require_relative "argument_mappers/close_button"
 
 module ERBLint
   module Linters
     # Counts the number of times a HTML clipboard-copy is used instead of the component.
-    class CloseButtonComponentMigrationCounter < Linter
-      include Helpers
+    class CloseButtonComponentMigrationCounter < BaseLinter
+      include Autocorrectable
 
       TAGS = %w[button].freeze
       CLASSES = %w[close-button].freeze
       MESSAGE = "We are migrating close-button to use [Primer::CloseButton](https://primer.style/view-components/components/closebutton), please try to use that instead of raw HTML."
+      ARGUMENT_MAPPER = ArgumentMappers::CloseButton
+      COMPONENT = "Primer::CloseButton"
+
+      ALLOWED_OCTICON_ARGS = %w[icon aria-label aria].freeze
+
+      private
+
+      def map_arguments(tag, tag_tree)
+        # We can only autocorrect cases where the tag only has an octicon as content.
+        return if tag_tree[:children].size != 1
+
+        nodes = tag_tree[:children].first.children
+        erb_nodes = nodes.select { |node| node.try(:type) == :erb }
+
+        # Don't correct if there are multiple ERB nodes.
+        return if erb_nodes.size != 1
+
+        _, _, code_node = *erb_nodes.first
+        code = code_node.children.first.strip
+        ast = erb_ast(code)
+
+        # We'll only autocorrect cases where the only content is an octicon.
+        if ast.method_name == :primer_octicon || ast.method_name == :octicon
+          octicon_kwargs = ast.arguments[1]
+          icon = icon(ast.arguments)
+        elsif ast.method_name == :render && code.include?("Primer::OcticonComponent")
+          octicon_kwargs = ast.arguments.first.arguments.last
+          icon = icon(ast.arguments.first.arguments)
+        else
+          return
+        end
+
+        # Don't autocorrect if using a custom icon
+        return unless icon == :x
+        # Don't autocorrect if the octicon has custom arguments
+        return if custom_attributes?(octicon_kwargs)
+
+        octicon_aria_label = aria_label_from_octicon(octicon_kwargs)
+        tag_aria_label = tag.attributes.each.find { |a| a.name == "aria-label" }
+
+        # Can't autocorrect if there is no aria-label.
+        return if octicon_aria_label.blank? && tag_aria_label.blank?
+
+        args = ARGUMENT_MAPPER.new(tag).to_s
+
+        # Argument mapper will add the `aria-label` if the tag has it.
+        return args if tag_aria_label.present?
+
+        aria_label_arg = "\"aria-label\": #{octicon_aria_label}"
+
+        return aria_label_arg if args.blank?
+
+        "#{args}, #{aria_label_arg}"
+      rescue ArgumentMappers::ConversionError
+        nil
+      end
+
+      # Overriding the basic correction since this component does not uses content blocks.
+      def correction(args)
+        return if args.nil?
+
+        correction = "<%= render #{self.class::COMPONENT}.new"
+        correction += "(#{args})" if args.present?
+        "#{correction} %>"
+      end
+
+      # Overriding the basic correction since this component will rewrite the whole tag block.
+      def add_correction(tag, tag_tree)
+        offense_loc = tag.loc.with(end_pos: tag_tree[:closing].loc.to_range.last)
+        add_offense(offense_loc, tag_tree[:message], tag_tree[:correction])
+      end
+
+      # Extracts the aria-label value from the octicon kwargs.
+      # It can either be in `"aria-label": "value"`` or `aria: { label: "value" } }`.
+      def aria_label_from_octicon(kwargs)
+        return if kwargs.blank? || kwargs.type != :hash || kwargs.pairs.blank?
+
+        aria_label = kwargs.pairs.find { |x| x.key.value == :"aria-label" }
+
+        return aria_label.value.source if aria_label
+
+        aria_hash = kwargs.pairs.find { |x| x.key.value == :aria }
+
+        return if aria_hash.blank?
+
+        aria_label = aria_hash.value.pairs.find { |x| x.key.value == :label }
+
+        aria_label&.value&.source
+      end
+
+      def custom_attributes?(kwargs)
+        return false if kwargs.blank? || kwargs.type != :hash || kwargs.pairs.blank?
+
+        (kwargs.keys.map { |key| key.value.to_s } - ALLOWED_OCTICON_ARGS).present?
+      end
+
+      def erb_ast(code)
+        RuboCop::AST::ProcessedSource.new(code, RUBY_VERSION.to_f).ast
+      end
+
+      def icon(args)
+        return args.first.value.to_sym if args.first.type == :sym || args.first.type == :str
+
+        args.last.pairs.find { |x| x.key.value == :icon }.value.value.to_sym
+      end
     end
   end
 end

data/lib/primer/view_components/linters/flash_component_migration_counter.rb

@@ -1,16 +1,31 @@
 # frozen_string_literal: true
 
-require_relative "helpers"
+require_relative "base_linter"
+require_relative "autocorrectable"
+require_relative "argument_mappers/flash"
 
 module ERBLint
   module Linters
     # Counts the number of times a HTML flash is used instead of the component.
-    class FlashComponentMigrationCounter < Linter
-      include Helpers
+    class FlashComponentMigrationCounter < BaseLinter
+      include Autocorrectable
 
       TAGS = %w[div].freeze
       CLASSES = %w[flash].freeze
       MESSAGE = "We are migrating flashes to use [Primer::FlashComponent](https://primer.style/view-components/components/flash), please try to use that instead of raw HTML."
+      ARGUMENT_MAPPER = ArgumentMappers::Flash
+      COMPONENT = "Primer::FlashComponent"
+
+      def map_arguments(tag, tag_tree)
+        # We can only autocorrect elements with simple text as content.
+        return nil if tag_tree[:children].size != 1
+        # Hash children indicates that there are tags in the content.
+        return nil if tag_tree[:children].first.is_a?(Hash)
+
+        ARGUMENT_MAPPER.new(tag).to_s
+      rescue ArgumentMappers::ConversionError
+        nil
+      end
     end
   end
 end