React-DataTable: Upgraded to SPFx version 1.14.0

samples/react-datatable/.gitignore

@@ -9,6 +9,7 @@ node_modules
 # Build generated files
 dist
 lib
+release
 solution
 temp
 *.sppkg

samples/react-datatable/.npmignore

@@ -0,0 +1,16 @@
+!dist
+config
+
+gulpfile.js
+
+release
+src
+temp
+
+tsconfig.json
+tslint.json
+
+*.log
+
+.yo-rc.json
+.vscode

samples/react-datatable/.yo-rc.json

@@ -1,8 +1,9 @@
 {
   "@microsoft/generator-sharepoint": {
+    "plusBeta": false,
     "isCreatingSolution": true,
     "environment": "spo",
-    "version": "1.11.0",
+    "version": "1.14.0",
     "libraryName": "react-datatable",
     "libraryId": "35299377-f8c8-4721-bd53-05602fc0c4ee",
     "packageManager": "npm",

samples/react-datatable/README.md

@@ -50,6 +50,7 @@ Version|Date|Comments
 1.4|April 10, 2021|Added feature to show profile picture in user column and shows display name of user field in export to CSV and PDF.
 1.5|June 2, 2021|Added feature to show image in dataTable and upgraded to the SPFx version 1.12.1.
 1.6|July 16, 2021|Changed library export-to-csv with react-csv
+1.7|Feb 22, 2022|Upgrade to SPFx v1.14.0
 
 ## Minimal Path to Awesome
 

samples/react-datatable/assets/sample.json

@@ -9,7 +9,7 @@
       "This web part provides easy way to render SharePoint custom list in data table view with all the necessary features."
     ],
     "creationDateTime": "2021-03-01",
-    "updateDateTime": "2021-07-16",
+    "updateDateTime": "2022-02-22",
     "products": [
       "SharePoint"
     ],
@@ -20,7 +20,7 @@
       },
       {
         "key": "SPFX-VERSION",
-        "value": "1.12.1"
+        "value": "1.14.0"
       },
       {
         "key": "PNPCONTROLS",
@@ -44,7 +44,7 @@
     "authors": [
       {
         "gitHubAccount": "chandaniprajapati",
-        "company": "",
+        "company": "Rapid Circle",
         "pictureUrl": "https://github.com/chandaniprajapati.png",
         "name": "Chandani Prajapati",
         "twitter": "Chandani_SPD"

samples/react-datatable/config/copy-assets.json

@@ -1,4 +0,0 @@
-{
-  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/copy-assets.schema.json",
-  "deployCdnPath": "temp/deploy"
-}

samples/react-datatable/config/deploy-azure-storage.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json",
-  "workingDir": "./temp/deploy/",
+  "workingDir": "./release/assets/",
   "account": "<!-- STORAGE ACCOUNT NAME -->",
-  "container": "react-datatable",
+  "container": "DataTable",
   "accessKey": "<!-- ACCESS KEY -->"
 }

samples/react-datatable/config/package-solution.json

@@ -11,7 +11,7 @@
       "websiteUrl": "",
       "privacyUrl": "",
       "termsOfUseUrl": "",
-      "mpnId": ""
+      "mpnId": "Undefined-1.14.0"
     }
   },
   "paths": {

samples/react-datatable/config/serve.json

@@ -2,9 +2,5 @@
   "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
   "port": 4321,
   "https": true,
-  "initialPage": "https://localhost:5432/workbench",
+  "initialPage": "https://enter-your-SharePoint-site/_layouts/workbench.aspx"
-  "api": {
-    "port": 5432,
-    "entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"
-  }
 }

samples/react-datatable/package.json

