flow [nfc]: Mark specific rules that are being suppressed.

When we start using Flow v0.137, along with React Native v0.64
(that's issue zulip#4426), we'll be asked to specify what rule(s) we're
suppressing with each suppression comment. Conveniently, the
warnings will tell us the applicable rule(s).

So, using those warnings, get a head start on doing so. There will
probably be more of these (we haven't yet started enforcing the
requirement now, so some unmarked `$FlowFixMe`s will probably
accumulate), but we might as well get this chunk out of the way.

src/ZulipMobile.js

@@ -18,7 +18,7 @@ import LoadingScreen from './start/LoadingScreen';
 
 initializeSentry();
 
-// $FlowFixMe
+// $FlowMigrationFudge[prop-missing]
 console.disableYellowBox = true; // eslint-disable-line
 
 export default (): React$Node => (

src/__flow-tests__/types-test.js

@@ -4,6 +4,6 @@ import type { Action } from '../types';
 // Assert that Action does not allow arbitrary objects.
 {
   const foo = { nonexistent_key: 'bar' };
-  // $FlowExpectedError
+  // $FlowExpectedError[incompatible-type]
   const bar: Action = foo;
 }

src/api/__tests__/queueMarkAsRead-test.js

@@ -4,7 +4,7 @@ import * as messagesFlags from '../messages/messagesFlags';
 import * as eg from '../../__tests__/lib/exampleData';
 import { Lolex } from '../../__tests__/lib/lolex';
 
-// $FlowFixMe Make flow understand about mocking
+// $FlowFixMe[cannot-write] Make flow understand about mocking
 messagesFlags.default = jest.fn(() => {});
 
 describe('queueMarkAsRead', () => {

src/api/uploadFile.js

@@ -12,7 +12,7 @@ export default (auth: Auth, uri: string, name: string): Promise<ApiResponseUploa
   const formData = new FormData();
   const extension = getFileExtension(name);
   const type = getMimeTypeFromFileExtension(extension);
-  // $FlowFixMe
+  // $FlowFixMe[incompatible-call]
   formData.append('file', { uri, name, type, extension });
   return apiFile(auth, 'user_uploads', formData);
 };

src/autocomplete/PeopleAutocomplete.js

@@ -87,7 +87,11 @@ class PeopleAutocomplete extends PureComponent<Props> {
 
     return (
       <Popup>
-        {/* $FlowFixMe SectionList type is confused; should take $ReadOnly objects. */}
+        {/*
+          SectionList type is confused; should take $ReadOnly objects.
+          $FlowFixMe[incompatible-variance]
+          $FlowFixMe[prop-missing]
+        */}
         <SectionList
           keyboardShouldPersistTaps="always"
           initialNumToRender={10}

src/boot/__tests__/reducers-test.js

@@ -4,7 +4,7 @@ import { discardKeys, storeKeys, cacheKeys } from '../store';
 
 describe('reducers', () => {
   test('reducers return the default states on unknown action', () => {
-    // $FlowFixMe bogus action object
+    // $FlowFixMe[incompatible-call] bogus action object
     expect(() => reducers({}, { type: 'UNKNOWN_ACTION' })).not.toThrow();
   });
 

src/boot/store.js

@@ -92,7 +92,8 @@ export const cacheKeys: Array<$Keys<GlobalState>> = [
 function dropCache(state: GlobalState): $Shape<GlobalState> {
   const result: $Shape<GlobalState> = {};
   storeKeys.forEach(key => {
-    // $FlowFixMe This is well-typed only because it's the same `key` twice.
+    // This is well-typed only because it's the same `key` twice.
+    // $FlowFixMe[incompatible-type]
     result[key] = state[key];
   });
   return result;
@@ -170,7 +171,7 @@ const migrations: { [string]: (GlobalState) => GlobalState } = {
     accounts: state.accounts.map(a => ({
       ...a,
       // `a.realm` is a string until migration 15
-      // $FlowMigrationFudge
+      // $FlowFixMe[prop-missing]
       realm: a.realm.replace(/\/+$/, ''),
     })),
   }),
@@ -207,7 +208,8 @@ const migrations: { [string]: (GlobalState) => GlobalState } = {
     ...state,
     accounts: state.accounts.map(a => ({
       ...a,
-      // $FlowMigrationFudge - `a.realm` will be a string here
+      // `a.realm` will be a string here
+      // $FlowMigrationFudge[incompatible-call]
       realm: new URL(a.realm),
     })),
   }),
@@ -343,7 +345,8 @@ const reduxPersistConfig: Config = {
 
   // Store data through our own wrapper for AsyncStorage, in particular
   // to get compression.
-  // $FlowFixMe: https://github.com/rt2zz/redux-persist/issues/823
+  // https://github.com/rt2zz/redux-persist/issues/823
+  // $FlowFixMe[incompatible-variance]
   storage: ZulipAsyncStorage,
   serialize: stringify,
   deserialize: parse,

src/chat/flagsReducer.js

@@ -35,7 +35,7 @@ const addFlagsForMessages = (
     return state;
   }
 
-  // $FlowFixMe - #4252
+  // $FlowFixMe[incompatible-exact] - #4252
   const newState: FlagsState = {};
 
   flags.forEach(flag => {
@@ -65,7 +65,7 @@ const removeFlagForMessages = (state: FlagsState, messages: number[], flag: stri
 
 const processFlagsForMessages = (state: FlagsState, messages: Message[]): FlagsState => {
   let stateChanged = false;
-  // $FlowFixMe - #4252
+  // $FlowFixMe[incompatible-exact] - #4252
   const newState: FlagsState = {};
   messages.forEach(msg => {
     (msg.flags || []).forEach(flag => {
@@ -79,7 +79,8 @@ const processFlagsForMessages = (state: FlagsState, messages: Message[]): FlagsS
     });
   });
 
-  // $FlowFixMe: Flow can't follow this objects-as-maps logic.
+  // Flow can't follow this objects-as-maps logic.
+  // $FlowFixMe[incompatible-indexer]
   return stateChanged ? deeperMerge(state, newState) : state;
 };
 

src/compose/ComposeBox.js

@@ -449,7 +449,10 @@ class ComposeBox extends PureComponent<Props, State> {
 
     return (
       <View style={this.styles.wrapper}>
-        {/* $FlowFixMe - `MentionWarnings` should use a type-checked `connect` */}
+        {/*
+          `MentionWarnings` should use a type-checked `connect`
+          $FlowFixMe[incompatible-use]
+        */}
         <MentionWarnings narrow={narrow} stream={stream} ref={this.mentionWarnings} />
         <View style={[this.styles.autocompleteWrapper, { marginBottom: height }]}>
           <TopicAutocomplete

src/compose/ComposeMenu.js

@@ -83,7 +83,8 @@ class ComposeMenu extends PureComponent<Props> {
       return;
     }
 
-    // $FlowFixMe sketchy falsiness check, because upstream API is unclear
+    // Upstream API is unclear.
+    // $FlowFixMe[sketchy-null-bool]
     const error: string | null = response.error || null;
     if (error !== null) {
       showErrorAlert('Error', error);

src/compose/MentionWarnings.js

@@ -173,7 +173,7 @@ class MentionWarnings extends PureComponent<Props, State> {
   }
 }
 
-// $FlowFixMe. TODO: Use a type checked connect call.
+// $FlowFixMe[missing-annot]. TODO: Use a type checked connect call.
 export default connect(
   state => ({
     auth: getAuth(state),

src/emoji/Emoji.js

@@ -9,8 +9,9 @@ import { connect } from '../react-redux';
 import { getAllImageEmojiByCode } from './emojiSelectors';
 import { codeToEmojiMap } from './data';
 
-/* $FlowFixMe: `createIconSet` is mistyped upstream; elements of
-  `glyphMap` may be either `number` or `string`. */
+/* $FlowFixMe[incompatible-call]: `createIconSet` is mistyped
+  upstream; elements of `glyphMap` may be either `number` or `string`.
+  */
 const UnicodeEmoji = createIconSet(codeToEmojiMap);
 
 type SelectorProps = {|

src/events/doEventActionSideEffects.js

@@ -29,7 +29,7 @@ const messageEvent = (state: GlobalState, message: Message): void => {
 
   const activeAccount = getActiveAccount(state);
   // Assume (unchecked) that `narrow` is `Narrow` if present
-  // $FlowFixMe
+  // $FlowFixMe[cannot-resolve-name]
   const narrow: Narrow | void = getChatScreenParams().narrow;
   const isUserInSameNarrow =
     activeAccount

src/message/__tests__/messageActions-test.js

@@ -17,7 +17,7 @@ const streamNarrowObj = streamNarrow('some stream');
 describe('messageActions', () => {
   describe('doNarrow', () => {
     test('action to push to nav dispatched', () => {
-      // $FlowFixMe - Flow says `dispatch` is not writeable
+      // $FlowFixMe[cannot-write]
       NavigationService.dispatch = jest.fn();
 
       const store = mockStore<GlobalState, Action>(

src/message/__tests__/messagesReducer-test.js

@@ -113,7 +113,7 @@ describe('messagesReducer', () => {
           submessages: [
             // We know message2 has `submessages`; we defined it that
             // way.
-            // $FlowFixMe
+            // $FlowFixMe[incompatible-cast]
             ...(message2.submessages: $ReadOnlyArray<Submessage>),
             {
               id: 2,

src/notification/__tests__/notification-test.js

@@ -16,7 +16,7 @@ describe('getNarrowFromNotificationData', () => {
   const ownUserId = eg.selfUser.user_id;
 
   test('unknown notification data returns null', () => {
-    // $FlowFixMe: actually validate APNs messages
+    // $FlowFixMe[incompatible-type]: actually validate APNs messages
     const notification: Notification = {};
     const narrow = getNarrowFromNotificationData(notification, DEFAULT_MAP, new Map(), ownUserId);
     expect(narrow).toBe(null);

src/notification/index.js

@@ -223,7 +223,8 @@ export class NotificationListener {
     // Otherwise, a device token should be some (platform-dependent and largely
     // unspecified) flavor of string.
     if (deviceToken !== null && typeof deviceToken !== 'string') {
-      // $FlowFixMe: deviceToken probably _is_ JSONable, but we can only hope
+      // deviceToken probably _is_ JSONable, but we can only hope
+      // $FlowFixMe[incompatible-type]
       const token: JSONable = deviceToken;
       logging.error('Received invalid device token', { token });
       // Take no further action.

src/pm-conversations/pmConversationsSelectors.js

@@ -21,10 +21,10 @@ function unreadCount(unreadsKey, unreadPms, unreadHuddles): number {
   // of messy.  Fortunately it always works, because the key spaces
   // are disjoint: all `unreadHuddles` keys contain a comma, and all
   // `unreadPms` keys don't.
-  /* $FlowFixMe: The keys of unreadPms are logically numbers... but because
-       it's an object, they end up converted to strings, so this access with
-       string keys works.  We should probably use a Map for this and similar
-       maps. */
+  /* $FlowFixMe[incompatible-type]: The keys of unreadPms are
+       logically numbers... but because it's an object, they end up
+       converted to strings, so this access with string keys works.
+       We should probably use a Map for this and similar maps. */
   return unreadPms[unreadsKey] || unreadHuddles[unreadsKey];
 }
 

src/redux-persist-migrate/index.js

@@ -75,7 +75,8 @@ export function createMigrationImpl(
       throw new Error('createMigration: bad arguments');
     }
     if (action.type === REHYDRATE) {
-      // $FlowMigrationFudge this really is a lie -- and kind of central to migration
+      // this really is a lie -- and kind of central to migration
+      // $FlowMigrationFudge[incompatible-type]
       const incomingState: State = action.payload;
       const incomingVersion = parseInt(versionSelector(incomingState), 10);
       if (Number.isNaN(incomingVersion)) {

src/unread/UnreadCards.js

@@ -46,7 +46,9 @@ class UnreadCards extends PureComponent<Props> {
     }
 
     return (
-      // $FlowFixMe SectionList libdef seems confused; should take $ReadOnly objects.
+      // SectionList libdef seems confused; should take $ReadOnly
+      // objects.
+      // $FlowFixMe[prop-missing]
       <SectionList
         stickySectionHeadersEnabled
         initialNumToRender={20}

src/users/UserList.js

@@ -59,7 +59,7 @@ export default class UserList extends PureComponent<Props> {
         )}
         renderSectionHeader={({ section }) =>
           section.data.length === 0 ? null : (
-            // $FlowFixMe
+            // $FlowFixMe[incompatible-type]
             <SectionHeader text={section.key} />
           )
         }

src/utils/__tests__/internalLinks-test.js

@@ -158,7 +158,8 @@ describe('isInternalLink', () => {
     ],
   ];
 
-  // $FlowFixMe realm_ is URL | void, but complains of out-of-bounds access
+  // realm_ is URL | void, but complains of out-of-bounds access
+  // $FlowFixMe[invalid-tuple-index]
   for (const [expected, description, url, realm_] of cases) {
     test(`${expected ? 'accept' : 'reject'} ${description}: ${url}`, () => {
       expect(isInternalLink(url, realm_ ?? realm)).toBe(expected);

src/utils/avatar.js

@@ -195,7 +195,8 @@ export class GravatarURL extends AvatarURL {
     }
 
     // Make a new URL to mutate
-    // $FlowFixMe - https://github.com/zulip/zulip-mobile/pull/4230#discussion_r512351202
+    // https://github.com/zulip/zulip-mobile/pull/4230#discussion_r512351202
+    // $FlowFixMe[incompatible-call]
     const result: URL = new URL(this._standardUrl);
     result.searchParams.set('s', sizePhysicalPx.toString());
     return result;
@@ -383,7 +384,8 @@ export class UploadedAvatarURL extends AvatarURL {
     let result: URL = this._standardUrl;
     if (sizePhysicalPx > 100) {
       // Make a new URL to mutate, instead of mutating this._standardUrl
-      // $FlowFixMe - https://github.com/zulip/zulip-mobile/pull/4230#discussion_r512351202
+      // https://github.com/zulip/zulip-mobile/pull/4230#discussion_r512351202
+      // $FlowFixMe[incompatible-call]
       result = new URL(this._standardUrl);
 
       const match = new RegExp(/(\w+)\.png/g).exec(result.pathname);

src/webview/MessageList.js

@@ -195,7 +195,8 @@ class MessageList extends Component<Props> {
 
   sendInboundEvents = (uevents: WebViewInboundEvent[]): void => {
     if (this.webview && uevents.length > 0) {
-      // $FlowFixMe This `postMessage` is undocumented; tracking as #3572.
+      // This `postMessage` is undocumented; tracking as #3572.
+      // $FlowFixMe[prop-missing]
       const secretWebView: { postMessage: (string, string) => void } = this.webview;
       secretWebView.postMessage(base64Utf8Encode(JSON.stringify(uevents)), '*');
     }

src/webview/html/template.js

@@ -14,7 +14,7 @@ import escape from 'lodash.escape';
  *   template`Hello $\!${&<world}` -> 'Hello $!&amp;&lt;world'
  */
 export default (strings: string[], ...values: Array<string | number>) => {
-  // $FlowFixMe github.com/facebook/flow/issues/2616
+  // $FlowFixMe[prop-missing] github.com/facebook/flow/issues/2616
   const raw: string[] = strings.raw; // eslint-disable-line prefer-destructuring
   const result = [];
   values.forEach((value, i) => {

src/webview/js/js.js

@@ -55,7 +55,7 @@ declare var platformOS: string;
    Leaves out some of the fancy features (see MDN). */
 type ArrayLike<T> = { [indexer: number]: T, length: number, ... };
 if (!Array.from) {
-  // $FlowFixMe (polyfill)
+  // $FlowFixMe[cannot-write] (polyfill)
   Array.from = function from<T>(arr: ArrayLike<T>): Array<T> {
     return Array.prototype.slice.call(arr);
   };
@@ -69,7 +69,8 @@ if (!Array.from) {
  * Uses Element#matches, which we have a separate polyfill for.
  */
 if (!Element.prototype.closest) {
-  // $FlowFixMe closest is not writable... except it's absent here.
+  // closest is not writable... except it's absent here.
+  // $FlowFixMe[cannot-write]
   Element.prototype.closest = function closest(selector) {
     let element = this;
     while (element && !element.matches(selector)) {
@@ -82,7 +83,7 @@ if (!Element.prototype.closest) {
 /* Polyfill String#startsWith. Native in Mobile Safari 9, Chrome 49.
    Taken (with minor edits) from the relevant MDN page. */
 if (!String.prototype.startsWith) {
-  // $FlowFixMe (polyfill)
+  // $FlowFixMe[cannot-write] (polyfill)
   String.prototype.startsWith = function startsWith(search: string, rawPos: number) {
     const pos = rawPos > 0 ? rawPos | 0 : 0;
     return this.substring(pos, pos + search.length) === search;
@@ -93,7 +94,7 @@ if (!String.prototype.startsWith) {
    Based directly on the current ECMAScript draft:
      https://tc39.es/ecma262/#sec-string.prototype.includes */
 if (!String.prototype.includes) {
-  // $FlowFixMe (polyfill)
+  // $FlowFixMe[cannot-write] (polyfill)
   String.prototype.includes = function includes(search: string, start: number = 0) {
     /* required by the spec, but not worth the trouble */
     // if (search instanceof RegExp) { throw new TypeError('...'); }
@@ -275,7 +276,7 @@ function walkToMessage(
 ): ?Element {
   let element: ?Element = start;
   while (element && !element.classList.contains('message')) {
-    // $FlowFixMe: doesn't use finite type of `step`
+    // $FlowFixMe[prop-missing]: doesn't use finite type of `step`
     element = element[step];
   }
   return element;
@@ -346,7 +347,7 @@ function visibleMessageIds(): { first: number, last: number } {
         first = Math.min(first, id);
         last = Math.max(last, id);
       }
-      // $FlowFixMe: doesn't use finite type of `step`
+      // $FlowFixMe[prop-missing]: doesn't use finite type of `step`
       element = element[step];
     }
   }
@@ -668,7 +669,7 @@ const handleMessageEvent: MessageEventListener = e => {
 
   inboundEvents.forEach((uevent: WebViewInboundEvent) => {
     eventLogger.maybeCaptureInboundEvent(uevent);
-    // $FlowFixMe
+    // $FlowFixMe[prop-missing]
     inboundEventHandlers[uevent.type](uevent);
   });
   scrollEventsDisabled = false;