fix: Multiselect broken for single mode (#17453)

PostHog · Sep 15, 2023 · d7a97f8 · d7a97f8
1 parent 491960d
commit d7a97f8
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 8 deletions.
diff --git a/...napshots__/scenes-app-recordings--recordings-play-list-no-pinned-recordings.png b/...napshots__/scenes-app-recordings--recordings-play-list-no-pinned-recordings.png
diff --git a/frontend/src/lib/components/Subscriptions/views/EditSubscription.tsx b/frontend/src/lib/components/Subscriptions/views/EditSubscription.tsx
@@ -285,7 +285,7 @@ export function EditSubscription({
                                         >
                                             {({ value, onChange }) => (
                                                 <LemonSelectMultiple
-                                                    onChange={(val: string[]) => onChange(val)}
+                                                    onChange={(val: string) => onChange(val)}
                                                     value={value}
                                                     disabled={slackDisabled}
                                                     mode="single"

diff --git a/frontend/src/lib/lemon-ui/LemonSelectMultiple/LemonSelectMultiple.tsx b/frontend/src/lib/lemon-ui/LemonSelectMultiple/LemonSelectMultiple.tsx
@@ -18,20 +18,20 @@ export interface LemonSelectMultipleOptionItem extends LemonSelectMultipleOption
 
 export type LemonSelectMultipleOptions = Record<string, LemonSelectMultipleOption>
 
-export interface LemonSelectMultipleProps {
+export type LemonSelectMultipleProps = {
     selectClassName?: string
     options?: LemonSelectMultipleOptions | LemonSelectMultipleOptionItem[]
-    value?: string[] | null | LabelInValue[]
+    value?: string | string[] | null
     disabled?: boolean
     loading?: boolean
     placeholder?: string
     labelInValue?: boolean
-    onChange?: ((newValue: string[]) => void) | ((newValue: LabelInValue[]) => void)
     onSearch?: (value: string) => void
     onFocus?: () => void
     onBlur?: () => void
     filterOption?: boolean
     mode?: 'single' | 'multiple' | 'multiple-custom'
+    onChange?: ((newValue: string) => void) | ((newValue: string[]) => void)
     'data-attr'?: string
 }
 
@@ -82,9 +82,10 @@ export function LemonSelectMultiple({
                 showAction={['focus']}
                 onChange={(v) => {
                     if (onChange) {
-                        if (labelInValue) {
-                            const typedValues = v as LabelInValue[]
-                            const typedOnChange = onChange as (newValue: LabelInValue[]) => void
+                        // TRICKY: V is typed poorly and will be a string if the "mode" is undefined
+                        if (!v || typeof v === 'string') {
+                            const typedValues = v as string | null
+                            const typedOnChange = onChange as (newValue: string | null) => void
                             typedOnChange(typedValues)
                         } else {
                             const typedValues = v.map((token) => token.toString().trim()) as string[]

diff --git a/frontend/src/scenes/project/Settings/TimezoneConfig.tsx b/frontend/src/scenes/project/Settings/TimezoneConfig.tsx
@@ -32,7 +32,7 @@ export function TimezoneConfig(): JSX.Element {
                 loading={currentTeamLoading}
                 disabled={currentTeamLoading}
                 value={[currentTeam.timezone]}
-                onChange={(newTimezone: any): void => {
+                onChange={(newTimezone: string): void => {
                     // This is a string for a single-mode select, but typing is poor
                     if (!preflight?.available_timezones) {
                         throw new Error('No timezones are available')