diff --git a/web/account/traditional-login-form.react.js b/web/account/traditional-login-form.react.js
--- a/web/account/traditional-login-form.react.js
+++ b/web/account/traditional-login-form.react.js
@@ -37,7 +37,7 @@
const getSignedIdentityKeysBlob = useGetSignedIdentityKeysBlob();
- const usernameInputRef = React.useRef();
+ const usernameInputRef = React.useRef();
React.useEffect(() => {
usernameInputRef.current?.focus();
}, []);
diff --git a/web/avatars/edit-thread-avatar-menu.react.js b/web/avatars/edit-thread-avatar-menu.react.js
--- a/web/avatars/edit-thread-avatar-menu.react.js
+++ b/web/avatars/edit-thread-avatar-menu.react.js
@@ -57,7 +57,7 @@
[removeThreadAvatar],
);
- const imageInputRef = React.useRef();
+ const imageInputRef = React.useRef();
const onImageMenuItemClicked = React.useCallback(
() => imageInputRef.current?.click(),
[],
diff --git a/web/avatars/edit-user-avatar-menu.react.js b/web/avatars/edit-user-avatar-menu.react.js
--- a/web/avatars/edit-user-avatar-menu.react.js
+++ b/web/avatars/edit-user-avatar-menu.react.js
@@ -61,7 +61,7 @@
[openEmojiSelectionModal],
);
- const imageInputRef = React.useRef();
+ const imageInputRef = React.useRef();
const onImageMenuItemClicked = React.useCallback(
() => imageInputRef.current?.click(),
[],
diff --git a/web/chat/chat-input-text-area.react.js b/web/chat/chat-input-text-area.react.js
--- a/web/chat/chat-input-text-area.react.js
+++ b/web/chat/chat-input-text-area.react.js
@@ -27,7 +27,7 @@
onChangePosition,
maxHeight = defaultMaxTextAreaHeight,
} = props;
- const textareaRef = React.useRef(null);
+ const textareaRef = React.useRef(null);
const focusAndUpdateText = React.useCallback(() => {
if (!focus) {
diff --git a/web/chat/chat-message-list-container.react.js b/web/chat/chat-message-list-container.react.js
--- a/web/chat/chat-message-list-container.react.js
+++ b/web/chat/chat-message-list-container.react.js
@@ -75,7 +75,7 @@
[css.activeContainer]: isActive,
});
- const containerRef = React.useRef();
+ const containerRef = React.useRef();
const onPaste = React.useCallback(
(e: ClipboardEvent) => {
diff --git a/web/chat/chat-thread-list.react.js b/web/chat/chat-thread-list.react.js
--- a/web/chat/chat-thread-list.react.js
+++ b/web/chat/chat-thread-list.react.js
@@ -59,6 +59,11 @@
return
{item}
;
};
+type VariableSizeListRef = {
+ +resetAfterIndex: (index: number, shouldForceUpdate?: boolean) => void,
+ ...
+};
+
function ChatThreadList(): React.Node {
const threadListContext = React.useContext(ThreadListContext);
invariant(
@@ -108,7 +113,7 @@
? 'Create new chat'
: 'Create new channel';
- const threadListContainerRef = React.useRef();
+ const threadListContainerRef = React.useRef();
const threads = React.useMemo(
() =>
diff --git a/web/chat/edit-text-message.react.js b/web/chat/edit-text-message.react.js
--- a/web/chat/edit-text-message.react.js
+++ b/web/chat/edit-text-message.react.js
@@ -37,7 +37,7 @@
useEditModalContext();
const editMessage = useEditMessage();
- const myRef = React.useRef(null);
+ const myRef = React.useRef(null);
const editedMessageDraft = editState?.editedMessageDraft ?? '';
const threadColor = threadInfo.color;
diff --git a/web/chat/message-tooltip.react.js b/web/chat/message-tooltip.react.js
--- a/web/chat/message-tooltip.react.js
+++ b/web/chat/message-tooltip.react.js
@@ -63,9 +63,10 @@
// - emojiKeyboardRenderedNode, which will get set in that useEffect and will
// trigger the rerendering of this component with the correct height/width
- const [emojiKeyboardNode, setEmojiKeyboardNode] = React.useState(null);
+ const [emojiKeyboardNode, setEmojiKeyboardNode] =
+ React.useState(null);
const [emojiKeyboardRenderedNode, setEmojiKeyboardRenderedNode] =
- React.useState(null);
+ React.useState(null);
React.useEffect(() => {
if (emojiKeyboardNode) {
diff --git a/web/components/menu.react.js b/web/components/menu.react.js
--- a/web/components/menu.react.js
+++ b/web/components/menu.react.js
@@ -21,7 +21,7 @@
};
function Menu(props: MenuProps): React.Node {
- const buttonRef = React.useRef();
+ const buttonRef = React.useRef();
const {
renderMenu,
setMenuPosition,
diff --git a/web/media/encrypted-multimedia.react.js b/web/media/encrypted-multimedia.react.js
--- a/web/media/encrypted-multimedia.react.js
+++ b/web/media/encrypted-multimedia.react.js
@@ -29,6 +29,8 @@
+invisibleLoad?: boolean,
};
+type Source = { +uri: string } | { +error: string };
+
function EncryptedMultimedia(props: Props): React.Node {
const {
blobURI,
@@ -39,8 +41,8 @@
invisibleLoad,
} = props;
- const [source, setSource] = React.useState(null);
- const videoRef = React.useRef(null);
+ const [source, setSource] = React.useState(null);
+ const videoRef = React.useRef(null);
React.useEffect(() => {
let isMounted = true,
diff --git a/web/media/loadable-video.react.js b/web/media/loadable-video.react.js
--- a/web/media/loadable-video.react.js
+++ b/web/media/loadable-video.react.js
@@ -36,7 +36,7 @@
const { thumbnailURI, thumbnailBlobURI, thumbnailEncryptionKey } =
thumbnailSource;
- const [thumbnailImage, setThumbnailImage] = React.useState(null);
+ const [thumbnailImage, setThumbnailImage] = React.useState(null);
React.useEffect(() => {
let isMounted = true,
diff --git a/web/media/media-utils.js b/web/media/media-utils.js
--- a/web/media/media-utils.js
+++ b/web/media/media-utils.js
@@ -240,7 +240,7 @@
}
function usePlaceholder(thumbHash: ?string, encryptionKey: ?string): ?string {
- const [placeholder, setPlaceholder] = React.useState(null);
+ const [placeholder, setPlaceholder] = React.useState(null);
React.useEffect(() => {
if (!thumbHash) {
diff --git a/web/modals/chat/message-results-modal.react.js b/web/modals/chat/message-results-modal.react.js
--- a/web/modals/chat/message-results-modal.react.js
+++ b/web/modals/chat/message-results-modal.react.js
@@ -14,6 +14,7 @@
isInvalidPinSourceForThread,
modifyItemForResultScreen,
} from 'lib/shared/message-utils.js';
+import type { RawMessageInfo } from 'lib/types/message-types.js';
import type { MinimallyEncodedThreadInfo } from 'lib/types/minimally-encoded-thread-permissions-types.js';
import { type ThreadInfo } from 'lib/types/thread-types.js';
import { useDispatchActionPromise } from 'lib/utils/action-utils.js';
@@ -37,7 +38,9 @@
const { threadInfo, modalName } = props;
const { id: threadID } = threadInfo;
const { popModal } = useModalContext();
- const [rawMessageResults, setRawMessageResults] = React.useState([]);
+ const [rawMessageResults, setRawMessageResults] = React.useState<
+ $ReadOnlyArray,
+ >([]);
const callFetchPinnedMessages = useFetchPinnedMessages();
const dispatchActionPromise = useDispatchActionPromise();
diff --git a/web/modals/search/message-search-modal.react.js b/web/modals/search/message-search-modal.react.js
--- a/web/modals/search/message-search-modal.react.js
+++ b/web/modals/search/message-search-modal.react.js
@@ -57,7 +57,7 @@
const { clearTooltip } = useTooltipContext();
- const messageContainer = React.useRef(null);
+ const messageContainer = React.useRef(null);
const possiblyLoadMoreMessages = React.useCallback(() => {
if (!messageContainer.current) {
diff --git a/web/modals/threads/gallery/thread-settings-media-gallery.react.js b/web/modals/threads/gallery/thread-settings-media-gallery.react.js
--- a/web/modals/threads/gallery/thread-settings-media-gallery.react.js
+++ b/web/modals/threads/gallery/thread-settings-media-gallery.react.js
@@ -37,7 +37,7 @@
const modalName = 'Media';
const callFetchThreadMedia = useFetchThreadMedia();
- const [mediaInfos, setMediaInfos] = React.useState([]);
+ const [mediaInfos, setMediaInfos] = React.useState<$ReadOnlyArray>([]);
const [tab, setTab] = React.useState(activeTab);
React.useEffect(() => {
diff --git a/web/modals/threads/members/members-list.react.js b/web/modals/threads/members/members-list.react.js
--- a/web/modals/threads/members/members-list.react.js
+++ b/web/modals/threads/members/members-list.react.js
@@ -28,7 +28,7 @@
function ThreadMembersList(props: Props): React.Node {
const { threadMembers, threadInfo } = props;
- const [openMenu, setOpenMenu] = React.useState(null);
+ const [openMenu, setOpenMenu] = React.useState(null);
const hasMembers = threadMembers.length > 0;
const threadMembersWithENSNames = useENSNames(threadMembers);
diff --git a/web/modals/threads/settings/thread-settings-general-tab.react.js b/web/modals/threads/settings/thread-settings-general-tab.react.js
--- a/web/modals/threads/settings/thread-settings-general-tab.react.js
+++ b/web/modals/threads/settings/thread-settings-general-tab.react.js
@@ -48,7 +48,7 @@
const dispatchActionPromise = useDispatchActionPromise();
const callChangeThreadSettings = useChangeThreadSettings();
- const nameInputRef = React.useRef();
+ const nameInputRef = React.useRef();
React.useEffect(() => {
nameInputRef.current?.focus();
diff --git a/web/modals/threads/thread-picker-modal.react.js b/web/modals/threads/thread-picker-modal.react.js
--- a/web/modals/threads/thread-picker-modal.react.js
+++ b/web/modals/threads/thread-picker-modal.react.js
@@ -66,7 +66,7 @@
new Set(),
);
- const searchRef = React.useRef();
+ const searchRef = React.useRef();
React.useEffect(() => {
searchRef.current?.focus();
diff --git a/web/push-notif/badge-handler.react.js b/web/push-notif/badge-handler.react.js
--- a/web/push-notif/badge-handler.react.js
+++ b/web/push-notif/badge-handler.react.js
@@ -4,6 +4,7 @@
import { connectionSelector } from 'lib/selectors/keyserver-selectors.js';
import { unreadCount } from 'lib/selectors/thread-selectors.js';
+import type { ConnectionInfo } from 'lib/types/socket-types.js';
import { ashoatKeyserverID } from 'lib/utils/validation-utils.js';
import electron from '../electron.js';
@@ -12,7 +13,7 @@
function useBadgeHandler() {
const connection = useSelector(connectionSelector(ashoatKeyserverID));
- const prevConnection = React.useRef();
+ const prevConnection = React.useRef();
const boundUnreadCount = useSelector(unreadCount);
const prevUnreadCount = React.useRef(boundUnreadCount);
diff --git a/web/redux/focus-handler.react.js b/web/redux/focus-handler.react.js
--- a/web/redux/focus-handler.react.js
+++ b/web/redux/focus-handler.react.js
@@ -45,7 +45,7 @@
);
const prevFocusedRef = React.useRef(curWindowActive);
- const timerRef = React.useRef();
+ const timerRef = React.useRef();
React.useEffect(() => {
const prevFocused = prevFocusedRef.current;
if (focused && !prevFocused) {
diff --git a/web/redux/policy-acknowledgment-handler.js b/web/redux/policy-acknowledgment-handler.js
--- a/web/redux/policy-acknowledgment-handler.js
+++ b/web/redux/policy-acknowledgment-handler.js
@@ -12,7 +12,7 @@
const termsAndPrivacyState = useSelector(
state => state.userPolicies?.[policyTypes.tosAndPrivacyPolicy],
);
- const [policyModalKey, setPolicyModalKey] = React.useState(null);
+ const [policyModalKey, setPolicyModalKey] = React.useState(null);
const { pushModal, popModal, modals } = useModalContext();
const policyModalVisible = React.useMemo(
diff --git a/web/settings/tunnelbroker-test.react.js b/web/settings/tunnelbroker-test.react.js
--- a/web/settings/tunnelbroker-test.react.js
+++ b/web/settings/tunnelbroker-test.react.js
@@ -21,8 +21,8 @@
const [message, setMessage] = React.useState('');
const [loading, setLoading] = React.useState(false);
const [errorMessage, setErrorMessage] = React.useState('');
- const recipientInput = React.useRef(null);
- const messageInput = React.useRef(null);
+ const recipientInput = React.useRef(null);
+ const messageInput = React.useRef(null);
const onSubmit = React.useCallback(
async (event: SyntheticEvent) => {
diff --git a/web/utils/tooltip-action-utils.js b/web/utils/tooltip-action-utils.js
--- a/web/utils/tooltip-action-utils.js
+++ b/web/utils/tooltip-action-utils.js
@@ -35,6 +35,7 @@
import { getComposedMessageID } from '../chat/chat-constants.js';
import { useEditModalContext } from '../chat/edit-message-provider.js';
import MessageTooltip from '../chat/message-tooltip.react.js';
+import type { PositionInfo } from '../chat/position-types.js';
import ReactionTooltip from '../chat/reaction-tooltip.react.js';
import { useTooltipContext } from '../chat/tooltip-provider.js';
import CommIcon from '../CommIcon.react.js';
@@ -61,10 +62,11 @@
availablePositions,
}: UseTooltipArgs): UseTooltipResult {
const [onMouseLeave, setOnMouseLeave] = React.useState() => mixed>(null);
- const [tooltipSourcePosition, setTooltipSourcePosition] = React.useState();
+ const [tooltipSourcePosition, setTooltipSourcePosition] =
+ React.useState();
const { renderTooltip } = useTooltipContext();
- const updateTooltip = React.useRef();
+ const updateTooltip = React.useRef(React.Node) => mixed>();
const onMouseEnter = React.useCallback(
(event: SyntheticEvent) => {