From 986dc6c1c004e3d54482695c0c8c14650e8e344a Mon Sep 17 00:00:00 2001
From: Jed Fox <git@jedfox.com>
Date: Mon, 17 Jul 2023 18:24:51 -0400
Subject: [PATCH] Rename <CustomSelect> to <Select> (#1348)

---
 .../desktop-client/src/components/common.tsx     |  2 +-
 .../common/{CustomSelect.tsx => Select.tsx}      |  6 +++---
 .../src/components/filters/FiltersMenu.js        | 12 ++----------
 .../src/components/modals/EditRule.js            | 14 +++-----------
 .../src/components/modals/ImportTransactions.js  |  8 ++++----
 .../src/components/reports/Header.js             |  6 +++---
 .../components/select/RecurringSchedulePicker.js | 16 ++++------------
 .../src/components/settings/Format.js            |  8 ++++----
 upcoming-release-notes/1348.md                   |  6 ++++++
 9 files changed, 30 insertions(+), 48 deletions(-)
 rename packages/desktop-client/src/components/common/{CustomSelect.tsx => Select.tsx} (89%)
 create mode 100644 upcoming-release-notes/1348.md

diff --git a/packages/desktop-client/src/components/common.tsx b/packages/desktop-client/src/components/common.tsx
index 7cbd456c15..a96458ec70 100644
--- a/packages/desktop-client/src/components/common.tsx
+++ b/packages/desktop-client/src/components/common.tsx
@@ -19,7 +19,7 @@ export { default as AlignedText } from './common/AlignedText';
 export { default as Block } from './common/Block';
 export { default as Button, ButtonWithLoading } from './common/Button';
 export { default as Card } from './common/Card';
-export { default as CustomSelect } from './common/CustomSelect';
+export { default as Select } from './common/Select';
 export { default as FormError } from './common/FormError';
 export { default as HoverTarget } from './common/HoverTarget';
 export { default as InitialFocus } from './common/InitialFocus';
diff --git a/packages/desktop-client/src/components/common/CustomSelect.tsx b/packages/desktop-client/src/components/common/Select.tsx
similarity index 89%
rename from packages/desktop-client/src/components/common/CustomSelect.tsx
rename to packages/desktop-client/src/components/common/Select.tsx
index 5f95acee3b..8f9b85e881 100644
--- a/packages/desktop-client/src/components/common/CustomSelect.tsx
+++ b/packages/desktop-client/src/components/common/Select.tsx
@@ -30,11 +30,11 @@ type CustomSelectProps = {
  *
  * @example
  * // Usage:
- * // <CustomSelect options={[['1', 'Option 1'], ['2', 'Option 2']]} value="1" onChange={handleOnChange} />
- * // <CustomSelect options={[['1', 'Option 1'], ['2', 'Option 2']]} value="3" defaultLabel="Select an option"  onChange={handleOnChange} />
+ * // <Select options={[['1', 'Option 1'], ['2', 'Option 2']]} value="1" onChange={handleOnChange} />
+ * // <Select options={[['1', 'Option 1'], ['2', 'Option 2']]} value="3" defaultLabel="Select an option"  onChange={handleOnChange} />
  */
 
-export default function CustomSelect({
+export default function Select({
   options,
   value,
   defaultLabel = '',
diff --git a/packages/desktop-client/src/components/filters/FiltersMenu.js b/packages/desktop-client/src/components/filters/FiltersMenu.js
index b63b2d6cc9..5680cb86f4 100644
--- a/packages/desktop-client/src/components/filters/FiltersMenu.js
+++ b/packages/desktop-client/src/components/filters/FiltersMenu.js
@@ -26,15 +26,7 @@ import { titleFirst } from 'loot-core/src/shared/util';
 import DeleteIcon from '../../icons/v0/Delete';
 import SettingsSliderAlternate from '../../icons/v2/SettingsSliderAlternate';
 import { colors } from '../../style';
-import {
-  View,
-  Text,
-  Tooltip,
-  Stack,
-  Button,
-  Menu,
-  CustomSelect,
-} from '../common';
+import { View, Text, Tooltip, Stack, Button, Menu, Select } from '../common';
 import { Value } from '../ManageRules';
 import GenericInput from '../util/GenericInput';
 
@@ -173,7 +165,7 @@ function ConfigureField({
       <FocusScope>
         <View style={{ marginBottom: 10 }}>
           {field === 'amount' || field === 'date' ? (
-            <CustomSelect
+            <Select
               options={
                 field === 'amount'
                   ? [
diff --git a/packages/desktop-client/src/components/modals/EditRule.js b/packages/desktop-client/src/components/modals/EditRule.js
index 7856d248d3..c9733abc7a 100644
--- a/packages/desktop-client/src/components/modals/EditRule.js
+++ b/packages/desktop-client/src/components/modals/EditRule.js
@@ -30,15 +30,7 @@ import AddIcon from '../../icons/v0/Add';
 import SubtractIcon from '../../icons/v0/Subtract';
 import InformationOutline from '../../icons/v1/InformationOutline';
 import { colors } from '../../style';
-import {
-  View,
-  Text,
-  Modal,
-  Button,
-  Stack,
-  CustomSelect,
-  Tooltip,
-} from '../common';
+import { View, Text, Modal, Button, Stack, Select, Tooltip } from '../common';
 import { StatusBadge } from '../schedules/StatusBadge';
 import SimpleTransactionsTable from '../transactions/SimpleTransactionsTable';
 import { BetweenAmountInput } from '../util/AmountInput';
@@ -81,7 +73,7 @@ function getTransactionFields(conditions, actions) {
 export function FieldSelect({ fields, style, value, onChange }) {
   return (
     <View style={style}>
-      <CustomSelect
+      <Select
         options={fields}
         value={value}
         onChange={value => onChange('field', value)}
@@ -106,7 +98,7 @@ export function OpSelect({
   }
 
   return (
-    <CustomSelect
+    <Select
       options={ops.map(op => [op, formatOp(op, type)])}
       value={value}
       onChange={value => onChange('op', value)}
diff --git a/packages/desktop-client/src/components/modals/ImportTransactions.js b/packages/desktop-client/src/components/modals/ImportTransactions.js
index 94fe6b0acc..cdec28e883 100644
--- a/packages/desktop-client/src/components/modals/ImportTransactions.js
+++ b/packages/desktop-client/src/components/modals/ImportTransactions.js
@@ -17,7 +17,7 @@ import {
   Text,
   Stack,
   Modal,
-  CustomSelect,
+  Select,
   Input,
   Button,
   ButtonWithLoading,
@@ -339,7 +339,7 @@ function SubLabel({ title }) {
 
 function SelectField({ width, style, options, value, onChange }) {
   return (
-    <CustomSelect
+    <Select
       options={[
         ['choose-field', 'Choose field...'],
         ...options.map(option => [option, option]),
@@ -372,7 +372,7 @@ function DateFormatSelect({
   return (
     <View style={{ width: 120 }}>
       <SectionLabel title="Date format" />
-      <CustomSelect
+      <Select
         options={dateFormats.map(f => [
           f.format,
           f.label.replace(/ /g, delimiter),
@@ -890,7 +890,7 @@ function ImportTransactions({
               {filetype === 'csv' && (
                 <View style={{ marginLeft: 25 }}>
                   <SectionLabel title="CSV DELIMITER" />
-                  <CustomSelect
+                  <Select
                     options={[
                       [',', ','],
                       [';', ';'],
diff --git a/packages/desktop-client/src/components/reports/Header.js b/packages/desktop-client/src/components/reports/Header.js
index ede50cf7d3..70dc7d054c 100644
--- a/packages/desktop-client/src/components/reports/Header.js
+++ b/packages/desktop-client/src/components/reports/Header.js
@@ -2,7 +2,7 @@ import * as monthUtils from 'loot-core/src/shared/months';
 
 import ArrowLeft from '../../icons/v1/ArrowLeft';
 import { styles } from '../../style';
-import { View, Button, ButtonLink, CustomSelect } from '../common';
+import { View, Button, ButtonLink, Select } from '../common';
 import { FilterButton, AppliedFilters } from '../filters/FiltersMenu';
 
 function validateStart(allMonths, start, end) {
@@ -90,7 +90,7 @@ function Header({
             gap: 5,
           }}
         >
-          <CustomSelect
+          <Select
             style={{ backgroundColor: 'white' }}
             onChange={newValue =>
               onChangeDates(...validateStart(allMonths, newValue, end))
@@ -100,7 +100,7 @@ function Header({
             options={allMonths.map(({ name, pretty }) => [name, pretty])}
           />
           <View>to</View>
-          <CustomSelect
+          <Select
             style={{ backgroundColor: 'white' }}
             onChange={newValue =>
               onChangeDates(...validateEnd(allMonths, start, newValue))
diff --git a/packages/desktop-client/src/components/select/RecurringSchedulePicker.js b/packages/desktop-client/src/components/select/RecurringSchedulePicker.js
index 816177c463..2f55333502 100644
--- a/packages/desktop-client/src/components/select/RecurringSchedulePicker.js
+++ b/packages/desktop-client/src/components/select/RecurringSchedulePicker.js
@@ -8,15 +8,7 @@ import { getRecurringDescription } from 'loot-core/src/shared/schedules';
 import AddIcon from '../../icons/v0/Add';
 import SubtractIcon from '../../icons/v0/Subtract';
 import { colors } from '../../style';
-import {
-  Button,
-  CustomSelect,
-  Input,
-  Tooltip,
-  View,
-  Text,
-  Stack,
-} from '../common';
+import { Button, Select, Input, Tooltip, View, Text, Stack } from '../common';
 import { useTooltip } from '../tooltips';
 
 import DateSelect from './DateSelect';
@@ -199,7 +191,7 @@ function MonthlyPatterns({ config, dispatch }) {
             flexDirection: 'row',
           }}
         >
-          <CustomSelect
+          <Select
             options={[
               [-1, 'Last'],
               ['-', '---'],
@@ -216,7 +208,7 @@ function MonthlyPatterns({ config, dispatch }) {
               width: '100%',
             }}
           />
-          <CustomSelect
+          <Select
             options={[
               ['day', 'Day'],
               ['-', '---'],
@@ -327,7 +319,7 @@ function RecurringScheduleTooltip({ config: currentConfig, onClose, onSave }) {
           onEnter={e => updateField('interval', e.target.value)}
           defaultValue={config.interval || 1}
         />
-        <CustomSelect
+        <Select
           options={FREQUENCY_OPTIONS.map(opt => [opt.id, opt.name])}
           value={config.frequency}
           onChange={value => updateField('frequency', value)}
diff --git a/packages/desktop-client/src/components/settings/Format.js b/packages/desktop-client/src/components/settings/Format.js
index 5c8e844b70..009cc0930d 100644
--- a/packages/desktop-client/src/components/settings/Format.js
+++ b/packages/desktop-client/src/components/settings/Format.js
@@ -3,7 +3,7 @@ import React from 'react';
 import { numberFormats } from 'loot-core/src/shared/util';
 
 import tokens from '../../tokens';
-import { Button, CustomSelect, Text, View } from '../common';
+import { Button, Select, Text, View } from '../common';
 import { useSidebar } from '../FloatableSidebar';
 import { Checkbox } from '../forms';
 
@@ -87,7 +87,7 @@ export default function FormatSettings({ prefs, savePrefs }) {
         >
           <Column title="Numbers">
             <Button bounce={false} style={{ padding: 0 }}>
-              <CustomSelect
+              <Select
                 key={prefs.hideFraction} // needed because label does not update
                 value={numberFormat}
                 onChange={onNumberFormat}
@@ -111,7 +111,7 @@ export default function FormatSettings({ prefs, savePrefs }) {
 
           <Column title="Dates">
             <Button bounce={false} style={{ padding: 0 }}>
-              <CustomSelect
+              <Select
                 value={dateFormat}
                 onChange={onDateFormat}
                 options={dateFormats.map(f => [f.value, f.label])}
@@ -122,7 +122,7 @@ export default function FormatSettings({ prefs, savePrefs }) {
 
           <Column title="First day of the week">
             <Button bounce={false} style={{ padding: 0 }}>
-              <CustomSelect
+              <Select
                 value={firstDayOfWeekIdx}
                 onChange={onFirstDayOfWeek}
                 options={daysOfWeek.map(f => [f.value, f.label])}
diff --git a/upcoming-release-notes/1348.md b/upcoming-release-notes/1348.md
new file mode 100644
index 0000000000..0f84455485
--- /dev/null
+++ b/upcoming-release-notes/1348.md
@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [j-f1]
+---
+
+Rename `CustomSelect` component to `Select`