Merge pull request #2109 from hashicorp/feat/showcase-ts-tooling

feat(showcase): add typescript tooling

Author: aklkv

.github/workflows/ci-components.yml

@@ -42,18 +42,18 @@ jobs:
           cache-dependency-path: yarn.lock
       - name: Install Dependencies
         run: yarn install --immutable
-      - name: Lint Showcase
-        run: yarn run lint
-        working-directory: showcase
-      - name: Lint Components
-        run: yarn run lint
-        working-directory: packages/components
       - name: Build Icons
         run: yarn build
         working-directory: packages/ember-flight-icons
       - name: Build Components
         run: yarn build
         working-directory: packages/components
+      - name: Lint Showcase
+        run: yarn run lint
+        working-directory: showcase
+      - name: Lint Components
+        run: yarn run lint
+        working-directory: packages/components
       - name: Run Tests
         run: yarn run test:ember:percy
         working-directory: showcase

.yarn/patches/@glint-environment-ember-loose-npm-1.4.0-31c2f31bcb.patch

@@ -0,0 +1,17 @@
+diff --git a/-private/environment/index.js b/-private/environment/index.js
+index 217583f4bae53f6f72db8d3debd0f31b3dac2b8e..8caf5463cf2be2248952c2347c738b98d2b7e22b 100644
+--- a/-private/environment/index.js
++++ b/-private/environment/index.js
+@@ -46,10 +46,8 @@ function emberLooseEnvironment(options) {
+                     // Pod component/controller/route
+                     candidates.push(templatePath.replace(REGEXES.POD_TEMPLATE, '/component.ts'), templatePath.replace(REGEXES.POD_TEMPLATE, '/controller.ts'), templatePath.replace(REGEXES.POD_TEMPLATE, '/route.ts'));
+                 }
+-                else if (templatePath.includes('/templates/components/')) {
+-                    // Classic component
+-                    candidates.push(colocatedTsScriptPath.replace('/templates/components/', '/components/'));
+-                }
++                // we no longer need this as it remnant of classic components and it interferes with our route stricture in showcase up
++                // upstream PR: https://github.com/typed-ember/glint/pull/721
+                 else if (templatePath.includes('/templates/')) {
+                     // Classic controller/route
+                     candidates.push(colocatedTsScriptPath.replace('/templates/', '/controllers/'), colocatedTsScriptPath.replace('/templates/', '/routes/'));

package.json

@@ -17,6 +17,7 @@
   },
   "packageManager": "yarn@4.0.2",
   "resolutions": {
-    "broccoli-asset-rewrite@^2.0.0": "patch:broccoli-asset-rewrite@npm%3A2.0.0#./.yarn/patches/broccoli-asset-rewrite-npm-2.0.0-c4ce42084a.patch"
+    "broccoli-asset-rewrite@^2.0.0": "patch:broccoli-asset-rewrite@npm%3A2.0.0#./.yarn/patches/broccoli-asset-rewrite-npm-2.0.0-c4ce42084a.patch",
+    "@glint/environment-ember-loose": "patch:@glint/environment-ember-loose@npm%3A1.4.0#~/.yarn/patches/@glint-environment-ember-loose-npm-1.4.0-31c2f31bcb.patch"
   }
 }

showcase/.editorconfig

@@ -0,0 +1,19 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+[*.hbs]
+insert_final_newline = false
+
+[*.{diff,md}]
+trim_trailing_whitespace = false

showcase/.ember-cli

@@ -8,8 +8,8 @@
   "disableAnalytics": true,
 
   /**
-  Setting `isTypeScriptProject` to true will force the blueprint generators to generate TypeScript
-  rather than JavaScript by default, when a TypeScript version of a given blueprint is available.
+    Setting `isTypeScriptProject` to true will force the blueprint generators to generate TypeScript
+    rather than JavaScript by default, when a TypeScript version of a given blueprint is available.
   */
-  "isTypeScriptProject": false
+  "isTypeScriptProject": true
 }

showcase/.eslintignore

@@ -1,25 +1,13 @@
 # unconventional js
 /blueprints/*/files/
-/vendor/
 
 # compiled output
 /dist/
-/tmp/
-
-# dependencies
-/bower_components/
-/node_modules/
 
 # misc
 /coverage/
 !.*
 .*/
-.eslintcache
 
 # ember-try
 /.node_modules.ember-try/
-/bower.json.ember-try
-/npm-shrinkwrap.json.ember-try
-/package.json.ember-try
-/package-lock.json.ember-try
-/yarn.lock.ember-try

showcase/.eslintrc.js

