commit changes

samples/react-list-items-menu/README.md

@@ -55,6 +55,7 @@ Version|Date|Comments
 1.0.0|November 20, 2020|Initial release
 1.0.1|February 18, 2021|Added support for metadata columns
 1.0.2|February 21, 2021|Fixed `gulp build` issues
+1.0.3|October 25, 2021|Fixed bug support for metadata columns and Lookup fields
 
 ## Minimal Path to Awesome
 

samples/react-list-items-menu/config/package-solution.json

@@ -3,7 +3,7 @@
   "solution": {
     "name": "react-list-items-menu-client-side-solution",
     "id": "8b4a758d-a968-4e7c-a949-b42e7dd5ad14",
-    "version": "1.0.2.0",
+    "version": "1.0.3.0",
     "includeClientSideAssets": true,
     "skipFeatureDeployment": true,
     "isDomainIsolated": false,

samples/react-list-items-menu/package-lock.json

@@ -8342,6 +8342,11 @@
         }
       }
     },
+    "date-fns": {
+      "version": "2.25.0",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.25.0.tgz",
+      "integrity": "sha512-ovYRFnTrbGPD4nqaEqescPEv1mNwvt+UTqI3Ay9SzNtey9NZnYu6E2qCcBBgJ6/2VF1zGGygpyTDITqpQQ5e+w=="
+    },
     "dateformat": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.2.0.tgz",

samples/react-list-items-menu/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-list-items-menu",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "private": true,
   "main": "lib/index.js",
   "engines": {
@@ -26,6 +26,7 @@
     "@pnp/spfx-property-controls": "1.19.0",
     "@types/jquery": "^3.5.0",
     "@uifabric/file-type-icons": "^7.6.11",
+    "date-fns": "^2.25.0",
     "jquery": "^3.5.1",
     "jsstore": "^3.10.3",
     "moment": "^2.29.1",

samples/react-list-items-menu/src/Utils/Utils.ts

@@ -158,3 +158,11 @@ export const convertTimeTo24h = (
     resolve(hourInTimeFormat);
   });
 };
+
+/* Check if string is valid date */
+export const checkIfValidDate = (str:string):boolean => {
+  // Regular expression to check if string is valid date
+  const regexExp = /(?:(?:31(\/|-|\.)(?:0?[13578]|1[02]))\1|(?:(?:29|30)(\/|-|\.)(?:0?[13-9]|1[0-2])\2))(?:(?:1[6-9]|[2-9]\d)?\d{2})$|^(?:29(\/|-|\.)0?2\3(?:(?:(?:1[6-9]|[2-9]\d)?(?:0[48]|[2468][048]|[13579][26])|(?:(?:16|[2468][048]|[3579][26])00))))$|^(?:0?[1-9]|1\d|2[0-8])(\/|-|\.)(?:(?:0?[1-9])|(?:1[0-2]))\4(?:(?:1[6-9]|[2-9]\d)?\d{2})/gi;
+
+  return regexExp.test(str);
+};

samples/react-list-items-menu/src/hooks/useList.ts

@@ -9,7 +9,8 @@ import moment from "moment";
 import { sp } from "@pnp/sp";
 import { IFieldInfo } from "@pnp/sp/fields";
 import { IListInfo } from "@pnp/sp/lists";
-
+import { checkIfValidDate } from "../Utils/Utils";
+import {format , parseISO} from 'date-fns';
 export const useList = () => {
   // Run on useList hook
   (async () => {})();
@@ -71,12 +72,14 @@ export const useList = () => {
   ): Promise<any[]> => {
     const _field: any = await getField(listId, groupByField);
 
+    if (checkIfValidDate(groupFieldValue)) {
+      groupFieldValue = format(new Date(groupFieldValue), "yyyy-MM-dd");
+    }
+
     switch (_field.fieldType) {
       case "DateTime":
         groupFieldValue =
-          groupFieldValue != "Unassigned"
+          groupFieldValue != "Unassigned" ? format(parseISO(groupFieldValue), "yyyy-MM-dd") : "Unassigned";
-            ? moment(groupFieldValue).format("YYYY-MM-DD")
-            : "Unassigned";
         break;
       case "AllDayEvent":
         groupFieldValue = groupFieldValue === "No" ? "0" : "1";
@@ -84,7 +87,6 @@ export const useList = () => {
       default:
         break;
     }
-
     let _viewXml = `<View Scope='Recursive'>
            <Query>
             <OrderBy>