diff --git a/__mocks__/@gorhom/bottom-sheet.tsx b/__mocks__/@gorhom/bottom-sheet.tsx
index 31098601..dae0d655 100644
--- a/__mocks__/@gorhom/bottom-sheet.tsx
+++ b/__mocks__/@gorhom/bottom-sheet.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, {ReactNode} from 'react'
import {View, ScrollView, Modal, FlatList, TextInput} from 'react-native'
const BottomSheetModalContext = React.createContext(null)
@@ -6,7 +6,10 @@ const BottomSheetModalContext = React.createContext(null)
const BottomSheetModalProvider = (props: any) => {
return
}
-class BottomSheet extends React.Component<{onClose?: () => void}> {
+class BottomSheet extends React.Component<{
+ onClose?: () => void
+ children?: ReactNode
+}> {
snapToIndex() {}
snapToPosition() {}
expand() {}
diff --git a/package.json b/package.json
index 0b46a67c..e66d2bcf 100644
--- a/package.json
+++ b/package.json
@@ -190,7 +190,7 @@
"webpack-dev-server": "^4.11.1"
},
"resolutions": {
- "@types/react": "^17"
+ "@types/react": "^18"
},
"jest": {
"preset": "jest-expo/ios",
diff --git a/src/Navigation.tsx b/src/Navigation.tsx
index 77e7cfa0..640b771d 100644
--- a/src/Navigation.tsx
+++ b/src/Navigation.tsx
@@ -10,7 +10,10 @@ import {
DarkTheme,
} from '@react-navigation/native'
import {createNativeStackNavigator} from '@react-navigation/native-stack'
-import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'
+import {
+ BottomTabBarProps,
+ createBottomTabNavigator,
+} from '@react-navigation/bottom-tabs'
import {
HomeTabNavigatorParams,
SearchTabNavigatorParams,
@@ -62,6 +65,7 @@ import {ModerationBlockedAccounts} from 'view/screens/ModerationBlockedAccounts'
import {SavedFeeds} from 'view/screens/SavedFeeds'
import {getRoutingInstrumentation} from 'lib/sentry'
import {bskyTitle} from 'lib/strings/headings'
+import {JSX} from 'react/jsx-runtime'
const navigationRef = createNavigationContainerRef()
@@ -220,7 +224,12 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
* in 3 distinct tab-stacks with a different root screen on each.
*/
function TabsNavigator() {
- const tabBar = React.useCallback(props => , [])
+ const tabBar = React.useCallback(
+ (props: JSX.IntrinsicAttributes & BottomTabBarProps) => (
+
+ ),
+ [],
+ )
return (
{
- if (isProcessing || rt.graphemeLength_ > MAX_GRAPHEME_LENGTH) {
+ async (rt: RichText) => {
+ if (isProcessing || rt.graphemeLength > MAX_GRAPHEME_LENGTH) {
return
}
diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx
index 8ccdfdb0..64746840 100644
--- a/src/view/com/post-thread/PostThreadItem.tsx
+++ b/src/view/com/post-thread/PostThreadItem.tsx
@@ -1,6 +1,6 @@
import React, {useCallback, useMemo} from 'react'
import {observer} from 'mobx-react-lite'
-import {Linking, StyleSheet, View} from 'react-native'
+import {AccessibilityActionEvent, Linking, StyleSheet, View} from 'react-native'
import Clipboard from '@react-native-clipboard/clipboard'
import {AtUri} from '@atproto/api'
import {
@@ -152,7 +152,7 @@ export const PostThreadItem = observer(function PostThreadItem({
)
const onAccessibilityAction = useCallback(
- event => {
+ (event: AccessibilityActionEvent) => {
switch (event.nativeEvent.actionName) {
case 'like':
onPressToggleLike()
diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx
index d37c43a3..b9d146de 100644
--- a/src/view/com/post/Post.tsx
+++ b/src/view/com/post/Post.tsx
@@ -1,5 +1,6 @@
import React, {useCallback, useEffect, useMemo, useState} from 'react'
import {
+ AccessibilityActionEvent,
ActivityIndicator,
Linking,
StyleProp,
@@ -223,7 +224,7 @@ const PostLoaded = observer(
)
const onAccessibilityAction = useCallback(
- event => {
+ (event: AccessibilityActionEvent) => {
switch (event.nativeEvent.actionName) {
case 'like':
onPressToggleLike()
diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx
index 18c32b89..d83e6407 100644
--- a/src/view/com/posts/FeedItem.tsx
+++ b/src/view/com/posts/FeedItem.tsx
@@ -1,6 +1,6 @@
import React, {useCallback, useMemo, useState} from 'react'
import {observer} from 'mobx-react-lite'
-import {Linking, StyleSheet, View} from 'react-native'
+import {AccessibilityActionEvent, Linking, StyleSheet, View} from 'react-native'
import Clipboard from '@react-native-clipboard/clipboard'
import {AtUri} from '@atproto/api'
import {
@@ -173,7 +173,7 @@ export const FeedItem = observer(function ({
)
const onAccessibilityAction = useCallback(
- event => {
+ (event: AccessibilityActionEvent) => {
switch (event.nativeEvent.actionName) {
case 'like':
onPressToggleLike()
diff --git a/src/view/com/profile/ProfileCard.tsx b/src/view/com/profile/ProfileCard.tsx
index 50b9f199..2dfc7ad3 100644
--- a/src/view/com/profile/ProfileCard.tsx
+++ b/src/view/com/profile/ProfileCard.tsx
@@ -100,7 +100,7 @@ export const ProfileCard = observer(
{profile.description ? (
- {profile.description}
+ {profile.description as string}
) : undefined}
diff --git a/src/view/com/util/ViewSelector.tsx b/src/view/com/util/ViewSelector.tsx
index 705178a8..e2f47ba8 100644
--- a/src/view/com/util/ViewSelector.tsx
+++ b/src/view/com/util/ViewSelector.tsx
@@ -59,7 +59,7 @@ export const ViewSelector = React.forwardRef<
// events
// =
- const keyExtractor = React.useCallback(item => item._reactKey, [])
+ const keyExtractor = React.useCallback((item: any) => item._reactKey, [])
const onPressSelection = React.useCallback(
(index: number) => setSelectedIndex(clamp(index, 0, sections.length)),
diff --git a/src/view/com/util/forms/Button.tsx b/src/view/com/util/forms/Button.tsx
index 6a5f19f9..8049d224 100644
--- a/src/view/com/util/forms/Button.tsx
+++ b/src/view/com/util/forms/Button.tsx
@@ -6,6 +6,7 @@ import {
TextStyle,
Pressable,
ViewStyle,
+ PressableStateCallbackType,
} from 'react-native'
import {Text} from '../text/Text'
import {useTheme} from 'lib/ThemeContext'
@@ -26,6 +27,14 @@ export type ButtonType =
| 'secondary-light'
| 'default-light'
+// Augment type for react-native-web (see https://github.com/necolas/react-native-web/issues/1684#issuecomment-766451866)
+declare module 'react-native' {
+ interface PressableStateCallbackType {
+ hovered?: boolean
+ focused?: boolean
+ }
+}
+
// TODO: Enforce that button always has a label
export function Button({
type = 'primary',
@@ -139,7 +148,7 @@ export function Button({
)
const getStyle = React.useCallback(
- state => {
+ (state: PressableStateCallbackType) => {
const arr = [typeOuterStyle, styles.outer, style]
if (state.pressed) {
arr.push({opacity: 0.6})
diff --git a/src/view/screens/DiscoverFeeds.tsx b/src/view/screens/DiscoverFeeds.tsx
index 98f164a6..6b0f6b7f 100644
--- a/src/view/screens/DiscoverFeeds.tsx
+++ b/src/view/screens/DiscoverFeeds.tsx
@@ -13,6 +13,7 @@ import {Text} from 'view/com/util/text/Text'
import {isDesktopWeb} from 'platform/detection'
import {usePalette} from 'lib/hooks/usePalette'
import {s} from 'lib/styles'
+import {CustomFeedModel} from 'state/models/feeds/custom-feed'
type Props = NativeStackScreenProps
export const DiscoverFeedsScreen = withAuthRequired(
@@ -51,7 +52,7 @@ export const DiscoverFeedsScreen = withAuthRequired(
}, [pal, feeds.isLoading])
const renderItem = React.useCallback(
- ({item}) => (
+ ({item}: {item: CustomFeedModel}) => (
savedFeeds.refresh(), [savedFeeds])
const onDragEnd = useCallback(
- async ({data}) => {
+ async ({data}: {data: CustomFeedModel[]}) => {
try {
await savedFeeds.reorderPinnedFeeds(data)
} catch (e) {
diff --git a/yarn.lock b/yarn.lock
index b9e8fe5b..9bff87a8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4997,10 +4997,10 @@
dependencies:
"@types/react" "^17"
-"@types/react@*", "@types/react@^17":
- version "17.0.60"
- resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.60.tgz#a4a97dcdbebad76612c188fc06440e4995fd8ad2"
- integrity sha512-pCH7bqWIfzHs3D+PDs3O/COCQJka+Kcw3RnO9rFA2zalqoXg7cNjJDh6mZ7oRtY1wmY4LVwDdAbA1F7Z8tv3BQ==
+"@types/react@*", "@types/react@^17", "@types/react@^18":
+ version "18.2.12"
+ resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.12.tgz#95d584338610b78bb9ba0415e3180fb03debdf97"
+ integrity sha512-ndmBMLCgn38v3SntMeoJaIrO6tGHYKMEBohCUmw8HoLLQdRMOIGXfeYaBTLe2lsFaSB3MOK1VXscYFnmLtTSmw==
dependencies:
"@types/prop-types" "*"
"@types/scheduler" "*"