Merge branch 'Product/1107-frontendPerformance' into 'master'

Product/1107 frontend performance

See merge request !63

.gitignore

@@ -2,6 +2,14 @@
 node_modules
 /dist
 
+# yarn
+.yarn/*
+!.yarn/releases
+!.yarn/plugins
+!.yarn/sdks
+!.yarn/versions
+.pnp.*
+
 # local env files
 .env.local
 .env.*.local

.gitlab-ci.yml

+include:
+  - project: coscine/tools/gitlab-ci-templates
+    file: 
+      - /docker-runner.yml
+      - /nodejs.yml
+
 stages:
-  - test
+  - build
+# there are more stages in the imported file but we only want to import some
+#  - test
   - publish
-  - release
-  - pre_release
 
-before_script:
-    - npm install
+build-branch:
+  extends: .build-branch
+
+build-npm-release:
+  extends: .build-npm-release
 
-test:
-  stage: test
-  script:
-    - npm run build
-    - npm test
-  except:
-    refs:
-      - master
-      - tags
-    variables:
-      - $GITLAB_USER_ID == $GIT_BOT_USER_ID
+publish-branch-prerelease:
+  extends: .publish-branch-prerelease
 
-publish:
-  stage: publish
-  script:
-    - npm run build
-    - npm test
-    - npx semantic-release
-  only:
-    - master
-  except:
-    variables:
-      - $GITLAB_USER_ID == $GIT_BOT_USER_ID
+publish-master-release:
+  extends: .publish-master-release
 
-release:
-  stage: release
-  script:
-    - npm run build
-  artifacts:
-    paths:
-      - dist
-  only:
-    - tags
+publish-gitlab:
+  extends: .publish-gitlab-release
 
-pre_release:
-  stage: pre_release
-  script:
-    - npm run build
-  artifacts:
-    paths:
-      - dist
-  when: manual
-  except:
-    - tags
-    - master
+publish-npm:
+  extends: .publish-npm-release

.yarnrc.yml

+packageExtensions:
+  "@vue/cli-service@*":
+    peerDependencies:
+      "@vue/cli-plugin-babel": "*"
+      "@vue/cli-plugin-eslint": "*"
+      "@vue/cli-plugin-typescript": "*"
+  "@vue/cli-plugin-typescript@*":
+    peerDependencies:
+      "babel-loader": "*"
+  "fork-ts-checker-webpack-plugin@*":
+    dependencies:
+      "vue-template-compiler": "*"
+    peerDependencies:
+      "typescript": "*"
+  "vue-i18n@*":
+    dependencies:
+      "vue": "^2.6.12"
+  "vue-material-design-icons@*":
+    dependencies:
+      "vue": "^2.6.12"      
+  "vue-multiselect@*":
+    dependencies:
+      "vue": "^2.6.12" 
+  "vue-router@*":
+    dependencies:
+      "vue": "^2.6.12"
+  "vuex@*":
+    dependencies:
+      "vue": "^2.6.12"
+  "bootstrap-vue@*":
+    dependencies:
+      "vue": "^2.6.12"
+      "jquery": "*"

bili.config.ts

-import { Config } from 'bili';
-
-const config: Config = {
-    banner: true,
-    plugins: {
-        vue: {
-            css: true,
-        },
-        typescript2: {
-            // Override the config in `tsconfig.json`
-            tsconfigOverride: {
-                include: ['src'],
-            },
-        },
-    },
-
-     // Let's take this opportunity to move the CLI flags here as well
-    input: 'src/index.ts',
-    output: {
-        format: ['cjs', 'esm'],
-        extractCSS: true,
-    },
-};
-
-export default config;

package.json

 {
   "name": "@coscine/project-creation",
-  "version": "1.11.1",
-  "main": "./dist/index.js",
-  "module": "dist/index.esm.js",
-  "types": "dist/index.d.ts",
+  "version": "1.11.2",
+  "main": "dist/index.umd.js",
+  "module": "dist/index.common.js",
+  "browser": "dist/index.umd.min.js",
+  "style": "dist/index.css",
   "directories": {
     "doc": "docs"
   },
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/",
-    "tag": "latest"
-  },
   "scripts": {
-    "dev": "vue serve CreateProject.vue",
-    "build": "bili",
+    "build": "vue-cli-service build --target lib --name index ./src/index.ts",
     "lint": "vue-cli-service lint",
     "test:unit": "vue-cli-service test:unit"
   },
@@ -22,20 +17,20 @@
     "dist/*"
   ],
   "dependencies": {
-    "@coscine/api-connection": "^1.23.1",
-    "@coscine/app-util": "^1.7.1",
-    "@coscine/component-library": "^1.4.1",
-    "@types/jquery": "^3.5.2",
+    "@coscine/api-connection": "^1.24.2",
+    "@coscine/app-util": "^1.8.1",
+    "@coscine/component-library": "^1.5.0",
+    "@types/jquery": "^3.5.5",
     "@types/vuelidate": "^0.7.13",
-    "@voerro/vue-tagsinput": "^2.4.0",
-    "bootstrap-vue": "^2.17.3",
+    "@voerro/vue-tagsinput": "^2.4.3",
+    "bootstrap-vue": "^2.21.0",
     "jquery": "^3.5.1",
     "vue": "^2.6.12",
-    "vue-i18n": "^8.22.0",
+    "vue-i18n": "^8.22.2",
     "vue-multiselect": "^2.1.6",
-    "vuejs-datepicker": "^1.6.2",
     "vue-runtime-helpers": "^1.1.2",
-    "vuelidate": "^0.7.5"
+    "vuejs-datepicker": "^1.6.2",
+    "vuelidate": "^0.7.6"
   },
   "devDependencies": {
     "@hutson/semantic-delivery-gitlab": "^9.1.0",
@@ -44,19 +39,15 @@
     "@semantic-release/gitlab": "^6.0.5",
     "@semantic-release/npm": "^7.0.6",
     "@semantic-release/release-notes-generator": "^9.0.1",
-    "@types/chai": "^4.2.13",
-    "@types/mocha": "^8.0.3",
-    "@vue/cli-plugin-babel": "^4.5.7",
+    "@types/node": "^14.14.20",
+    "@typescript-eslint/eslint-plugin": "^4.12.0",
+    "@typescript-eslint/parser": "^4.12.0",
     "@vue/cli-plugin-typescript": "^4.5.7",
-    "@vue/cli-plugin-unit-mocha": "^4.5.7",
     "@vue/cli-service": "^4.5.7",
-    "@vue/test-utils": "1.1.0",
-    "bili": "^5.0.5",
-    "chai": "^4.2.0",
-    "rollup": "^2.29.0",
-    "rollup-plugin-typescript2": "^0.27.3",
-    "rollup-plugin-vue": "^5.1.9",
-    "semantic-release": "^17.3.0",
+    "conventional-changelog-eslint": "3.0.9",
+    "core-js": "^3.8.2",
+    "eslint": "^7.17.0",
+    "semantic-release": "^17.3.1",
     "typescript": "^4.0.3",
     "vue-template-compiler": "^2.6.12"
   },

postcss.config.js

-module.exports = {
-  plugins: {
-    autoprefixer: {}
-  }
-}

src/CreateProject.vue

@@ -327,6 +327,7 @@
 <script lang="ts">
 import Vue from 'vue';
 import { CoscineLoadingSpinner } from '@coscine/component-library';
+import '@coscine/component-library/dist/index.css';
 import Datepicker from 'vuejs-datepicker';
 import { de, en } from 'vuejs-datepicker/dist/locale';
 import { validationMixin } from 'vuelidate';
@@ -642,7 +643,7 @@ export default Vue.extend({
       if (search.length < 3) {
         return;
       }
-      this.queryTimer = setTimeout(() => this.fetchOrganizationOptions(search), 1000);
+      this.queryTimer = window.setTimeout(() => this.fetchOrganizationOptions(search), 1000);
     },
     fetchOrganizationOptions(search: string) {
       this.loadingOrganizations = true;

src/components/DeleteModal.vue

@@ -51,9 +51,6 @@ import Vue from 'vue';
 import { CoscineLoadingSpinner } from '@coscine/component-library';
 import { ProjectApi, SubProjectApi } from '@coscine/api-connection';
 
-import Loading from 'vue-loading-overlay';
-import 'vue-loading-overlay/dist/vue-loading.css';
-
 import VueI18n from 'vue-i18n';
 import { GuidUtil, LinkUtil } from '@coscine/app-util';
 Vue.use(VueI18n);

src/shims-vue.d.ts

@@ -5,4 +5,5 @@ declare module '*.vue' {
 
 declare module '@voerro/vue-tagsinput';
 declare module '@coscine/api-connection';
+declare module '@coscine/app-util';
 declare module '@coscine/component-library';

tsconfig.json

@@ -10,10 +10,13 @@
     "allowSyntheticDefaultImports": true,
     "sourceMap": true,
     "baseUrl": ".",
+    "skipLibCheck": true,
+    "outDir": "dist",
+    "declaration": true,
+    "declarationDir": "dist",
     "types": [
       "webpack-env",
-      "mocha",
-      "chai"
+      "node"
     ],
     "paths": {
       "@/*": [

tslint.json

-{
-  "defaultSeverity": "warning",
-  "extends": [
-    "tslint:recommended"
-  ],
-  "linterOptions": {
-    "exclude": [
-      "node_modules/**"
-    ]
-  },
-  "rules": {
-    "quotemark": [true, "single"],
-    "indent": [true, "spaces", 2],
-    "interface-name": false,
-    "ordered-imports": false,
-    "object-literal-sort-keys": false,
-    "no-consecutive-blank-lines": false
-  }
-}