Merge pull request #68 from Microsoft/update-uifabric-ext-dependencies

Update dependencies for ui-fabric-react example

ui-fabric-react/manifests/base.json

@@ -1,7 +1,7 @@
 {
     "manifestVersion": 1,
     "id": "samples-ui-fabric-react",
-    "version": "1.0.9",
+    "version": "1.0.15",
     "publisher": "ms-samples",
     "name": "Office UI Fabric React Sample",
     "description": "Sample Visual Studio Team Services web extension built with Office UI Fabric React components.",
@@ -34,6 +34,6 @@
                 "order": 1000,
                 "uri": "index.html"
             }
-        }       
+        }
     ]
 }

ui-fabric-react/package.json

@@ -3,7 +3,12 @@
   "version": "1.0.0",
   "description": "Sample Visual Studio Team Services web extension using Office UI Fabric React",
   "main": "index.html",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/microsoft/vsts-extension-samples"
+  },
   "scripts": {
+    "build": "gulp",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "keywords": [
@@ -11,24 +16,34 @@
     "extension",
     "office-ui-fabric-react"
   ],
-  "author": "serkan-inci",
+  "author": "Microsoft Corporation",
+  "contributors": [
+    {
+      "name": "Serkan Inci",
+      "email": "serkani@microsoft.com"
+    },
+    {
+      "name": "Trevor Gau",
+      "email": "trgau@microsoft.com"
+    }
+  ],
   "license": "MIT",
   "devDependencies": {
-    "@types/react": "^0.14.48",
-    "@types/react-dom": "^0.14.18",
+    "@types/react": "^15.6.1",
+    "@types/react-dom": "^15.5.2",
     "@types/q": "0.0.32",
     "gulp": "^3.9.1",
     "gulp-rename": "^1.2.2",
     "gulp-template": "^4.0.0",
     "gulp-typescript": "^3.1.3",
     "gulp-webpack": "^1.5.0",
-    "tfx-cli": "^0.3.45",
-    "typescript": "^2.0.10",
-    "webpack": "^1.13.3",
+    "tfx-cli": "^0.4.9",
+    "typescript": "~2.3.4",
+    "webpack": "^1.15.0",
     "yargs": "^6.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "^2.21.0",
-    "vss-web-extension-sdk": "^2.109.0"
+    "office-ui-fabric-react": "^4.33.0",
+    "vss-web-extension-sdk": "~3.121.0"
   }
 }

ui-fabric-react/scripts/WorkItemSearch.ts

@@ -1,9 +1,9 @@
 /// <reference types="vss-web-extension-sdk" />
 
