Migrate ember to typescript

app/ember/package.json

@@ -31,6 +31,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.5.0",
+    "@storybook/addons": "5.3.0-beta.13",
     "@storybook/core": "5.3.0-beta.13",
     "core-js": "^3.0.1",
     "global": "^4.3.2",
@@ -49,4 +50,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}

app/ember/src/client/preview/index.js → app/ember/src/client/preview/index.ts

@@ -15,7 +15,8 @@ export const {
 } = clientApi;
 
 const framework = 'ember';
-export const storiesOf = (...args) => clientApi.storiesOf(...args).addParameters({ framework });
-export const configure = (...args) => coreConfigure(...args, framework);
+export const storiesOf = (...args: any) =>
+  clientApi.storiesOf(...args).addParameters({ framework });
+export const configure = (...args: any) => coreConfigure(...args, framework);
 
 export { forceReRender };

app/ember/src/client/preview/render.js → app/ember/src/client/preview/render.ts

@@ -1,6 +1,7 @@
 /* eslint-disable no-undef */
 import { window, document } from 'global';
 import dedent from 'ts-dedent';
+import { RenderMainArgs, ElementArgs, OptionsArgs } from './types';
 
 const rootEl = document.getElementById('root');
 
@@ -14,19 +15,18 @@ const app = window.require(`${window.STORYBOOK_NAME}/app`).default.create({
 let lastPromise = app.boot();
 let hasRendered = false;
 
-function render(options, el) {
+function render(options: OptionsArgs, el: ElementArgs) {
   const { template, context = {}, element } = options;
-
   if (hasRendered) {
-    lastPromise = lastPromise.then(instance => instance.destroy());
+    lastPromise = lastPromise.then((instance: any) => instance.destroy());
   }
 
   lastPromise = lastPromise
     .then(() => {
       const appInstancePrivate = app.buildInstance();
       return appInstancePrivate.boot().then(() => appInstancePrivate);
     })
-    .then(instance => {
+    .then((instance: any) => {
       instance.register(
         'component:story-mode',
         Ember.Component.extend({
@@ -56,8 +56,7 @@ export default function renderMain({
   selectedStory,
   showMain,
   showError,
-  // forceRender,
-}) {
+}: RenderMainArgs) {
   const element = storyFn();
 
   if (!element) {

app/ember/src/client/preview/types.ts

@@ -0,0 +1,24 @@
+import { StoryFn } from '@storybook/addons';
+
+export interface RenderMainArgs {
+  storyFn: StoryFn<any>;
+  selectedKind: string;
+  selectedStory: string;
+  showMain: () => void;
+  showError: (args: ShowErrorArgs) => void;
+}
+
+export interface ShowErrorArgs {
+  title: string;
+  description: string;
+}
+
+export interface ElementArgs {
+  el: HTMLElement;
+}
+
+export interface OptionsArgs {
+  template: any;
+  context: any;
+  element: any;
+}

app/ember/src/server/framework-preset-babel-ember.js → app/ember/src/server/framework-preset-babel-ember.ts

@@ -1,6 +1,7 @@
 import { precompile } from 'ember-source/dist/ember-template-compiler';
+import { Configuration } from 'webpack'; // eslint-disable-line
 
-export function babel(config) {
+export function babel(config: Configuration) {
   const babelConfigPlugins = config.plugins || [];
 
   const extraPlugins = [

app/ember/src/typings.d.ts

@@ -0,0 +1,3 @@
+declare module '@storybook/core/*';
+declare module 'ember-source/dist/ember-template-compiler';
+declare module 'global';

app/ember/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "./src",
+    "types": ["webpack-env"],
+    "resolveJsonModule": true
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "src/**/*.test.*"
+  ]
+}