GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-01 03:51:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: [GH-4451]: custom time range modal closed on focussing closed date (#4456)

Browse Source 
* fix: [GH-4451]: custom time range modal closed on focussing closed date

* fix: jest test
This commit is contained in:
Vikrant Gupta 2024-01-30 18:50:02 +05:30 committed by GitHub
parent 0200fb3a21
commit 01fc7a7fd4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/container/TopNav/CustomDateTimeModal/CustomDateTimeModal.test.tsx
View File

@ -12,6 +12,7 @@ describe('CustomDateTimeModal', () => {
visible visible
onCreate={handleCreate} onCreate={handleCreate}
onCancel={handleCancel} onCancel={handleCancel}
setCustomDTPickerVisible={jest.fn()}
/>, />,
); );
}); });

11
frontend/src/container/TopNav/CustomDateTimeModal/index.tsx
View File

@ -1,6 +1,6 @@
import { DatePicker, Modal } from 'antd'; import { DatePicker, Modal } from 'antd';
import dayjs, { Dayjs } from 'dayjs'; import dayjs, { Dayjs } from 'dayjs';
import { useState } from 'react'; import { Dispatch, SetStateAction, useState } from 'react';
export type DateTimeRangeType = [Dayjs | null, Dayjs | null] | null; export type DateTimeRangeType = [Dayjs | null, Dayjs | null] | null;
@ -10,12 +10,12 @@ function CustomDateTimeModal({
visible, visible,
onCreate, onCreate,
onCancel, onCancel,
setCustomDTPickerVisible,
}: CustomDateTimeModalProps): JSX.Element { }: CustomDateTimeModalProps): JSX.Element {
const [selectedDate, setDateTime] = useState<DateTimeRangeType>(); const [selectedDate, setDateTime] = useState<DateTimeRangeType>();
// eslint-disable-next-line @typescript-eslint/no-explicit-any // eslint-disable-next-line @typescript-eslint/no-explicit-any
const onModalOkHandler = (date_time: any): void => { const onModalOkHandler = (date_time: any): void => {
onCreate(date_time);
setDateTime(date_time); setDateTime(date_time);
}; };
@ -25,7 +25,10 @@ function CustomDateTimeModal({
}; };
const onOk = (): void => { const onOk = (): void => {
if (selectedDate) onCreate(selectedDate); if (selectedDate) {
onCreate(selectedDate);
setCustomDTPickerVisible(false);
}
}; };
return ( return (
@ -42,7 +45,6 @@ function CustomDateTimeModal({
allowClear allowClear
onOk={onModalOkHandler} onOk={onModalOkHandler}
showTime showTime
onCalendarChange={onModalOkHandler}
/> />
</Modal> </Modal>
); );
@ -52,6 +54,7 @@ interface CustomDateTimeModalProps {
visible: boolean; visible: boolean;
onCreate: (dateTimeRange: DateTimeRangeType) => void; onCreate: (dateTimeRange: DateTimeRangeType) => void;
onCancel: () => void; onCancel: () => void;
setCustomDTPickerVisible: Dispatch<SetStateAction<boolean>>;
} }
export default CustomDateTimeModal; export default CustomDateTimeModal;

2
frontend/src/container/TopNav/DateTimeSelection/index.tsx
View File

@ -216,7 +216,6 @@ function DateTimeSelection({
if (dateTimeRange !== null) { if (dateTimeRange !== null) {
const [startTimeMoment, endTimeMoment] = dateTimeRange; const [startTimeMoment, endTimeMoment] = dateTimeRange;
if (startTimeMoment && endTimeMoment) { if (startTimeMoment && endTimeMoment) {
setCustomDTPickerVisible(false);
updateTimeInterval('custom', [ updateTimeInterval('custom', [
startTimeMoment?.toDate().getTime() || 0, startTimeMoment?.toDate().getTime() || 0,
endTimeMoment?.toDate().getTime() || 0, endTimeMoment?.toDate().getTime() || 0,
@ -352,6 +351,7 @@ function DateTimeSelection({
onCancel={(): void => { onCancel={(): void => {
setCustomDTPickerVisible(false); setCustomDTPickerVisible(false);
}} }}
setCustomDTPickerVisible={setCustomDTPickerVisible}
/> />
</div> </div>
); );