diff --git a/packages/desktop-client/src/components/select/RecurringSchedulePicker.jsx b/packages/desktop-client/src/components/select/RecurringSchedulePicker.jsx index 17ee82e87c2..4c29f179bb8 100644 --- a/packages/desktop-client/src/components/select/RecurringSchedulePicker.jsx +++ b/packages/desktop-client/src/components/select/RecurringSchedulePicker.jsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer, useState } from 'react'; +import React, { useEffect, useReducer, useRef, useState } from 'react'; import { sendCatch } from 'loot-core/src/platform/client/fetch'; import * as monthUtils from 'loot-core/src/shared/months'; @@ -9,12 +9,12 @@ import { SvgAdd, SvgSubtract } from '../../icons/v0'; import { theme } from '../../style'; import { Button } from '../common/Button'; import { Input } from '../common/Input'; +import { Popover } from '../common/Popover'; import { Select } from '../common/Select'; import { Stack } from '../common/Stack'; import { Text } from '../common/Text'; import { View } from '../common/View'; import { Checkbox } from '../forms'; -import { useTooltip, Tooltip } from '../tooltips'; import { DateSelect } from './DateSelect'; @@ -48,19 +48,18 @@ function parsePatternValue(value) { } function parseConfig(config) { - return ( - config || { - start: monthUtils.currentDay(), - interval: 1, - frequency: 'monthly', - patterns: [createMonthlyRecurrence(monthUtils.currentDay())], - skipWeekend: false, - weekendSolveMode: 'before', - endMode: 'never', - endOccurrences: '1', - endDate: monthUtils.currentDay(), - } - ); + return { + start: monthUtils.currentDay(), + interval: 1, + frequency: 'monthly', + patterns: [createMonthlyRecurrence(monthUtils.currentDay())], + skipWeekend: false, + weekendSolveMode: 'before', + endMode: 'never', + endOccurrences: '1', + endDate: monthUtils.currentDay(), + ...config, + }; } function unparseConfig(parsed) { @@ -309,12 +308,7 @@ function RecurringScheduleTooltip({ config: currentConfig, onClose, onSave }) { } return ( - + <>
-
+ ); } export function RecurringSchedulePicker({ value, buttonStyle, onChange }) { - const { isOpen, close, getOpenEvents } = useTooltip(); + const triggerRef = useRef(null); + const [isOpen, setIsOpen] = useState(false); const dateFormat = useDateFormat() || 'MM/dd/yyyy'; function onSave(config) { onChange(config); - close(); + setIsOpen(false); } return ( - {isOpen && ( + + setIsOpen(false)} + > setIsOpen(false)} onSave={onSave} /> - )} + ); } diff --git a/upcoming-release-notes/2766.md b/upcoming-release-notes/2766.md new file mode 100644 index 00000000000..cc9a4e48974 --- /dev/null +++ b/upcoming-release-notes/2766.md @@ -0,0 +1,6 @@ +--- +category: Maintenance +authors: [MatissJanis] +--- + +Migrating recurring schedule `Tooltip` component to react-aria Tooltip/Popover (vol.5)