Merge branch 'ClemSK-pnpFilePickerBugFix' into dev

pnp · Nov 22, 2023 · e9a7765 · e9a7765
2 parents a963e8e + d1ab5fa
commit e9a7765
Show file tree

Hide file tree

Showing 8 changed files with 23 additions and 5 deletions.
diff --git a/src/propertyFields/filePicker/filePickerControls/OneDriveFilesTab/OneDriveFilesTab.tsx b/src/propertyFields/filePicker/filePickerControls/OneDriveFilesTab/OneDriveFilesTab.tsx
@@ -90,7 +90,7 @@ export class OneDriveFilesTab extends React.Component<IOneDriveFilesTabProps, IO
     return (
       <div className={styles.tabContainer}>
         <div className={styles.tabHeaderContainer}>
-          <Breadcrumb items={breadcrumbItems} /*onRenderItem={this.renderBreadcrumbItem}*/ className={styles.breadcrumbNav}/>
+          <Breadcrumb items={breadcrumbItems} /*onRenderItem={this.renderBreadcrumbItem}*/ className={styles.breadcrumbNav} />
         </div>
         <div className={styles.tabFiles}>
           {libraryAbsolutePath !== undefined &&
@@ -101,7 +101,9 @@ export class OneDriveFilesTab extends React.Component<IOneDriveFilesTabProps, IO
               libraryName={libraryTitle}
               libraryId={libraryId}
               folderPath={folderPath}
-              accepts={accepts} />}
+              accepts={accepts}
+              context={this.props.context}
+            />}
         </div>
         <div className={styles.actionButtonsContainer}>
           <div className={styles.actionButtons}>

diff --git a/src/propertyFields/filePicker/filePickerControls/SiteFilePickerTab/SiteFilePickerTab.tsx b/src/propertyFields/filePicker/filePickerControls/SiteFilePickerTab/SiteFilePickerTab.tsx
@@ -59,7 +59,9 @@ export default class SiteFilePickerTab extends React.Component<ISiteFilePickerTa
               libraryName={this.state.libraryTitle}
               libraryId={this.state.libraryId}
               folderPath={this.state.libraryPath}
-              accepts={this.props.accepts} />}
+              accepts={this.props.accepts}
+              context={this.props.context}
+            />}
         </div>
         <div className={styles.actionButtonsContainer}>
           <div className={styles.actionButtons}>

diff --git a/src/propertyFields/filePicker/filePickerControls/controls/FileBrowser/FileBrowser.tsx b/src/propertyFields/filePicker/filePickerControls/controls/FileBrowser/FileBrowser.tsx
@@ -198,6 +198,7 @@ export class FileBrowser extends React.Component<IFileBrowserProps, IFileBrowser
                       onFolderOpen={this._handleOpenFolder}
                       onFileSelected={this._itemSelectionChanged}
                       onNextPageDataRequest={this._loadNextDataRequest}
+                      context={this.props.context}
                     />)
                 }
               </ScrollablePane>

diff --git a/src/propertyFields/filePicker/filePickerControls/controls/FileBrowser/IFileBrowserProps.ts b/src/propertyFields/filePicker/filePickerControls/controls/FileBrowser/IFileBrowserProps.ts
@@ -1,3 +1,4 @@
+import { BaseComponentContext } from "@microsoft/sp-component-base";
 import { FileBrowserService } from "../../../../../services/FileBrowserService";
 import { IFile } from "../../../../../services/FileBrowserService.types";
 import { IFilePickerResult } from "../../FilePicker.types";
@@ -8,6 +9,7 @@ export interface IFileBrowserProps {
   libraryId: string;
   folderPath: string;
   accepts: string[];
+  context: BaseComponentContext;
   onChange: (filePickerResult: IFilePickerResult) => void;
   onOpenFolder: (folder: IFile) => void;
 }
diff --git a/src/propertyFields/filePicker/filePickerControls/controls/FolderTile/FolderTile.tsx b/src/propertyFields/filePicker/filePickerControls/controls/FolderTile/FolderTile.tsx
@@ -16,6 +16,12 @@ export class FolderTile extends React.Component<IFolderTileProps> {
       .replace('{1}', item.modifiedFriendly)
       .replace('{2}', item.modifiedBy)
       .replace('{3}', `${item.totalFileCount}`);
+
+    // Get the user's locale
+    const userLocale = this.props.context.pageContext
+      ? this.props.context.pageContext.cultureInfo.currentCultureName || this.props.context.pageContext.cultureInfo.currentUICultureName // gets the language / locale of the user
+      : "en-US"; // defaults to American English
+
     return (
       <div
         aria-selected={isSelected}
@@ -28,7 +34,7 @@ export class FolderTile extends React.Component<IFolderTileProps> {
         data-is-sub-focuszone={true}
         data-disable-click-on-enter={true}
         data-selection-index={index}
-        onClick={(_event)=>this.props.onItemInvoked(item)}
+        onClick={(_event) => this.props.onItemInvoked(item)}
       >
         <div
           className={styles.link}
@@ -78,7 +84,7 @@ export class FolderTile extends React.Component<IFolderTileProps> {
             </span>
             <span className={styles.activity} id={`Tile-activity${index}`}>
               <span className={css(styles.signalField, styles.compact)}>
-                <span className={styles.signalFieldValue}>{item.modified}</span>
+                <span className={styles.signalFieldValue}>{item.modified.toLocaleDateString(userLocale)}</span>
               </span>
             </span>
           </span>

diff --git a/src/propertyFields/filePicker/filePickerControls/controls/FolderTile/IFolderTileProps.ts b/src/propertyFields/filePicker/filePickerControls/controls/FolderTile/IFolderTileProps.ts
@@ -1,5 +1,6 @@
 import { IDimensions } from "../../../../../services/IOneDriveService";
 import { IFile } from "../../../../../services/FileBrowserService.types";
+import { BaseComponentContext } from "@microsoft/sp-component-base";
 
 export interface IFolderTileProps {
   item: IFile;
@@ -8,4 +9,5 @@ export interface IFolderTileProps {
   pageWidth: number;
   onItemInvoked: (item: IFile) => void;
   tileDimensions: IDimensions;
+  context: BaseComponentContext;
 }
diff --git a/src/propertyFields/filePicker/filePickerControls/controls/TilesList/ITilesListProps.ts b/src/propertyFields/filePicker/filePickerControls/controls/TilesList/ITilesListProps.ts
@@ -2,12 +2,14 @@ import { FileBrowserService } from "../../../../../services/FileBrowserService";
 import { IFile } from "../../../../../services/FileBrowserService.types";
 import { Selection } from '@fluentui/react/lib/Selection';
 import { IFilePickerResult } from "../../FilePicker.types";
+import { BaseComponentContext } from "@microsoft/sp-component-base";
 
 export interface ITilesListProps {
   fileBrowserService: FileBrowserService;
   filePickerResult: IFilePickerResult;
   selection: Selection;
   items: IFile[];
+  context: BaseComponentContext;
 
   onFolderOpen: (item: IFile) => void;
   onFileSelected: (item: IFile) => void;

diff --git a/src/propertyFields/filePicker/filePickerControls/controls/TilesList/TilesList.tsx b/src/propertyFields/filePicker/filePickerControls/controls/TilesList/TilesList.tsx
@@ -214,6 +214,7 @@ export class TilesList extends React.Component<ITilesListProps> {
                     height: this._rowHeight - TILE_HORZ_PADDING
                   }}
                   onItemInvoked={(itemInvoked: IFile) => this._handleItemInvoked(itemInvoked)}
+                  context={this.props.context} // used to get page locale
                 />
                 :
                 <DocumentTile