Merge branch 'master' of https://github.com/russgove/sp-dev-fx-controls-react into russgove-master

Author: joelfmrodrigues

docs/documentation/docs/controls/ComboBoxListItemPicker.md

@@ -25,6 +25,7 @@ import { ComboBoxListItemPicker } from '@pnp/spfx-controls-react/lib/ListItemPic
 ```TypeScript
 <ComboBoxListItemPicker listId='da8daf15-d84f-4ab1-9800-7568f82fed3f'
                         columnInternalName='Title'
+                        orderBy='Title asc'
                         keyColumnInternalName='Id'
                         filter="Title eq 'SPFx'"
                         onSelectedItem={this.onSelectedItem}
@@ -123,5 +124,6 @@ The `ComboBoxListItemPicker` control can be configured with the following proper
 | onInitialized | () => void | no | Calls when component is ready|
 | itemLimit | number | no | Maximum number of items to be displayed in the combobox. Default: 100 |
 | label | string | no | Specifies the text describing the combobox ListItemPicker. |
+| orderBy | string | no | Specifies the sequence of the items in the comboBox ,same as $orderBy ODATA parameter|
 
 ![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/ComboBoxListItemPicker)

src/common/dal/ListItemRepository.ts

@@ -12,12 +12,15 @@ export class ListItemRepository {
      * @param keyInternalColumnName
      * @param webUrl
      * @param top
+     * @param orderBy text value of the filter part of oData query 'Title desc, Created'
      */
-    public async getListItemsByFilterClause(filterText: string, listId: string, internalColumnName: string, keyInternalColumnName?: string, webUrl?: string, top?: number): Promise<any[]> {
-        let returnItems: any[];
+    public async getListItemsByFilterClause(filterText: string, listId: string, internalColumnName: string, keyInternalColumnName?: string, webUrl?: string, top?: number, orderBy?: string): Promise<any[]> {
         try {
             const webAbsoluteUrl = !webUrl ? this.SiteUrl : webUrl;
-            const apiUrl = `${webAbsoluteUrl}/_api/web/lists('${listId}')/items?$select=${keyInternalColumnName || 'Id'},${internalColumnName}&$filter=${filterText}&$top=${top}`;
+            let apiUrl = `${webAbsoluteUrl}/_api/web/lists('${listId}')/items?$select=${keyInternalColumnName || 'Id'},${internalColumnName}&$filter=${filterText}&$top=${top}`;
+            if (orderBy) {
+              apiUrl += `&$orderBy=${orderBy}`
+            }
             const data = await this.SPClient.get(apiUrl, SPHttpClient.configurations.v1);
             if (data.ok) {
                 const results = await data.json();

src/controls/listItemPicker/ComboBoxListItemPicker.tsx

@@ -1,10 +1,11 @@
 import * as strings from 'ControlStrings';
-import * as React from "react";
+import { ComboBox, IComboBoxOption } from "office-ui-fabric-react/lib/ComboBox";
 import { Label } from "office-ui-fabric-react/lib/Label";
+import * as React from "react";
+
 import { IComboBoxListItemPickerProps, IComboBoxListItemPickerState } from ".";
-import * as telemetry from '../../common/telemetry';
-import { ComboBox, IComboBoxOption } from "office-ui-fabric-react/lib/ComboBox";
 import { ListItemRepository } from '../../common/dal/ListItemRepository';
+import * as telemetry from '../../common/telemetry';
 import styles from './ComboBoxListItemPicker.module.scss';
 import { Spinner, SpinnerSize } from 'office-ui-fabric-react';
 import { cloneDeep, isEqual } from 'lodash';
@@ -45,7 +46,8 @@ export class ComboBoxListItemPicker extends React.Component<IComboBoxListItemPic
       columnInternalName,
       webUrl,
       itemLimit,
-      onInitialized
+      onInitialized,
+      orderBy
     } = props;
     let query = filter || "";
     //query += filter;
@@ -57,7 +59,8 @@ export class ComboBoxListItemPicker extends React.Component<IComboBoxListItemPic
         columnInternalName,
         keyColumnInternalName,
         webUrl,
-        itemLimit || 100);
+        itemLimit || 100,
+        orderBy);
 
         this._options = listItems.map(option => {
           return {

src/controls/listItemPicker/IComboBoxListItemPickerProps.ts

@@ -29,4 +29,5 @@ export interface IComboBoxListItemPickerProps {
     onInitialized?: () => void;
     onSelectedItem: (item: any) => void;
     label?: string;
+    orderBy?:string;
 }

src/webparts/controlsTest/components/ControlsTest.tsx

@@ -1443,6 +1443,7 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
                 <ComboBoxListItemPicker listId={this.state.comboBoxListItemPickerListId}
                   columnInternalName='Title'
                   keyColumnInternalName='Id'
+                  orderBy='Title desc'
                   multiSelect={true}
                   onSelectedItem={(data) => {
                     console.log(`Item(s):`, data);