TD: Rewrite application to TS

7 files changed, 27 insertions, 160 deletions

diff --git a/plugins/base/search-component/build.gradle.kts b/plugins/base/search-component/build.gradle.kts
index ce747c5e..11f04ace 100644
--- a/plugins/base/search-component/build.gradle.kts
+++ b/plugins/base/search-component/build.gradle.kts
@@ -8,11 +8,11 @@ task("generateSearchFiles") {
 
 tasks {
     "npm_run_build" {
-        inputs.dir("$projectDir/src/main/js/search/")
+        inputs.dir("$projectDir/src/main/components/")
         inputs.files("$projectDir/package.json", "$projectDir/webpack.config.js")
         outputs.dir("$projectDir/dist/")
     }
     clean {
         delete = setOf("$projectDir/node_modules", "$projectDir/dist/", "$projectDir/package-lock.json")
     }
-}
\ No newline at end of file
+}
diff --git a/plugins/base/search-component/package.json b/plugins/base/search-component/package.json
index fa997c44..1fb386f6 100644
--- a/plugins/base/search-component/package.json
+++ b/plugins/base/search-component/package.json
@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "config": {
-    "components": "./src/main/js/search",
+    "components": "./src/main/components",
     "dist": "./dist"
   },
   "scripts": {
@@ -28,50 +28,30 @@
   "dependencies": {
     "@babel/core": "^7.8.3",
     "@jetbrains/babel-preset-jetbrains": "^2.1.4",
-    "@jetbrains/icons": "3.6.0",
     "@jetbrains/logos": "1.1.5",
     "@jetbrains/ring-ui": "2.1.16",
+    "@types/node": "^12.12.36",
+    "@types/react": "^16.9.0",
+    "@types/react-dom": "^16.9.0",
     "babel-loader": "^8.0.6",
-    "copy-webpack-plugin": "^5.1.1",
-    "css-loader": "^3.4.2",
-    "json-loader": "^0.5.7",
     "postcss-import": "^12.0.1",
-    "postcss-loader": "^3.0.0",
     "postcss-preset-env": "^6.7.0",
-    "prop-types": "^15.7.2",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "redbox-react": "^1.6.0",
+    "ts-loader": "^7.0.0",
+    "typescript": "^3.8.3",
     "webpack": "^4.41.5",
     "webpack-cli": "^3.3.10",
     "webpack-dev-server": "^3.10.1"
   },
   "devDependencies": {
-    "@jetbrains/generator-ring-ui": "2.0.53",
-    "@jetbrains/eslint-config": "^4.0.6",
     "@jetbrains/stylelint-config": "^2.0.0",
     "babel-eslint": "^10.0.3",
-    "chai": "^4.2.0",
-    "chai-as-promised": "^7.1.1",
-    "chai-dom": "^1.8.1",
-    "chai-enzyme": "1.0.0-beta.1",
-    "electron": "^7.1.9",
-    "enzyme": "^3.11.0",
-    "enzyme-adapter-react-16": "^1.15.2",
     "eslint": "^6.8.0",
-    "karma": "^4.4.1",
-    "karma-chai-plugins": "^0.9.0",
-    "karma-electron": "^6.3.0",
-    "karma-mocha": "^1.3.0",
-    "karma-sourcemap-loader": "^0.3.7",
-    "karma-teamcity-reporter": "^1.1.0",
-    "karma-webpack": "^4.0.2",
-    "mocha": "^6.2.2",
-    "react-test-renderer": "^16.12.0",
-    "sinon": "^8.0.4",
-    "sinon-chai": "^3.4.0",
-    "stylelint": "^12.0.1",
-    "xvfb-maybe": "^0.2.1",
+    "sass": "^1.26.3",
+    "sass-loader": "^8.0.2",
+    "stylelint": "^13.3.2",
     "yo": "^3.1.1"
   },
   "engines": {
diff --git a/plugins/base/search-component/postcss.config.js b/plugins/base/search-component/postcss.config.js
index ce65774e..66c94ee0 100644
--- a/plugins/base/search-component/postcss.config.js
+++ b/plugins/base/search-component/postcss.config.js
@@ -4,7 +4,6 @@ module.exports = () => ({
     require('postcss-preset-env')({
       features: {
         stage: 3, // See https://cssdb.org/#staging-process
-        importFrom: require.resolve('@jetbrains/ring-ui/components/global/variables.css'),
         features: {
           'nesting-rules': true,
           'custom-properties': {
diff --git a/plugins/base/search-component/src/main/js/search/app.css b/plugins/base/search-component/src/main/js/search/app.css
deleted file mode 100644
index c51d3fe1..00000000
--- a/plugins/base/search-component/src/main/js/search/app.css
+++ /dev/null
@@ -1,21 +0,0 @@
-@import "@jetbrains/ring-ui/components/global/variables.css";
-
-html,
-.app-root {
-  height: 100%;
-}
-
-.search-root {
-  margin: 0;
-  padding: 0;
-
-  background: var(--ring-content-background-color);
-
-  font-family: var(--ring-font-family);
-  font-size: var(--ring-font-size);
-  line-height: var(--ring-line-height);
-}
-
-.search-content {
-  padding: 24px 41px;
-}
diff --git a/plugins/base/search-component/src/main/js/search/app.js b/plugins/base/search-component/src/main/js/search/app.js
deleted file mode 100644
index bceffa48..00000000
--- a/plugins/base/search-component/src/main/js/search/app.js
+++ /dev/null
@@ -1,41 +0,0 @@
-import React from 'react';
-import {render} from 'react-dom';
-import RedBox from 'redbox-react';
-
-import {AppRoot} from './app-root';
-import './app.css';
-
-const appEl = document.getElementById('searchBar');
-const rootEl = document.createElement('div');
-
-let renderApp = () => {
-  render(
-    <AppRoot/>,
-    rootEl
-  );
-};
-
-if (module.hot) {
-  const renderAppHot = renderApp;
-  const renderError = error => {
-    render(
-      <RedBox error={error}/>,
-      rootEl
-    );
-  };
-
-  renderApp = () => {
-    try {
-      renderAppHot();
-    } catch (error) {
-      renderError(error);
-    }
-  };
-
-  module.hot.accept('./app-root', () => {
-    setTimeout(renderApp);
-  });
-}
-
-renderApp();
-appEl.appendChild(rootEl);
diff --git a/plugins/base/search-component/src/main/js/search/search.js b/plugins/base/search-component/src/main/js/search/search.js
deleted file mode 100644
index a742f11d..00000000
--- a/plugins/base/search-component/src/main/js/search/search.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import React, {Component} from 'react';
-import Select from '@jetbrains/ring-ui/components/select/select';
-import '@jetbrains/ring-ui/components/input-size/input-size.scss';
-
-class WithFuzzySearchFilterComponent extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {selected: props.data[0]};
-  }
-
-  clearSelection = () => {
-    this.setState({selected: null});
-  };
-
-  onSelect = option => {
-    window.location.href = `${window.pathToRoot}${option.location}?query${option.name}`;
-    this.setState({selected: option});
-    debugger
-  };
-
-  render() {
-    return (
-      <div className="search-container">
-        <div className="search">
-          <Select
-            selectedLabel="Search"
-            label="Please type page name"
-            filter={{fuzzy: true}}
-            clear
-            selected={this.state.selected}
-            data={this.props.data}
-            onSelect={this.onSelect}
-          />
-        </div>
-      </div>
-    );
-  }
-}
-
-export const WithFuzzySearchFilter = () => {
-  let data = [];
-  if (window.pages) {
-    data = window.pages.map((page, i) => ({
-      ...page,
-      label: page.name,
-      key: i + 1,
-      type: page.kind
-    }));
-  }
-
-  return <WithFuzzySearchFilterComponent data={data}/>;
-};
diff --git a/plugins/base/search-component/webpack.config.js b/plugins/base/search-component/webpack.config.js
index a7b503b6..559f5792 100644
--- a/plugins/base/search-component/webpack.config.js
+++ b/plugins/base/search-component/webpack.config.js
@@ -13,9 +13,10 @@ ringUiWebpackConfig.loaders.svgInlineLoader.include.push(
 );
 
 const webpackConfig = () => ({
-  entry: `${componentsPath}/app.js`,
+  entry: `${componentsPath}/root.tsx`,
   resolve: {
     mainFields: ['module', 'browser', 'main'],
+    extensions: ['.tsx', '.ts', '.js'],
     alias: {
       react: resolve('./node_modules/react'),
       'react-dom': resolve('./node_modules/react-dom'),
@@ -32,24 +33,25 @@ const webpackConfig = () => ({
     rules: [
       ...ringUiWebpackConfig.config.module.rules,
       {
-        test: /\.css$/,
-        include: componentsPath,
+        test: /\.s[ac]ss$/i,
         use: [
           'style-loader',
-          {loader: 'css-loader'},
-          {loader: 'postcss-loader'}
-        ]
-      },
-      {
-        test: /\.css$/,
-        include: /node_modules/,
+          'css-loader',
+          'sass-loader',
+        ],
+        include: componentsPath,
         exclude: ringUiWebpackConfig.componentsPath,
-        use: ['style-loader', 'css-loader']
       },
       {
-        test: /\.js$/,
-        include: [componentsPath],
-        loader: 'babel-loader?cacheDirectory'
+        test: /\.tsx?$/,
+        use: [
+          {
+            loader: 'ts-loader',
+            options: {
+              transpileOnly: true
+            }
+          }
+        ]
       }
     ]
   },