Skip to content

Commit 2dedcd6

Browse files
isekovanicisekovanic
authored
fix: remove keyboard controller remnants (#3605)
## 🎯 Goal This PR removes remnants of `react-native-keyboard-controller` which we initially wanted to add to the SDK in a first line support fashion. However, since it was a bit rushed it was not up to our standards in terms of quality and so we decided to remove it (hence why it isn't mentioned in the docs). This was due to the complexity of the integration within our SDK specifically, not the library itself (the library's really really great and we actively recommend using it if your project allows it). However, some remnants of it spilled over in a way that it forces `react-native-keyboard-controller` to be used if it's installed. This is obviously not ideal as a lot of the issues did not get polished out and so integrations that previously used `react-native-keyboard-controller` elsewhere have a buggy handling of pretty much everything keyboard related. With this change this should be resolved. ## 🛠 Implementation details <!-- Provide a description of the implementation --> ## 🎨 UI Changes <!-- Add relevant screenshots --> <details> <summary>iOS</summary> <table> <thead> <tr> <td>Before</td> <td>After</td> </tr> </thead> <tbody> <tr> <td> <!--<img src="" /> --> </td> <td> <!--<img src="" /> --> </td> </tr> </tbody> </table> </details> <details> <summary>Android</summary> <table> <thead> <tr> <td>Before</td> <td>After</td> </tr> </thead> <tbody> <tr> <td> <!--<img src="" /> --> </td> <td> <!--<img src="" /> --> </td> </tr> </tbody> </table> </details> ## 🧪 Testing <!-- Explain how this change can be tested (or why it can't be tested) --> ## ☑️ Checklist - [ ] I have signed the [Stream CLA](https://docs.google.com/forms/d/e/1FAIpQLScFKsKkAJI7mhCr7K9rEIOpqIDThrWxuvxnwUq2XkHyG154vQ/viewform) (required) - [ ] PR targets the `develop` branch - [ ] Documentation is updated - [ ] New code is tested in main example apps, including all possible scenarios - [ ] SampleApp iOS and Android - [ ] Expo iOS and Android
1 parent 89076d5 commit 2dedcd6

15 files changed

Lines changed: 38 additions & 136 deletions

File tree

‎.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,3 +24,5 @@ index.android.bundle
2424
*.DSYM.zip
2525
**/metrics/
2626
package/shared-native/.sync-state/
27+
28+
.claude/worktrees

‎examples/ExpoMessaging/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,13 +47,14 @@
4747
"react-dom": "19.2.0",
4848
"react-native": "0.83.2",
4949
"react-native-gesture-handler": "~2.30.0",
50+
"react-native-keyboard-controller": "1.20.7",
5051
"react-native-maps": "1.26.20",
5152
"react-native-reanimated": "4.2.1",
5253
"react-native-safe-area-context": "~5.6.2",
5354
"react-native-screens": "~4.23.0",
5455
"react-native-svg": "15.15.3",
55-
"react-native-web": "^0.21.0",
5656
"react-native-teleport": "^1.0.2",
57+
"react-native-web": "^0.21.0",
5758
"react-native-worklets": "0.7.2",
5859
"stream-chat-expo": "link:../../package/expo-package",
5960
"stream-chat-react-native-core": "link:../../package"

‎examples/ExpoMessaging/yarn.lock‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5526,6 +5526,13 @@ react-native-is-edge-to-edge@1.2.1, react-native-is-edge-to-edge@^1.2.1:
55265526
resolved "https://registry.yarnpkg.com/react-native-is-edge-to-edge/-/react-native-is-edge-to-edge-1.2.1.tgz#64e10851abd9d176cbf2b40562f751622bde3358"
55275527
integrity sha512-FLbPWl/MyYQWz+KwqOZsSyj2JmLKglHatd3xLZWskXOpRaio4LfEDEz8E/A6uD8QoTHW6Aobw1jbEwK7KMgR7Q==
55285528

5529+
react-native-keyboard-controller@1.20.7:
5530+
version "1.20.7"
5531+
resolved "https://registry.yarnpkg.com/react-native-keyboard-controller/-/react-native-keyboard-controller-1.20.7.tgz#e1be1c15a5eb10b96a40a0812d8472e6e4bd8f29"
5532+
integrity sha512-G8S5jz1FufPrcL1vPtReATx+jJhT/j+sTqxMIb30b1z7cYEfMlkIzOCyaHgf6IMB2KA9uBmnA5M6ve2A9Ou4kw==
5533+
dependencies:
5534+
react-native-is-edge-to-edge "^1.2.1"
5535+
55295536
react-native-lightbox@^0.7.0:
55305537
version "0.7.0"
55315538
resolved "https://registry.yarnpkg.com/react-native-lightbox/-/react-native-lightbox-0.7.0.tgz#e52b4d7fcc141f59d7b23f0180de535e35b20ec9"

‎package/package.json‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,6 @@
9494
"emoji-mart": ">=5.4.0",
9595
"react-native": ">=0.73.0",
9696
"react-native-gesture-handler": ">=2.18.0",
97-
"react-native-keyboard-controller": ">=1.20.2",
9897
"react-native-reanimated": ">=3.16.0",
9998
"react-native-safe-area-context": ">=5.4.1",
10099
"react-native-svg": ">=15.8.0",
@@ -112,9 +111,6 @@
112111
},
113112
"@emoji-mart/data": {
114113
"optional": true
115-
},
116-
"react-native-keyboard-controller": {
117-
"optional": true
118114
}
119115
},
120116
"devDependencies": {
@@ -163,7 +159,6 @@
163159
"react-native": "0.80.2",
164160
"react-native-builder-bob": "0.40.11",
165161
"react-native-gesture-handler": "^2.26.0",
166-
"react-native-keyboard-controller": "^1.20.2",
167162
"react-native-reanimated": "3.18.0",
168163
"react-native-safe-area-context": "^5.6.1",
169164
"react-native-svg": "15.12.0",

‎package/src/components/AttachmentPicker/AttachmentPicker.tsx‎

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React, { useEffect, useMemo, useRef, useState } from 'react';
22
import {
33
BackHandler,
4-
EmitterSubscription,
54
Keyboard,
65
Platform,
76
View,
@@ -21,7 +20,6 @@ import { useComponentsContext } from '../../contexts/componentsContext/Component
2120
import { useTheme } from '../../contexts/themeContext/ThemeContext';
2221
import { useStableCallback } from '../../hooks';
2322
import { BottomSheet } from '../BottomSheetCompatibility/BottomSheet';
24-
import { KeyboardControllerPackage } from '../KeyboardCompatibleView/KeyboardControllerAvoidingView';
2523

2624
dayjs.extend(duration);
2725

@@ -78,18 +76,10 @@ export const AttachmentPicker = () => {
7876
}
7977
closePicker();
8078
};
81-
let keyboardSubscription: EmitterSubscription | null = null;
82-
if (KeyboardControllerPackage?.KeyboardEvents) {
83-
keyboardSubscription = KeyboardControllerPackage.KeyboardEvents.addListener(
84-
'keyboardWillShow',
85-
onKeyboardOpenHandler,
86-
);
87-
} else {
88-
const keyboardShowEvent = Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow';
89-
keyboardSubscription = Keyboard.addListener(keyboardShowEvent, onKeyboardOpenHandler);
90-
}
79+
const keyboardShowEvent = Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow';
80+
const keyboardSubscription = Keyboard.addListener(keyboardShowEvent, onKeyboardOpenHandler);
9181
return () => {
92-
keyboardSubscription?.remove();
82+
keyboardSubscription.remove();
9383
};
9484
}, [attachmentPickerStore, closePicker]);
9585

