topid edit modal [nfc]: Revise Flow types for relevant components.

Author: Leslie Ngo

src/action-sheets/index.js

@@ -82,7 +82,7 @@ type TopicArgs = {
     topic: string,
     streamsById: Map<number, Stream>,
     _: GetText,
-  ) => void,
+  ) => Promise<void>,
   ...
 };
 
@@ -686,7 +686,7 @@ export const showTopicActionSheet = (args: {|
       topic: string,
       streamsById: Map<number, Stream>,
       _: GetText,
-    ) => void,
+    ) => Promise<void>,
     _: GetText,
   |},
   backgroundData: $ReadOnly<{

src/boot/TopicModalProvider.js

@@ -1,11 +1,6 @@
-import React, {
-  createContext,
-  useState,
-  useMemo,
-  useCallback,
-  useContext }
-from 'react';
-import type { Context } from 'react';
+/* @flow strict-local */
+import React, { createContext, useState, useMemo, useCallback, useContext } from 'react';
+import type { Context, Node } from 'react';
 import { useSelector } from '../react-redux';
 import TopicEditModal from '../topics/TopicEditModal';
 import type { Stream, GetText } from '../types';
@@ -16,21 +11,21 @@ type Props = $ReadOnly<{|
   children: Node,
 |}>;
 
-type TopicModalContext = $ReadOnly<{|
+type TopicModalContext = {|
   startEditTopic: (
     streamId: number,
     topic: string,
     streamsById: Map<number, Stream>,
     _: GetText,
-  ) => void,
+  ) => Promise<void>,
   closeEditTopicModal: () => void,
-|}>;
+|};
 
-const TopicModal: Context<TopicModalContext> = createContext();
+const TopicModal: Context<TopicModalContext> = createContext(undefined);
 
 export const useTopicModalHandler = () => useContext(TopicModal);
 
-export default function TopicModalProvider(props: Props) {
+export default function TopicModalProvider(props: Props): Node {
   const { children } = props;
   const auth = useSelector(getAuth);
   const zulipFeatureLevel = useSelector(getZulipFeatureLevel);
@@ -40,16 +35,12 @@ export default function TopicModalProvider(props: Props) {
     fetchArgs: {
       auth: null,
       messageId: null,
-      zulipFeatureLevel: null
-    }
+      zulipFeatureLevel: null,
+    },
   });
 
-  const startEditTopic = useCallback(async (
-      streamId,
-      topic,
-      streamsById,
-      _,
-    ) => {
+  const startEditTopic = useCallback(
+    async (streamId, topic, streamsById, _) => {
       const messageId = await fetchSomeMessageIdForConversation(
         auth,
         streamId,
@@ -67,30 +58,32 @@ export default function TopicModalProvider(props: Props) {
       setTopicModalState({
         visible: true,
         topic,
-        fetchArgs: { auth, messageId, zulipFeatureLevel }
+        fetchArgs: { auth, messageId, zulipFeatureLevel },
       });
-  }, [auth, zulipFeatureLevel]);
+    },
+    [auth, zulipFeatureLevel],
+  );
 
   const closeEditTopicModal = useCallback(() => {
     setTopicModalState({
       visible: false,
       topic: null,
-      fetchArgs: { auth: null, messageId: null, zulipFeatureLevel: null }
+      fetchArgs: { auth: null, messageId: null, zulipFeatureLevel: null },
     });
   }, []);
 
-  const topicModalHandler = useMemo(() => ({
-    startEditTopic,
-    closeEditTopicModal,
-  }), [startEditTopic, closeEditTopicModal]);
+  const topicModalHandler = useMemo(
+    () => ({
+      startEditTopic,
+      closeEditTopicModal,
+    }),
+    [startEditTopic, closeEditTopicModal],
+  );
 
   return (
     <TopicModal.Provider value={topicModalHandler}>
       {topicModalState.visible && (
-        <TopicEditModal
-          topicModalState={topicModalState}
-          topicModalHandler={topicModalHandler}
-        />
+        <TopicEditModal topicModalState={topicModalState} topicModalHandler={topicModalHandler} />
       )}
       {children}
     </TopicModal.Provider>

src/topics/TopicEditModal.js

@@ -13,21 +13,24 @@ type TopicEditModalArgs = {
     fetchArgs: {
       auth: Auth,
       messageId: number,
-      zulipFeatureLevel: number
-    }
+      zulipFeatureLevel: number,
+    },
   },
   topicModalHandler: {
     startEditTopic: (
       streamId: number,
       topic: string,
       streamsById: Map<number, Stream>,
       _: GetText,
-    ) => void,
+    ) => Promise<void>,
     closeEditTopicModal: () => void,
-  }
+  },
 };
 
