diff --git a/web/package.json b/web/package.json index 27907da95..08688a26d 100644 --- a/web/package.json +++ b/web/package.json @@ -10,8 +10,9 @@ "@babel/core": "^7.10.2", "@babel/eslint-parser": "^7.12.13", "@babel/eslint-plugin": "^7.12.13", - "@babel/plugin-proposal-object-rest-spread": "^7.9.6", + "@babel/plugin-proposal-object-rest-spread": "^7.10.1", "@babel/preset-env": "^7.10.2", + "@babel/preset-typescript": "^7.8.3", "@emotion/core": "^10.0.14", "@emotion/memoize": "^0.7.5", "@emotion/react": "^11.1.5", @@ -61,22 +62,20 @@ "sass-resources-loader": "^2.2.1", "style-loader": "^2.0.0", "stylis": "^4.0.7", + "svgo": "^1.1.1", + "svgo-loader": "^2.2.0", "terser-webpack-plugin": "^5.1.1", + "typescript": "^3.2.2", "webfonts-loader": "^7.1.1", "webpack": "^5.21.2", "webpack-bundle-analyzer": "^4.4.0", "webpack-cli": "^4.5.0", - "yarn-audit-html": "^2.0.0", - "@babel/preset-typescript": "^7.8.3", - "@babel/plugin-proposal-object-rest-spread": "^7.10.1", - "typescript": "^3.2.2", - "svgo": "^1.1.1", - "svgo-loader": "^2.2.0" + "yarn-audit-html": "^2.0.0" }, "dependencies": { "@babel/plugin-proposal-class-properties": "^7.10.4", "@babel/preset-react": "^7.12.13", - "@date-io/moment": "1.x", + "@date-io/date-fns": "1.x", "@emotion/sheet": "^1.0.1", "@fortawesome/fontawesome-free": "^5.14.0", "@material-ui/core": "4.11.0", @@ -86,8 +85,12 @@ "@projectstorm/react-diagrams": "^6.4.2", "@simonwep/pickr": "^1.5.1", "@tippyjs/react": "^4.2.0", + "@types/classnames": "^2.2.6", + "@types/react": "^16.7.18", + "@types/react-dom": "^16.0.11", "acitree": "git+https://github.com/imsurinder90/jquery-aciTree.git#rc.7", "alertifyjs": "git+https://github.com/EnterpriseDB/AlertifyJS/#72c1d794f5b6d4ec13a68d123c08f19021afe263", + "aspen-decorations": "^1.0.2", "axios": "^0.21.1", "babelify": "~10.0.0", "backbone": "1.4.0", @@ -98,17 +101,22 @@ "bootstrap": "^4.3.1", "bootstrap-datepicker": "^1.8.0", "bootstrap4-toggle": "^3.6.1", + "browserfs": "^1.4.3", "chart.js": "^2.9.3", + "classnames": "^2.2.6", "closest": "^0.0.1", "codemirror": "^5.59.2", + "context-menu": "^2.0.0", "css-loader": "^5.0.1", "cssnano": "^5.0.2", "dagre": "^0.8.4", + "date-fns": "^2.24.0", "diff-arrays-of-objects": "^1.1.8", "dropzone": "^5.7.4", "html2canvas": "^1.0.0-rc.7", "immutability-helper": "^3.0.0", "imports-loader": "^2.0.0", + "insert-if": "^1.1.0", "ip-address": "^7.1.0", "istanbul-instrumenter-loader": "^3.0.1", "jquery": "^3.6.0", @@ -123,11 +131,15 @@ "moment": "^2.29.1", "moment-timezone": "^0.5.33", "mousetrap": "^1.6.3", + "notificar": "^1.0.1", + "path-fx": "^2.0.0", "pathfinding": "^0.4.18", "paths-js": "^0.4.9", + "pgadmin4-tree": "git+https://github.com/EnterpriseDB/pgadmin4-treeview/#76d7801ae6c179a5efd3c826c1bd91446a2436fb", "postcss": "^8.2.15", "raf": "^3.4.1", "react": "^17.0.1", + "react-aspen": "^1.1.0", "react-dom": "^17.0.1", "react-select": "^4.2.1", "react-table": "^7.6.3", @@ -144,26 +156,14 @@ "tempusdominus-bootstrap-4": "^5.1.2", "tempusdominus-core": "^5.0.3", "underscore": "^1.13.1", + "url-loader": "^1.1.2", + "valid-filename": "^2.0.1", "webcabin-docker": "git+https://github.com/EnterpriseDB/wcDocker/#5a5a1c96b89e965cb4900520ca7d5740e6a53afa", "wkx": "^0.5.0", "xterm": "^4.11.0", "xterm-addon-fit": "^0.5.0", "xterm-addon-search": "^0.8.0", - "xterm-addon-web-links": "^0.4.0", - "pgadmin4-tree": "git+https://github.com/EnterpriseDB/pgadmin4-treeview/#76d7801ae6c179a5efd3c826c1bd91446a2436fb", - "react-aspen": "^1.1.0", - "@types/classnames": "^2.2.6", - "@types/react": "^16.7.18", - "@types/react-dom": "^16.0.11", - "aspen-decorations": "^1.0.2", - "browserfs": "^1.4.3", - "classnames": "^2.2.6", - "context-menu": "^2.0.0", - "insert-if": "^1.1.0", - "notificar": "^1.0.1", - "path-fx": "^2.0.0", - "valid-filename": "^2.0.1", - "url-loader": "^1.1.2" + "xterm-addon-web-links": "^0.4.0" }, "scripts": { "linter": "yarn eslint --no-eslintrc -c .eslintrc.js --ext .js --ext .jsx .", diff --git a/web/pgadmin/browser/server_groups/servers/pgagent/schedules/static/js/pga_schedule.ui.js b/web/pgadmin/browser/server_groups/servers/pgagent/schedules/static/js/pga_schedule.ui.js index 7320238d1..fcb1c31e2 100644 --- a/web/pgadmin/browser/server_groups/servers/pgagent/schedules/static/js/pga_schedule.ui.js +++ b/web/pgadmin/browser/server_groups/servers/pgagent/schedules/static/js/pga_schedule.ui.js @@ -95,13 +95,13 @@ export class ExceptionsSchema extends BaseUISchema { { id: 'jexdate', cell: 'datetimepicker', label: gettext('Date'), type: 'datetimepicker', - controlProps: { format: 'YYYY-MM-DD', placeholder: gettext(''), + controlProps: { placeholder: gettext(''), autoOk: true, pickerType: 'Date', }, }, { id: 'jextime', cell: 'datetimepicker', label: gettext('Time'), type: 'datetimepicker', - controlProps: { format: 'HH:mm', placeholder: gettext(''), + controlProps: { placeholder: gettext(''), autoOk: true, pickerType: 'Time', ampm: false, }, } @@ -289,13 +289,13 @@ export default class PgaJobScheduleSchema extends BaseUISchema { id: 'jscenabled', label: gettext('Enabled?'), type: 'switch', cell: 'switch', }, { id: 'jscstart', label: gettext('Start'), type: 'datetimepicker', cell: 'datetimepicker', - controlProps: { format: 'YYYY-MM-DD HH:mm:ss Z', ampm: false, + controlProps: { ampm: false, placeholder: gettext('YYYY-MM-DD HH:mm:ss Z'), autoOk: true, disablePast: true, }, }, { id: 'jscend', label: gettext('End'), type: 'datetimepicker', cell: 'datetimepicker', - controlProps: { format: 'YYYY-MM-DD HH:mm:ss Z', ampm: false, + controlProps: { ampm: false, placeholder: gettext('YYYY-MM-DD HH:mm:ss Z'), autoOk: true, disablePast: true, }, diff --git a/web/pgadmin/browser/server_groups/servers/roles/static/js/role.ui.js b/web/pgadmin/browser/server_groups/servers/roles/static/js/role.ui.js index 1b2dde9c1..ed182aec3 100644 --- a/web/pgadmin/browser/server_groups/servers/roles/static/js/role.ui.js +++ b/web/pgadmin/browser/server_groups/servers/roles/static/js/role.ui.js @@ -100,7 +100,8 @@ export default class RoleSchema extends BaseUISchema { mode: ['properties', 'edit', 'create'], deps: ['rolcanlogin'], helpMessage: gettext('Please note that if you leave this field blank, then password will never expire.'), - controlProps: { format: 'YYYY-MM-DD HH:mm:ss Z', ampm: false, + controlProps: { + ampm: false, placeholder: gettext('No Expiry'), autoOk: true, }, disabled: obj.readOnly, diff --git a/web/pgadmin/static/js/components/FormComponents.jsx b/web/pgadmin/static/js/components/FormComponents.jsx index 3187a1d85..1e7e12951 100644 --- a/web/pgadmin/static/js/components/FormComponents.jsx +++ b/web/pgadmin/static/js/components/FormComponents.jsx @@ -27,7 +27,9 @@ import clsx from 'clsx'; import PropTypes from 'prop-types'; import HTMLReactParse from 'html-react-parser'; import { KeyboardDateTimePicker, KeyboardDatePicker, KeyboardTimePicker, MuiPickersUtilsProvider} from '@material-ui/pickers'; -import MomentUtils from '@date-io/moment'; +import DateFnsUtils from '@date-io/date-fns'; +import * as DateFns from 'date-fns'; + import moment from 'moment'; import CodeMirror from './CodeMirror'; @@ -200,40 +202,60 @@ FormInputSQL.propTypes = { change: PropTypes.func, }; -export function InputDateTimePicker({value, onChange, readonly, controlProps, ...props}) { +/* https://date-fns.org/v2.24.0/docs/format */ +const DATE_TIME_FORMAT = { + DATE_TIME_12: 'yyyy-MM-dd hh:mm:ss aa xxx', + DATE_TIME_24: 'yyyy-MM-dd HH:mm:ss XXX', + DATE: 'yyyy-MM-dd', + TIME_12: 'hh:mm aa', + TIME_24: 'HH:mm', +}; - const onDateTimeChange = (momentVal)=> { - onChange(momentVal ? momentVal.format(controlProps.format || 'YYYY-MM-DD HH:mm:ss Z') : null); - }; +export function InputDateTimePicker({value, onChange, readonly, controlProps, ...props}) { + let format = ''; + if (controlProps?.pickerType === 'Date') { + format = controlProps.format || DATE_TIME_FORMAT.DATE; + } else if (controlProps?.pickerType === 'Time') { + format = controlProps.format || (controlProps.ampm ? DATE_TIME_FORMAT.TIME_12 : DATE_TIME_FORMAT.TIME_24); + } else { + format = controlProps.format || (controlProps.ampm ? DATE_TIME_FORMAT.DATE_TIME_12 : DATE_TIME_FORMAT.DATE_TIME_24); + } - const onDateChange = (momentVal)=> { - onChange(momentVal ? momentVal.format(controlProps.format || 'YYYY-MM-DD') : null); + const handleChange = (dateVal)=> { + onChange(DateFns.format(dateVal, format)); }; - const onTimeChange = (momentVal)=> { - onChange(momentVal ? momentVal.format(controlProps.format || 'HH:mm') : null); - }; + /* Value should be a date object instead of string */ + value = _.isUndefined(value) ? null : value; + if(!_.isNull(value)) { + let parseValue = DateFns.parse(value, format, new Date()); + if(!DateFns.isValid(parseValue)) { + parseValue = DateFns.parseISO(value); + } + value = !DateFns.isValid(parseValue) ? null : parseValue; + } if (readonly) { - return (); + return (); } - if (controlProps && controlProps.pickerType === 'Date') { + if (controlProps?.pickerType === 'Date') { return ( - - + ); - } else if (controlProps && controlProps.pickerType === 'Time') { + } else if (controlProps?.pickerType === 'Time') { let newValue = (!_.isNull(value) && !_.isUndefined(value)) ? moment(value, 'HH:mm').toDate() : value; return ( - - + + diff --git a/web/yarn.lock b/web/yarn.lock index 007e2201d..c7a443c2a 100644 --- a/web/yarn.lock +++ b/web/yarn.lock @@ -1150,10 +1150,10 @@ resolved "https://registry.yarnpkg.com/@date-io/core/-/core-1.3.13.tgz#90c71da493f20204b7a972929cc5c482d078b3fa" integrity sha512-AlEKV7TxjeK+jxWVKcCFrfYAk8spX9aCyiToFIiLPtfQbsjmRGLIhb5VZgptQcJdHtLXo7+m0DuurwFgUToQuA== -"@date-io/moment@1.x": +"@date-io/date-fns@1.x": version "1.3.13" - resolved "https://registry.yarnpkg.com/@date-io/moment/-/moment-1.3.13.tgz#56c2772bc4f6675fc6970257e6033e7a7c2960f0" - integrity sha512-3kJYusJtQuOIxq6byZlzAHoW/18iExJer9qfRF5DyyzdAk074seTuJfdofjz4RFfTd/Idk8WylOQpWtERqvFuQ== + resolved "https://registry.yarnpkg.com/@date-io/date-fns/-/date-fns-1.3.13.tgz#7798844041640ab393f7e21a7769a65d672f4735" + integrity sha512-yXxGzcRUPcogiMj58wVgFjc9qUYrCnnU9eLcyNbsQCmae4jPuZCDoIBR21j8ZURsM7GRtU62VOw5yNd4dDHunA== dependencies: "@date-io/core" "^1.3.13" @@ -3744,6 +3744,11 @@ dashdash@^1.12.0: dependencies: assert-plus "^1.0.0" +date-fns@^2.24.0: + version "2.24.0" + resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.24.0.tgz#7d86dc0d93c87b76b63d213b4413337cfd1c105d" + integrity sha512-6ujwvwgPID6zbI0o7UbURi2vlLDR9uP26+tW6Lg+Ji3w7dd0i3DOcjcClLjLPranT60SSEFBwdSyYwn/ZkPIuw== + date-format@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/date-format/-/date-format-2.1.0.tgz#31d5b5ea211cf5fd764cd38baf9d033df7e125cf"