Typescriptify the main process code (13/N)

Summary: Converted src/utils/icons.js to typescript

Reviewed By: passy

Differential Revision: D20076060

fbshipit-source-id: fa6309033f5de7183de7f85ac8318eec36b6bb69

scripts/build-release.ts

@@ -21,11 +21,7 @@ import {
   genMercurialRevision,
 } from './build-utils';
 import fetch from 'node-fetch';
-const {
+import {ICONS, buildLocalIconPath, getIconURL} from '../src/utils/icons';
-  ICONS,
-  buildLocalIconPath,
-  getIconURL,
-} = require('../src/utils/icons.js');
 
 function generateManifest(versionNumber: string) {
   const filePath = path.join(__dirname, '..', 'dist');
@@ -129,12 +125,16 @@ function copyStaticFolder(buildFolder: string) {
 }
 
 function downloadIcons(buildFolder: string) {
-  const iconURLs = Object.entries(ICONS).reduce((acc, [name, sizes]) => {
+  const iconURLs = Object.entries(ICONS).reduce<
+    {
+      name: string;
+      size: number;
+      density: number;
+    }[]
+  >((acc, [name, sizes]) => {
     acc.push(
       // get icons in @1x and @2x
-      // @ts-ignore
       ...sizes.map(size => ({name, size, density: 1})),
-      // @ts-ignore
       ...sizes.map(size => ({name, size, density: 2})),
     );
     return acc;

src/ui/components/Glyph.tsx

@@ -10,7 +10,7 @@
 import React from 'react';
 import styled from '@emotion/styled';
 import PropTypes from 'prop-types';
-import {getIconURL} from '../../utils/icons.js';
+import {getIconURL} from '../../utils/icons';
 
 export type IconSize = 8 | 10 | 12 | 16 | 18 | 20 | 24 | 32;
 

src/utils/icons.ts

@@ -7,13 +7,12 @@
  * @format
  */
 
-/* eslint-disable import/no-commonjs */
+import fs from 'fs';
+import path from 'path';
+import {remote} from 'electron';
 
 const AVAILABLE_SIZES = [8, 10, 12, 16, 18, 20, 24, 32];
 const DENSITIES = [1, 1.5, 2, 3, 4];
-const fs = require('fs');
-const path = require('path');
-const {remote} = require('electron');
 
 const staticPath = path.resolve(__dirname, '..', '..', 'static');
 const appPath = remote ? remote.app.getAppPath() : staticPath;
@@ -21,34 +20,50 @@ const iconsPath = fs.existsSync(path.resolve(appPath, 'icons.json'))
   ? path.resolve(appPath, 'icons.json')
   : path.resolve(staticPath, 'icons.json');
 
-const ICONS = JSON.parse(fs.readFileSync(iconsPath, {encoding: 'utf8'}));
+export type Icons = {
+  [key: string]: number[];
+};
+
+export const ICONS: Icons = JSON.parse(
+  fs.readFileSync(iconsPath, {encoding: 'utf8'}),
+);
 
 // Takes a string like 'star', or 'star-outline', and converts it to
 // {trimmedName: 'star', variant: 'filled'} or {trimmedName: 'star', variant: 'outline'}
-function getIconPartsFromName(icon) {
+function getIconPartsFromName(
+  icon: string,
+): {trimmedName: string; variant: 'outline' | 'filled'} {
   const isOutlineVersion = icon.endsWith('-outline');
   const trimmedName = isOutlineVersion ? icon.replace('-outline', '') : icon;
   const variant = isOutlineVersion ? 'outline' : 'filled';
   return {trimmedName: trimmedName, variant: variant};
 }
 
-function getIconFileName(icon, size, density) {
+function getIconFileName(
+  icon: {trimmedName: string; variant: 'outline' | 'filled'},
+  size: number,
+  density: number,
+) {
   return `${icon.trimmedName}-${icon.variant}-${size}@${density}x.png`;
 }
 
 // $FlowFixMe not using flow in this file
-function buildLocalIconPath(name, size, density) {
+export function buildLocalIconPath(
+  name: string,
+  size: number,
+  density: number,
+) {
   const icon = getIconPartsFromName(name);
   return path.join('icons', getIconFileName(icon, size, density));
 }
 
-function buildLocalIconURL(name, size, density) {
+export function buildLocalIconURL(name: string, size: number, density: number) {
   const icon = getIconPartsFromName(name);
   return `icons/${getIconFileName(icon, size, density)}`;
 }
 
 // $FlowFixMe not using flow in this file
-function buildIconURL(name, size, density) {
+export function buildIconURL(name: string, size: number, density: number) {
   const icon = getIconPartsFromName(name);
   // eslint-disable-next-line prettier/prettier
   const url = `https://external.xx.fbcdn.net/assets/?name=${
@@ -104,14 +119,8 @@ function buildIconURL(name, size, density) {
   return url;
 }
 
-module.exports = {
+// $FlowFixMe: not using flow in this file
-  ICONS: ICONS,
+export function getIconURL(name: string, size: number, density: number) {
-
-  buildLocalIconPath: buildLocalIconPath,
-  buildIconURL: buildIconURL,
-
-  // $FlowFixMe: not using flow in this file
-  getIconURL(name, size, density) {
   if (name.indexOf('/') > -1) {
     return name;
   }
@@ -158,5 +167,4 @@ module.exports = {
     return buildLocalIconURL(name, size, density);
   }
   return buildIconURL(name, requestedSize, density);
-  },
+}
-};