Merge pull request #105 from skellock/double-quotes

🎨 Switches to double-quotes

Author: skellock

.prettierrc

@@ -1,10 +1,5 @@
 {
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
   "printWidth": 100,
   "semi": false,
-  "singleQuote": false,
-  "tabWidth": 2,
-  "trailingComma": "es5",
-  "useTabs": false
+  "trailingComma": "es5"
 }

fuse.ts

@@ -1,29 +1,29 @@
-import { FuseBox, CSSPlugin, Sparky, CopyPlugin } from 'fuse-box'
-import { spawn } from 'child_process'
+import { FuseBox, CSSPlugin, Sparky, CopyPlugin } from "fuse-box"
+import { spawn } from "child_process"
 
 const DEV_PORT = 4445
-const OUTPUT_DIR = 'out'
-const ASSETS = ['*.jpg', '*.png', '*.jpeg', '*.gif', '*.svg']
+const OUTPUT_DIR = "out"
+const ASSETS = ["*.jpg", "*.png", "*.jpeg", "*.gif", "*.svg"]
 
 // are we running in production mode?
-const isProduction = process.env.NODE_ENV === 'production'
+const isProduction = process.env.NODE_ENV === "production"
 
 // copy the renderer's html file into the right place
-Sparky.task('copy-html', () => {
-  return Sparky.src('src/renderer/index.html').dest(`${OUTPUT_DIR}/$name`)
+Sparky.task("copy-html", () => {
+  return Sparky.src("src/renderer/index.html").dest(`${OUTPUT_DIR}/$name`)
 })
 
 // the default task
-Sparky.task('default', ['copy-html'], () => {
+Sparky.task("default", ["copy-html"], () => {
   // setup the producer with common settings
   const fuse = FuseBox.init({
-    homeDir: 'src',
+    homeDir: "src",
     output: `${OUTPUT_DIR}/$name.js`,
-    target: 'electron',
+    target: "electron",
     log: isProduction,
     cache: !isProduction,
     sourceMaps: true,
-    tsConfig: 'tsconfig.json',
+    tsConfig: "tsconfig.json",
   })
 
   // start the hot reload server
@@ -32,7 +32,7 @@ Sparky.task('default', ['copy-html'], () => {
   }
 
   // bundle the electron main code
-  const mainBundle = fuse.bundle('main').instructions('> [main/main.ts]')
+  const mainBundle = fuse.bundle("main").instructions("> [main/main.ts]")
 
   // and watch unless we're bundling for production
   if (!isProduction) {
@@ -41,10 +41,10 @@ Sparky.task('default', ['copy-html'], () => {
 
   // bundle the electron renderer code
   const rendererBundle = fuse
-    .bundle('renderer')
-    .instructions('> [renderer/index.tsx] +fuse-box-css')
+    .bundle("renderer")
+    .instructions("> [renderer/index.tsx] +fuse-box-css")
     .plugin(CSSPlugin())
-    .plugin(CopyPlugin({ useDefault: false, files: ASSETS, dest: 'assets', resolve: 'assets/' }))
+    .plugin(CopyPlugin({ useDefault: false, files: ASSETS, dest: "assets", resolve: "assets/" }))
 
   // and watch & hot reload unless we're bundling for production
   if (!isProduction) {
@@ -56,7 +56,7 @@ Sparky.task('default', ['copy-html'], () => {
   return fuse.run().then(() => {
     if (!isProduction) {
       // startup electron
-      spawn('node', [`${__dirname}/node_modules/electron/cli.js`, __dirname], { stdio: 'inherit' })
+      spawn("node", [`${__dirname}/node_modules/electron/cli.js`, __dirname], { stdio: "inherit" })
     }
   })
 })

package.json

@@ -45,13 +45,13 @@
   },
   "scripts": {
     "build-storybook": "build-storybook",
-    "typecheck": "tsc -p . --noEmit --pretty",
     "clean": "rm -rf .fusebox out dist coverage",
     "compile": "NODE_ENV=production ts-node fuse",
     "coverage:upload": "cat ./coverage/lcov.info | coveralls",
     "coverage": "yarn test --coverage --no-cache",
     "dist": "electron-builder --mac --win --linux --ia32 --x64",
     "draft": "electron-builder -p always --draft --mac --win --linux --ia32 --x64",
+    "format": "prettier --write **/*.ts && tslint -p . --fix",
     "lint": "tslint --project .",
     "pack": "electron-builder --dir",
     "postinstall": "electron-builder install-app-deps",
@@ -60,7 +60,8 @@
     "sanity": "npm-run-all clean typecheck lint test clean compile clean",
     "start": "ts-node fuse",
     "storybook": "start-storybook -p 6006",
-    "test": "jest"
+    "test": "jest",
+    "typecheck": "tsc -p . --noEmit --pretty"
   },
   "dependencies": {
     "electron-is-dev": "^0.3.0",

src/main/database/database.fixtures.ts

@@ -1,19 +1,19 @@
-import { GithubRepo } from '../../shared/models/github-repo'
-import { Database } from './database'
+import { GithubRepo } from "../../shared/models/github-repo"
+import { Database } from "./database"
 
 /**
  * Creates a valid repo for use in tests.
  */
 export function createRepo() {
   const repo: GithubRepo = {
-    name: 'typescript-with-electron-react-kit',
-    fullName: 'skellock/typescript-with-electron-react-kit',
+    name: "typescript-with-electron-react-kit",
+    fullName: "skellock/typescript-with-electron-react-kit",
     private: false,
   }
   return repo
 }
 
-const directory = './tmp'
+const directory = "./tmp"
 
 /**
  * Creates a sample database.

src/main/database/database.test.ts

@@ -1,24 +1,24 @@
-import { createDb, createRepo } from './database.fixtures'
+import { createDb, createRepo } from "./database.fixtures"
 
-test('can load', async () => {
+test("can load", async () => {
   const db = createDb()
-  const repo = await db.load('skellock/typescript-with-electron-react-kit')
+  const repo = await db.load("skellock/typescript-with-electron-react-kit")
 
-  expect(repo.name).toBe('typescript-with-electron-react-kit')
-  expect(repo.fullName).toBe('skellock/typescript-with-electron-react-kit')
+  expect(repo.name).toBe("typescript-with-electron-react-kit")
+  expect(repo.fullName).toBe("skellock/typescript-with-electron-react-kit")
 })
 
-test('can save', async () => {
+test("can save", async () => {
   const db = createDb()
   const repo = createRepo()
   const result = await db.save(repo)
   expect(result).toBe(true)
 })
 
-test('fails to save', async () => {
+test("fails to save", async () => {
   const db = createDb()
   const repo = createRepo()
-  repo.fullName = 'crap'
+  repo.fullName = "crap"
   const result = await db.save(repo)
   expect(result).toBe(false)
 })

src/main/database/database.ts

@@ -1,5 +1,5 @@
 // this example is here only to show how some testing could work.
-import { GithubRepo } from '../../shared/models/github-repo'
+import { GithubRepo } from "../../shared/models/github-repo"
 
 interface DatabaseOptions {
   readonly directory: string
@@ -22,7 +22,7 @@ export class Database {
     return new Promise(resolve =>
       setTimeout(() => {
         const repo: GithubRepo = {
-          name: fullName.split('/')[1],
+          name: fullName.split("/")[1],
           fullName,
           private: false,
         }
@@ -33,10 +33,10 @@ export class Database {
 
   /**
    * Saves something to the database.
-   * 
+   *
    * @param repo The thing to save.
    */
   save(repo: GithubRepo): Promise<boolean> {
-    return new Promise(resolve => setTimeout(() => resolve(repo.fullName !== 'crap'), 10))
+    return new Promise(resolve => setTimeout(() => resolve(repo.fullName !== "crap"), 10))
   }
 }

src/main/main-window/load-url.test.ts

@@ -1,13 +1,13 @@
-import { loadURL } from './load-url'
+import { loadURL } from "./load-url"
 
-test('loads from storybook', () => {
+test("loads from storybook", () => {
   const loadStub = jest.fn()
-  loadURL({ loadURL: loadStub } as any, 'a', true)
-  expect(loadStub).toBeCalledWith('http://localhost:6006')
+  loadURL({ loadURL: loadStub } as any, "a", true)
+  expect(loadStub).toBeCalledWith("http://localhost:6006")
 })
 
-test('loads from electron', () => {
+test("loads from electron", () => {
   const loadStub = jest.fn()
-  loadURL({ loadURL: loadStub } as any, 'a', false)
-  expect(loadStub).toBeCalledWith('file:///a/out/index.html')
+  loadURL({ loadURL: loadStub } as any, "a", false)
+  expect(loadStub).toBeCalledWith("file:///a/out/index.html")
 })

src/main/main-window/load-url.ts

@@ -1,18 +1,18 @@
-import { join } from 'path'
-import { format } from 'url'
+import { join } from "path"
+import { format } from "url"
 
 export function loadURL(
   window: Electron.BrowserWindow,
   appPath: string,
   showStorybook: boolean = false,
 ) {
   if (showStorybook) {
-    window.loadURL('http://localhost:6006')
+    window.loadURL("http://localhost:6006")
   } else {
     window.loadURL(
       format({
-        pathname: join(appPath, 'out/index.html'),
-        protocol: 'file:',
+        pathname: join(appPath, "out/index.html"),
+        protocol: "file:",
         slashes: true,
       }),
     )

src/main/main-window/main-window.test.ts

@@ -1,39 +1,39 @@
-import { createMainWindow } from './main-window'
+import { createMainWindow } from "./main-window"
 // @ts-ignore
-import * as containDeep from 'jest-expect-contain-deep'
-import { BrowserWindow } from 'electron'
-const WindowStateManager = require('electron-window-state-manager')
+import * as containDeep from "jest-expect-contain-deep"
+import { BrowserWindow } from "electron"
+const WindowStateManager = require("electron-window-state-manager")
 
-it('can read window state', () => {
+it("can read window state", () => {
   WindowStateManager.mockImplementation(() => ({ width: 10, height: 40 }))
   createMainWindow(__dirname)
   expect(BrowserWindow).toBeCalledWith(containDeep({ width: 10, height: 40 }))
 })
 
-it('might maximize on startup', () => {
+it("might maximize on startup", () => {
   WindowStateManager.mockImplementation(() => ({ maximized: true }))
   const window = createMainWindow(__dirname)
   expect(window.maximize).toBeCalled()
 })
 
-it('might not maximize on startup', () => {
+it("might not maximize on startup", () => {
   WindowStateManager.mockImplementation(() => ({ maximized: false }))
   expect(createMainWindow(__dirname).maximize).not.toBeCalled()
 })
 
-test('saves window state', () => {
+test("saves window state", () => {
   let saveState = jest.fn()
   WindowStateManager.mockImplementation(() => ({ saveState: saveState }))
   const window: BrowserWindow = createMainWindow(__dirname)
-  window.emit('close')
-  window.emit('move')
-  window.emit('resize')
+  window.emit("close")
+  window.emit("move")
+  window.emit("resize")
   expect(saveState).toHaveBeenCalledTimes(3)
 })
 
-test('show the window after we finish loading + delay', async () => {
+test("show the window after we finish loading + delay", async () => {
   const window: BrowserWindow = createMainWindow(__dirname, 1)
-  window.webContents.emit('did-finish-load')
+  window.webContents.emit("did-finish-load")
   const delay = (ms: number) => new Promise(resolve => setTimeout(resolve, ms))
   await delay(2)
   expect(window.show).toHaveBeenCalled()

src/main/main-window/main-window.ts

@@ -1,6 +1,6 @@
-const { app, BrowserWindow } = require('electron')
-const WindowStateManager = require('electron-window-state-manager')
-import { loadURL } from './load-url'
+const { app, BrowserWindow } = require("electron")
+const WindowStateManager = require("electron-window-state-manager")
+import { loadURL } from "./load-url"
 
 // default dimensions
 export const DIMENSIONS = { width: 600, height: 500, minWidth: 450, minHeight: 450 }
@@ -14,7 +14,7 @@ export const DIMENSIONS = { width: 600, height: 500, minWidth: 450, minHeight: 4
  */
 export function createMainWindow(appPath: string, showDelay: number = 100) {
   // persistent window state manager
-  const windowState = new WindowStateManager('main', {
+  const windowState = new WindowStateManager("main", {
     defaultWidth: DIMENSIONS.width,
     defaultHeight: DIMENSIONS.height,
   })
@@ -29,10 +29,10 @@ export function createMainWindow(appPath: string, showDelay: number = 100) {
     y: windowState.y,
     show: false,
     useContentSize: true,
-    titleBarStyle: 'hidden-inset',
+    titleBarStyle: "hidden-inset",
     autoHideMenuBar: true,
     // backgroundColor: '#fff',
-    vibrancy: 'light',
+    vibrancy: "light",
     transparent: true,
     title: app.getName(),
     webPreferences: {
@@ -47,15 +47,15 @@ export function createMainWindow(appPath: string, showDelay: number = 100) {
   }
 
   // trap movement events
-  window.on('close', () => windowState.saveState(window))
-  window.on('move', () => windowState.saveState(window))
-  window.on('resize', () => windowState.saveState(window))
+  window.on("close", () => windowState.saveState(window))
+  window.on("move", () => windowState.saveState(window))
+  window.on("resize", () => windowState.saveState(window))
 
   // load entry html page in the renderer.
   loadURL(window, appPath)
 
   // only appear once we've loaded
-  window.webContents.on('did-finish-load', () => {
+  window.webContents.on("did-finish-load", () => {
     setTimeout(() => {
       window.show()
       window.focus()