merge with dev

AJIXuMuK · AJIXuMuK · commit 92a0e39e11c7 · 2021-03-06T11:09:39.000-08:00
diff --git a/CHANGELOG.JSON b/CHANGELOG.JSON
@@ -6,17 +6,22 @@
         "new": [],
         "enhancements": [
           "`TreeView`: Adding support to clear TreeView selected items by passing an empty array. [#787](https://github.com/pnp/sp-dev-fx-controls-react/pull/787)",
-          "`FilePicker`: new property `includePageLibraries` to optionally display Site Pages library on Site tab [#601](https://github.com/pnp/sp-dev-fx-controls-react/issues/601)"
+          "`FilePicker`: new property `includePageLibraries` to optionally display Site Pages library on Site tab [#601](https://github.com/pnp/sp-dev-fx-controls-react/issues/601)",
+          "`ListItemPicker`: Support of `Calculated` columns [#805](https://github.com/pnp/sp-dev-fx-controls-react/issues/805)",
+          "`Progress`: Documentation update to have consistency in variables names [#811](https://github.com/pnp/sp-dev-fx-controls-react/pull/811)",
+          "`FolderExplorer`: Add support for sorting folder explorer items [#812](https://github.com/pnp/sp-dev-fx-controls-react/pull/812)"
         ],
         "fixes": [
           "`ListView`: Selection is reset when putting a ListView inside a React Component that controls its items and selection props [#251](https://github.com/pnp/sp-dev-fx-controls-react/issues/251)",
           "Documentation fix for `PeoplePicker`: Removed unwanted new line in help content. [#783](https://github.com/pnp/sp-dev-fx-controls-react/pull/783)",
           "Documentation fix for `TreeView`: `TreeViewSelectionMode` added in the import [#780](https://github.com/pnp/sp-dev-fx-controls-react/pull/780)",
           "Documentation fix for `TreeView`: removed unwanted comma [#779](https://github.com/pnp/sp-dev-fx-controls-react/pull/779)",
-          "`ListView`: When the items reach the number of items more than can be shown on a page/component, it adds horizontal scroll instead of vertical [#648](https://github.com/pnp/sp-dev-fx-controls-react/issues/648)"
+          "`IFrameDialog`: height unable to resize relative to screen size, even if we provide in % it is taking default value. [#636](https://github.com/pnp/sp-dev-fx-controls-react/issues/636)",
+          "`DateTimePicker`: Clear Date functionality [#799](https://github.com/pnp/sp-dev-fx-controls-react/issues/799)"
         ]
       },
       "contributions": [
+        "[Ari Gunawan](https://github.com/AriGunawan)",
         "[Joel Rodrigues](https://github.com/joelfmrodrigues)",
         "[Mike Myers](https://github.com/thespooler)",
         "[Ravichandran Krishnasamy](https://github.com/ravichandran-blog)",
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,18 +6,22 @@
 
 - `TreeView`: Adding support to clear TreeView selected items by passing an empty array. [#787](https://github.com/pnp/sp-dev-fx-controls-react/pull/787)
 - `FilePicker`: new property `includePageLibraries` to optionally display Site Pages library on Site tab [#601](https://github.com/pnp/sp-dev-fx-controls-react/issues/601)
+- `ListItemPicker`: Support of `Calculated` columns [#805](https://github.com/pnp/sp-dev-fx-controls-react/issues/805)
+- `Progress`: Documentation update to have consistency in variables names [#811](https://github.com/pnp/sp-dev-fx-controls-react/pull/811)
+- `FolderExplorer`: Add support for sorting folder explorer items [#812](https://github.com/pnp/sp-dev-fx-controls-react/pull/812)
 
 ### Fixes
 
 - `ListView`: Selection is reset when putting a ListView inside a React Component that controls its items and selection props [#251](https://github.com/pnp/sp-dev-fx-controls-react/issues/251)
 - Documentation fix for `PeoplePicker`: Removed unwanted new line in help content. [#783](https://github.com/pnp/sp-dev-fx-controls-react/pull/783)
 - Documentation fix for `TreeView`: `TreeViewSelectionMode` added in the import [#780](https://github.com/pnp/sp-dev-fx-controls-react/pull/780)
 - Documentation fix for `TreeView`: removed unwanted comma [#779](https://github.com/pnp/sp-dev-fx-controls-react/pull/779)
-- `ListView`: When the items reach the number of items more than can be shown on a page/component, it adds horizontal scroll instead of vertical [#648](https://github.com/pnp/sp-dev-fx-controls-react/issues/648)
+- `IFrameDialog`: height unable to resize relative to screen size, even if we provide in % it is taking default value. [#636](https://github.com/pnp/sp-dev-fx-controls-react/issues/636)
+- `DateTimePicker`: Clear Date functionality [#799](https://github.com/pnp/sp-dev-fx-controls-react/issues/799)
 
 ### Contributors
 
-Special thanks to our contributors (in alphabetical order): [Joel Rodrigues](https://github.com/joelfmrodrigues), [Mike Myers](https://github.com/thespooler), [Ravichandran Krishnasamy](https://github.com/ravichandran-blog), [San](https://github.com/sankarkumar23).
+Special thanks to our contributors (in alphabetical order): [Ari Gunawan](https://github.com/AriGunawan), [Joel Rodrigues](https://github.com/joelfmrodrigues), [Mike Myers](https://github.com/thespooler), [Ravichandran Krishnasamy](https://github.com/ravichandran-blog), [San](https://github.com/sankarkumar23).
 
 ## 2.4.0
 
diff --git a/README.md b/README.md
@@ -1,5 +1,3 @@
-![SharePoint Patterns and Practices](https://devofficecdn.azureedge.net/media/Default/PnP/sppnp.png)
-
 # SharePoint Framework React Controls
 
 This is a open source library that shares a set of reusable React control that can be used in your SharePoint Framework solutions.
diff --git a/docs/documentation/docs/about/release-notes.md b/docs/documentation/docs/about/release-notes.md
@@ -6,18 +6,22 @@
 
 - `TreeView`: Adding support to clear TreeView selected items by passing an empty array. [#787](https://github.com/pnp/sp-dev-fx-controls-react/pull/787)
 - `FilePicker`: new property `includePageLibraries` to optionally display Site Pages library on Site tab [#601](https://github.com/pnp/sp-dev-fx-controls-react/issues/601)
+- `ListItemPicker`: Support of `Calculated` columns [#805](https://github.com/pnp/sp-dev-fx-controls-react/issues/805)
+- `Progress`: Documentation update to have consistency in variables names [#811](https://github.com/pnp/sp-dev-fx-controls-react/pull/811)
+- `FolderExplorer`: Add support for sorting folder explorer items [#812](https://github.com/pnp/sp-dev-fx-controls-react/pull/812)
 
 ### Fixes
 
 - `ListView`: Selection is reset when putting a ListView inside a React Component that controls its items and selection props [#251](https://github.com/pnp/sp-dev-fx-controls-react/issues/251)
 - Documentation fix for `PeoplePicker`: Removed unwanted new line in help content. [#783](https://github.com/pnp/sp-dev-fx-controls-react/pull/783)
 - Documentation fix for `TreeView`: `TreeViewSelectionMode` added in the import [#780](https://github.com/pnp/sp-dev-fx-controls-react/pull/780)
 - Documentation fix for `TreeView`: removed unwanted comma [#779](https://github.com/pnp/sp-dev-fx-controls-react/pull/779)
-- `ListView`: When the items reach the number of items more than can be shown on a page/component, it adds horizontal scroll instead of vertical [#648](https://github.com/pnp/sp-dev-fx-controls-react/issues/648)
+- `IFrameDialog`: height unable to resize relative to screen size, even if we provide in % it is taking default value. [#636](https://github.com/pnp/sp-dev-fx-controls-react/issues/636)
+- `DateTimePicker`: Clear Date functionality [#799](https://github.com/pnp/sp-dev-fx-controls-react/issues/799)
 
 ### Contributors
 
-Special thanks to our contributors (in alphabetical order): [Joel Rodrigues](https://github.com/joelfmrodrigues), [Mike Myers](https://github.com/thespooler), [Ravichandran Krishnasamy](https://github.com/ravichandran-blog), [San](https://github.com/sankarkumar23).
+Special thanks to our contributors (in alphabetical order): [Ari Gunawan](https://github.com/AriGunawan), [Joel Rodrigues](https://github.com/joelfmrodrigues), [Mike Myers](https://github.com/thespooler), [Ravichandran Krishnasamy](https://github.com/ravichandran-blog), [San](https://github.com/sankarkumar23).
 
 ## 2.4.0
 
diff --git a/docs/documentation/docs/controls/FolderExplorer.md b/docs/documentation/docs/controls/FolderExplorer.md
@@ -59,5 +59,7 @@ The `FolderExplorer` control can be configured with the following properties:
 | initialBreadcrumbItems | IBreadcrumbItem | no | Additional items to be added to the beginning of the breadcrumb. |
 | hiddenFilterBox | boolean | no | Hide the filter box |
 | onSelect | (folder: IFolder): void | no | Callback function called after a folder is selected. |
+| orderby | string | no | The name of the field on which to sort. Default: Name. For list item properties, use ListItemAllFields/Title, ListItemAllFields/Created, etc |
+| orderAscending | boolean | no | If set to true, results will be sorted in ascending order. Otherwise, descending will be used as default |
 
 ![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/FolderExplorer)
diff --git a/docs/documentation/docs/controls/Progress.md b/docs/documentation/docs/controls/Progress.md
@@ -63,8 +63,8 @@ Now, in a component, where `Progress` is used you can have code as below:
 
 ```TypeScript
 export interface IYourComponentState {
-  actions: IProgressAction[];
-  currentActionIndex?: number;
+  progressActions: IProgressAction[];
+  currentProgressActionIndex?: number;
   // other state properties
 }
 
@@ -75,7 +75,7 @@ export class YourComponent extends React.Component<IYourComponentProps, IYourCom
 
   private _initActions() {
     this.setState({
-      actions: [
+      progressActions: [
         new FirstAction(),
         new SecondAction()
       ]
@@ -84,7 +84,7 @@ export class YourComponent extends React.Component<IYourComponentProps, IYourCom
 
   private async _execute() {
     for (let i = 0; i <= this.state.actions.length; i++) {
-      this.setState(currentActionIndex: i);
+      this.setState(currentProgressActionIndex: i);
 
       if (i < this.state.actions.length) {
         await this.state.actions[i].execute();
diff --git a/src/common/SPEntities.ts b/src/common/SPEntities.ts
@@ -23,6 +23,8 @@ export interface ISPField {
     RichText?: boolean;
     SchemaXml?: string;
     LookupDisplayUrl?: string;
+    TypeAsString?: string;
+    ResultType?: string;
 }
 
 /**
@@ -166,4 +168,4 @@ export interface ICultureInfo {
     name: string;
     dateTimeFormat: ICultureDateTimeFormat;
     numberFormat: ICultureNumberFormat;
-}
+}
diff --git a/src/controls/dateTimePicker/DateTimePicker.tsx b/src/controls/dateTimePicker/DateTimePicker.tsx
@@ -69,7 +69,7 @@ export class DateTimePicker extends React.Component<IDateTimePickerProps, IDateT
    * Called before the component receives new props, used for matching state with new props.
    */
   public componentWillReceiveProps(nextProps: IDateTimePickerProps): void {
-    if (nextProps.value != null && !isEqual(nextProps.value, this.props.value)) {
+    if (!isEqual(nextProps.value, this.props.value)) {
       const { day, hours, minutes, seconds } = DateTimePicker.getDateComponents(nextProps.value, this.props.dateConvention);
       this.setState({ day, hours, minutes, seconds });
     }
@@ -134,9 +134,9 @@ export class DateTimePicker extends React.Component<IDateTimePickerProps, IDateT
           }
         }
         else if (hours === 12) {
-            //am - if hours == 12, set hours to 0 here
-            hours = 0;
-          }
+          //am - if hours == 12, set hours to 0 here
+          hours = 0;
+        }
       }
 
       if (hours > 23) {
diff --git a/src/controls/folderExplorer/FolderExplorer/FolderExplorer.tsx b/src/controls/folderExplorer/FolderExplorer/FolderExplorer.tsx
@@ -166,7 +166,9 @@ export class FolderExplorer extends React.Component<IFolderExplorerProps, IFolde
         }
       } else {
         // library/folder level, get folders
-        this._allFolders = await this._spService.GetFolders(siteAbsoluteUrl, folder.ServerRelativeUrl);
+        const orderBy = this.props.orderby !== undefined ? this.props.orderby : 'Name';
+        const orderAscending = this.props.orderAscending !== undefined ? this.props.orderAscending : true;
+        this._allFolders = await this._spService.GetFolders(siteAbsoluteUrl, folder.ServerRelativeUrl, orderBy, orderAscending);
       }
       this.setState({ folders: this._allFolders, selectedFolder: folder, foldersLoading: false });
 
diff --git a/src/controls/folderExplorer/FolderExplorer/IFolderExplorerProps.ts b/src/controls/folderExplorer/FolderExplorer/IFolderExplorerProps.ts
@@ -46,6 +46,16 @@ export interface IFolderExplorerProps {
    */
   hiddenFilterBox?: boolean;
 
+  /**
+   * The name of the field on which to sort. Default: Name. For list item properties, use ListItemAllFields/Title, ListItemAllFields/Created, etc
+   */
+  orderby?: string;
+
+  /**
+   * If set to true, results will be sorted in ascending order. Otherwise, descending will be used as default
+   */
+  orderAscending?: boolean;
+
   /**
    * Callback function called after a folder is selected
    * @argument folder The selected folder
diff --git a/src/controls/iFrameDialog/IFrameDialog.tsx b/src/controls/iFrameDialog/IFrameDialog.tsx
@@ -1,10 +1,12 @@
 import * as React from "react";
 import * as ReactDOM from "react-dom";
-import { Dialog, IDialogProps } from 'office-ui-fabric-react/lib/Dialog';
+import { Dialog, IDialogContentProps, IDialogProps, IDialogStyleProps, IDialogStyles } from 'office-ui-fabric-react/lib/Dialog';
 import { IFrameDialogContent } from './IFrameDialogContent';
 import * as telemetry from '../../common/telemetry';
 import { Guid } from "@microsoft/sp-core-library";
 import omit from 'lodash/omit';
+import merge from 'lodash/merge';
+import { IStyleFunctionOrObject } from "office-ui-fabric-react/lib/Utilities";
 
 export interface IFrameDialogProps extends IDialogProps {
   /**
@@ -110,6 +112,7 @@ export class IFrameDialog extends React.Component<IFrameDialogProps, IFrameDialo
     const {
       iframeOnLoad,
       height,
+      width,
       allowFullScreen,
       allowTransparency,
       marginHeight,
@@ -119,6 +122,7 @@ export class IFrameDialog extends React.Component<IFrameDialogProps, IFrameDialo
       scrolling,
       seamless,
       modalProps,
+      dialogContentProps,
       className
     } = this.props;
 
@@ -127,11 +131,40 @@ export class IFrameDialog extends React.Component<IFrameDialogProps, IFrameDialo
       onLayerDidMount: () => { this.setDialogStyling(); }
     };
 
+    const dlgContentProps = merge<IDialogContentProps, IDialogContentProps, IDialogContentProps>({}, dialogContentProps, {
+      styles: {
+        content: {
+          display: 'flex',
+          flexDirection: 'column',
+          height: '100%'
+        },
+        inner: {
+          flexGrow: 1
+        },
+        innerContent: {
+          height: '100%'
+        }
+      }
+    });
+
+
+    const dlgStyles: IStyleFunctionOrObject<IDialogStyleProps, IDialogStyles> = {
+      main: {
+        width: width,
+        maxWidth: width,
+        minWidth: width,
+        height: height
+      }
+    };
+
     return (
       <Dialog
         className={`${this.state.dialogId} ${className || ''}`}
+
+        styles={dlgStyles}
         modalProps={dlgModalProps}
-        {...omit(this.props, 'className', 'modalProps')}>
+        dialogContentProps={dlgContentProps}
+        {...omit(this.props, 'className', 'modalProps', 'dialogContentProps')}>
         <IFrameDialogContent src={this.props.url}
           iframeOnLoad={iframeOnLoad}
           close={this.props.onDismiss}
diff --git a/src/controls/iFrameDialog/IFrameDialogContent.module.scss b/src/controls/iFrameDialog/IFrameDialogContent.module.scss
@@ -1,6 +1,7 @@
 
 .iFrameDialog {
     border: none;
+    height: 100%;
 
     .spinnerContainer {
         position: absolute;
@@ -9,4 +10,4 @@
         margin-left: -14px;
         margin-top: -14px;
     }
-}
+}
diff --git a/src/controls/iFrameDialog/IFrameDialogContent.tsx b/src/controls/iFrameDialog/IFrameDialogContent.tsx
@@ -28,7 +28,7 @@ export class IFrameDialogContent extends React.Component<IIFrameDialogContentPro
 
     public render(): JSX.Element {
         return (<div className={styles.iFrameDialog}>
-            <iframe ref={(iframe) => { this._iframe = iframe; }} frameBorder={0} onLoad={this._iframeOnLoad.bind(this)} style={{ width: '100%', height: this.props.height, visibility: this.state.isContentVisible ? 'visible' : 'hidden' }} {...omit(this.props, 'height')} />
+            <iframe ref={(iframe) => { this._iframe = iframe; }} frameBorder={0} onLoad={this._iframeOnLoad.bind(this)} style={{ width: '100%', height: '100%', visibility: this.state.isContentVisible ? 'visible' : 'hidden' }} {...omit(this.props, 'height')} />
             {!this.state.isContentVisible &&
                 <div className={styles.spinnerContainer}>
                     <Spinner size={SpinnerSize.large} />
diff --git a/src/controls/listItemPicker/IListItemPickerState.ts b/src/controls/listItemPicker/IListItemPickerState.ts
@@ -1,7 +1,10 @@
+import { ISPField } from '../../common/SPEntities';
+
 export interface IListItemPickerState {
   noresultsFoundText: string;
   showError: boolean;
   errorMessage: string;
   suggestionsHeaderText:string;
   selectedItems?: any[];
+  field?: ISPField;
 }
diff --git a/src/controls/listItemPicker/ListItemPicker.tsx b/src/controls/listItemPicker/ListItemPicker.tsx
@@ -29,6 +29,10 @@ export class ListItemPicker extends React.Component<IListItemPickerProps, IListI
     this._spservice = new SPservice(this.props.context);
   }
 
+  public componentDidMount() {
+    this.loadField(this.props);
+  }
+
   public componentWillReceiveProps(nextProps: IListItemPickerProps) {
     let newSelectedItems: any[] | undefined;
     if (this.props.listId !== nextProps.listId) {
@@ -41,6 +45,12 @@ export class ListItemPicker extends React.Component<IListItemPickerProps, IListI
     this.setState({
       selectedItems: newSelectedItems
     });
+
+    if (this.props.listId !== nextProps.listId
+      || this.props.columnInternalName !== nextProps.columnInternalName
+      || this.props.webUrl !== nextProps.webUrl) {
+        this.loadField(nextProps);
+      }
   }
 
   /**
@@ -135,11 +145,14 @@ export class ListItemPicker extends React.Component<IListItemPickerProps, IListI
    */
   private loadListItems = async (filterText: string): Promise<{ key: string; name: string }[]> => {
     let { listId, columnInternalName, keyColumnInternalName, webUrl, filter, substringSearch } = this.props;
+    const {
+      field
+    } = this.state;
     let arrayItems: { key: string; name: string }[] = [];
     let keyColumn: string = keyColumnInternalName || 'Id';
 
     try {
-      let listItems = await this._spservice.getListItems(filterText, listId, columnInternalName, keyColumn, webUrl, filter, substringSearch); // JJ - 20200613 - find by substring as an option
+      let listItems = await this._spservice.getListItems(filterText, listId, columnInternalName, field, keyColumn, webUrl, filter, substringSearch); // JJ - 20200613 - find by substring as an option
       // Check if the list had items
       if (listItems.length > 0) {
         for (const item of listItems) {
@@ -157,4 +170,16 @@ export class ListItemPicker extends React.Component<IListItemPickerProps, IListI
       return null;
     }
   }
+
+  private loadField = async (props: IListItemPickerProps): Promise<void> => {
+    this.setState({
+      field: undefined
+    });
+
+    const field = await this._spservice.getField(props.listId, props.columnInternalName, props.webUrl);
+
+    this.setState({
+      field
+    });
+  }
 }
diff --git a/src/services/FolderExplorerService.ts b/src/services/FolderExplorerService.ts
@@ -59,21 +59,21 @@ export class FolderExplorerService implements IFolderExplorerService {
  * @param webAbsoluteUrl - the url of the target site
  * @param folderRelativeUrl - the relative url of the folder
  */
-  public GetFolders = async (webAbsoluteUrl: string, folderRelativeUrl: string): Promise<IFolder[]> => {
-    return this._getFolders(webAbsoluteUrl, folderRelativeUrl);
+  public GetFolders = async (webAbsoluteUrl: string, folderRelativeUrl: string, orderby: string, orderAscending: boolean): Promise<IFolder[]> => {
+    return this._getFolders(webAbsoluteUrl, folderRelativeUrl, orderby, orderAscending);
   }
 
   /**
    * Get folders within a given library or sub folder
    * @param webAbsoluteUrl - the url of the target site
    * @param folderRelativeUrl - the relative url of the folder
    */
-  private _getFolders = async (webAbsoluteUrl: string, folderRelativeUrl: string): Promise<IFolder[]> => {
+  private _getFolders = async (webAbsoluteUrl: string, folderRelativeUrl: string, orderby: string, orderAscending: boolean): Promise<IFolder[]> => {
     let results: IFolder[] = [];
     try {
       const web = Web(webAbsoluteUrl);
       folderRelativeUrl = folderRelativeUrl.replace(/\'/ig, "''");
-      let foldersResult: IFolder[] = await web.getFolderByServerRelativePath(folderRelativeUrl).folders.select('Name', 'ServerRelativeUrl').orderBy('Name').get();
+      let foldersResult: IFolder[] = await web.getFolderByServerRelativePath(folderRelativeUrl).folders.select('Name', 'ServerRelativeUrl').orderBy(orderby, orderAscending).get();
       results = foldersResult.filter(f => f.Name != "Forms");
     } catch (error) {
       console.error('Error loading folders', error);
diff --git a/src/services/IFolderExplorerService.ts b/src/services/IFolderExplorerService.ts
@@ -24,7 +24,7 @@ export interface IFolderExplorerService {
   * @param webAbsoluteUrl - the url of the target site
   * @param folderRelativeUrl - the relative url of the folder
   */
-  GetFolders(webAbsoluteUrl: string, folderRelativeUrl: string): Promise<IFolder[]>;
+  GetFolders(webAbsoluteUrl: string, folderRelativeUrl: string, orderby: string, orderAscending: boolean): Promise<IFolder[]>;
 
   /**
   * Create a new folder
diff --git a/src/services/ISPService.ts b/src/services/ISPService.ts
diff --git a/src/services/SPService.ts b/src/services/SPService.ts
diff --git a/src/services/SPServiceMock.ts b/src/services/SPServiceMock.ts
diff --git a/src/webparts/controlsTest/components/ControlsTest.tsx b/src/webparts/controlsTest/components/ControlsTest.tsx

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,3 @@`
`1`		`-![SharePoint Patterns and Practices](https://devofficecdn.azureedge.net/media/Default/PnP/sppnp.png)`
`2`		`-`
`3`	`1`	`# SharePoint Framework React Controls`
`4`	`2`
`5`	`3`	`This is a open source library that shares a set of reusable React control that can be used in your SharePoint Framework solutions.`
Original file line number	Diff line number	Diff line change
`@@ -69,7 +69,7 @@ export class DateTimePicker extends React.Component<IDateTimePickerProps, IDateT`
`69`	`69`	`* Called before the component receives new props, used for matching state with new props.`
`70`	`70`	`*/`
`71`	`71`	`public componentWillReceiveProps(nextProps: IDateTimePickerProps): void {`
`72`		`- if (nextProps.value != null && !isEqual(nextProps.value, this.props.value)) {`
	`72`	`+ if (!isEqual(nextProps.value, this.props.value)) {`
`73`	`73`	`const { day, hours, minutes, seconds } = DateTimePicker.getDateComponents(nextProps.value, this.props.dateConvention);`
`74`	`74`	`this.setState({ day, hours, minutes, seconds });`
`75`	`75`	`}`
`@@ -134,9 +134,9 @@ export class DateTimePicker extends React.Component<IDateTimePickerProps, IDateT`
`134`	`134`	`}`
`135`	`135`	`}`
`136`	`136`	`else if (hours === 12) {`
`137`		`- //am - if hours == 12, set hours to 0 here`
`138`		`- hours = 0;`
`139`		`- }`
	`137`	`+ //am - if hours == 12, set hours to 0 here`
	`138`	`+ hours = 0;`
	`139`	`+ }`
`140`	`140`	`}`
`141`	`141`
`142`	`142`	`if (hours > 23) {`
Original file line number	Diff line number	Diff line change
`@@ -166,7 +166,9 @@ export class FolderExplorer extends React.Component<IFolderExplorerProps, IFolde`
`166`	`166`	`}`
`167`	`167`	`} else {`
`168`	`168`	`// library/folder level, get folders`
`169`		`- this._allFolders = await this._spService.GetFolders(siteAbsoluteUrl, folder.ServerRelativeUrl);`
	`169`	`+ const orderBy = this.props.orderby !== undefined ? this.props.orderby : 'Name';`
	`170`	`+ const orderAscending = this.props.orderAscending !== undefined ? this.props.orderAscending : true;`
	`171`	`+ this._allFolders = await this._spService.GetFolders(siteAbsoluteUrl, folder.ServerRelativeUrl, orderBy, orderAscending);`
`170`	`172`	`}`
`171`	`173`	`this.setState({ folders: this._allFolders, selectedFolder: folder, foldersLoading: false });`
`172`	`174`