fix: disable open on click behavior

Adds the disable-open-on-click attibute to the mgt-file-list to allow developers to prevent items with a webUrl from opening in a new browser window. The provides backwards function compatibility to v2
microsoftgraph · Aug 25, 2023 · 734ac4d · 734ac4d
1 parent cb69e01
commit 734ac4d
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 2 deletions.
diff --git a/packages/mgt-components/src/components/mgt-file-list/mgt-file-list.ts b/packages/mgt-components/src/components/mgt-file-list/mgt-file-list.ts
@@ -403,6 +403,11 @@ export class MgtFileList extends MgtTemplatedComponent implements CardSection {
     void this.requestStateUpdate(true);
   }
 
+  @property({
+    attribute: 'disable-open-on-click',
+    type: Boolean
+  })
+  public disableOpenOnClick = false;
   /**
    * A boolean value indication if 'show-more' button should be disabled
    *
@@ -1007,7 +1012,7 @@ export class MgtFileList extends MgtTemplatedComponent implements CardSection {
   }
 
   private handleFileClick(file: DriveItem) {
-    if (file?.webUrl) {
+    if (file?.webUrl && !this.disableOpenOnClick) {
       window.open(file.webUrl, '_blank', 'noreferrer');
     }
   }

diff --git a/packages/mgt-element/src/utils/version.ts b/packages/mgt-element/src/utils/version.ts
@@ -8,4 +8,4 @@
 // THIS FILE IS AUTO GENERATED
 // ANY CHANGES WILL BE LOST DURING BUILD
 
-export const PACKAGE_VERSION = '3.0.1';
+export const PACKAGE_VERSION = '3.1.1';
diff --git a/packages/mgt-react/src/generated/react.ts b/packages/mgt-react/src/generated/react.ts
@@ -58,6 +58,7 @@ export type FileListProps = {
 	itemView?: ViewType;
 	fileExtensions?: string[];
 	pageSize?: number;
+	disableOpenOnClick?: boolean;
 	hideMoreFilesButton?: boolean;
 	maxFileSize?: number;
 	enableFileUpload?: boolean;

diff --git a/stories/components/fileList/fileList.properties.js b/stories/components/fileList/fileList.properties.js
@@ -94,6 +94,10 @@ export const getFileListByExtensions = () => html`
     <mgt-file-list file-extensions="docx, xlsx"></mgt-file-list>
   `;
 
+export const disableOpenOnClick = () => html`
+<mgt-file-list disable-open-on-click></mgt-file-list>
+`;
+
 export const disableFileExpansion = () => html`
     <mgt-file-list hide-more-files-button></mgt-file-list>
   `;