forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Add optional close callback to Dialog (#2947)
* Add optional close callback
* No emitter
authored by
Eric Bailey
and committed by
GitHub
f88b1652
6413b8ba
+21
-9
+7
-3
src/components/Dialog/context.ts
+7
-3
src/components/Dialog/context.ts
···
1
1
import React from 'react'
2
2
3
3
import {useDialogStateContext} from '#/state/dialogs'
4
-
import {DialogContextProps, DialogControlProps} from '#/components/Dialog/types'
4
+
import {
5
+
DialogContextProps,
6
+
DialogControlProps,
7
+
DialogOuterProps,
8
+
} from '#/components/Dialog/types'
5
9
6
10
export const Context = React.createContext<DialogContextProps>({
7
11
close: () => {},
···
11
15
return React.useContext(Context)
12
16
}
13
17
14
-
export function useDialogControl() {
18
+
export function useDialogControl(): DialogOuterProps['control'] {
15
19
const id = React.useId()
16
20
const control = React.useRef<DialogControlProps>({
17
21
open: () => {},
···
30
34
return {
31
35
ref: control,
32
36
open: () => control.current.open(),
33
-
close: () => control.current.close(),
37
+
close: cb => control.current.close(cb),
34
38
}
35
39
}
+7
-1
src/components/Dialog/index.tsx
+7
-1
src/components/Dialog/index.tsx
···
35
35
const sheetOptions = nativeOptions?.sheet || {}
36
36
const hasSnapPoints = !!sheetOptions.snapPoints
37
37
const insets = useSafeAreaInsets()
38
+
const closeCallback = React.useRef<() => void>()
38
39
39
40
/*
40
41
* Used to manage open/closed, but index is otherwise handled internally by `BottomSheet`
···
54
55
[setOpenIndex],
55
56
)
56
57
57
-
const close = React.useCallback(() => {
58
+
const close = React.useCallback<DialogControlProps['close']>(cb => {
59
+
if (cb) {
60
+
closeCallback.current = cb
61
+
}
58
62
sheet.current?.close()
59
63
}, [])
60
64
···
70
74
const onChange = React.useCallback(
71
75
(index: number) => {
72
76
if (index === -1) {
77
+
closeCallback.current?.()
78
+
closeCallback.current = undefined
73
79
onClose?.()
74
80
setOpenIndex(-1)
75
81
}
+2
-4
src/components/Dialog/types.ts
+2
-4
src/components/Dialog/types.ts
···
22
22
23
23
export type DialogControlProps = {
24
24
open: (options?: DialogControlOpenOptions) => void
25
-
close: () => void
25
+
close: (callback?: () => void) => void
26
26
}
27
27
28
28
export type DialogOuterProps = {
29
29
control: {
30
30
ref: React.RefObject<DialogControlProps>
31
-
open: (index?: number) => void
32
-
close: () => void
33
-
}
31
+
} & DialogControlProps
34
32
onClose?: () => void
35
33
nativeOptions?: {
36
34
sheet?: Omit<BottomSheetProps, 'children'>
+5
-1
src/view/screens/Storybook/Dialogs.tsx
+5
-1
src/view/screens/Storybook/Dialogs.tsx