Merge pull request #2682 from storybooks/ts-lint-all

Add tslint to the linting pipe
storybookjs · Jan 10, 2018 · be0b6f2 · be0b6f2
1 parent 4194f73
commit be0b6f2
Show file tree

Hide file tree

Showing 40 changed files with 333 additions and 461 deletions.
diff --git a/app/angular/demo.d.ts b/app/angular/demo.d.ts
@@ -1,4 +1,4 @@
 declare module '@storybook/angular/demo' {
-    export const Button: any;
-    export const Welcome: any;
-}
+  export const Button: any;
+  export const Welcome: any;
+}
diff --git a/app/angular/index.d.ts b/app/angular/index.d.ts
@@ -1,31 +1,31 @@
-import {NgModuleMetadata, ICollection} from './dist/client/preview/angular/types';
+import { NgModuleMetadata, ICollection } from './dist/client/preview/angular/types';
 
 export interface IStorybookStory {
-    name: string,
-    render: () => any
+  name: string;
+  render: () => any;
 }
 
 export interface IStoribookSection {
-    kind: string,
-    stories: IStorybookStory[]
+  kind: string;
+  stories: IStorybookStory[];
 }
 
 export type IGetStory = () => {
-    props?: ICollection;
-    moduleMetadata?: Partial<NgModuleMetadata>;
-    component: any
+  props?: ICollection;
+  moduleMetadata?: Partial<NgModuleMetadata>;
+  component: any;
 };
 
 export interface IApi {
-    kind: string;
-    addDecorator: (decorator: any) => IApi;
-    add: (storyName: string, getStory: IGetStory ) => IApi;
+  kind: string;
+  addDecorator: (decorator: any) => IApi;
+  add: (storyName: string, getStory: IGetStory) => IApi;
 }
 
 declare module '@storybook/angular' {
-    export function storiesOf(kind: string, module: NodeModule): IApi;
-    export function setAddon(addon: any): void;
-    export function addDecorator(decorator: any): IApi;
-    export function configure(loaders: () => NodeRequire, module: NodeModule): void;
-    export function getStorybook(): IStoribookSection[];
+  export function storiesOf(kind: string, module: NodeModule): IApi;
+  export function setAddon(addon: any): void;
+  export function addDecorator(decorator: any): IApi;
+  export function configure(loaders: () => NodeRequire, module: NodeModule): void;
+  export function getStorybook(): IStoribookSection[];
 }
diff --git a/app/angular/src/client/preview/angular/app.token.ts b/app/angular/src/client/preview/angular/app.token.ts
@@ -1,4 +1,4 @@
-import { InjectionToken } from "@angular/core";
-import { NgStory } from "./types";
+import { InjectionToken } from '@angular/core';
+import { NgStory } from './types';
 
-export const STORY = new InjectionToken<NgStory>("story");
+export const STORY = new InjectionToken<NgStory>('story');
diff --git a/app/angular/src/client/preview/angular/components/app.component.ts b/app/angular/src/client/preview/angular/components/app.component.ts
@@ -13,22 +13,19 @@ import {
   OnDestroy,
   EventEmitter,
   SimpleChanges,
-  SimpleChange
+  SimpleChange,
 } from '@angular/core';
 import { STORY } from '../app.token';
 import { NgStory, ICollection } from '../types';
 
 @Component({
   selector: 'storybook-dynamic-app-root',
-  template: '<ng-template #target></ng-template>'
+  template: '<ng-template #target></ng-template>',
 })
 export class AppComponent implements AfterViewInit, OnDestroy {
   @ViewChild('target', { read: ViewContainerRef })
   target: ViewContainerRef;
-  constructor(
-    private cfr: ComponentFactoryResolver,
-    @Inject(STORY) private data: NgStory
-  ) {}
+  constructor(private cfr: ComponentFactoryResolver, @Inject(STORY) private data: NgStory) {}
 
   ngAfterViewInit(): void {
     this.putInMyHtml();
@@ -49,7 +46,7 @@ export class AppComponent implements AfterViewInit, OnDestroy {
   /**
    * Set inputs and outputs
    */
-  private setProps(instance: any, {props = {}, propsMeta = {}}: NgStory): void {
+  private setProps(instance: any, { props = {}, propsMeta = {} }: NgStory): void {
     const changes: SimpleChanges = {};
     const hasNgOnChangesHook = _.has(instance, 'ngOnChanges');
 
@@ -62,7 +59,7 @@ export class AppComponent implements AfterViewInit, OnDestroy {
         if (hasNgOnChangesHook) {
           changes[key] = new SimpleChange(undefined, value, instanceProperty === undefined);
         }
-      } else if (_.isFunction(value) && (key !== 'ngModelChange')) {
+      } else if (_.isFunction(value) && key !== 'ngModelChange') {
         instanceProperty.subscribe(value);
       }
     });
@@ -90,7 +87,7 @@ export class AppComponent implements AfterViewInit, OnDestroy {
     }
 
     if (_.isFunction(props.ngModelChange)) {
-        _.invoke(instance, 'registerOnChange', props.ngModelChange);
+      _.invoke(instance, 'registerOnChange', props.ngModelChange);
     }
   }
 }
diff --git a/app/angular/src/client/preview/angular/components/error.component.ts b/app/angular/src/client/preview/angular/components/error.component.ts
@@ -1,6 +1,6 @@
-import { Component, Inject } from "@angular/core";
-import { STORY } from "../app.token";
-import { NgError } from "../types";
+import { Component, Inject } from '@angular/core';
+import { STORY } from '../app.token';
+import { NgError } from '../types';
 
 @Component({
   selector: 'storybook-dynamic-app-root',
@@ -40,9 +40,9 @@ import { NgError } from "../types";
         width: 100vw;
         overflow: auto;
       }
-    `
-  ]
+    `,
+  ],
 })
 export class ErrorComponent {
   constructor(@Inject(STORY) public error: NgError) {}
-}
+}
diff --git a/app/angular/src/client/preview/angular/components/no-preview.component.ts b/app/angular/src/client/preview/angular/components/no-preview.component.ts
@@ -1,7 +1,7 @@
-import { Component } from "@angular/core";
+import { Component } from '@angular/core';
 
 @Component({
   selector: 'storybook-dynamic-app-root',
-  template: "<p>No Preview Available!</p>"
+  template: '<p>No Preview Available!</p>',
 })
 export class NoPreviewComponent {}
