search

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.15k stars 1.3k forks source link

[data grid] Wrong date when filtering on date when in timezone GMT - 3 #14970

Open gustavhagland opened 6 days ago

gustavhagland commented 6 days ago

Steps to reproduce

Link to live example: https://stackblitz.com/edit/react-pfwkpt?file=Demo.tsx

Steps:

  1. Set timezone to GMT - 3 on your local computer
  2. Open the demo and select any date

Current behavior

The date in the filter will be the selected date -1 day at 21:00 in GMT -3

Expected behavior

For the date to be the same date picked in the users current timezone

Context

No response

Your environment

npx @mui/envinfo Using firefox/chromium ``` System: OS: Linux 6.10 Fedora Linux 40 (Workstation Edition) Binaries: Node: 20.17.0 - /usr/bin/node npm: 10.8.2 - /usr/bin/npm pnpm: Not Found Browsers: Chrome: Not Found npmPackages: @emotion/react: 11.11.4 => 11.11.4 @emotion/styled: 11.11.5 => 11.11.5 @mui/base: 5.0.0-beta.40 @mui/core-downloads-tracker: 5.16.6 @mui/icons-material: 5.15.14 => 5.15.14 @mui/lab: 5.0.0-alpha.169 => 5.0.0-alpha.169 @mui/material: 5.16.6 => 5.16.6 @mui/private-theming: 5.16.6 @mui/styled-engine: 5.16.6 @mui/system: 5.16.6 @mui/types: 7.2.15 @mui/utils: 5.16.6 @mui/x-data-grid: 7.12.0 @mui/x-data-grid-pro: 7.12.0 => 7.12.0 @mui/x-date-pickers: 7.12.0 @mui/x-date-pickers-pro: 7.12.0 => 7.12.0 @mui/x-internals: 7.12.0 @mui/x-license: 7.12.0 @types/react: 18.2.73 => 18.2.73 react: 18.2.0 => 18.2.0 react-dom: 18.2.0 => 18.2.0 typescript: 5.4.3 => 5.4.3 ```

Search keywords: filter date Order ID: 77030

arminmeh commented 4 days ago

@gustavhagland

date filters work with UTC timezone. If you output JSON.stringify(filterModel?.items) or filterModel?.items[0]?.value?.toISOString() you will see the date that you have chosen.

In addition to that, selecting the date correctly filters out the data in the grid

can you give more details for which use case this creates a problem for you?