Add filter parameter.

Encanto · Jun 2, 2021 · a50a46b · a50a46b
1 parent 326ca0f
commit a50a46b
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 16 deletions.
diff --git a/api/src/server.ts b/api/src/server.ts
@@ -19,11 +19,15 @@ const HOME_DIR = require('os').homedir();
 var fs = require("fs");
 const fsPromises = fs.promises;
 var path = require("path");
+const bodyParser = require('body-parser');
+
 
 export const app = express();
 app.use(express.json());
 app.use(express.urlencoded({ extended: true }));
 app.use(cors());
+app.use(bodyParser.urlencoded({ extended: false }));
+app.use(bodyParser.json());
 
 async function getStats(dirPath: any) {
     var stats = await fsPromises.stat(dirPath);
@@ -34,8 +38,28 @@ async function getStats(dirPath: any) {
     }    
 }
 
+function pathMatch(dirPath: string, filter: string) {
+    // Default for empty string.
+    let retVal = false;
+    if (filter == "") {
+       retVal = true;
+    }
+
+    console.log('filter ' + filter);
+    let filterSet = filter.split("|");
+    for (var i: number = 0; i < filterSet.length; i++) {
+      if (dirPath.endsWith(filterSet[i])) {
+        console.log(dirPath + ' matches ' + filterSet[i]);
+        retVal = true;
+        break;
+      }
+    }
+
+    return retVal;
+}
+
 app.get('/encanto/root', async function(req, res) {
-        res.json({"path": HOME_DIR})
+    res.json({"path": HOME_DIR})
 });
 
 app.get('/encanto/list/:path?', async function(req, res) {
@@ -48,6 +72,13 @@ app.get('/encanto/list/:path?', async function(req, res) {
     }
     dirPath = path.join(HOME_DIR, dirPath);
 
+    // Read the filter parameter if definted
+    let filter = '';
+    console.log('query: ' + JSON.stringify(req.query));
+    if (req.query && req.query['filter']) {
+      filter = decodeURIComponent(<any> req.query['filter']);
+    }
+
     var stats = []; 
     try {
       var files = await fsPromises.readdir(dirPath);
@@ -57,14 +88,11 @@ app.get('/encanto/list/:path?', async function(req, res) {
           var stat: any = await getStats(fPath);
           stat.name = files[i];
 
-          // Example of filtering of a file type.
-            /*
-            if (stat.folder === true || 
-                stat.folder === false && fPath.endsWith('.xlsx')) {
-                stats.push(stat);  
-            } 
-            */
-          stats.push(stat);  
+          if (stat.folder === true || 
+              stat.folder === false && pathMatch(fPath, filter)) {
+              stats.push(stat);  
+          } 
+
         }
       } catch (e) {
         console.error('Error reading file in directory: ' + dirPath);

diff --git a/component/src/app/file-browse/file-browse.component.ts b/component/src/app/file-browse/file-browse.component.ts
@@ -13,17 +13,19 @@
  *  and limitations under the License. 
  */
 
-import { Component, EventEmitter, Output, Injector, OnInit } from '@angular/core';
+import { Component, EventEmitter, Output, Injector, OnInit, Input } from '@angular/core';
 import { createCustomElement } from '@angular/elements';
 import { FileServiceService } from '../services/file-service.service';
 
 
 @Component({
-  selector: 'local-file-browse',
+  selector: 'file-browse',
   templateUrl: './file-browse.component.html',
   styleUrls: ['./file-browse.component.css']
 })
 export class FileBrowseComponent implements OnInit {
+  @Input() filter = "";
+
   public files = [];
   public breadcrumbPaths = [];
   public selectedFile;
@@ -40,7 +42,7 @@ export class FileBrowseComponent implements OnInit {
   }
 
   ngOnInit(): void {
-    this.fileService.getFiles("").subscribe(
+    this.fileService.getFiles("", this.filter).subscribe(
       res => {
         this.files = <any> res;
       },
@@ -130,7 +132,7 @@ export class FileBrowseComponent implements OnInit {
       let lastBreadcrumbPath = this.getCurrentPath();
       this.breadcrumbPaths.push({name: file.name, path: lastBreadcrumbPath + '/' + file.name});
       console.log('adding breadcrumb path: ' + lastBreadcrumbPath + '/' + file.name);
-      this.fileService.getFiles(lastBreadcrumbPath + '/' + file.name).subscribe(
+      this.fileService.getFiles(lastBreadcrumbPath + '/' + file.name, this.filter).subscribe(
         res => {
           this.files = <any> res;
         },

diff --git a/component/src/app/services/file-service.service.ts b/component/src/app/services/file-service.service.ts
@@ -15,6 +15,7 @@
 
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
+import { encode } from 'punycode';
 
 @Injectable({
   providedIn: 'root'
@@ -23,8 +24,8 @@ export class FileServiceService {
   private readonly localAPI = 'http://localhost:1880/encanto'
   constructor(private http: HttpClient) { }
 
-  public getFiles(path: string) {
-    return this.http.get(this.localAPI + '/list/' + encodeURIComponent(path));
+  public getFiles(path: string, filter: string) {
+    return this.http.get(this.localAPI + '/list/' + encodeURIComponent(path) + '?filter=' + encodeURIComponent(filter));
   }
 
   public getRoot() {

diff --git a/component/src/index.html b/component/src/index.html
@@ -9,6 +9,6 @@
   <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
 </head>
 <body>
-  <file-browse></file-browse>
+  <file-browse filter=".txt|.json"></file-browse>
 </body>
 </html>