diff --git a/samples/react-list-items-menu/README.md b/samples/react-list-items-menu/README.md index f04bc86a4..770962121 100644 --- a/samples/react-list-items-menu/README.md +++ b/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 diff --git a/samples/react-list-items-menu/config/package-solution.json b/samples/react-list-items-menu/config/package-solution.json index 5d7381b36..6cf93a1d8 100644 --- a/samples/react-list-items-menu/config/package-solution.json +++ b/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, diff --git a/samples/react-list-items-menu/package-lock.json b/samples/react-list-items-menu/package-lock.json index bb99da7c1..ac45cf08d 100644 --- a/samples/react-list-items-menu/package-lock.json +++ b/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", diff --git a/samples/react-list-items-menu/package.json b/samples/react-list-items-menu/package.json index 458a5b192..9911c4569 100644 --- a/samples/react-list-items-menu/package.json +++ b/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", diff --git a/samples/react-list-items-menu/src/Utils/Utils.ts b/samples/react-list-items-menu/src/Utils/Utils.ts index 218a2d88d..81f09d905 100644 --- a/samples/react-list-items-menu/src/Utils/Utils.ts +++ b/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); +}; diff --git a/samples/react-list-items-menu/src/hooks/useList.ts b/samples/react-list-items-menu/src/hooks/useList.ts index c827ac46a..a6cb171c3 100644 --- a/samples/react-list-items-menu/src/hooks/useList.ts +++ b/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 => { 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" - ? moment(groupFieldValue).format("YYYY-MM-DD") - : "Unassigned"; + groupFieldValue != "Unassigned" ? format(parseISO(groupFieldValue), "yyyy-MM-dd") : "Unassigned"; break; case "AllDayEvent": groupFieldValue = groupFieldValue === "No" ? "0" : "1"; @@ -84,7 +87,6 @@ export const useList = () => { default: break; } - let _viewXml = `