-export default function TopicEditModal({ topicModalState, topicModalHandler }:TopicEditModalArgs): JSX$Element {
+export default function TopicEditModal({
+  topicModalState,
+  topicModalHandler,
+}: TopicEditModalArgs): JSX$Element {
   const { topic, fetchArgs } = topicModalState;
   const [topicState, onChangeTopic] = useState(topic);
   const { closeEditTopicModal } = topicModalHandler;
@@ -103,7 +106,7 @@ export default function TopicEditModal({ topicModalState, topicModalHandler }:To
     },
     cancelButtonText: {
       color: BRAND_COLOR,
-    }
+    },
   });
 
   const handleSubmit = async () => {
@@ -128,11 +131,7 @@ export default function TopicEditModal({ topicModalState, topicModalHandler }:To
     >
       <View style={styles.wrapper}>
         <View style={styles.modalView}>
-          <Text
-            style={styles.titleText}
-          >
-            Edit topic
-          </Text>
+          <Text style={styles.titleText}>Edit topic</Text>
           <TextInput
             style={styles.input}
             value={topicState}
@@ -146,32 +145,24 @@ export default function TopicEditModal({ topicModalState, topicModalHandler }:To
                 borderStyle: 'solid',
                 borderWidth: 2,
                 borderColor: BRAND_COLOR,
-                ...styles.button
+                ...styles.button,
               }}
               onPress={() => {
                 closeEditTopicModal();
               }}
             >
-              <Text
-                style={{ ...styles.text, ...styles.cancelButtonText }}
-              >
-                Cancel
-              </Text>
+              <Text style={{ ...styles.text, ...styles.cancelButtonText }}>Cancel</Text>
             </Pressable>
             <Pressable
               style={{
                 opacity: !topicState ? 0.25 : 1,
                 backgroundColor: BRAND_COLOR,
-                ...styles.button
+                ...styles.button,
               }}
               onPress={handleSubmit}
               disabled={!topicState}
             >
-              <Text
-                style={{ ...styles.text, ...styles.submitButtonText }}
-              >
-                Submit
-              </Text>
+              <Text style={{ ...styles.text, ...styles.submitButtonText }}>Submit</Text>
             </Pressable>
           </View>
         </View>

src/webview/MessageList.js

@@ -51,7 +51,7 @@ type OuterProps = $ReadOnly<{|
     topic: string,
     streamsById: Map<number, Stream>,
     _: GetText,
-  ) => void,
+  ) => Promise<void>,
 |}>;
 
 type SelectorProps = {|
@@ -85,7 +85,7 @@ export type Props = $ReadOnly<{|
     topic: string,
     streamsById: Map<number, Stream>,
     _: GetText,
-  ) => void,
+  ) => Promise<void>,
 |}>;
 
 /**

src/webview/handleOutboundEvents.js

@@ -4,7 +4,16 @@ import { Clipboard, Alert } from 'react-native';
 import * as NavigationService from '../nav/NavigationService';
 import * as api from '../api';
 import config from '../config';
-import type { Dispatch, GetText, Message, Narrow, Outbox, EditMessage, UserId, Stream } from '../types';
+import type {
+  Dispatch,
+  GetText,
+  Message,
+  Narrow,
+  Outbox,
+  EditMessage,
+  UserId,
+  Stream,
+} from '../types';
 import type { BackgroundData } from './backgroundData';
 import type { ShowActionSheetWithOptions } from '../action-sheets';
 import type { JSONableDict } from '../utils/jsonable';
@@ -174,7 +183,7 @@ type Props = $ReadOnly<{
     topic: string,
     streamsById: Map<number, Stream>,
     _: GetText,
-  ) => void,
+  ) => Promise<void>,
   ...
 }>;
 
@@ -228,7 +237,14 @@ const handleLongPress = (
   if (!message) {
     return;
   }
-  const { dispatch, showActionSheetWithOptions, backgroundData, narrow, startEditMessage, startEditTopic } = props;
+  const {
+    dispatch,
+    showActionSheetWithOptions,
+    backgroundData,
+    narrow,
+    startEditMessage,
+    startEditTopic,
+  } = props;
   if (target === 'header') {
     if (message.type === 'stream') {
       showTopicActionSheet({