diff --git a/app/angular/src/client/preview/angular/helpers.ts b/app/angular/src/client/preview/angular/helpers.ts
@@ -1,12 +1,5 @@
-import {
-  Type,
-  enableProdMode,
-  NgModule,
-  Component,
-  NgModuleRef
-} from '@angular/core';
-import {FormsModule} from '@angular/forms';
-
+import { Type, enableProdMode, NgModule, Component, NgModuleRef } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { BrowserModule } from '@angular/platform-browser';
 import { AppComponent } from './components/app.component';
@@ -33,13 +26,16 @@ interface IComponent extends Type<any> {
 
 // Taken from https://davidwalsh.name/javascript-debounce-function
 // We don't want to pull underscore
-const debounce = (func: IRenderStoryFn | IRenderErrorFn,
-                  wait: number = 100,
-                  immediate: boolean = false): () => void => {
+const debounce = (
+  func: IRenderStoryFn | IRenderErrorFn,
+  wait: number = 100,
+  immediate: boolean = false
+): (() => void) => {
   let timeout: any;
-  return function () {
-    const context = this, args = arguments;
-    const later = function () {
+  return function() {
+    const context = this,
+      args = arguments;
+    const later = function() {
       timeout = null;
       if (!immediate) {
         func.apply(context, args);
@@ -54,14 +50,17 @@ const debounce = (func: IRenderStoryFn | IRenderErrorFn,
   };
 };
 
-const getComponentMetadata = (
-  { component, props = {}, propsMeta = {}, moduleMetadata = {
+const getComponentMetadata = ({
+  component,
+  props = {},
+  propsMeta = {},
+  moduleMetadata = {
     imports: [],
     schemas: [],
     declarations: [],
-    providers: []
-  } }: NgStory
-) => {
+    providers: [],
+  },
+}: NgStory) => {
   if (!component || typeof component !== 'function') {
     throw new Error('No valid component provided');
   }
@@ -71,15 +70,10 @@ const getComponentMetadata = (
   const paramsMetadata = getParameters(component);
 
   Object.keys(propsMeta).map(key => {
-      (<any>propsMetadata)[key] = (<any>propsMeta)[key];
+    (<any>propsMetadata)[key] = (<any>propsMeta)[key];
   });
 
-  const {
-    imports = [],
-    schemas = [],
-    declarations = [],
-    providers = []
-  } = moduleMetadata;
+  const { imports = [], schemas = [], declarations = [], providers = [] } = moduleMetadata;
 
   return {
     component,
@@ -91,16 +85,18 @@ const getComponentMetadata = (
       imports,
       schemas,
       declarations,
-      providers
-    }
+      providers,
+    },
   };
 };
 
-const getAnnotatedComponent = (meta: NgModule,
-                               component: any,
-                               propsMeta: { [p: string]: any },
-                               params: any[]): IComponent => {
-  const NewComponent: any = function NewComponent(...args: any[]) {
+const getAnnotatedComponent = (
+  meta: NgModule,
+  component: any,
+  propsMeta: { [p: string]: any },
+  params: any[]
+): IComponent => {
+  const NewComponent: any = function(...args: any[]) {
     component.call(this, ...args);
   };
 
@@ -112,55 +108,54 @@ const getAnnotatedComponent = (meta: NgModule,
   return NewComponent;
 };
 
-const getModule = (declarations: Array<Type<any> | any[]>,
-entryComponents: Array<Type<any> | any[]>,
-bootstrap: Array<Type<any> | any[]>,
-data: NgProvidedData,
-moduleMetadata: NgModuleMetadata = {
-  imports: [],
-  schemas: [],
-  declarations: [],
-  providers: []
-}): IModule => {
+const getModule = (
+  declarations: Array<Type<any> | any[]>,
+  entryComponents: Array<Type<any> | any[]>,
+  bootstrap: Array<Type<any> | any[]>,
+  data: NgProvidedData,
+  moduleMetadata: NgModuleMetadata = {
+    imports: [],
+    schemas: [],
+    declarations: [],
+    providers: [],
+  }
+): IModule => {
   const moduleMeta = new NgModule({
     declarations: [...declarations, ...moduleMetadata.declarations],
     imports: [BrowserModule, FormsModule, ...moduleMetadata.imports],
     providers: [{ provide: STORY, useValue: Object.assign({}, data) }, ...moduleMetadata.providers],
     entryComponents: [...entryComponents],
     schemas: [...moduleMetadata.schemas],
-    bootstrap: [...bootstrap]
+    bootstrap: [...bootstrap],
   });
 
-  const NewModule: any = function NewModule() {};
+  const NewModule: any = function() {};
   (<IModule>NewModule).annotations = [moduleMeta];
   return NewModule;
 };
 
-const initModule = (currentStory: IGetStoryWithContext, context: IContext, reRender: boolean): IModule => {
-  const {
-    component,
-    componentMeta,
-    props,
-    propsMeta,
-    params,
-    moduleMeta
-  } = getComponentMetadata(currentStory(context));
+const initModule = (
+  currentStory: IGetStoryWithContext,
+  context: IContext,
+  reRender: boolean
+): IModule => {
+  const { component, componentMeta, props, propsMeta, params, moduleMeta } = getComponentMetadata(
+    currentStory(context)
+  );
 
   if (!componentMeta) {
     throw new Error('No component metadata available');
   }
 
-  const AnnotatedComponent = getAnnotatedComponent(
-    componentMeta,
-    component,
-    propsMeta,
-    [...params, ...moduleMeta.providers.map(provider => [provider])]
-  );
+  const AnnotatedComponent = getAnnotatedComponent(componentMeta, component, propsMeta, [
+    ...params,
+    ...moduleMeta.providers.map(provider => [provider]),
+  ]);
 
   const story = {
     component: AnnotatedComponent,
     props,
-    propsMeta
+    propsMeta,
   };
 
   return getModule(
@@ -181,23 +176,22 @@ const draw = (newModule: IModule, reRender: boolean = true): void => {
     platform = platformBrowserDynamic();
     promises.push(platform.bootstrapModule(newModule));
   } else {
-    Promise.all(promises)
-      .then((modules) => {
-        modules.forEach(mod => mod.destroy());
-
-        const body = document.body;
-        const app = document.createElement('storybook-dynamic-app-root');
-        body.appendChild(app);
-        promises = [];
-        promises.push(platform.bootstrapModule(newModule));
-      });
+    Promise.all(promises).then(modules => {
+      modules.forEach(mod => mod.destroy());
+
+      const body = document.body;
+      const app = document.createElement('storybook-dynamic-app-root');
+      body.appendChild(app);
+      promises = [];
+      promises.push(platform.bootstrapModule(newModule));
+    });
   }
 };
 
 export const renderNgError = debounce((error: Error) => {
   const errorData = {
     message: error.message,
-    stack: error.stack
+    stack: error.stack,
   };
 
   const Module = getModule([ErrorComponent], [], [ErrorComponent], errorData);
@@ -206,15 +200,10 @@ export const renderNgError = debounce((error: Error) => {
 });
 
 export const renderNoPreview = debounce(() => {
-  const Module = getModule(
-    [NoPreviewComponent],
-    [],
-    [NoPreviewComponent],
-    {
-      message: 'No Preview available.',
-      stack: ''
-    }
-  );
+  const Module = getModule([NoPreviewComponent], [], [NoPreviewComponent], {
+    message: 'No Preview available.',
+    stack: '',
+  });
 
   draw(Module);
 });