Added devcontainer, updated readme

samples/react-content-query-online/.devcontainer/devcontainer.json

@@ -0,0 +1,39 @@
+// For more information on how to run this SPFx project in a VS Code Remote Container, please visit https://aka.ms/spfx-devcontainer
+{
+	"name": "SPFx 1.11.0",
+	"image": "docker.io/m365pnp/spfx:1.11.0",
+	// Set *default* container specific settings.json values on container create.
+	"settings": {},
+	// Add the IDs of extensions you want installed when the container is created.
+	"extensions": [
+		"editorconfig.editorconfig",
+		"dbaeumer.vscode-eslint"
+	],
+	// Use 'forwardPorts' to make a list of ports inside the container available locally.
+	"forwardPorts": [
+		4321,
+		35729,
+		5432
+	],
+	"portsAttributes": {
+		"4321": {
+			"protocol": "https",
+			"label": "Manifest",
+			"onAutoForward": "silent",
+			"requireLocalPort": true
+		},
+		"5432": {
+			"protocol": "https",
+			"label": "Workbench",
+			"onAutoForward": "silent"
+		},
+		"35729": {
+			"protocol": "https",
+			"label": "LiveReload",
+			"onAutoForward": "silent",
+			"requireLocalPort": true
+		}
+	},
+	"postCreateCommand": "bash .devcontainer/spfx-startup.sh",
+	"remoteUser": "node"
+}

samples/react-content-query-online/.devcontainer/spfx-startup.sh

@@ -0,0 +1,31 @@
+echo
+echo -e "\e[1;94mInstalling Node dependencies\e[0m"
+npm install
+
+## commands to create dev certificate and copy it to the root folder of the project
+echo
+echo -e "\e[1;94mGenerating dev certificate\e[0m"
+gulp trust-dev-cert
+
+
+cp ~/.gcb-serve-data/gcb-serve.cer ./spfx-dev-cert.cer
+cp ~/.gcb-serve-data/gcb-serve.cer ./spfx-dev-cert.pem
+
+## add *.cer to .gitignore to prevent certificates from being saved in repo
+if ! grep -Fxq '*.cer' ./.gitignore
+  then
+    echo "# .CER Certificates" >> .gitignore
+    echo "*.cer" >> .gitignore
+fi
+
+## add *.pem to .gitignore to prevent certificates from being saved in repo
+if ! grep -Fxq '*.pem' ./.gitignore
+  then
+    echo "# .PEM Certificates" >> .gitignore
+    echo "*.pem" >> .gitignore
+fi
+
+echo
+echo -e "\e[1;92mReady!\e[0m"
+
+echo -e "\n\e[1;94m**********\nOptional: if you plan on using gulp serve, don't forget to add the container certificate to your local machine. Please visit https://aka.ms/spfx-devcontainer for more information\n**********"

samples/react-content-query-online/README.md

@@ -10,7 +10,6 @@ While the original web part was based on an **XSLT** templating engine, this *Re
 
 ![Web Part Preview](assets/toolpart.gif)
 
-
 ## Compatibility
 
 | :warning: Important          |