@@ -12,35 +12,33 @@
     "test": "gulp test"
   },
   "dependencies": {
-    "@material-ui/core": "^4.11.4",
+    "@material-ui/core": "^4.12.3",
-    "@material-ui/icons": "^4.11.2",
+    "@microsoft/sp-core-library": "1.14.0",
-    "@microsoft/sp-core-library": "1.12.1",
+    "@microsoft/sp-lodash-subset": "1.14.0",
-    "@microsoft/sp-lodash-subset": "1.12.1",
+    "@microsoft/sp-office-ui-fabric-core": "1.14.0",
-    "@microsoft/sp-office-ui-fabric-core": "1.12.1",
+    "@microsoft/sp-property-pane": "1.14.0",
-    "@microsoft/sp-property-pane": "1.12.1",
+    "@microsoft/sp-webpart-base": "1.14.0",
-    "@microsoft/sp-webpart-base": "1.12.1",
     "@pnp/sp": "2.5.0",
     "@pnp/spfx-controls-react": "3.1.0",
-    "@pnp/spfx-property-controls": "^3.2.0-beta.ab74df5",
+    "@pnp/spfx-property-controls": "3.5.0",
-    "office-ui-fabric-react": "7.156.0",
+    "office-ui-fabric-react": "7.174.1",
     "pdfmake": "^0.1.70",
-    "react": "16.9.0",
+    "react": "16.13.1",
     "react-csv": "^2.0.3",
-    "react-dom": "16.9.0"
+    "react-dom": "16.13.1"
   },
   "devDependencies": {
-    "@types/react": "16.9.36",
+    "@types/react": "16.9.51",
     "@types/react-dom": "16.9.8",
-    "@microsoft/sp-build-web": "1.12.1",
+    "@microsoft/sp-build-web": "1.14.0",
-    "@microsoft/sp-tslint-rules": "1.12.1",
+    "@microsoft/sp-tslint-rules": "1.14.0",
-    "@microsoft/sp-module-interfaces": "1.12.1",
+    "@microsoft/sp-module-interfaces": "1.14.0",
-    "@microsoft/sp-webpart-workbench": "1.12.1",
+    "@microsoft/rush-stack-compiler-3.9": "0.4.47",
-    "@microsoft/rush-stack-compiler-3.3": "0.3.5",
     "gulp": "~4.0.2",
     "@types/chai": "3.4.34",
     "@types/mocha": "2.2.38",
     "ajv": "~5.2.2",
-    "@types/webpack-env": "1.13.1",
+    "@types/webpack-env": "1.14.0",
     "@types/es6-promise": "0.0.33"
   }
 }

samples/react-datatable/release/component-dependency-audit/react-datatable.json

