From b2a1dfd3fd7d072684ccf4850fbfa8a9985c0390 Mon Sep 17 00:00:00 2001
From: David Newell <d.newell1@outlook.com>
Date: Tue, 21 Nov 2023 11:55:14 +0000
Subject: [PATCH] chore: remove DropdownSelector (#18768)

---
 .../DropdownSelector/DropdownSelector.scss    | 25 -----
 .../DropdownSelector/DropdownSelector.tsx     | 94 -------------------
 2 files changed, 119 deletions(-)
 delete mode 100644 frontend/src/lib/components/DropdownSelector/DropdownSelector.scss
 delete mode 100644 frontend/src/lib/components/DropdownSelector/DropdownSelector.tsx

diff --git a/frontend/src/lib/components/DropdownSelector/DropdownSelector.scss b/frontend/src/lib/components/DropdownSelector/DropdownSelector.scss
deleted file mode 100644
index b8ffa8d145235..0000000000000
--- a/frontend/src/lib/components/DropdownSelector/DropdownSelector.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-.dropdown-selector {
-    padding: 0.5rem;
-    border: 1px solid var(--border-light);
-    border-radius: var(--radius);
-    display: flex;
-    align-items: center;
-    cursor: pointer;
-
-    &.disabled {
-        color: var(--muted);
-        cursor: not-allowed;
-    }
-
-    &.compact {
-        padding: 0.333rem 0.5rem;
-    }
-
-    .dropdown-arrow {
-        display: flex;
-        align-items: center;
-        padding-left: 4px;
-        font-size: 1.2em;
-        color: var(--muted-alt);
-    }
-}
diff --git a/frontend/src/lib/components/DropdownSelector/DropdownSelector.tsx b/frontend/src/lib/components/DropdownSelector/DropdownSelector.tsx
deleted file mode 100644
index abe0e061c8827..0000000000000
--- a/frontend/src/lib/components/DropdownSelector/DropdownSelector.tsx
+++ /dev/null
@@ -1,94 +0,0 @@
-/* Custom dropdown selector with an icon a help caption  */
-import { Dropdown, Menu } from 'antd'
-import clsx from 'clsx'
-import { IconArrowDropDown } from 'lib/lemon-ui/icons'
-import './DropdownSelector.scss'
-
-interface DropdownSelectorProps {
-    label?: string
-    value: string | null
-    onValueChange: (value: string) => void
-    options: DropdownOption[]
-    hideDescriptionOnDisplay?: boolean // Hides the description support text on the main display component (i.e. only shown in the dropdown menu)
-    disabled?: boolean
-    compact?: boolean
-}
-
-interface DropdownOption {
-    key: string
-    label: string
-    description?: string
-    icon: JSX.Element
-    hidden?: boolean
-}
-
-interface SelectItemInterface {
-    icon: JSX.Element
-    label: string
-    description?: string
-    onClick: () => void
-}
-
-function SelectItem({ icon, label, description, onClick }: SelectItemInterface): JSX.Element {
-    return (
-        <div onClick={onClick}>
-            <div className="flex items-center text-sm font-medium gap-2">
-                {icon}
-                <div>{label}</div>
-            </div>
-            {description && <div className="text-muted text-xs mt-1">{description}</div>}
-        </div>
-    )
-}
-
-export function DropdownSelector({
-    label,
-    value,
-    onValueChange,
-    options,
-    hideDescriptionOnDisplay,
-    disabled,
-    compact,
-}: DropdownSelectorProps): JSX.Element {
-    const selectedOption = options.find((opt) => opt.key === value)
-
-    const menu = (
-        <Menu>
-            {options.map(({ key, hidden, ...props }) => {
-                if (hidden) {
-                    return null
-                }
-                return (
-                    <Menu.Item key={key}>
-                        <SelectItem {...props} onClick={() => onValueChange(key)} />
-                    </Menu.Item>
-                )
-            })}
-        </Menu>
-    )
-
-    return (
-        <>
-            {label && <label className="ant-form-item-label">{label}</label>}
-            <Dropdown overlay={menu} trigger={['click']} disabled={disabled}>
-                <div
-                    className={clsx('dropdown-selector', disabled && ' disabled', compact && 'compact')}
-                    onClick={(e) => e.preventDefault()}
-                >
-                    <div className="grow">
-                        {selectedOption && (
-                            <SelectItem
-                                {...selectedOption}
-                                onClick={() => {}}
-                                description={hideDescriptionOnDisplay ? undefined : selectedOption.description}
-                            />
-                        )}
-                    </div>
-                    <div className="dropdown-arrow">
-                        <IconArrowDropDown />
-                    </div>
-                </div>
-            </Dropdown>
-        </>
-    )
-}