Add Prettier, Lint Staged to help maintain repo consistency (Definite…

…lyTyped#35672)

* [Toolchain] Add Prettier

* [Toolchain] Add lint-staged

* [Toolchain] Apply prettier to some types

* Switch to using precise commits so that only changed code is ran through prettier

.editorconfig

@@ -7,3 +7,4 @@ insert_final_newline = true
 
 [{*.json,*.yml,*.ts,*.tsx,*.md}]
 indent_style = space
+

.prettierignore

@@ -0,0 +1 @@
+*.json

.prettierrc.json

@@ -0,0 +1,20 @@
+{
+    "$schema": "http://json.schemastore.org/prettierrc",
+
+    "parser": "typescript",
+    "printWidth": 120,
+    "semi": true,
+    "singleQuote": true,
+    "tabWidth": 4,
+    "trailingComma": "es5",
+
+    "overrides": [
+        {
+            "files": ["*.md"],
+            "options": {
+                "tabWidth": 2
+            }
+        }
+    ]
+}
+

package.json

@@ -23,7 +23,15 @@
     },
     "devDependencies": {
         "dtslint": "latest",
+        "husky": ">=1",
+        "precise-commits": "^1.0.2",
+        "prettier": "^1.17.1",
         "types-publisher": "github:Microsoft/types-publisher#production"
     },
-    "dependencies": {}
+    "dependencies": {},
+    "husky": {
+        "hooks": {
+            "pre-commit": "precise-commits"
+        }
+    }
 }

types/react-relay/classic.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-import * as RelayRuntimeTypes from "relay-runtime";
+import * as React from 'react';
+import * as RelayRuntimeTypes from 'relay-runtime';
 
 // ~~~~~~~~~~~~~~~~~~~~~
 // Maybe Fix
@@ -19,7 +19,7 @@ export interface RelayQuery {
 export interface FragmentResolver {
     dispose(): void;
     resolve(
-        fragment: RelayQuery["Fragment"],
+        fragment: RelayQuery['Fragment'],
         dataIDs: RelayRuntimeTypes.DataID | RelayRuntimeTypes.DataID[]
     ): StoreReaderData | StoreReaderData[] | undefined | null;
 }
@@ -29,18 +29,18 @@ export interface RelayEnvironmentInterface {
         querySet: RelayRuntimeTypes.RelayQuerySet,
         onReadyStateChange: RelayRuntimeTypes.ReadyStateChangeCallback
     ): RelayRuntimeTypes.Abortable;
-    getFragmentResolver(fragment: RelayQuery["Fragment"], onNext: () => void): FragmentResolver;
+    getFragmentResolver(fragment: RelayQuery['Fragment'], onNext: () => void): FragmentResolver;
     getStoreData(): RelayStoreData;
     primeCache(
         querySet: RelayRuntimeTypes.RelayQuerySet,
         onReadyStateChange: RelayRuntimeTypes.ReadyStateChangeCallback
     ): RelayRuntimeTypes.Abortable;
     read(
-        node: RelayQuery["Node"],
+        node: RelayQuery['Node'],
         dataID: RelayRuntimeTypes.DataID,
         options?: StoreReaderOptions
     ): StoreReaderData | void;
-    readQuery(root: RelayQuery["Root"], options?: StoreReaderOptions): StoreReaderData[] | void;
+    readQuery(root: RelayQuery['Root'], options?: StoreReaderOptions): StoreReaderData[] | void;
 }
 
 // ~~~~~~~~~~~~~~~~~~~~~