@@ -5,37 +5,37 @@
         {
           "componentId": "f9e737b7-f0df-4597-ba8c-3060f82380db",
           "componentName": "@microsoft/sp-property-pane",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": true
         },
         {
           "componentId": "1c6c9123-7aac-41f3-a376-3caea41ed83f",
           "componentName": "@microsoft/sp-loader",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
           "componentId": "8217e442-8ed3-41fd-957d-b112e841286a",
           "componentName": "@ms/sp-telemetry",
-          "componentVersion": "0.19.2",
+          "componentVersion": "0.21.51",
           "isDirectDependency": false
         },
         {
           "componentId": "e40f8203-b39d-425a-a957-714852e33b79",
           "componentName": "@microsoft/sp-dynamic-data",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
           "componentId": "73e1dc6c-8441-42cc-ad47-4bd3659f8a3a",
           "componentName": "@microsoft/sp-lodash-subset",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
           "componentId": "7263c7d0-1d6a-45ec-8d85-d4d1d234171b",
           "componentName": "@microsoft/sp-core-library",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
@@ -47,19 +47,19 @@
         {
           "componentId": "2e09fb9b-13bb-48f2-859f-97d6fff71176",
           "componentName": "@ms/odsp-core-bundle",
-          "componentVersion": "1.1.13",
+          "componentVersion": "1.1.258",
           "isDirectDependency": false
         },
         {
           "componentId": "78359e4b-07c2-43c6-8d0b-d060b4d577e8",
           "componentName": "@microsoft/sp-diagnostics",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
           "componentId": "1c4541f7-5c31-41aa-9fa8-fbc9dc14c0a8",
           "componentName": "@microsoft/sp-page-context",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
@@ -71,31 +71,37 @@
         {
           "componentId": "c07208f0-ea3b-4c1a-9965-ac1b825211a6",
           "componentName": "@microsoft/sp-http",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": false
         },
         {
           "componentId": "0d910c1c-13b9-4e1c-9aa4-b008c5e42d7d",
           "componentName": "react",
-          "componentVersion": "16.9.0",
+          "componentVersion": "16.13.1",
           "isDirectDependency": false
         },
         {
           "componentId": "aa0a46ec-1505-43cd-a44a-93f3a5aa460a",
           "componentName": "react-dom",
-          "componentVersion": "16.9.0",
+          "componentVersion": "16.13.1",
           "isDirectDependency": false
         },
         {
           "componentId": "974a7777-0990-4136-8fa6-95d80114c2e0",
           "componentName": "@microsoft/sp-webpart-base",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
           "isDirectDependency": true
         },
         {
           "componentId": "467dc675-7cc5-4709-8aac-78e3b71bd2f6",
           "componentName": "@microsoft/sp-component-base",
-          "componentVersion": "1.12.1",
+          "componentVersion": "1.14.0",
+          "isDirectDependency": false
+        },
+        {
+          "componentId": "42647dee-1f75-4b9f-b521-5c844a6c35cc",
+          "componentName": "@ms/sp-edit-customer-promise",
+          "componentVersion": "0.1.0",
           "isDirectDependency": false
         }
       ]

samples/react-datatable/release/manifests/9d6e26c1-e57c-4005-ad6a-5b066f1acd65.manifest.json

@@ -1,154 +0,0 @@
-{
-  "id": "9d6e26c1-e57c-4005-ad6a-5b066f1acd65",
-  "alias": "ReactDatatableWebPart",
-  "componentType": "WebPart",
-  "version": "1.1.0",
-  "manifestVersion": 2,
-  "requiresCustomScript": false,
-  "supportedHosts": [
-    "SharePointWebPart"
-  ],
-  "preconfiguredEntries": [
-    {
-      "groupId": "5c03119e-3074-46fd-976b-c60198311f70",
-      "group": {
-        "default": "Other"
-      },
-      "title": {
-        "default": "Datatable"
-      },
-      "description": {
-        "default": "Shows the sharepoint list items in data table format with some advanced features."
-      },
-      "officeFabricIconFontName": "Table",
-      "properties": {
-        "title": "Webpart Title (eg. DataTable)",
-        "enableSorting": true,
-        "enableSearching": true,
-        "enableDownloadAsCsv": true,
-        "enableDownloadAsPdf": true,
-        "enablePagination": true
-      }
-    }
-  ],
-  "loaderConfig": {
-    "internalModuleBaseUrls": [
-      "<!-- PATH TO CDN -->"
-    ],
-    "entryModuleId": "react-datatable-web-part",
-    "scriptResources": {
-      "react-datatable-web-part": {
-        "type": "path",
-        "path": "react-datatable-web-part.js"
-      },
-      "@microsoft/sp-property-pane": {
-        "type": "component",
-        "id": "f9e737b7-f0df-4597-ba8c-3060f82380db",
-        "version": "1.12.1"
-      },
-      "@microsoft/sp-lodash-subset": {
-        "type": "component",
-        "id": "73e1dc6c-8441-42cc-ad47-4bd3659f8a3a",
-        "version": "1.12.1"
-      },
-      "ControlStrings": {
-        "type": "localizedPath",
-        "paths": {
-          "bg-BG": "ControlStrings_bg-bg.js",
-          "ca-ES": "ControlStrings_ca-es.js",
-          "da-DK": "ControlStrings_da-dk.js",
-          "de-DE": "ControlStrings_de-de.js",
-          "el-GR": "ControlStrings_el-gr.js",
-          "en-US": "ControlStrings_en-us.js",
-          "es-ES": "ControlStrings_es-es.js",
-          "et-EE": "ControlStrings_et-ee.js",
-          "eu-ES": "ControlStrings_eu-es.js",
-          "fi-FI": "ControlStrings_fi-fi.js",
-          "fr-CA": "ControlStrings_fr-ca.js",
-          "fr-FR": "ControlStrings_fr-fr.js",
-          "it-IT": "ControlStrings_it-it.js",
-          "ja-JP": "ControlStrings_ja-jp.js",
-          "lt-LT": "ControlStrings_lt-lt.js",
-          "lv-LV": "ControlStrings_lv-lv.js",
-          "nb-NO": "ControlStrings_nb-no.js",
-          "nl-NL": "ControlStrings_nl-nl.js",
-          "pl-PL": "ControlStrings_pl-pl.js",
-          "pt-PT": "ControlStrings_pt-pt.js",
-          "ro-RO": "ControlStrings_ro-ro.js",
-          "ru-RU": "ControlStrings_ru-ru.js",
-          "sk-SK": "ControlStrings_sk-sk.js",
-          "sr-Latn-RS": "ControlStrings_sr-latn-rs.js",
-          "sv-SE": "ControlStrings_sv-se.js",
-          "tr-TR": "ControlStrings_tr-tr.js",
-          "vi-VN": "ControlStrings_vi-vn.js",
-          "zh-CN": "ControlStrings_zh-cn.js",
-          "zh-TW": "ControlStrings_zh-tw.js"
-        },
-        "defaultPath": "ControlStrings_en-us.js"
-      },
-      "@microsoft/sp-core-library": {
-        "type": "component",
-        "id": "7263c7d0-1d6a-45ec-8d85-d4d1d234171b",
-        "version": "1.12.1"
-      },
-      "ReactDatatableWebPartStrings": {
-        "type": "path",
-        "path": "ReactDatatableWebPartStrings_en-us.js"
-      },
-      "@microsoft/sp-webpart-base": {
-        "type": "component",
-        "id": "974a7777-0990-4136-8fa6-95d80114c2e0",
-        "version": "1.12.1"
-      },
-      "react": {
-        "type": "component",
-        "id": "0d910c1c-13b9-4e1c-9aa4-b008c5e42d7d",
-        "version": "16.9.0"
-      },
-      "react-dom": {
-        "type": "component",
-        "id": "aa0a46ec-1505-43cd-a44a-93f3a5aa460a",
-        "version": "16.9.0"
-      },
-      "@microsoft/sp-http": {
-        "type": "component",
-        "id": "c07208f0-ea3b-4c1a-9965-ac1b825211a6",
-        "version": "1.12.1"
-      },
-      "PropertyControlStrings": {
-        "type": "localizedPath",
-        "paths": {
-          "bg-BG": "PropertyControlStrings_bg-bg.js",
-          "ca-ES": "PropertyControlStrings_ca-es.js",
-          "da-DK": "PropertyControlStrings_da-dk.js",
-          "de-DE": "PropertyControlStrings_de-de.js",
-          "el-GR": "PropertyControlStrings_el-gr.js",
-          "en-US": "PropertyControlStrings_en-us.js",
-          "es-ES": "PropertyControlStrings_es-es.js",
-          "et-EE": "PropertyControlStrings_et-ee.js",
-          "fi-FI": "PropertyControlStrings_fi-fi.js",
-          "fr-FR": "PropertyControlStrings_fr-fr.js",
-          "it-IT": "PropertyControlStrings_it-it.js",
-          "ja-JP": "PropertyControlStrings_ja-jp.js",
-          "lt-LT": "PropertyControlStrings_lt-lt.js",
-          "lv-LV": "PropertyControlStrings_lv-lv.js",
-          "nb-NO": "PropertyControlStrings_nb-no.js",
-          "nl-NL": "PropertyControlStrings_nl-nl.js",
-          "no": "PropertyControlStrings_no.js",
-          "pl-PL": "PropertyControlStrings_pl-pl.js",
-          "pt-PT": "PropertyControlStrings_pt-pt.js",
-          "ro-RO": "PropertyControlStrings_ro-ro.js",
-          "ru-RU": "PropertyControlStrings_ru-ru.js",
-          "sk-SK": "PropertyControlStrings_sk-sk.js",
-          "sr-Latn-RS": "PropertyControlStrings_sr-latn-rs.js",
-          "sv-SE": "PropertyControlStrings_sv-se.js",
-          "tr-TR": "PropertyControlStrings_tr-tr.js",
-          "vi-VN": "PropertyControlStrings_vi-vn.js",
-          "zh-CN": "PropertyControlStrings_zh-cn.js",
-          "zh-TW": "PropertyControlStrings_zh-tw.js"
-        },
-        "defaultPath": "PropertyControlStrings_en-us.js"
-      }
-    }
-  }
-}

samples/react-datatable/src/webparts/reactDatatable/ReactDatatableWebPart.ts

@@ -141,7 +141,7 @@ export default class ReactDatatableWebPart extends BaseClientSideWebPart<IReactD
                   baseTemplate: 100,
                   onPropertyChange: this.onChangeProperty.bind(this),
                   properties: this.properties,
-                  context: this.context,
+                  context: this.context as any,
                   onGetErrorMessage: null,
                   key: 'listPickerFieldId',
                 }),

