Move truncation of docker ids to FE to allow full value in tooltips

- Reveals full id if you search for it.
- Difficult to copy and paste the full id if you want it for some reason

client/app/scripts/components/matched-results.js

@@ -18,7 +18,8 @@ class MatchedResults extends React.Component {
           <span className="matched-results-match-label">
             {match.label}:
           </span>
-          <MatchedText text={text} match={match} maxLength={MAX_MATCH_LENGTH} />
+          <MatchedText text={text} match={match} maxLength={MAX_MATCH_LENGTH}
+            truncate={match.truncate} />
         </div>
       </div>
     );

client/app/scripts/components/matched-text.js

@@ -82,15 +82,20 @@ function truncateChunks(chunks, text, maxLength) {
 class MatchedText extends React.Component {
 
   render() {
-    const { match, text, maxLength } = this.props;
+    const { match, text, truncate, maxLength } = this.props;
+
+    const showFullValue = !truncate || match && match.start + match.length > truncate;
+    const displayText = showFullValue ? text : text.slice(0, truncate);
 
     if (!match) {
-      return <span>{text}</span>;
+      return <span>{displayText}</span>;
     }
 
+    const chunks = chunkText(displayText, match);
+
     return (
       <span className="matched-text" title={text}>
-        {truncateChunks(chunkText(text, match), text, maxLength).map((chunk, index) => {
+        {truncateChunks(chunks, displayText, maxLength).map((chunk, index) => {
           if (chunk.match) {
             return (
               <span className="match" key={index}>

client/app/scripts/components/node-details/node-details-info.js

@@ -42,7 +42,10 @@ export default class NodeDetailsInfo extends React.Component {
               {field.label}
             </div>
             <div className="node-details-info-field-value truncate" title={field.value}>
-              <MatchedText text={field.value} match={matches.get(field.id)} />
+              <MatchedText
+                text={field.value}
+                truncate={field.truncate}
+                match={matches.get(field.id)} />
             </div>
           </div>
         ))}

client/app/scripts/utils/search-utils.js

@@ -64,7 +64,7 @@ function matchPrefix(label, prefix) {
  * no match).
  * Returns a new instance of nodeMatches.
  */
-function findNodeMatch(nodeMatches, keyPath, text, query, prefix, label) {
+function findNodeMatch(nodeMatches, keyPath, text, query, prefix, label, truncate) {
   if (!prefix || matchPrefix(label, prefix)) {
     const queryRe = makeRegExp(query);
     const matches = text.match(queryRe);
@@ -72,7 +72,7 @@ function findNodeMatch(nodeMatches, keyPath, text, query, prefix, label) {
       const firstMatch = matches[0];
       const index = text.search(queryRe);
       nodeMatches = nodeMatches.setIn(keyPath,
-        {text, label, start: index, length: firstMatch.length});
+        {text, label, start: index, length: firstMatch.length, truncate});
     }
   }
   return nodeMatches;
@@ -135,7 +135,7 @@ export function searchTopology(nodes, { prefix, query, metric, comp, value }) {
         node.get('metadata').forEach(field => {
           const keyPath = [nodeId, 'metadata', field.get('id')];
           nodeMatches = findNodeMatch(nodeMatches, keyPath, field.get('value'),
-            query, prefix, field.get('label'));
+            query, prefix, field.get('label'), field.get('truncate'));
         });
       }
 

report/metadata_template.go

@@ -45,13 +45,11 @@ func (t MetadataTemplate) MetadataRows(n Node) []MetadataRow {
 		from = fromCounters
 	}
 	if val, ok := from(n, t.ID); ok {
-		if t.Truncate > 0 && len(val) > t.Truncate {
-			val = val[:t.Truncate]
-		}
 		return []MetadataRow{{
 			ID:       t.ID,
 			Label:    t.Label,
 			Value:    val,
+			Truncate: t.Truncate,
 			Datatype: t.Datatype,
 			Priority: t.Priority,
 		}}
@@ -89,6 +87,7 @@ type MetadataRow struct {
 	Value    string  `json:"value"`
 	Priority float64 `json:"priority,omitempty"`
 	Datatype string  `json:"dataType,omitempty"`
+	Truncate int     `json:"truncate,omitempty"`
 }
 
 // Copy returns a value copy of a metadata row.