highlighting strings w multiple instaances

2 files changed, 27 insertions, 5 deletions

diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 54b0bbe65..fd687328c 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -52,6 +52,8 @@ export interface EditableProps {
     color?: string | undefined;
     onDrop?: any;
     placeholder?: string;
+    highlight?: boolean;
+    positions?: number[];
 }
 
 /**
@@ -180,7 +182,9 @@ export class EditableView extends React.Component<EditableProps> {
                 placeholder={this.props.placeholder}
             />;
     }
+
     render() {
+        console.log(this.props.contents.valueOf())
         if (this._editing && this.props.GetValue() !== undefined) {
             return this.props.sizeToContent ?
                 <div style={{ display: "grid", minWidth: 100 }}>
@@ -194,9 +198,10 @@ export class EditableView extends React.Component<EditableProps> {
                     ref={this._ref}
                     style={{ display: this.props.display, minHeight: "20px", height: `${this.props.height ? this.props.height : "auto"}`, maxHeight: `${this.props.maxHeight}` }}
                     onClick={this.onClick} placeholder={this.props.placeholder}>
+                    {this.props.highlight ? this.props.contents.forEach(el => {
+                        console.log(el.valueOf());
+                    }) : undefined}
                     <span style={{ backgroundColor: "#FFFF00", fontStyle: this.props.fontStyle, fontSize: this.props.fontSize, color: this.props.contents ? "black" : "grey" }}>{this.props.contents ? this.props.contents?.valueOf() : this.props.placeholder?.valueOf()}</span>
-
-
                 </div>
             );
         }
diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 5a84408f7..3fc29c46e 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -244,23 +244,40 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
         //     </div>
         // );   
         trace();
-
+        let positions = [];
         if (type === "string") {
+            let term = contents
             let search = StrCast(this.props.Document._searchString)
-            let start = contents.indexOf(search);
-            console.log(contents.slice(start, search.length));
+            let start = term.indexOf(search) as number;
+            let tally = 0;
+            positions.push(start);
+            while (start < contents.length && start !== -1) {
+                console.log(start, search.length + 1);
+                console.log(term.slice(start, start + search.length + 1));
+                term = term.slice(start + search.length + 1);
+                tally += start + search.length + 1;
+                console.log(term);
+                start = term.indexOf(search);
+                positions.push(tally + start);
+                console.log(start);
+            }
+            positions.pop();
+            console.log(positions);
         }
 
         StrCast(this.props.Document._searchString) ? console.log(StrCast(this.props.Document._searchString)) : undefined;
+
         return (
             <div className="collectionSchemaView-cellContainer" style={{ cursor: fieldIsDoc ? "grab" : "auto" }} ref={dragRef} onPointerDown={this.onPointerDown} onPointerEnter={onPointerEnter} onPointerLeave={onPointerLeave}>
                 <div className={className} ref={this._focusRef} onPointerDown={onItemDown} tabIndex={-1}>
                     <div className="collectionSchemaView-cellContents" ref={type === undefined || type === "document" ? this.dropRef : null} key={props.Document[Id]}>
                         <EditableView
+                            positions={positions}
                             editing={this._isEditing}
                             isEditingCallback={this.isEditingCallback}
                             display={"inline"}
                             contents={contents ? contents : type === "number" ? "0" : "undefined"}
+                            highlight={true}
                             //contents={StrCast(contents)}
                             height={"auto"}
                             maxHeight={Number(MAX_ROW_HEIGHT)}