feat: elegantly handle long service names in index.

Author: bangn

lib/pact_broker/ui/view_models/index_item.rb

@@ -22,11 +22,11 @@ def provider_name
         end
 
         def consumer_version_number
-          short_version_number(@relationship.consumer_version_number)
+          @relationship.consumer_version_number
         end
 
         def provider_version_number
-          short_version_number(@relationship.provider_version_number)
+          @relationship.provider_version_number
         end
 
         def tag_names
@@ -145,4 +145,4 @@ def short_version_number version_number
       end
     end
   end
-end
+end

lib/pact_broker/ui/views/index/show-with-tags.haml

@@ -18,14 +18,14 @@
         %th.consumer
           Consumer
           %span.glyphicon.glyphicon-sort.relationships-sort
-        %th.tag
+        %th.consumer-version-number
           Version
           %span.glyphicon.glyphicon-sort.relationships-sort
         %th.pact{ style: 'width: 40px' }
         %th.provider
           Provider
           %span.glyphicon.glyphicon-sort.relationships-sort
-        %th.tag
+        %th.provider-version-number
           Version
           %span.glyphicon.glyphicon-sort.relationships-sort
         %th
@@ -41,7 +41,7 @@
           %td.consumer
             %a{:href => index_item.consumer_group_url }
               = index_item.consumer_name
-          %td
+          %td.consumer-version-number
             = index_item.consumer_version_number
             %span{style: 'color:gray'}
               = index_item.tag_names
@@ -51,7 +51,7 @@
           %td.provider
             %a{ href: index_item.provider_group_url }
               = index_item.provider_name
-          %td
+          %td.provider-version-number
             = index_item.provider_version_number
           %td
             = index_item.publication_date_of_latest_pact.gsub("about ", "")

public/stylesheets/index.css

@@ -4,6 +4,7 @@
 }
 
 .table-striped>tbody>tr>td.consumer, .table-striped>thead>tr>th.consumer {
+  padding: 2px;
   border-right: none;
 }
 
@@ -49,6 +50,11 @@ body { padding-top: 10px; }
 
 .consumer, .provider {
   text-align: center;
+  word-wrap: break-word;
+}
+
+.consumer-version-number, .provider-version-number {
+  word-wrap: break-word;
 }
 
 span.pact {