-import * as Q from 'q';
-import { getClient, WorkItemTrackingHttpClient } from 'TFS/WorkItemTracking/RestClient';
-import { WorkItem, WorkItemFieldReference } from 'TFS/WorkItemTracking/Contracts';
-import { ignoreCaseComparer } from 'VSS/Utils/String';
+import * as Q from "q";
+import { getClient, WorkItemTrackingHttpClient3_1 } from "TFS/WorkItemTracking/RestClient";
+import { WorkItem, WorkItemFieldReference } from "TFS/WorkItemTracking/Contracts";
+import { ignoreCaseComparer } from "VSS/Utils/String";
 
 export interface IWiqlQueryResult {
     columns: WorkItemFieldReference[];
@@ -34,9 +34,9 @@ interface IWiqlResult {
 }
 
 class WorkItemSearch implements IWorkItemSearch {
-    private _httpClient: WorkItemTrackingHttpClient;
+    private _httpClient: WorkItemTrackingHttpClient3_1;
 
-    public get httpClient(): WorkItemTrackingHttpClient {
+    public get httpClient(): WorkItemTrackingHttpClient3_1 {
         if (!this._httpClient) {
             this._httpClient = getClient();
         }
@@ -51,14 +51,29 @@ class WorkItemSearch implements IWorkItemSearch {
                 queryResult => {
                     // We got the work item ids, now get the field values
                     if (queryResult.workItems.length > 0) {
-                        return this.httpClient.getWorkItems(queryResult.workItems.map(wi => wi.id), queryResult.columns.map(wiRef => wiRef.referenceName)).then(
-                            workItems => { return <IWorkItemSearchResult>{ queryResult: { columns: queryResult.columns, workItems: workItems } }; },
-                            err => { return <IWorkItemSearchResult>{ error: err.message }; });
+                        return this.httpClient
+                            .getWorkItems(
+                                queryResult.workItems.map(wi => wi.id),
+                                queryResult.columns.map(wiRef => wiRef.referenceName),
+                            )
+                            .then(
+                                workItems => {
+                                    return <IWorkItemSearchResult>{
+                                        queryResult: { columns: queryResult.columns, workItems: workItems },
+                                    };
+                                },
+                                err => {
+                                    return <IWorkItemSearchResult>{ error: err.message };
+                                },
+                            );
                     } else {
                         return <IWorkItemSearchResult>{ queryResult: { columns: queryResult.columns, workItems: [] } };
                     }
                 },
-                err => { return <IWorkItemSearchResult>{ error: err.message }; });
+                err => {
+                    return <IWorkItemSearchResult>{ error: err.message };
+                },
+            ) as IPromise<IWorkItemSearchResult>;
         }
 
         return Q(<IWorkItemSearchResult>{ error: wiqlResult.error });
@@ -72,7 +87,9 @@ class WorkItemSearch implements IWorkItemSearch {
         if (filter && filter.keyword && filter.keyword.length >= 3) {
             let wiqlWhereClauses = [`([System.TeamProject] = @project)`];
             // Add keyword
-            wiqlWhereClauses.push(`([System.Title] CONTAINS '${filter.keyword}' OR [System.Description] CONTAINS '${filter.keyword}')`);
+            wiqlWhereClauses.push(
+                `([System.Title] CONTAINS '${filter.keyword}' OR [System.Description] CONTAINS '${filter.keyword}')`,
+            );
 
             if (filter.assignedToMe) {
                 wiqlWhereClauses.push(`([System.AssignedTo] = @me)`);
@@ -97,11 +114,12 @@ class WorkItemSearch implements IWorkItemSearch {
                     [System.Tags]
                 FROM WorkItems
                 WHERE ${wiqlWhereClauses.join(" AND ")}
-                ORDER BY [System.ChangedDate] DESC`};
+                ORDER BY [System.ChangedDate] DESC`,
+            };
         }
 
         return { error: "Specify at least 3 chars for the keyword" };
     }
 }
 
-export var Instance: IWorkItemSearch = new WorkItemSearch(); 
+export var Instance: IWorkItemSearch = new WorkItemSearch();

ui-fabric-react/scripts/WorkItemSearchComponent.tsx

@@ -152,9 +152,7 @@ class WorkItemSearchComponent extends React.Component<IWorkItemSearchProps, IWor
     }
 
     private _setSearchResult(querying: boolean, result: IWorkItemSearchResult): void {
-        this.state.querying = querying;
-        this.state.result = result;
-        this.setState(this.state);
+        this.setState({querying, result});
     }
 }
 

ui-fabric-react/tsconfig.json

@@ -4,10 +4,16 @@
         "moduleResolution": "node",
         "target": "es5",
         "noImplicitAny": false,
+        "lib": ["es5", "es6", "dom"],
         "jsx": "react",
         "sourceMap": false,
         "paths": {
             "OfficeFabric/*": ["node_modules/office-ui-fabric-react/lib-amd/*"]
-        }
-    }
+        },
+        "baseUrl": "./",
+        "types": ["jquery", "jqueryui", "knockout", "q", "react", "react-dom", "requirejs"]
+    },
+    "include": [
+        "scripts/WorkItemSearchComponent.tsx"
+    ]
 }