Try to build Docker image for Pull Requests

Reviewed-on: #85
Reviewed-by: srsh <srsh@noreply.git.wtf-eg.de>

.dockerignore

@@ -1,2 +1,11 @@
+.browserslistrc
+.dockerignore
+.drone.yml
+.editorconfig
 .git
+.gitignore
+.reuse
+Dockerfile
+LICENSES
+README.md
 node_modules

.drone.yml

@@ -21,6 +21,13 @@ steps:
     commands:
       - npm ci
       - npm run lint
+  - name: docker-build
+    image: plugins/docker
+    settings:
+      registry: git.wtf-eg.de
+      repo: git.wtf-eg.de/kompetenzinventar/frontend
+      target: ki-frontend
+      dry_run: true
 
 ---
 kind: pipeline

.eslintrc.js

@@ -8,7 +8,7 @@ module.exports = {
     'eslint:recommended'
   ],
   parserOptions: {
-    parser: '@babel/eslint-parser'
+    parser: 'babel-eslint'
   },
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',

Dockerfile

@@ -2,19 +2,27 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 
-FROM node:20-alpine as builder
+FROM node:14-alpine as builder
 
-COPY . ./
+COPY package.json package-lock.json ./
+RUN npm install
+
+COPY .eslintrc.js .
+COPY babel.config.js .
+COPY public public
+COPY src src
 
 RUN npm ci && npm run build
 
 
 FROM nginx as ki-frontend
 
-COPY --from=builder /dist/ /usr/share/nginx/html/
-COPY etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
-
 LABEL org.opencontainers.image.source=https://git.wtf-eg.de/kompetenzinventar/ki-frontend.git
 LABEL org.opencontainers.image.url=https://git.wtf-eg.de/kompetenzinventar/ki-frontend
 LABEL org.opencontainers.image.documentation=https://git.wtf-eg.de/kompetenzinventar/ki-frontend#docker
 LABEL org.opencontainers.image.vendor="WTF Kooperative eG"
+
+WORKDIR /usr/share/nginx/html
+
+COPY etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
+COPY --from=builder /dist .

package.json

@@ -7,22 +7,22 @@
     "lint": "vue-cli-service lint"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "~5.0.8",
-    "@vue/cli-plugin-eslint": "~5.0.8",
-    "@vue/cli-plugin-router": "~5.0.8",
-    "@vue/cli-service": "~5.0.8",
+    "@vue/cli-plugin-babel": "^4.5.0",
+    "@vue/cli-plugin-eslint": "^4.5.0",
+    "@vue/cli-plugin-router": "^4.5.0",
+    "@vue/cli-service": "^4.5.0",
     "@vue/compiler-sfc": "^3.0.0",
-    "@babel/eslint-parser": "7.23.10",
-    "bootstrap": "^5.3.2",
-    "bootstrap-icons": "^1.11.3",
+    "babel-eslint": "^10.1.0",
+    "bootstrap": "^5.0.1",
+    "bootstrap-icons": "^1.5.0",
     "core-js": "^3.6.5",
-    "eslint": "^7.32.0",
+    "eslint": "^6.7.2",
     "eslint-plugin-vue": "^7.0.0",
     "sass": "^1.37.5",
     "sass-loader": "^10.2.0",
-    "v-tooltip": "^4.0.0-beta.17",
-    "vue": "^3.4.0",
-    "vue-router": "^4.2.5",
-    "vuex": "^4.1.0"
+    "v-tooltip": "^4.0.0-alpha.1",
+    "vue": "^3.0.0",
+    "vue-router": "^4.0.0-0",
+    "vuex": "^4.0.2"
   }
 }

src/assets/global.scss

@@ -21,11 +21,3 @@
 .search-card{
   height: 100%;
 }
-
-.card-body {
-  background-color: #fff;
-}
-
-.list-group-flush > .list-group-item {
-  background-color: #fff;
-}

src/mixins/request.mixin.js

@@ -95,10 +95,11 @@ export default {
         console.error(error);
       }
     },
-    async submitFormEdit() {
+    async submitFormEdit(isProfileVisible) {
       this.showErrorMessage = false
       this.showSuccessMessage = false
       const userId = store.state.currentUserId
+      this.profile.visible = isProfileVisible;
 
       try {
         const body = JSON.stringify(this.profile)

src/views/profile/Edit.vue

@@ -12,25 +12,8 @@ SPDX-License-Identifier: AGPL-3.0-or-later
       </div>
     </div>
     <div class="container">
-      <form @submit.prevent="submitFormEdit()">
+      <form @submit.prevent="submitFormEdit(false)">
         <Section title="Grunddaten">
-          <div class="mb-4">
-            <div class="form-check form-switch">
-              <input
-                class="form-check-input"
-                type="checkbox"
-                role="switch"
-                v-model="profile.visible"
-                id="visibility"
-              >
-              <label
-                class="form-check-label"
-                for="visibility">
-                Profil für angemeldete Benutzer sichtbar
-              </label>
-            </div>
-          </div>
-
           <div class="row mb-4">
             <div class="col-12 col-md-4 mb-3 mb-md-0">
               <label class="form-label">Nickname</label>
@@ -223,10 +206,16 @@ SPDX-License-Identifier: AGPL-3.0-or-later
               Gespeichert
             </div>
             <button
-              class="btn btn-primary ms-3"
-              @click="submitFormEdit()"
+              class="btn btn-secondary ms-3"
+              @click="submitFormEdit(false)"
             >
-              Speichern
+              Entwurf Speichern
+            </button>
+            <button
+              class="btn btn-primary ms-3"
+              @click="submitFormEdit(true)"
+            >
+              Speichern und Veröffentlichen
             </button>
           </div>
         </div>