@@ -50,7 +50,7 @@ export type ClientMutationID = string;
 
 /** Fragments are a hash of functions */
 export interface Fragments {
-    [query: string]: ((variables?: RelayVariables) => string);
+    [query: string]: (variables?: RelayVariables) => string;
 }
 
 export interface CreateContainerOpts {
@@ -65,20 +65,20 @@ export interface RelayVariables {
 
 /** add static getFragment method to the component constructor */
 export interface RelayContainerClass<T> extends React.ComponentClass<T> {
-    getFragment: ((q: string, v?: RelayVariables) => string);
+    getFragment: (q: string, v?: RelayVariables) => string;
 }
 
 export interface RelayQueryRequestResolve {
     response: any;
 }
 
 export type RelayMutationStatus =
-    | "UNCOMMITTED" // Transaction hasn't yet been sent to the server. Transaction can be committed or rolled back.
-    | "COMMIT_QUEUED" // Transaction was committed but another transaction with the same collision key is pending, so the transaction has been queued to send to the server.
-    | "COLLISION_COMMIT_FAILED" // Transaction was queued for commit but another transaction with the same collision key failed. All transactions in the collision queue,
+    | 'UNCOMMITTED' // Transaction hasn't yet been sent to the server. Transaction can be committed or rolled back.
+    | 'COMMIT_QUEUED' // Transaction was committed but another transaction with the same collision key is pending, so the transaction has been queued to send to the server.
+    | 'COLLISION_COMMIT_FAILED' // Transaction was queued for commit but another transaction with the same collision key failed. All transactions in the collision queue,
     // including this one, have been failed. Transaction can be recommitted or rolled back.
-    | "COMMITTING" // Transaction is waiting for the server to respond.
-    | "COMMIT_FAILED";
+    | 'COMMITTING' // Transaction is waiting for the server to respond.
+    | 'COMMIT_FAILED';
 
 export class RelayMutationTransaction {
     applyOptimistic(): RelayMutationTransaction;
@@ -187,27 +187,25 @@ export interface RenderStateConfig {
 export type RenderCallback = (renderState: RenderStateConfig) => any;
 
 export type ReadyStateEvent =
-    | "ABORT"
-    | "CACHE_RESTORED_REQUIRED"
-    | "CACHE_RESTORE_FAILED"
-    | "CACHE_RESTORE_START"
-    | "NETWORK_QUERY_ERROR"
-    | "NETWORK_QUERY_RECEIVED_ALL"
-    | "NETWORK_QUERY_RECEIVED_REQUIRED"
-    | "NETWORK_QUERY_START"
-    | "STORE_FOUND_ALL"
-    | "STORE_FOUND_REQUIRED";
-
-export type OnReadyStateChange = (
-    readyState: {
-        ready: boolean;
-        done: boolean;
-        stale: boolean;
-        error?: Error;
-        events: ReadyStateEvent[];
-        aborted: boolean;
-    }
-) => void;
+    | 'ABORT'
+    | 'CACHE_RESTORED_REQUIRED'
+    | 'CACHE_RESTORE_FAILED'
+    | 'CACHE_RESTORE_START'
+    | 'NETWORK_QUERY_ERROR'
+    | 'NETWORK_QUERY_RECEIVED_ALL'
+    | 'NETWORK_QUERY_RECEIVED_REQUIRED'
+    | 'NETWORK_QUERY_START'
+    | 'STORE_FOUND_ALL'
+    | 'STORE_FOUND_REQUIRED';
+
+export type OnReadyStateChange = (readyState: {
+    ready: boolean;
+    done: boolean;
+    stale: boolean;
+    error?: Error;
+    events: ReadyStateEvent[];
+    aborted: boolean;
+}) => void;
 
 export interface RelayProp<V = any> {
     readonly route: { name: string }; // incomplete, also has params and queries

types/react-relay/compat.d.ts

@@ -1,12 +1,12 @@
-export { QueryRenderer, fetchQuery, graphql } from "./index";
+export { QueryRenderer, fetchQuery, graphql } from './index';
 import {
     ConnectionConfig,
     RelayPaginationProp as RelayModernPaginationProp,
     RelayRefetchProp as RelayModernRefetchProp,
-} from "./index";
-export { ConcreteFragment, ConcreteRequest, ConcreteBatchRequest } from "relay-runtime";
-import * as RelayRuntimeTypes from "relay-runtime";
-import { RelayEnvironmentInterface } from "./classic";
+} from './index';
+export { ConcreteFragment, ConcreteRequest, ConcreteBatchRequest } from 'relay-runtime';
+import * as RelayRuntimeTypes from 'relay-runtime';
+import { RelayEnvironmentInterface } from './classic';
 
 // ~~~~~~~~~~~~~~~~~~~~~
 // Maybe Fix

types/react-relay/index.d.ts

@@ -20,29 +20,31 @@ export {
     fetchRelayModernQuery as fetchQuery,
     GraphQLTaggedNode,
     requestRelaySubscription as requestSubscription,
-} from "relay-runtime";
+} from 'relay-runtime';
 
-import * as React from "react";
-import * as RelayRuntimeTypes from "relay-runtime";
+import * as React from 'react';
+import * as RelayRuntimeTypes from 'relay-runtime';
 
 // ~~~~~~~~~~~~~~~~~~~~~
 // Utility types
 // ~~~~~~~~~~~~~~~~~~~~~
 
 export interface _RefType<T> {
-    " $refType": T;
+    ' $refType': T;
 }
 export interface _FragmentRefs<T> {
-    " $fragmentRefs": T;
+    ' $fragmentRefs': T;
 }
 
 export type FragmentOrRegularProp<T> = T extends _RefType<infer U>
     ? _FragmentRefs<U>
-    : T extends ReadonlyArray<_RefType<infer U>> ? ReadonlyArray<_FragmentRefs<U>> : T;
+    : T extends ReadonlyArray<_RefType<infer U>>
+    ? ReadonlyArray<_FragmentRefs<U>>
+    : T;
 
 export type MappedFragmentProps<T> = { [K in keyof T]: FragmentOrRegularProp<T[K]> };
 
-export type RemoveRelayProp<P> = Pick<P, Exclude<keyof P, "relay">>;
+export type RemoveRelayProp<P> = Pick<P, Exclude<keyof P, 'relay'>>;
 
 export interface ComponentRef {
     componentRef?: (ref: any) => void;
@@ -92,11 +94,11 @@ export const graphql: GraphqlInterface;
 
 export interface QueryRendererProps<T extends RelayRuntimeTypes.OperationBase = RelayRuntimeTypes.OperationDefaults> {
     cacheConfig?: RelayRuntimeTypes.CacheConfig;
-    dataFrom?: "NETWORK_ONLY"|"STORE_THEN_NETWORK";
+    dataFrom?: 'NETWORK_ONLY' | 'STORE_THEN_NETWORK';
     environment: RelayRuntimeTypes.Environment;
     query?: RelayRuntimeTypes.GraphQLTaggedNode | null;
-    render(readyState: ReadyState<T["response"]>): React.ReactNode;
-    variables: T["variables"];
+    render(readyState: ReadyState<T['response']>): React.ReactNode;
+    variables: T['variables'];
     rerunParamExperimental?: RelayRuntimeTypes.RerunParam;
 }
 export interface ReadyState<T extends RelayRuntimeTypes.Variables = RelayRuntimeTypes.Variables> {
@@ -153,7 +155,7 @@ export function FragmentVariablesGetter(
     totalCount: number
 ): RelayRuntimeTypes.Variables;
 export interface ConnectionConfig<P> {
-    direction?: "backward" | "forward";
+    direction?: 'backward' | 'forward';
     getConnectionFromProps?(props: P): ConnectionData | undefined | null;
     getFragmentVariables?: typeof FragmentVariablesGetter;
     getVariables(
@@ -196,6 +198,4 @@ export function createRefetchContainer<P>(
 // Context
 // ~~~~~~~~~~~~~~~~~~~~~
 
-export const ReactRelayContext: React.Context<
-    RelayRuntimeTypes.CRelayContext<RelayRuntimeTypes.Environment>
->;
+export const ReactRelayContext: React.Context<RelayRuntimeTypes.CRelayContext<RelayRuntimeTypes.Environment>>;

types/react-relay/test/react-relay-classic-tests.tsx

@@ -1,7 +1,7 @@
-import * as React from "react";
-import * as Relay from "react-relay/classic";
+import * as React from 'react';
+import * as Relay from 'react-relay/classic';
 
-import { CompatContainer } from "./react-relay-compat-tests";
+import { CompatContainer } from './react-relay-compat-tests';
 
 interface Props {
     text: string;
@@ -25,13 +25,13 @@ export default class AddTweetMutation extends Relay.Mutation<Props, {}> {
     getConfigs() {
         return [
             {
-                type: "RANGE_ADD",
-                parentName: "user",
+                type: 'RANGE_ADD',
+                parentName: 'user',
                 parentID: this.props.userId,
-                connectionName: "tweets",
-                edgeName: "tweetEdge",
+                connectionName: 'tweets',
+                edgeName: 'tweetEdge',
                 rangeBehaviors: {
-                    "": "append",
+                    '': 'append',
                 },
             },
         ];
@@ -63,7 +63,7 @@ const ArtworkContainer = Relay.createContainer(Artwork, {
         artwork: () => Relay.QL`
             fragment on Artwork {
                 title
-                ${CompatContainer.getFragment("whatever")}
+                ${CompatContainer.getFragment('whatever')}
             }
         `,
     },
@@ -72,13 +72,13 @@ const ArtworkContainer = Relay.createContainer(Artwork, {
 class StubbedArtwork extends React.Component {
     render() {
         const props = {
-            artwork: { title: "CHAMPAGNE FORMICA FLAG" },
+            artwork: { title: 'CHAMPAGNE FORMICA FLAG' },
             relay: {
                 route: {
-                    name: "champagne",
+                    name: 'champagne',
                 },
                 variables: {
-                    artworkID: "champagne-formica-flag",
+                    artworkID: 'champagne-formica-flag',
                 },
                 setVariables: () => {},
                 forceFetch: () => {},

types/react-relay/test/react-relay-compat-tests.tsx

@@ -1,13 +1,13 @@
-import * as React from "react";
+import * as React from 'react';
 import {
     QueryRenderer as CompatQueryRenderer,
     createFragmentContainer as createFragmentContainerCompat,
     commitMutation as commitMutationCompat,
     CompatEnvironment,
     RelayPaginationProp as RelayPaginationPropCompat,
-} from "react-relay/compat";
+} from 'react-relay/compat';
 
-import { configs, mutation, optimisticResponse } from "./react-relay-tests";
+import { configs, mutation, optimisticResponse } from './react-relay-tests';
 
 // testting compat mutation with classic environment
 function markNotificationAsReadCompat(environment: CompatEnvironment, source: string, storyID: string) {
@@ -24,13 +24,13 @@ function markNotificationAsReadCompat(environment: CompatEnvironment, source: st
         optimisticResponse,
         variables,
         onCompleted: (response, errors) => {
-            console.log("Response received from server.");
+            console.log('Response received from server.');
         },
         onError: err => console.error(err),
         updater: (store, data) => {
             const field = store.get(storyID);
             if (field) {
-                field.setValue(data.story, "story");
+                field.setValue(data.story, 'story');
             }
         },
     });