Remove old select fields after migration

.changeset/mighty-apricots-sleep.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+The migrated dropdown components and there types no longer exist within the codebase

locale/defaultMessages.json

@@ -934,9 +934,6 @@
     "context": "Transaction capture button - charge preauthorized transaction amount",
     "string": "Capture"
   },
-  "450Fty": {
-    "string": "None"
-  },
   "45aV8u": {
     "context": "gift card bulk create modal bottom explanation",
     "string": "After creation Saleor will create a list of gift card codes that you will be able to download."

src/attributes/components/AttributeDetails/utils.ts

@@ -1,5 +1,5 @@
-import { Choice } from "@dashboard/components/SingleSelectField";
 import { MeasurementUnitsEnum } from "@dashboard/graphql";
+import { Option } from "@saleor/macaw-ui-next";
 import React from "react";
 import { IntlShape, MessageDescriptor } from "react-intl";
 
@@ -56,7 +56,7 @@ export const getMeasurementUnitMessage = (
     : formatMessage(message as MessageDescriptor);
 };
 
-export const unitSystemChoices: Array<Choice<UnitSystem, MessageDescriptor>> = [
+export const unitSystemChoices = [
   {
     label: M.unitSystemMessages.metric,
     value: "metric",
@@ -67,7 +67,7 @@ export const unitSystemChoices: Array<Choice<UnitSystem, MessageDescriptor>> = [
   },
 ];
 
-export const unitTypeChoices: Array<Choice<UnitType, MessageDescriptor>> = [
+export const unitTypeChoices = [
   {
     label: M.unitTypeMessages.volume,
     value: "volume",
@@ -149,7 +149,7 @@ export const getUnitChoices = (
   formatMessage: IntlShape["formatMessage"],
 ): {
   [key in UnitSystem]: {
-    [key in UnitType]: Array<Choice<MeasurementUnitsEnum>>;
+    [key in UnitType]: Option[];
   };
 } =>
   Object.entries(unitMapping).reduce(
@@ -160,6 +160,6 @@ export const getUnitChoices = (
     {},
   ) as {
     [key in UnitSystem]: {
-      [key in UnitType]: Array<Choice<MeasurementUnitsEnum>>;
+      [key in UnitType]: Option[];
     };
   };

src/channels/components/ChannelPickerDialog/ChannelPickerDialog.tsx

@@ -1,17 +1,17 @@
 import ActionDialog from "@dashboard/components/ActionDialog";
 import { Combobox } from "@dashboard/components/Combobox";
 import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton";
-import { Choice } from "@dashboard/components/SingleSelectField";
 import useChoiceSearch from "@dashboard/hooks/useChoiceSearch";
 import useModalDialogOpen from "@dashboard/hooks/useModalDialogOpen";
 import useStateFromProps from "@dashboard/hooks/useStateFromProps";
+import { Option } from "@saleor/macaw-ui-next";
 import React from "react";
 import { useIntl } from "react-intl";
 
 import { messages } from "./messages";
 
 export interface ChannelPickerDialogProps {
-  channelsChoices: Array<Choice<string, string>>;
+  channelsChoices: Option[];
   confirmButtonState: ConfirmButtonTransitionState;
   defaultChoice: string;
   open: boolean;

src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx

@@ -11,7 +11,6 @@ import Form from "@dashboard/components/Form";
 import { DetailPageLayout } from "@dashboard/components/Layouts";
 import RequirePermissions from "@dashboard/components/RequirePermissions";
 import { Savebar } from "@dashboard/components/Savebar";
-import { SingleAutocompleteChoiceType } from "@dashboard/components/SingleAutocompleteSelectField";
 import {
   AllocationStrategyEnum,
   ChannelDetailsFragment,
@@ -35,6 +34,7 @@ import useStateFromProps from "@dashboard/hooks/useStateFromProps";
 import { FetchMoreProps, RelayToFlat } from "@dashboard/types";
 import createSingleAutocompleteSelectHandler from "@dashboard/utils/handlers/singleAutocompleteSelectChangeHandler";
 import { mapCountriesToChoices } from "@dashboard/utils/maps";
+import { Option } from "@saleor/macaw-ui-next";
 import React, { useState } from "react";
 import { useIntl } from "react-intl";
 
@@ -51,7 +51,7 @@ import { ChannelShippingZones, ChannelWarehouses } from "./types";
 
 export interface ChannelDetailsPageProps<TErrors extends ChannelErrorFragment[]> {
   channel?: ChannelDetailsFragment;
-  currencyCodes?: SingleAutocompleteChoiceType[];
+  currencyCodes?: Option[];
   disabled: boolean;
   disabledStatus?: boolean;
   errors: ChannelErrorFragment[];

src/collections/components/CollectionListPage/filters.ts

@@ -1,14 +1,14 @@
 import { IFilter } from "@dashboard/components/Filter";
-import { MultiAutocompleteChoiceType } from "@dashboard/components/MultiAutocompleteSelectField";
 import { CollectionPublished } from "@dashboard/graphql";
 import { commonMessages } from "@dashboard/intl";
 import { FilterOpts } from "@dashboard/types";
 import { createOptionsField } from "@dashboard/utils/filters/fields";
+import { Option } from "@saleor/macaw-ui-next";
 import { defineMessages, IntlShape } from "react-intl";
 
 export interface CollectionListFilterOpts {
   status: FilterOpts<CollectionPublished>;
-  channel: FilterOpts<string> & { choices: MultiAutocompleteChoiceType[] };
+  channel: FilterOpts<string> & { choices: Option[] };
 }
 
 export enum CollectionFilterKeys {

src/collections/views/CollectionList/filters.test.ts

@@ -1,10 +1,10 @@
 import { createFilterStructure } from "@dashboard/collections/components/CollectionListPage";
 import { CollectionListUrlFilters } from "@dashboard/collections/urls";
-import { MultiAutocompleteChoiceType } from "@dashboard/components/MultiAutocompleteSelectField";
 import { CollectionPublished } from "@dashboard/graphql";
 import { FilterOpts } from "@dashboard/types";
 import { getFilterQueryParams } from "@dashboard/utils/filters";
 import { stringifyQs } from "@dashboard/utils/urls";
+import { Option } from "@saleor/macaw-ui-next";
 import { getExistingKeys, setFilterOptsStatus } from "@test/filters";
 import { config } from "@test/intl";
 import { createIntl } from "react-intl";
@@ -35,7 +35,7 @@ describe("Filtering URL params", () => {
       value: CollectionPublished.PUBLISHED,
     },
     channel: undefined as unknown as FilterOpts<string> & {
-      choices: MultiAutocompleteChoiceType[];
+      choices: Option[];
     },
   });
 
@@ -51,7 +51,7 @@ describe("Filtering URL params", () => {
         value: CollectionPublished.PUBLISHED,
       },
       channel: undefined as unknown as FilterOpts<string> & {
-        choices: MultiAutocompleteChoiceType[];
+        choices: Option[];
       },
     });
     const filterQueryParams = getFilterQueryParams(

src/collections/views/CollectionList/filters.ts

@@ -4,9 +4,9 @@ import {
   CollectionListFilterOpts,
 } from "@dashboard/collections/components/CollectionListPage";
 import { FilterElement, FilterElementRegular } from "@dashboard/components/Filter";
-import { SingleAutocompleteChoiceType } from "@dashboard/components/SingleAutocompleteSelectField";
 import { CollectionFilterInput, CollectionPublished } from "@dashboard/graphql";
 import { findValueInEnum, maybe } from "@dashboard/misc";
+import { Option } from "@saleor/macaw-ui-next";
 
 import {
   createFilterTabUtils,
@@ -24,7 +24,7 @@ export const COLLECTION_FILTERS_KEY = "collectionFilters";
 
 export function getFilterOpts(
   params: CollectionListUrlFilters,
-  channels: SingleAutocompleteChoiceType[],
+  channels: Option[],
 ): CollectionListFilterOpts {
   return {
     channel: {

src/components/Attributes/utils.ts

@@ -1,8 +1,6 @@
 // @ts-strict-ignore
 import { AttributeInput } from "@dashboard/components/Attributes/Attributes";
 import { FileChoiceType } from "@dashboard/components/FileUploadField";
-import { MultiAutocompleteChoiceType } from "@dashboard/components/MultiAutocompleteSelectField";
-import { SingleAutocompleteChoiceType } from "@dashboard/components/SingleAutocompleteSelectField";
 import { SortableChipsFieldValueType } from "@dashboard/components/SortableChipsField";
 import {
   AttributeValueFragment,
@@ -12,9 +10,10 @@ import {
 import { getProductErrorMessage } from "@dashboard/utils/errors";
 import getPageErrorMessage from "@dashboard/utils/errors/page";
 import { OutputData } from "@editorjs/editorjs";
+import { Option } from "@saleor/macaw-ui-next";
 import { IntlShape } from "react-intl";
 
-export function getSingleChoices(values: AttributeValueFragment[]): SingleAutocompleteChoiceType[] {
+export function getSingleChoices(values: AttributeValueFragment[]): Option[] {
   return values.map(value => ({
     label: value.name,
     value: value.slug,
@@ -90,7 +89,7 @@ export function getReferenceDisplayValue(attribute: AttributeInput): SortableChi
   });
 }
 
-export function getMultiChoices(values: AttributeValueFragment[]): MultiAutocompleteChoiceType[] {
+export function getMultiChoices(values: AttributeValueFragment[]): Option[] {
   return values.map(value => ({
     label: value.name,
     value: value.slug,
@@ -112,7 +111,7 @@ export function getSingleDisplayValue(
 export function getMultiDisplayValue(
   attribute: AttributeInput,
   attributeValues: AttributeValueFragment[],
-): MultiAutocompleteChoiceType[] {
+): Option[] {
   if (!attribute.value) {
     return [];
   }

src/components/Filter/FilterAutocompleteField.tsx

@@ -2,14 +2,13 @@
 import { toggle } from "@dashboard/utils/lists";
 import { FormControlLabel, TextField } from "@material-ui/core";
 import { makeStyles } from "@saleor/macaw-ui";
-import { Text } from "@saleor/macaw-ui-next";
+import { Option, Text } from "@saleor/macaw-ui-next";
 import React from "react";
 import { FormattedMessage } from "react-intl";
 
 import Checkbox from "../Checkbox";
 import Hr from "../Hr";
 import Link from "../Link";
-import { MultiAutocompleteChoiceType } from "../MultiAutocompleteSelectField";
 import { FieldType, FilterFieldBaseProps } from "./types";
 
 interface FilterAutocompleteFieldProps
@@ -19,7 +18,7 @@ interface FilterAutocompleteFieldProps
   initialDisplayValues: FilterAutocompleteDisplayValues;
 }
 
-export type FilterAutocompleteDisplayValues = Record<string, MultiAutocompleteChoiceType[]>;
+export type FilterAutocompleteDisplayValues = Record<string, Option[]>;
 
 const useStyles = makeStyles(
   theme => ({
@@ -63,14 +62,14 @@ const FilterAutocompleteField: React.FC<FilterAutocompleteFieldProps> = ({
     fieldDisplayValues.every(displayValue => displayValue.value !== option.value),
   );
   const displayNoResults = availableOptions.length === 0 && fieldDisplayValues.length === 0;
-  const getUpdatedFilterValue = (option: MultiAutocompleteChoiceType) => {
+  const getUpdatedFilterValue = (option: Option) => {
     if (filter.multiple) {
       return toggle(option.value, filter.value, (a, b) => a === b);
     }
 
     return [option.value];
   };
-  const handleChange = (option: MultiAutocompleteChoiceType) => {
+  const handleChange = (option: Option) => {
     onFilterPropertyChange({
       payload: {
         name: filter.name,
@@ -89,8 +88,7 @@ const FilterAutocompleteField: React.FC<FilterAutocompleteFieldProps> = ({
       });
     }
   };
-  const isValueChecked = (displayValue: MultiAutocompleteChoiceType) =>
-    filter.value.includes(displayValue.value);
+  const isValueChecked = (displayValue: Option) => filter.value.includes(displayValue.value);
   const filteredValuesChecked = initialFieldDisplayValues.filter(isValueChecked);
   const filteredValuesUnchecked = fieldDisplayValues.filter(
     displayValue => !isValueChecked(displayValue),

src/components/Filter/FilterContent/FilterContentBody.tsx

@@ -3,10 +3,9 @@ import { FilterDateTimeField } from "@dashboard/components/Filter/FilterContent/
 import { FilterNumericField } from "@dashboard/components/Filter/FilterContent/FilterNumericField";
 import { FilterSingleSelectField } from "@dashboard/components/Filter/FilterContent/FilterSingleSelectField";
 import { useCommonStyles } from "@dashboard/components/Filter/FilterContent/utils";
-import { MultiAutocompleteChoiceType } from "@dashboard/components/MultiAutocompleteSelectField";
 import { FormControlLabel, Radio, TextField } from "@material-ui/core";
 import { makeStyles } from "@saleor/macaw-ui";
-import { Skeleton } from "@saleor/macaw-ui-next";
+import { Option, Skeleton } from "@saleor/macaw-ui-next";
 import clsx from "clsx";
 import React from "react";
 
@@ -49,9 +48,7 @@ export interface FilterContentBodyProps<K extends string> {
   initialAutocompleteDisplayValues: FilterAutocompleteDisplayValues;
   onFilterPropertyChange: <T extends FieldType>(value: FilterReducerAction<K, T>) => void;
   autocompleteDisplayValues: FilterAutocompleteDisplayValues;
-  setAutocompleteDisplayValues: React.Dispatch<
-    React.SetStateAction<Record<string, MultiAutocompleteChoiceType[]>>
-  >;
+  setAutocompleteDisplayValues: React.Dispatch<React.SetStateAction<Record<string, Option[]>>>;
 }
 
 const FilterContentBody = <K extends string = string>({

src/components/Filter/FilterContent/utils.ts

@@ -1,7 +1,7 @@
 // @ts-strict-ignore
-import { SingleAutocompleteChoiceType } from "@dashboard/components/SingleAutocompleteSelectField";
 import { joinDateTime, splitDateTime } from "@dashboard/misc";
 import { makeStyles } from "@saleor/macaw-ui";
+import { Option } from "@saleor/macaw-ui-next";
 import { IntlShape } from "react-intl";
 
 import { FilterType } from "../types";
@@ -34,7 +34,7 @@ export const useCommonStyles = makeStyles(
   { name: "FilterContentBodyCommon" },
 );
 
-export function getIsFilterMultipleChoices(intl: IntlShape): SingleAutocompleteChoiceType[] {
+export function getIsFilterMultipleChoices(intl: IntlShape): Option[] {
   return [
     {
       label: intl.formatMessage({

src/components/Filter/types.ts

@@ -1,8 +1,8 @@
 import { PermissionEnum } from "@dashboard/graphql";
 import { FetchMoreProps, KeyValue, SearchPageProps } from "@dashboard/types";
+import { Option } from "@saleor/macaw-ui-next";
 import { MessageDescriptor } from "react-intl";
 
-import { MultiAutocompleteChoiceType } from "../MultiAutocompleteSelectField";
 import { FilterDispatchFunction } from "./useFilter";
 
 export enum FieldType {
@@ -20,7 +20,7 @@ export enum FieldType {
 interface FilterElementCommonData {
   active: boolean;
   multiple: boolean;
-  options?: MultiAutocompleteChoiceType[];
+  options?: Option[];
 }
 
 export interface KeyValueFilterElementData {
@@ -48,7 +48,7 @@ export type IFilterElementMutableDataGeneric<T extends FieldType> = T extends Fi
 
 type FilterElementCommon<K extends string = string> = {
   autocomplete?: boolean;
-  displayValues?: MultiAutocompleteChoiceType[];
+  displayValues?: Option[];
   group?: K;
   label: string;
   name: K;

src/components/LinkChoice/LinkChoice.tsx

@@ -2,17 +2,17 @@
 import { FormChange } from "@dashboard/hooks/useForm";
 import ArrowDropdown from "@dashboard/icons/ArrowDropdown";
 import { ClickAwayListener, MenuItem, Paper, Popper } from "@material-ui/core";
+import { Option } from "@saleor/macaw-ui-next";
 import clsx from "clsx";
 import { codes } from "keycode";
 import React from "react";
 
 import Link from "../Link";
-import { SingleAutocompleteChoiceType } from "../SingleAutocompleteSelectField";
 import { useStyles } from "./styles";
 
 export interface LinkChoiceProps {
   className?: string;
-  choices: SingleAutocompleteChoiceType[];
+  choices: Option[];
   name?: string;
   value: string;
   onChange: FormChange;