Merge pull request #39 from valadas/file-search

Implemented file search
valadas · Feb 28, 2022 · f0c7e2e · f0c7e2e
2 parents c027210 + 5991855
commit f0c7e2e
Show file tree

Hide file tree

Showing 4 changed files with 98 additions and 9 deletions.
diff --git a/...esourceManager/ResourceManager.Web/src/components/dnn-rm-files-pane/dnn-rm-files-pane.tsx b/...esourceManager/ResourceManager.Web/src/components/dnn-rm-files-pane/dnn-rm-files-pane.tsx
@@ -52,14 +52,29 @@ export class DnnRmFilesPane {
       return;
     }
 
-    this.itemsClient.getFolderContent(
-      state.currentItems.folder.folderId,
-      state.currentItems.items.length)
-    .then(data => state.currentItems = {
-      ...state.currentItems,
-      items: [...state.currentItems.items, ...data.items],
-    });
-    console.log(state.currentItems);
+    if (state.itemsSearchTerm){
+      this.itemsClient.search(
+        state.currentItems.folder.folderId,
+        state.itemsSearchTerm,
+        state.lastSearchRequestedPage + 1)
+      .then(data => {
+        state.lastSearchRequestedPage += 1;
+        state.currentItems = {
+          ...state.currentItems,
+          totalCount: data.totalCount,
+          items: [...state.currentItems.items, ...data.items],
+        }
+      })
+    }
+    else{
+      this.itemsClient.getFolderContent(
+        state.currentItems.folder.folderId,
+        state.currentItems.items.length)
+      .then(data => state.currentItems = {
+        ...state.currentItems,
+        items: [...state.currentItems.items, ...data.items],
+      });
+    }
   }
 
   render() {

diff --git a/...ules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-top-bar/dnn-rm-top-bar.tsx b/...ules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-top-bar/dnn-rm-top-bar.tsx
@@ -1,15 +1,48 @@
 import { Component, Host, h, } from '@stencil/core';
+import state from '../../store/store';
+import { ItemsClient } from "../../services/ItemsClient";
 @Component({
   tag: 'dnn-rm-top-bar',
   styleUrl: 'dnn-rm-top-bar.scss',
   shadow: true,
 })
 export class DnnRmTopBar {
 
+  private itemsClient: ItemsClient;
+
+  constructor(){
+    this.itemsClient = new ItemsClient(state.moduleId);
+  }
+
+  private handleSearchChanged(e: CustomEvent<any>): void {
+    if (e.detail != ""){
+      state.itemsSearchTerm = e.detail;
+      this.itemsClient.search(state.currentItems.folder.folderId, e.detail, 0)
+      .then(data =>{
+        state.currentItems = {
+          ...state.currentItems,
+          totalCount: data.totalCount,
+          items: data.items,
+        };
+        state.lastSearchRequestedPage = 1;
+      })
+      .catch(reason => console.error(reason));
+    }
+    else
+    {
+      this.itemsClient.getFolderContent(state.currentItems.folder.folderId, 0)
+      .then(data => {
+        state.lastSearchRequestedPage = 1;
+        state.itemsSearchTerm = undefined;
+        state.currentItems = data;
+      })
+    }
+  }
+
   render() {
     return (
       <Host>
-        <dnn-searchbox></dnn-searchbox>
+        <dnn-searchbox onQueryChanged={e => this.handleSearchChanged(e)}></dnn-searchbox>
       </Host>
     );
   }

diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/services/ItemsClient.ts b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/services/ItemsClient.ts
@@ -67,6 +67,37 @@ export class ItemsClient{
         .catch(error => reject(error));
       });
     }
+
+    public search(
+        folderId: number,
+        search: string,
+        pageIndex: number,
+        pageSize = 20,
+        sorting: "ItemName" | "LastModifiedOnDate" | "Size" | "ParentFolder" | "CreatedOnDate" = "ItemName",
+        culture = "",
+        groupId = -1)
+    {
+        return new Promise<SearchResponse>((resolve, reject) => {
+            const url = `${this.requestUrl}Search?folderId=${folderId}&search=${search}&pageIndex=${pageIndex}&pageSize=${pageSize}&sorting=${sorting}&culture=${culture}`;
+            const headers = this.sf.getModuleHeaders();
+            headers.append("groupId", groupId.toString());
+            this.abortController?.abort();
+            this.abortController = new AbortController();
+            fetch(url, {
+                headers,
+                signal: this.abortController.signal,
+            })
+            .then(response => {
+                if (response.status == 200){
+                    response.json().then(data => resolve(data));
+                }
+                else{
+                    response.json().then(error => reject(error.message));
+                }
+            })
+            .catch(error => reject(error));
+        });
+    }
 }
 
 export interface GetFolderContentResponse{
@@ -108,4 +139,9 @@ export interface Item{
     modifiedOn: string;
     /** The size of the file (only available for file Items) */
     fileSize?: number,
+}
+
+export interface SearchResponse{
+    items: Item[],
+    totalCount: number,
 }
diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/store/store.ts b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/store/store.ts
@@ -9,9 +9,14 @@ const { state } = createStore<{
     currentItems?: GetFolderContentResponse;
     layout: "list" | "card";
     localization?: LocalizedStrings;
+    itemsSearchTerm?: string;
+    pageSize: number;
+    lastSearchRequestedPage: number;
 }>({
     moduleId: -1,
     layout: "list",
+    pageSize: 20,
+    lastSearchRequestedPage: 1,
 });
 
 export default state;