Merge pull request #792 from pnp/filepicker-site-pages

#601 - allow display Site Pages on Site tab
pnp · Jan 29, 2021 · 2d6f962 · 2d6f962
2 parents bd85345 + c507b16
commit 2d6f962
Show file tree

Hide file tree

Showing 9 changed files with 18 additions and 2 deletions.
diff --git a/docs/documentation/docs/controls/FilePicker.md b/docs/documentation/docs/controls/FilePicker.md
@@ -79,6 +79,7 @@ The FilePicker component can be configured with the following properties:
 | storeLastActiveTab | boolean | no | Specifies if last active tab will be stored after the Upload panel has been closed. Note: the value of selected tab is stored in the queryString hash. Default `true` |
 | renderCustomUploadTabContent | (filePickerResult: IFilePickerResult) => JSX.Element \| null | no | Optional renderer to add custom user-defined fields to "Upload" tab |
 | renderCustomLinkTabContent | (filePickerResult: IFilePickerResult) => JSX.Element \| null | no | Optional renderer to add custom user-defined fields to "Link" tab |
+| includePageLibraries | boolean | no | Specifies if Site Pages library to be visible on Sites tab |
 
 interface `IFilePickerResult`
 

diff --git a/src/controls/filePicker/FilePicker.tsx b/src/controls/filePicker/FilePicker.tsx
@@ -211,6 +211,7 @@ export class FilePicker extends React.Component<
             {this.state.selectedTab === "keySite" && (
               <SiteFilePickerTab
                 fileBrowserService={this.fileBrowserService}
+                includePageLibraries={this.props.includePageLibraries}
                 {...linkTabProps}
               />
             )}

diff --git a/src/controls/filePicker/IFilePickerProps.ts b/src/controls/filePicker/IFilePickerProps.ts
@@ -137,4 +137,9 @@ export interface IFilePickerProps {
    * Optional additional renderer for Upload tab
    */
   renderCustomUploadTabContent?: (filePickerResult: IFilePickerResult) => JSX.Element | null;
+
+  /**
+   * Specifies if Site Pages library to be visible on Sites tab
+   */
+  includePageLibraries?: boolean;
 }
diff --git a/src/controls/filePicker/SiteFilePickerTab/ISiteFilePickerTabProps.ts b/src/controls/filePicker/SiteFilePickerTab/ISiteFilePickerTabProps.ts
@@ -9,4 +9,6 @@ export interface ISiteFilePickerTabProps extends IFilePickerTab {
    * Represents the base node in the breadrumb navigation
    */
   breadcrumbFirstNode?: IBreadcrumbItem;
+
+  includePageLibraries?: boolean;
 }
diff --git a/src/controls/filePicker/SiteFilePickerTab/SiteFilePickerTab.tsx b/src/controls/filePicker/SiteFilePickerTab/SiteFilePickerTab.tsx
@@ -46,6 +46,7 @@ export default class SiteFilePickerTab extends React.Component<ISiteFilePickerTa
           {this.state.libraryAbsolutePath === undefined &&
             <DocumentLibraryBrowser
               fileBrowserService={this.props.fileBrowserService}
+              includePageLibraries={this.props.includePageLibraries}
               onOpenLibrary={(selectedLibrary: ILibrary) => this._handleOpenLibrary(selectedLibrary, true)} />}
           {this.state.libraryAbsolutePath !== undefined &&
             <FileBrowser

diff --git a/src/controls/filePicker/controls/DocumentLibraryBrowser/DocumentLibraryBrowser.tsx b/src/controls/filePicker/controls/DocumentLibraryBrowser/DocumentLibraryBrowser.tsx
@@ -41,7 +41,7 @@ export class DocumentLibraryBrowser extends React.Component<IDocumentLibraryBrow
   }
 
   public async componentDidMount() {
-    const lists = await this.props.fileBrowserService.getSiteMediaLibraries();
+    const lists = await this.props.fileBrowserService.getSiteMediaLibraries(this.props.includePageLibraries);
     this.setState({
       lists: lists,
       isLoading: false

diff --git a/src/controls/filePicker/controls/DocumentLibraryBrowser/IDocumentLibraryBrowserProps.ts b/src/controls/filePicker/controls/DocumentLibraryBrowser/IDocumentLibraryBrowserProps.ts
@@ -4,4 +4,5 @@ import { ILibrary } from "../../../../services/FileBrowserService.types";
 export interface IDocumentLibraryBrowserProps {
   fileBrowserService: FileBrowserService;
   onOpenLibrary: (selectedLibrary: ILibrary) => void;
+  includePageLibraries?: boolean;
 }
diff --git a/src/controls/filePicker/controls/FileBrowser/FileBrowser.tsx b/src/controls/filePicker/controls/FileBrowser/FileBrowser.tsx
@@ -44,7 +44,11 @@ export class FileBrowser extends React.Component<IFileBrowserProps, IFileBrowser
           const folderIcon: string = strings.FolderIconUrl;
           // TODO: Improve file icon URL
           const isPhoto = GeneralHelper.isImage(item.name);
-          const iconUrl = isPhoto ? strings.PhotoIconUrl : `https://spoprod-a.akamaihd.net/files/odsp-next-prod_2019-01-11_20190116.001/odsp-media/images/itemtypes/20_2x/${item.fileType}.png`;
+          let fileType = item.fileType;
+          if (fileType.toLowerCase() === 'aspx') {
+            fileType = 'html';
+          }
+          const iconUrl = isPhoto ? strings.PhotoIconUrl : `https://spoprod-a.akamaihd.net/files/odsp-next-prod_2019-01-11_20190116.001/odsp-media/images/itemtypes/20_2x/${fileType}.png`;
 
           const altText: string = item.isFolder ? strings.FolderAltText : strings.ImageAltText.replace('{0}', item.fileType);
           return <div className={styles.fileTypeIcon}>

diff --git a/src/webparts/controlsTest/components/ControlsTest.tsx b/src/webparts/controlsTest/components/ControlsTest.tsx
@@ -1445,6 +1445,7 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
             onChange={(filePickerResult: IFilePickerResult) => { console.log(filePickerResult.fileName); }}
             context={this.props.context}
             hideRecentTab={false}
+            includePageLibraries={true}
           />
           {
             this.state.filePickerResult &&