samples/react-datatable/tsconfig.json

@@ -1,5 +1,5 @@
 {
-  "extends": "./node_modules/@microsoft/rush-stack-compiler-3.3/includes/tsconfig-web.json",
+  "extends": "./node_modules/@microsoft/rush-stack-compiler-3.9/includes/tsconfig-web.json",
   "compilerOptions": {
     "target": "es5",
     "forceConsistentCasingInFileNames": true,
@@ -11,7 +11,6 @@
     "experimentalDecorators": true,
     "skipLibCheck": true,
     "outDir": "lib",
-    "downlevelIteration": true,
     "inlineSources": false,
     "strictNullChecks": false,
     "noUnusedLocals": false,

samples/react-datatable/tslint.json

@@ -1,5 +1,5 @@
 {
-  "extends": "@microsoft/sp-tslint-rules/base-tslint.json",
+  "extends": "./node_modules/@microsoft/sp-tslint-rules/base-tslint.json",
   "rules": {
     "class-name": false,
     "export-name": false,
@@ -17,7 +17,6 @@
     "no-switch-case-fall-through": true,
     "no-unnecessary-semicolons": true,
     "no-unused-expression": true,
-    "no-use-before-declare": true,
     "no-with-statement": true,
     "semicolon": true,
     "trailing-comma": false,