about summary refs log tree commit diff
path: root/src/components/dialogs/Context.tsx
blob: 1ee4d27398761ca9c64236ca7d07b5fc26289ea9 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
import {createContext, useContext, useMemo, useState} from 'react'

import * as Dialog from '#/components/Dialog'
import {type Screen} from '#/components/dialogs/EmailDialog/types'

type Control = Dialog.DialogControlProps

export type StatefulControl<T> = {
  control: Control
  open: (value: T) => void
  clear: () => void
  value: T | undefined
}

type ControlsContext = {
  mutedWordsDialogControl: Control
  signinDialogControl: Control
  inAppBrowserConsentControl: StatefulControl<string>
  emailDialogControl: StatefulControl<Screen>
  linkWarningDialogControl: StatefulControl<{
    href: string
    displayText: string
    share?: boolean
  }>
}

const ControlsContext = createContext<ControlsContext | null>(null)

export function useGlobalDialogsControlContext() {
  const ctx = useContext(ControlsContext)
  if (!ctx) {
    throw new Error(
      'useGlobalDialogsControlContext must be used within a Provider',
    )
  }
  return ctx
}

export function Provider({children}: React.PropsWithChildren<{}>) {
  const mutedWordsDialogControl = Dialog.useDialogControl()
  const signinDialogControl = Dialog.useDialogControl()
  const inAppBrowserConsentControl = useStatefulDialogControl<string>()
  const emailDialogControl = useStatefulDialogControl<Screen>()
  const linkWarningDialogControl = useStatefulDialogControl<{
    href: string
    displayText: string
    share?: boolean
  }>()

  const ctx = useMemo<ControlsContext>(
    () => ({
      mutedWordsDialogControl,
      signinDialogControl,
      inAppBrowserConsentControl,
      emailDialogControl,
      linkWarningDialogControl,
    }),
    [
      mutedWordsDialogControl,
      signinDialogControl,
      inAppBrowserConsentControl,
      emailDialogControl,
      linkWarningDialogControl,
    ],
  )

  return (
    <ControlsContext.Provider value={ctx}>{children}</ControlsContext.Provider>
  )
}

export function useStatefulDialogControl<T>(
  initialValue?: T,
): StatefulControl<T> {
  const [value, setValue] = useState(initialValue)
  const control = Dialog.useDialogControl()
  return useMemo(
    () => ({
      control,
      open: (v: T) => {
        setValue(v)
        control.open()
      },
      clear: () => setValue(initialValue),
      value,
    }),
    [control, value, initialValue],
  )
}