@@ -2,19 +2,11 @@
 
 module.exports = {
   root: true,
-  parser: '@babel/eslint-parser',
+  parser: '@typescript-eslint/parser',
   parserOptions: {
-    ecmaVersion: 2018,
-    sourceType: 'module',
-    ecmaFeatures: {
-      legacyDecorators: true,
-    },
-    requireConfigFile: false,
-    babelOptions: {
-      plugins: [['@babel/plugin-proposal-decorators', { legacy: true }]],
-    },
+    ecmaVersion: 'latest',
   },
-  plugins: ['ember'],
+  plugins: ['ember', '@typescript-eslint'],
   extends: [
     'eslint:recommended',
     'plugin:ember/recommended',
@@ -25,6 +17,15 @@ module.exports = {
   },
   rules: {},
   overrides: [
+    // ts files
+    {
+      files: ['**/*.ts'],
+      extends: [
+        'plugin:@typescript-eslint/eslint-recommended',
+        'plugin:@typescript-eslint/recommended',
+      ],
+      rules: {},
+    },
     // node files
     {
       files: [
@@ -33,26 +34,16 @@ module.exports = {
         './.stylelintrc.js',
         './.template-lintrc.js',
         './ember-cli-build.js',
-        './index.js',
         './testem.js',
         './blueprints/*/index.js',
         './config/**/*.js',
         './tests/dummy/config/**/*.js',
       ],
-      parserOptions: {
-        sourceType: 'script',
-      },
       env: {
         browser: false,
         node: true,
       },
-      plugins: ['node'],
-      extends: ['plugin:node/recommended'],
-      rules: {
-        // this can be removed once the following is fixed
-        // https://github.com/mysticatea/eslint-plugin-node/issues/77
-        'node/no-unpublished-require': 'off',
-      },
+      extends: ['plugin:n/recommended'],
     },
     {
       // test files

showcase/.gitignore

@@ -1,28 +1,21 @@
-# See https://help.github.com/ignore-files/ for more about ignoring files.
-
 # compiled output
 /dist/
 /declarations/
 
 # dependencies
-/bower_components/
 /node_modules/
 
 # misc
 /.env*
 /.pnp*
-/.sass-cache
 /.eslintcache
-/connect.lock
 /coverage/
-/libpeerconnection.log
 /npm-debug.log*
 /testem.log
 /yarn-error.log
 
 # ember-try
 /.node_modules.ember-try/
-/bower.json.ember-try
 /npm-shrinkwrap.json.ember-try
 /package.json.ember-try
 /package-lock.json.ember-try

showcase/.prettierignore

@@ -1,25 +1,13 @@
 # unconventional js
 /blueprints/*/files/
-/vendor/
 
 # compiled output
 /dist/
-/tmp/
-
-# dependencies
-/bower_components/
-/node_modules/
 
 # misc
 /coverage/
 !.*
-.eslintcache
-.lint-todo/
+.*/
 
 # ember-try
 /.node_modules.ember-try/
-/bower.json.ember-try
-/npm-shrinkwrap.json.ember-try
-/package.json.ember-try
-/package-lock.json.ember-try
-/yarn.lock.ember-try

showcase/.prettierrc.js

@@ -1,19 +1,17 @@
 'use strict';
 
 module.exports = {
-  singleQuote: true,
   overrides: [
     {
-      files: '*.hbs',
+      files: '*.{js,ts}',
       options: {
-        singleQuote: false,
-        printWidth: 120,
+        singleQuote: true,
       },
     },
     {
-      files: '*.scss',
+      files: '*.hbs',
       options: {
-        singleQuote: false,
+        printWidth: 120,
       },
     },
   ],

showcase/.stylelintignore

@@ -1,26 +1,8 @@
-# unconventional js
+# unconventional files
 /blueprints/*/files/
-/vendor/
 
 # compiled output
 /dist/
-/tmp/
 
-# dependencies
-/bower_components/
-/node_modules/
-
-# misc
-/coverage/
-!.*
-.*/
-.eslintcache
-.lint-todo/
-
-# ember-try
+# addons
 /.node_modules.ember-try/
-/bower.json.ember-try
-/npm-shrinkwrap.json.ember-try
-/package.json.ember-try
-/package-lock.json.ember-try
-/yarn.lock.ember-try

showcase/app/app.js renamed to showcase/app/app.ts

@@ -1,12 +1,12 @@
 /**
  * Type declarations for
- *    import config from 'my-app/config/environment'
+ *    import config from 'showcase/config/environment'
  */
 declare const config: {
   environment: string;
   modulePrefix: string;
   podModulePrefix: string;
-  locationType: 'history' | 'hash' | 'none' | 'auto';
+  locationType: 'history' | 'hash' | 'none';
   rootURL: string;
   APP: Record<string, unknown>;
 };

showcase/app/config/environment.d.ts

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/router.js renamed to showcase/app/router.ts

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/accordion.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/alert.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/app-footer.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/application-state.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/badge-count.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/badge.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/button-set.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/button.hbs

@@ -1,7 +1,6 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
-Copyright (c) HashiCorp, Inc.
-SPDX-License-Identifier: MPL-2.0
+  Copyright (c) HashiCorp, Inc.
+  SPDX-License-Identifier: MPL-2.0
 }}
 
 {{page-title "CodeBlock Component"}}

showcase/app/templates/components/card.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/code-block.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/copy/button.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/copy/snippet.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/dropdown.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/flyout.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/form/base-elements.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0

showcase/app/templates/components/form/checkbox.hbs

@@ -1,4 +1,3 @@
-{{! @glint-nocheck: not typesafe yet }}
 {{!
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0