Types: Add random types to various files (#1933)

Automattic · Feb 26, 2020 · 1e7c3c3 · 1e7c3c3
1 parent 5ea0e8a
commit 1e7c3c3
Show file tree

Hide file tree

Showing 13 changed files with 185 additions and 131 deletions.
diff --git a/lib/analytics/index.ts b/lib/analytics/index.ts
@@ -4,18 +4,10 @@ const debug = require('debug')('analytics');
  * Internal dependencies
  */
 import './tracks';
-import { TKQItem } from './tracks';
 let user: string;
 
 import * as T from '../types';
 
-declare global {
-  interface Window {
-    analyticsEnabled: boolean;
-    _tkq: TKQItem[];
-  }
-}
-
 declare const config: { version: string };
 
 const analytics = {

diff --git a/lib/analytics/tracks.ts b/lib/analytics/tracks.ts
@@ -1,28 +1,8 @@
 import * as T from '../types';
-
-declare global {
-  interface Window {
-    wpcom: {
-      _tkq: TKQItem[];
-      tracks: TracksAPI;
-    };
-  }
-}
+import { TKQItem, TracksAPI } from './types';
 
 declare const TRACKS_COOKIE_DOMAIN: string | undefined;
 
-export type TKQItem =
-  | Function
-  | [keyof TracksAPI, ...(string | T.JSONSerializable)[]];
-
-export type TracksAPI = {
-  storeContext: (c: object) => void;
-  identifyUser: (user: string, login: string) => void;
-  recordEvent: (name: string, props: T.JSONSerializable) => void;
-  setProperties: (properties: object) => void;
-  clearIdentity: () => void;
-};
-
 type Query = Partial<{
   _dl: string;
   _dr: string;
@@ -41,10 +21,11 @@ type Query = Partial<{
   anonId: string;
 }>;
 
-window.wpcom = window.wpcom || {};
 window._tkq = window._tkq || [];
+window.wpcom = window.wpcom || { tracks: buildTracks() };
+window.wpcom.tracks = window.wpcom.tracks || buildTracks();
 
-window.wpcom.tracks = (function() {
+function buildTracks() {
   let userId: string | null | undefined;
   let userIdType: string;
   let userLogin: string | null | undefined;
@@ -277,19 +258,16 @@ window.wpcom.tracks = (function() {
     const sx =
       window.pageXOffset !== undefined
         ? window.pageXOffset
-        : (
-            document.documentElement ||
+        : ((document.documentElement ||
             document.body.parentNode ||
-            document.body
-          ).scrollLeft;
+            document.body) as HTMLElement).scrollLeft;
+
     const sy =
       window.pageYOffset !== undefined
         ? window.pageYOffset
-        : (
-            document.documentElement ||
+        : ((document.documentElement ||
             document.body.parentNode ||
-            document.body
-          ).scrollTop;
+            document.body) as HTMLElement).scrollTop;
 
     query._sx = sx !== undefined ? sx : 0;
     query._sy = sy !== undefined ? sy : 0;
@@ -410,4 +388,4 @@ window.wpcom.tracks = (function() {
   initQueue();
 
   return API;
-})();
+}
diff --git a/lib/analytics/types.ts b/lib/analytics/types.ts
@@ -0,0 +1,13 @@
+import * as T from '../types';
+
+export type TKQItem =
+  | Function
+  | [keyof TracksAPI, ...(string | T.JSONSerializable)[]];
+
+export type TracksAPI = {
+  storeContext: (c: object) => void;
+  identifyUser: (user: string, login: string) => void;
+  recordEvent: (name: string, props: T.JSONSerializable) => void;
+  setProperties: (properties: object) => void;
+  clearIdentity: () => void;
+};
diff --git a/lib/global.d.ts b/lib/global.d.ts
@@ -1,9 +1,14 @@
-declare var __TEST__: boolean;
+import { TKQItem, TracksAPI } from './analytics/types';
 
-interface Window {
-  _tkq: Array;
-  testEvents: (string | [string, ...any[]])[];
-  wpcom: {
-    tracks: object;
-  };
+declare global {
+  const __TEST__: boolean;
+
+  interface Window {
+    analyticsEnabled: boolean;
+    testEvents: (string | [string, ...any[]])[];
+    _tkq: TKQItem[] & { a: unknown };
+    wpcom: {
+      tracks: TracksAPI;
+    };
+  }
 }
diff --git a/lib/note-info/index.tsx b/lib/note-info/index.tsx
@@ -26,6 +26,8 @@ type StateProps = {
 };
 
 type DispatchProps = {
+  onMarkdownNote: (note: T.NoteEntity, isMarkdown: boolean) => any;
+  onPinNote: (note: T.NoteEntity, shouldPinNote: boolean) => any;
   onOutsideClick: () => any;
 };
 
@@ -180,12 +182,12 @@ export class NoteInfo extends Component<Props> {
     this.props.onMarkdownNote(this.props.note, event.currentTarget.checked);
 }
 
-function formatTimestamp(unixTime) {
+function formatTimestamp(unixTime: number) {
   return format(unixTime * 1000, 'MMM d, yyyy h:mm a');
 }
 
 // https://github.com/RadLikeWhoa/Countable
-function wordCount(content) {
+function wordCount(content: string) {
   const matches = (content || '')
     .replace(/[\u200B]+/, '')
     .trim()
@@ -197,7 +199,7 @@ function wordCount(content) {
 
 // https://mathiasbynens.be/notes/javascript-unicode
 const surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
-function characterCount(content) {
+function characterCount(content: string) {
   return (
     // then get the length
     (content || '')

diff --git a/lib/tag-field/index.tsx b/lib/tag-field/index.tsx
@@ -1,6 +1,11 @@
-import React, { Component, KeyboardEventHandler } from 'react';
+import React, {
+  Component,
+  KeyboardEvent,
+  KeyboardEventHandler,
+  MouseEvent,
+  RefObject,
+} from 'react';
 import { connect } from 'react-redux';
-import PropTypes from 'prop-types';
 import { Overlay } from 'react-overlays';
 import isEmailTag from '../utils/is-email-tag';
 import { updateNoteTags } from '../state/domain/notes';
@@ -18,23 +23,42 @@ import {
   union,
 } from 'lodash';
 
+import * as S from '../state';
+import * as T from '../types';
+
+type OwnProps = {
+  allTags: T.TagName[];
+  note: T.NoteEntity;
+  storeFocusTagField: (focusSetter: () => any) => any;
+  storeHasFocus: (focusGetter: () => boolean) => any;
+  tags: T.TagName[];
+  unusedTags: T.TagName[];
+  usedTags: T.TagName[];
+};
+
+type OwnState = {
+  selectedTag: T.TagName;
+  showEmailTooltip?: boolean;
+  tagInput: string;
+};
+
+type DispatchProps = {
+  updateNoteTags: (args: { note: T.NoteEntity; tags: T.TagEntity[] }) => any;
+};
+
+type Props = OwnProps & DispatchProps;
+
 const KEY_BACKSPACE = 8;
 const KEY_TAB = 9;
 const KEY_RIGHT = 39;
 
-export class TagField extends Component {
-  static displayName = 'TagField';
+export class TagField extends Component<Props, OwnState> {
+  focusInput?: () => any;
+  hiddenTag?: RefObject<HTMLInputElement> | null;
+  inputHasFocus?: () => boolean;
+  tagInput?: RefObject<HTMLDivElement> | null;
 
-  static propTypes = {
-    allTags: PropTypes.array.isRequired,
-    note: PropTypes.object.isRequired,
-    storeFocusTagField: PropTypes.func,
-    storeHasFocus: PropTypes.func,
-    tags: PropTypes.array.isRequired,
-    unusedTags: PropTypes.arrayOf(PropTypes.string),
-    updateNoteTags: PropTypes.func.isRequired,
-    usedTags: PropTypes.arrayOf(PropTypes.string),
-  };
+  static displayName = 'TagField';
 
   static defaultProps = {
     storeFocusTagField: noop,
@@ -64,7 +88,7 @@ export class TagField extends Component {
     }
   }
 
-  addTag = tags => {
+  addTag = (tags: string) => {
     const { allTags, tags: existingTags } = this.props;
 
     const newTags = tags
@@ -90,7 +114,7 @@ export class TagField extends Component {
   hasSelection = () =>
     this.state.selectedTag && !!this.state.selectedTag.length;
 
-  deleteTag = tagName => {
+  deleteTag = (tagName: T.TagName) => {
     const { tags } = this.props;
     const { selectedTag } = this.state;
 
@@ -117,7 +141,7 @@ export class TagField extends Component {
 
   focusTagField = () => this.focusInput && this.focusInput();
 
-  interceptKeys: KeyboardEventHandler<HTMLDivElement> = e => {
+  interceptKeys: KeyboardEventHandler = e => {
     if (KEY_BACKSPACE === e.which) {
       if (this.hasSelection()) {
         this.deleteSelection();
@@ -148,7 +172,7 @@ export class TagField extends Component {
   selectLastTag = () =>
     this.setState({ selectedTag: this.props.tags.slice(-1).shift() });
 
-  selectTag = event => {
+  selectTag = (event: MouseEvent<HTMLDivElement>) => {
     const {
       target: {
         dataset: { tagName },
@@ -167,7 +191,7 @@ export class TagField extends Component {
     setTimeout(() => this.setState({ showEmailTooltip: false }), 5000);
   };
 
-  onKeyDown = e => {
+  onKeyDown = (e: KeyboardEvent) => {
     if (this.state.showEmailTooltip) {
       this.hideEmailTooltip();
     }
@@ -183,10 +207,10 @@ export class TagField extends Component {
 
   storeInputRef = r => (this.tagInput = r);
 
-  storeTagInput = (value, callback) =>
+  storeTagInput = (value: string, callback?: (...args: any) => any) =>
     this.setState({ tagInput: value }, callback);
 
-  unselect = event => {
+  unselect = (event: KeyboardEvent) => {
     if (!this.state.selectedTag) {
       return;
     }
@@ -249,4 +273,6 @@ export class TagField extends Component {
   }
 }
 
-export default connect(null, { updateNoteTags })(TagField);
+export default connect(null, { updateNoteTags } as S.MapDispatch<
+  DispatchProps
+>)(TagField);