‎package/src/components/Channel/Channel.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ import {
114114
} from '../../utils/utils';
115115
import { NotificationAnnouncer } from '../Accessibility/NotificationAnnouncer';
116116
import { AttachmentPicker } from '../AttachmentPicker/AttachmentPicker';
117-
import type { KeyboardCompatibleViewProps } from '../KeyboardCompatibleView/KeyboardControllerAvoidingView';
117+
import type { KeyboardCompatibleViewProps } from '../KeyboardCompatibleView/KeyboardCompatibleView';
118118
import { Emoji } from '../MessageMenu/EmojiPickerList';
119119
import { emojis } from '../MessageMenu/emojis';
120120
import { toUnicodeScalarString } from '../MessageMenu/utils/toUnicodeScalarString';

‎package/src/components/ImageGallery/ImageGallery.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ import { useViewport } from '../../hooks/useViewport';
3636
import { IconProps } from '../../icons/utils/base';
3737
import { ImageGalleryState } from '../../state-store/image-gallery-state-store';
3838
import { FileTypes } from '../../types/types';
39-
import { dismissKeyboard } from '../KeyboardCompatibleView/KeyboardControllerAvoidingView';
39+
import { dismissKeyboard } from '../KeyboardCompatibleView/KeyboardCompatibleView';
4040
import { BottomSheetModal } from '../UIComponents';
4141

4242
export type ImageGalleryActionHandler = () => Promise<void> | void;

‎package/src/components/KeyboardCompatibleView/KeyboardCompatibleView.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,12 @@ import {
2222

2323
import { KeyboardProvider } from '../../contexts/keyboardContext/KeyboardContext';
2424

25+
export type KeyboardCompatibleViewProps = KeyboardAvoidingViewProps;
26+
27+
export const dismissKeyboard = () => {
28+
Keyboard.dismiss();
29+
};
30+
2531
type State = {
2632
bottom: number;
2733
};

‎package/src/components/KeyboardCompatibleView/KeyboardControllerAvoidingView.tsx‎

Lines changed: 0 additions & 69 deletions
This file was deleted.

‎package/src/components/Message/Message.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ import {
7777
MessageStatusTypes,
7878
} from '../../utils/utils';
7979
import type { Thumbnail } from '../Attachment/utils/buildGallery/types';
80-
import { dismissKeyboard } from '../KeyboardCompatibleView/KeyboardControllerAvoidingView';
80+
import { dismissKeyboard } from '../KeyboardCompatibleView/KeyboardCompatibleView';
8181
import { BottomSheetModal } from '../UIComponents';
8282

8383
const createMessageOverlayId = (messageId?: string) =>

0 commit comments

Comments
 (0)