forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Fix double padding in `Dialog.InnerFlatList` on web (#5986)
* remove extra padding on web
* pass prop
authored by
Samuel Newman
and committed by
GitHub
80c5f23d
2502c91d
+19
-12
+4
-1
src/components/Dialog/index.tsx
+4
-1
src/components/Dialog/index.tsx
···
267
267
268
268
export const InnerFlatList = React.forwardRef<
269
269
ListMethods,
270
-
ListProps<any> & {webInnerStyle?: StyleProp<ViewStyle>}
270
+
ListProps<any> & {
271
+
webInnerStyle?: StyleProp<ViewStyle>
272
+
webInnerContentContainerStyle?: StyleProp<ViewStyle>
273
+
}
271
274
>(function InnerFlatList({style, ...props}, ref) {
272
275
const insets = useSafeAreaInsets()
273
276
const {nativeSnapPoint, disableDrag, setDisableDrag} = useDialogContext()
+13
-8
src/components/Dialog/index.web.tsx
+13
-8
src/components/Dialog/index.web.tsx
···
210
210
211
211
export const InnerFlatList = React.forwardRef<
212
212
FlatList,
213
-
FlatListProps<any> & {label: string} & {webInnerStyle?: StyleProp<ViewStyle>}
214
-
>(function InnerFlatList({label, style, webInnerStyle, ...props}, ref) {
213
+
FlatListProps<any> & {label: string} & {
214
+
webInnerStyle?: StyleProp<ViewStyle>
215
+
webInnerContentContainerStyle?: StyleProp<ViewStyle>
216
+
}
217
+
>(function InnerFlatList(
218
+
{label, style, webInnerStyle, webInnerContentContainerStyle, ...props},
219
+
ref,
220
+
) {
215
221
const {gtMobile} = useBreakpoints()
216
222
return (
217
223
<Inner
218
224
label={label}
219
225
style={[
226
+
a.overflow_hidden,
227
+
a.px_0,
220
228
// @ts-ignore web only -sfn
221
-
{
222
-
paddingHorizontal: 0,
223
-
maxHeight: 'calc(-36px + 100vh)',
224
-
overflow: 'hidden',
225
-
},
229
+
{maxHeight: 'calc(-36px + 100vh)'},
226
230
webInnerStyle,
227
-
]}>
231
+
]}
232
+
contentContainerStyle={[a.px_0, webInnerContentContainerStyle]}>
228
233
<FlatList
229
234
ref={ref}
230
235
style={[gtMobile ? a.px_2xl : a.px_xl, flatten(style)]}
+2
-3
src/components/dialogs/GifSelect.tsx
+2
-3
src/components/dialogs/GifSelect.tsx
···
144
144
a.mb_lg,
145
145
a.flex_row,
146
146
a.align_center,
147
-
!gtMobile && isWeb && a.gap_md,
147
+
!gtMobile && web(a.gap_md),
148
148
]}>
149
149
{/* cover top corners */}
150
150
<View
···
209
209
native([a.px_xl, {minHeight: height}]),
210
210
web(a.h_full_vh),
211
211
]}
212
+
style={[web(a.h_full_vh)]}
212
213
ListHeaderComponent={
213
214
<>
214
215
{listHeader}
···
238
239
onEndReached={onEndReached}
239
240
onEndReachedThreshold={4}
240
241
keyExtractor={(item: Gif) => item.id}
241
-
// @ts-expect-error web only
242
-
style={isWeb && {minHeight: '100vh'}}
243
242
keyboardDismissMode="on-drag"
244
243
ListFooterComponent={
245
244
hasData ? (