diff --git a/packages/desktop-client/src/components/schedules/EditSchedule.js b/packages/desktop-client/src/components/schedules/EditSchedule.js index 90d7ebbdc32772d0fa03b7e7556d71be111758d0..8b4d42782dce5a3258fb3a60410f76716676d8c4 100644 --- a/packages/desktop-client/src/components/schedules/EditSchedule.js +++ b/packages/desktop-client/src/components/schedules/EditSchedule.js @@ -442,6 +442,7 @@ export default function ScheduleDetails() { <FormLabel title="Payee" htmlFor="payee-field" /> <PayeeAutocomplete value={state.fields.payee} + inputId="payee-field" inputProps={{ id: 'payee-field', placeholder: '(none)' }} onSelect={id => dispatch({ type: 'set-field', field: 'payee', value: id }) @@ -455,6 +456,7 @@ export default function ScheduleDetails() { <AccountAutocomplete includeClosedAccounts={false} value={state.fields.account} + inputId="account-field" inputProps={{ id: 'account-field', placeholder: '(none)' }} onSelect={id => dispatch({ type: 'set-field', field: 'account', value: id }) diff --git a/packages/desktop-client/src/hooks/useFeatureFlag.js b/packages/desktop-client/src/hooks/useFeatureFlag.js index 6cda94e421b10c562c00f574d3086c8b939f702e..27920fe18970b430a7c639838066068425233387 100644 --- a/packages/desktop-client/src/hooks/useFeatureFlag.js +++ b/packages/desktop-client/src/hooks/useFeatureFlag.js @@ -1,7 +1,12 @@ import { useSelector } from 'react-redux'; +import { + isDevelopmentEnvironment, + isPreviewEnvironment, +} from 'loot-design/src/util/environment'; + const DEFAULT_FEATURE_FLAG_STATE = { - newAutocomplete: false, + newAutocomplete: isDevelopmentEnvironment() || isPreviewEnvironment(), syncAccount: false, goalTemplatesEnabled: false, }; diff --git a/packages/loot-design/src/components/NewAutocomplete.js b/packages/loot-design/src/components/NewAutocomplete.js index dc2bf91f623285c3f3d6f6e6380468880fe7e600..263160c79033d6aa65799b0ba0b47bd0582e3cb2 100644 --- a/packages/loot-design/src/components/NewAutocomplete.js +++ b/packages/loot-design/src/components/NewAutocomplete.js @@ -40,7 +40,7 @@ const Autocomplete = React.forwardRef( // Create a new option if (selected.__isNew__) { - onCreateOption(selected); + onCreateOption(selected.value); return; } diff --git a/packages/loot-design/src/components/NewPayeeAutocomplete.js b/packages/loot-design/src/components/NewPayeeAutocomplete.js index c6310f60f38d189196d79dbffef7c1a15d00bfcb..389f992a5bda17ded0b95a1d6e9f0e93ebe9f2cf 100644 --- a/packages/loot-design/src/components/NewPayeeAutocomplete.js +++ b/packages/loot-design/src/components/NewPayeeAutocomplete.js @@ -93,9 +93,9 @@ export default function PayeeAutocomplete({ inputValue={inputValue} onInputChange={setInputValue} onSelect={onSelect} - onCreateOption={async selected => { + onCreateOption={async selectedValue => { const existingOption = allOptions.find(option => - option.label.toLowerCase().includes(selected.label?.toLowerCase()), + option.label.toLowerCase().includes(selectedValue?.toLowerCase()), ); // Prevent creating duplicates @@ -105,7 +105,7 @@ export default function PayeeAutocomplete({ } // This is actually a new option, so create it - onSelect(await dispatch(createPayee(selected.value))); + onSelect(await dispatch(createPayee(selectedValue))); }} isCreatable={useCreatableComponent} createOptionPosition="first" diff --git a/upcoming-release-notes/789.md b/upcoming-release-notes/789.md new file mode 100644 index 0000000000000000000000000000000000000000..447b15ca06d0140a37e970090ad46e941e8d50b1 --- /dev/null +++ b/upcoming-release-notes/789.md @@ -0,0 +1,6 @@ +--- +category: Maintenance +authors: [MatissJanis] +--- + +Enable new autocomplete in dev/preview builds