Improved search-replace component logic by disabing buttons when no query; displaying found/not found status; displaying too long query; adding ctrl-up and down key bindig on query field to god prev-next instance found

package.json

@@ -30,7 +30,10 @@
         "icon": "./icos/",
         "files": [
             "newton/",
-            "build/"
+            "build/",
+            "!node_modules/ace-builds/",
+            "!node_modules/web-streams-polyfill/",
+            "!node_modules/@angular/"
         ],
         "mac": {
             "category": "public.app-category.developer-tools"
@@ -46,7 +49,13 @@
     },
     "postinstall": "electron-builder install-app-deps",
     "dependencies": {
+        "@angular/cdk": "19.2.0",
+        "@angular/common": "19.2.0",
+        "@angular/core": "19.2.0",
+        "@angular/forms": "19.2.0",
+        "@angular/platform-browser": "19.2.0",
         "@xterm/xterm": "5.5.0",
+        "ace-builds": "1.43.0",
         "ace-diff": "3.0.3",
         "ace-layout": "1.5.0",
         "ace-linters": "1.8.3",
@@ -57,21 +66,16 @@
         "express": "4.18.2",
         "marked": "16.4.0",
         "node-fetch": "3.3.2",
-        "node-pty": "1.0.0",
+        "node-pty": "^1.0.0",
+        "rxjs": "7.8.0",
         "socket.io": "4.8.1",
         "uuid": "11.1.0",
         "zone.js": "0.15.0"
     },
     "devDependencies": {
-        "ace-builds": "1.43.0",
         "@angular-devkit/build-angular": "19.2.8",
-        "@angular/cdk": "19.2.0",
-        "@angular/common": "19.2.0",
-        "@angular/core": "19.2.0",
         "@angular/cli": "19.2.8",
         "@angular/compiler-cli": "19.2.0",
-        "@angular/forms": "19.2.0",
-        "@angular/platform-browser": "19.2.0",
         "@types/express": "4.17.17",
         "@types/jasmine": "5.1.0",
         "@types/node": "18.18.0",
@@ -87,7 +91,6 @@
         "karma-jasmine": "5.1.0",
         "karma-jasmine-html-reporter": "2.1.0",
         "nanoevents": "9.1.0",
-        "rxjs": "7.8.0",
         "tree-sitter": "0.21.1",
         "tree-sitter-bash": "0.23.2",
         "tree-sitter-c": "0.23.1",

src/app/editor/search-replace/search-replace.component.html

@@ -8,13 +8,12 @@
             } @else if (isQueryNotFound) {
                 <label id="find-status-lbl">
                     <b class="warning">Query not found...</b>
+                    <p class="warning" style="white-space: pre;">{{query}}</p>
                 </label>
-            } @else if (query && !isQueryLong && !isQueryNotFound) {
+            } @else if (!isQueryLong && !isQueryNotFound) {
-                <label id="find-status-lbl">Found in current file:
+                <label id="find-status-lbl">Find in Current File:
-                    <b class="success">{{totalCount}}</b>
+                    <p class="success">{{query}}</p>
                 </label>
-            } @else {
-                <label id="find-status-lbl">Find in Current File:</label>
             }
         </div>
 

src/app/editor/search-replace/search-replace.component.ts

@@ -40,7 +40,6 @@ export class SearchReplaceComponent {
     @Input() findOptions: string           = "";
     @Input() isQueryLong: boolean          = false;
     @Input() isQueryNotFound: boolean      = false;
-    @Input() totalCount: number            = 0;
 
     private editor!: any;
 
@@ -194,14 +193,14 @@ export class SearchReplaceComponent {
     public findEntryKeyUpHandler(event: KeyboardEvent) {
         if (!event.ctrlKey || !this.query) return;
 
-        if (event.key === "ArrowUp")   this.findPreviousEntry();
+        if (event.key === "ArrowUp") this.findPreviousEntry();
         if (event.key === "ArrowDown") this.findNextEntry();
     }
 
     public findAllEntries() {
         this.query = this.findEntryElm.nativeElement.value;
 
-        this.totalCount = this.editor.findAll(this.query, {
+        let totalCount = this.editor.findAll(this.query, {
             backwards: this.isBackwards,
             wrap: this.isWrap,
             caseSensitive: this.useCaseSensitive,
@@ -210,7 +209,7 @@ export class SearchReplaceComponent {
             range: this.searchOnlyInSelection
         });
 
-        if (this.totalCount === 0) this.isQueryNotFound = true;
+        if (totalCount === 0) this.isQueryNotFound = true;
     }
 
     public replaceEntry(event: KeyboardEvent) {
@@ -221,7 +220,7 @@ export class SearchReplaceComponent {
 
         if (!fromStr) return;
 
-        this.editor.replace(toStr, fromStr, {
+        let totalCount = this.editor.replace(toStr, fromStr, {
             backwards: this.isBackwards,
             wrap: this.isWrap,
             caseSensitive: this.useCaseSensitive,
@@ -242,7 +241,7 @@ export class SearchReplaceComponent {
 
         if (!fromStr) return;
 
-        this.editor.replaceAll(toStr, fromStr, {
+        let totalCount = this.editor.replaceAll(toStr, fromStr, {
             backwards: this.isBackwards,
             wrap: this.isWrap,
             caseSensitive: this.useCaseSensitive,
@@ -270,7 +269,7 @@ export class SearchReplaceComponent {
         if (this.isQueryLong) return;
 
         this.searchTimeoutId = setTimeout(() => {
-            this.totalCount   = this.editor.findAll(this.query, {
+            let totalCount   = this.editor.findAll(this.query, {
                 backwards: this.isBackwards,
                 wrap: this.isWrap,
                 caseSensitive: this.useCaseSensitive,
@@ -279,7 +278,7 @@ export class SearchReplaceComponent {
                 range: this.searchOnlyInSelection
             });
 
-            this.isQueryNotFound = (this.totalCount === 0);
+            this.isQueryNotFound = (totalCount === 0);
         }, this.searchTimeout);
     }