@@ -38,6 +37,7 @@ While the original web part was based on an **XSLT** templating engine, this *Re
 * [Paolo Pialorsi](https://github.com/PaoloPia)
 * [Simon-Pierre Plante](https://github.com/spplante)
 * [Abderahman Moujahid](https://github.com/Abderahman88)
+* [Chris Lizon](https://github.com/ChrisLizon)
 
 ## Version history
 
@@ -46,8 +46,8 @@ Version|Date|Comments
 1.0.0|May 04, 2017|Initial release
 1.0.1|July 23rd 15, 2017|Updated to GA Version
 1.0.3|August 12, 2017|Added external scripts functionality
-1.0.4|August 31, 2017|Fixed a bug where tenant sites/sub-sites were missing from the **Web Url** dropdown
+1.0.4|August 31, 2017|Fixed a bug where tenant sites/sub-sites were missing from the **Web URL** dropdown
-1.0.5|September 1st, 2017|Added a **Site Url** parameter next to the **Web Url** parameter in order to narrow down the results
+1.0.5|September 1st, 2017|Added a **Site URL** parameter next to the **Web URL** parameter in order to narrow down the results
 1.0.6|September 19, 2017|Upgraded to SharePoint drop 1.2.0 and added the site URL and web URL preselection when adding the web part for the first time on a page. Also fixed a bug with fields that had spaces in their internal names (automatically replaced with `_x0020_` by SharePoint).
 1.0.7|November 17, 2017|Reverted to drop 1.1.0 in order to keep compatibility for SP2016 on-premise
 1.0.8|March 17, 2018|Updated to store the selected list using its ID instead of its title, so the web part keeps working if the list title gets updated.
@@ -288,7 +288,6 @@ Property | Description
 `{{MyField.jsonValue}}`  | Returns a JSON object value of the field. For example, an *Image* field JSON value would return a JSON object which contains the `serverRelativeUrl` property
 `{{MyField.personValue}}`  | Returns an object value of a person field. The `personValue` property provides `email`, `displayName` and `image` properties. The `image` property contains `small`, `medium`, and `large` properties, each of which pointing to the profile image URL for the small, medium, and large profile images.
 
-
 ##### Handlebars
 
 ```handlebars
@@ -344,7 +343,6 @@ If you need custom logic files that can interact precisely **before** or **after
 
 ```javascript
 ReactContentQuery.ExternalScripts.MyScriptFile = {
-	
     onPreRender: function(wpContext, handlebarsContext) {
         // Do something before rendering (ie: adding a custom block helper)
     },
@@ -352,7 +350,6 @@ ReactContentQuery.ExternalScripts.MyScriptFile = {
     onPostRender: function(wpContext, handlebarsContext) {
         // Do something after rendering (ie: calling a plugin on the generated HTML)
     }
-    
 }
 ```
 
@@ -429,7 +426,6 @@ If you have a SharePoint list containing a user field (like a **Created By** or
 
 For example, to use the `mgt-person` component with a person field called `MyPersonField`, you would use the following template:
 
-
 ```handlebars
 <mgt-person person-query="{{MyPersonField.personValue.email}}" view="twoLines"></mgt-person>
 ```
@@ -498,10 +494,8 @@ For questions regarding this sample, [create a new question](https://github.com/
 
 Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Aenhancement%2Csample%3A%20react-content-query-online&template=question.yml&sample=react-content-query-online&authors=@YOURGITHUBUSERNAME&title=react-content-query-online%20-%20).
 
-
 ## Disclaimer
 
 **THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**
 
-
 <img src="https://m365-visitor-stats.azurewebsites.net/sp-dev-fx-webparts/samples/react-content-query-online" />

samples/react-content-query-online/assets/sample.json

@@ -9,7 +9,7 @@
       "The React Content Query Web Part is a modern version of the good old Content by Query Web Part that was introduced in SharePoint 2007. Built for SharePoint Online, this modern version is built against the new SharePoint Framework (SPFx) and uses the latest Web Stack practices. While the original Web Part was based on a XSLT templating engine, this React Web Part is based on the well known Handlebars templating engine, which empowers users to create simple, yet powerfull HTML templates for rendering the queried content. This new version also lets the user query any site collections which resides on the same domain url, add unlimited filters, query DateTime fields to the nearest minute rather than being limited to a day, and much more."
     ],
     "creationDateTime": "2021-01-07",
-    "updateDateTime": "2021-01-07",
+    "updateDateTime": "2023-05-04",
     "products": [
       "SharePoint"
     ],
@@ -20,7 +20,7 @@
       },
       {
         "key": "SPFX-VERSION",
-        "value": "1.10.0"
+        "value": "1.11.0"
       }
     ],
     "thumbnails": [
@@ -136,6 +136,11 @@
         "company": "",
         "pictureUrl": "https://avatars.githubusercontent.com/u/36161889?s=460\u0026u=afdd5f6681bc375ee3811482dec79824c12d8170\u0026v=4",
         "name": "Abderahman Moujahid"
+      },
+      {
+          "gitHubAccount": "ChrisLizon",
+          "name": "Chris Lizon",
+          "pictureUrl": "https://github.com/ChrisLizon.png"
           }
     ],
     "references": [