22 changed files with 22550 additions and 8304 deletions
--- a/.dockerignore
+++ b/.dockerignore
@ -1,11 +1,2 @@
-.browserslistrc
-.dockerignore
-.drone.yml
-.editorconfig
 .git
-.gitignore
-.reuse
-Dockerfile
-LICENSES
-README.md
 node_modules
--- a/.drone.yml
+++ b/.drone.yml
@ -4,118 +4,22 @@
 # SPDX-License-Identifier: AGPL-3.0-or-later
 kind: pipeline
 type: docker
-name: qa
-
-trigger:
-  event:
-    - push
-    - pull_request
-  branch:
-    - main
+name: default

 steps:
 - name: reuse
-    image: fsfe/reuse:5.0.2-debian@sha256:7928d25ed14a1bc22758d917ebc6aecbb8bcd1a4da7aa748d7179c9011bbfb0b
-  - name: lint
-    image: node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9
-    commands:
-      - npm ci
-      - npm run lint -- --no-fix
-  - name: audit
-    image: node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9
-    commands:
-      - npm install -g better-npm-audit
-      - better-npm-audit audit --production --level=moderate
-  - name: docker-dry-run
-    image: plugins/docker:20.18.4@sha256:a8d3d86853c721492213264815f1d00d3ed13f42f5c1855a02f47fa4d5f1e042
+  image: fsfe/reuse:latest
+- name: docker-publish
+  image: plugins/docker
  settings:
-      registry: git.wtf-eg.de
-      repo: git.wtf-eg.de/kompetenzinventar/frontend
+    registry: registry.wtf-eg.net
+    repo: registry.wtf-eg.net/ki-frontend
    target: ki-frontend
-      dry_run: true
+    auto_tag: true
+    username:
+      from_secret: "docker_username"
+    password:
+      from_secret: "docker_password"
  when:
-      event:
-        - pull_request
-
---
-kind: pipeline
-type: docker
-name: build
-
-trigger:
-  event:
-    - push
    branch:
      - main
-
-depends_on:
-  - qa
-
-steps:
-  - name: docker-publish
-    image: plugins/docker:20.18.4@sha256:a8d3d86853c721492213264815f1d00d3ed13f42f5c1855a02f47fa4d5f1e042
-    settings:
-      registry: git.wtf-eg.de
-      repo: git.wtf-eg.de/kompetenzinventar/frontend
-      target: ki-frontend
-      auto_tag: true
-      username:
-        from_secret: "docker_username"
-      password:
-        from_secret: "docker_password"
-
---
-kind: pipeline
-type: docker
-name: deploy
-
-trigger:
-  event:
-    - push
-  branch:
-    - main
-
-depends_on:
-  - build
-
-steps:
-  - name: deploy-dev
-    image: appleboy/drone-ssh:1.7.5@sha256:995677e073454912f26d4c0fdd2f9df2e1f5a30d6603d3f2ece667311b6babb3
-    settings:
-      host:
-        - dev01.wtf-eg.net
-      username: drone_deployment
-      key:
-        from_secret: "dev01_deployment_key"
-      command_timeout: 2m
-      script:
-        - echo "Executing forced command..."
-
---
-kind: pipeline
-type: docker
-name: tag-release
-
-trigger:
-  event:
-    - tag
-
-steps:
-  - name: reuse
-    image: fsfe/reuse:5.0.2-debian@sha256:7928d25ed14a1bc22758d917ebc6aecbb8bcd1a4da7aa748d7179c9011bbfb0b
-  - name: lint
-    image: node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9
-    commands:
-      - npm ci
-      - npm run lint -- --no-fix
-  - name: docker-publish
-    image: plugins/docker:20.18.4@sha256:a8d3d86853c721492213264815f1d00d3ed13f42f5c1855a02f47fa4d5f1e042
-    settings:
-      registry: git.wtf-eg.de
-      repo: git.wtf-eg.de/kompetenzinventar/frontend
-      target: ki-frontend
-      auto_tag: true
-      username:
-        from_secret: "docker_username"
-      password:
-        from_secret: "docker_password"
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -8,13 +8,10 @@ module.exports = {
    'eslint:recommended'
  ],
  parserOptions: {
-    parser: '@babel/eslint-parser'
+    parser: 'babel-eslint'
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'vue/multi-word-component-names': 'off',
-    'vue/no-useless-template-attributes': 'off',
-    'vue/no-reserved-component-names': 'off'
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
  }
 }
--- a/.reuse/dep5
+++ b/.reuse/dep5
@ -0,0 +1,28 @@
+Format: https://www.debian.org/doc/packaging-manuals/copyright-format/1.0/
+Upstream-Name: ki-frontend
+Upstream-Contact: Scammo <kontakt@samuelbrinkmann.de>
+Source: https://git.wtf-eg.de/kompetenzinventar/ki-frontend
+
+Files: package.json package-lock.json
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: AGPL-3.0-or-later
+
+Files: .browserslistrc .dockerignore .eslintrc.js .gitignore 
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: AGPL-3.0-or-later
+
+Files: src/assets/img/wtf*
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: LicenseRef-WTF
+
+Files: src/assets/language_level.json src/assets/skill_level.json
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: AGPL-3.0-or-later
+
+Files: public/img/bootstrap-icons-1.5.0/*
+Copyright: Copyright (c) 2019-2020 The Bootstrap Authors
+License: MIT
+
+Files: public/fonts/Lato*
+Copyright: 2010-2015, Łukasz Dziedzic (dziedzic@typoland.com)
+License: OFL-1.1-RFN
--- a/21
+++ b/21
@ -2,27 +2,14 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later

-FROM node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9 as builder
+FROM node:14-alpine as builder

-COPY package.json package-lock.json ./
-RUN npm install
-
-COPY .eslintrc.js .
-COPY babel.config.js .
-COPY public public
-COPY src src
+COPY . ./

 RUN npm ci && npm run build


-FROM nginx:1.27-alpine@sha256:2140dad235c130ac861018a4e13a6bc8aea3a35f3a40e20c1b060d51a7efd250 as ki-frontend
-
-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
+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
-COPY --from=builder /dist .
--- a/README.md
+++ b/README.md
@ -41,14 +41,6 @@ Folgende Kanäle gibt es für die Kommunikation über das Kompetenzinventar:
 npm ci
 ```

-### Pre requirements
-
-* Node 20
-  * Wenn du eine andere node version installiert hast, kannst du [nvm](https://github.com/nvm-sh/nvm) benutzen um schnell zwischen node version zu wechseln
-* NPM
-* (KI-backend)[https://git.wtf-eg.de/kompetenzinventar/ki-backend] muss lokal laufen
-
-
 ### Konfigurationsdatei anpassen

 ```
@ -56,6 +48,7 @@ cp public/config.js.dev public/config.js
 vi public/config.js
 ```

+
 ### Compiles and hot-reloads for development
 ```
 npm run serve
--- a/REUSE.toml
+++ b/REUSE.toml
@ -1,40 +0,0 @@
-version = 1
-SPDX-PackageName = "ki-frontend"
-SPDX-PackageSupplier = "Scammo <kontakt@samuelbrinkmann.de>"
-SPDX-PackageDownloadLocation = "https://git.wtf-eg.de/kompetenzinventar/ki-frontend"
-
-[[annotations]]
-path = ["package.json", "package-lock.json", "renovate.json"]
-precedence = "aggregate"
-SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
-SPDX-License-Identifier = "AGPL-3.0-or-later"
-
-[[annotations]]
-path = [".browserslistrc", ".dockerignore", ".eslintrc.js", ".gitignore", "REUSE.toml"]
-precedence = "aggregate"
-SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
-SPDX-License-Identifier = "AGPL-3.0-or-later"
-
-[[annotations]]
-path = "src/assets/img/wtf**"
-precedence = "aggregate"
-SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
-SPDX-License-Identifier = "LicenseRef-WTF"
-
-[[annotations]]
-path = ["src/assets/language_level.json", "src/assets/skill_level.json"]
-precedence = "aggregate"
-SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
-SPDX-License-Identifier = "AGPL-3.0-or-later"
-
-[[annotations]]
-path = "public/img/bootstrap-icons-1.5.0/**"
-precedence = "aggregate"
-SPDX-FileCopyrightText = "Copyright (c) 2019-2020 The Bootstrap Authors"
-SPDX-License-Identifier = "MIT"
-
-[[annotations]]
-path = "public/fonts/Lato**"
-precedence = "aggregate"
-SPDX-FileCopyrightText = "2010-2015, Łukasz Dziedzic (dziedzic@typoland.com)"
-SPDX-License-Identifier = "OFL-1.1-RFN"
--- a/etc/nginx/conf.d/default.conf
+++ b/etc/nginx/conf.d/default.conf
@ -9,24 +9,10 @@ server {

    #access_log  /var/log/nginx/host.access.log  main;

-    root   /usr/share/nginx/html;
-
-    # routes without dots serve the index.html without caching
    location / {
-        add_header Cache-Control "no-cache";
-        try_files $uri $uri/index.html /index.html;
-    }
-  
-    # static js and css files that get replaced instead of updated
-    location ~ \.(js|css) {
-        add_header Cache-Control "public, max-age=31536000, immutable";
-        try_files $uri =404;
-    }
-  
-    # cache other static files for 30 days
-    location ~ \.(?!html) {
-        add_header Cache-Control "public, max-age=2592000";
-        try_files $uri =404;
+        root   /usr/share/nginx/html;
+        index  index.html index.htm;
+        try_files $uri $uri/ /index.html;
    }

    #error_page  404              /404.html;
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -1,31 +1,28 @@
 {
  "name": "@wtf/ki-frontend",
-  "version": "1.1.0",
+  "version": "0.1.0",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "devDependencies": {
-    "@babel/eslint-parser": "7.25.9",
-    "@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/compiler-sfc": "3.5.6",
-    "bootstrap": "5.3.3",
-    "bootstrap-icons": "1.11.3",
-    "core-js": "3.39.0",
-    "eslint": "8.57.1",
-    "eslint-plugin-vue": "9.30.0",
-    "sass": "1.80.4",
-    "sass-loader": "16.0.3",
-    "v-tooltip": "4.0.0-beta.17",
-    "vue": "3.5.6",
-    "vue-router": "4.4.5",
-    "vuex": "4.1.0"
-  },
-  "optionalDependencies": {
-    "sass-embedded": "1.80.4"
+    "@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": "^10.1.0",
+    "bootstrap": "^5.0.1",
+    "bootstrap-icons": "^1.5.0",
+    "core-js": "^3.6.5",
+    "eslint": "^6.7.2",
+    "eslint-plugin-vue": "^7.0.0",
+    "sass": "^1.37.5",
+    "sass-loader": "^10.2.0",
+    "v-tooltip": "^4.0.0-alpha.1",
+    "vue": "^3.0.0",
+    "vue-router": "^4.0.0-0",
+    "vuex": "^4.0.2"
  }
 }
--- a/renovate.json
+++ b/renovate.json
@ -1,21 +0,0 @@
-{
-  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
-    "config:best-practices",
-    "group:linters",
-    "group:test",
-    "npm:unpublishSafe",
-    ":disableDependencyDashboard",
-    ":maintainLockFilesWeekly",
-    ":pinAllExceptPeerDependencies",
-    ":separateMultipleMajorReleases"
-  ],
-  "packageRules": [
-    {
-      "matchPackageNames": [
-        "node"
-      ],
-      "allowedVersions": "/^[1-9][02468]\\./"
-    }
-  ]
-}
--- a/src/components/AutoComplete.vue
+++ b/src/components/AutoComplete.vue
@ -14,7 +14,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
    @update-values="this.$emit('update-values', this.values)"
  >
  </profile-list>
-  <div v-bind="$attrs" class="card-body bg-white">
+  <div v-bind="$attrs" class="card-body">
    <div class="row">
      <div class="col-12 col-md-4 col-lg-3 col-xl-2">
        <div class="form-control-plaintext form-control-sm">Eintrag hinzufügen:</div>
@ -34,7 +34,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
        <div v-if="searchResults">
          <ul class="list-group">
            <li
-              class="list-group-item bg-white"
+              class="list-group-item"
              v-for="result in searchResults"
              :key="result.id"
              @click="addResult(result)"
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
          <div class="fw-bold text-white mb-2">Kompetenzinventar</div>
          <ul class="list-unstyled">
            <li><a href="https://git.wtf-eg.de/kompetenzinventar">Quellcode</a></li>
-            <li><a href="https://git.wtf-eg.de/kompetenzinventar/ki-doku/issues/new/choose">Problem melden</a></li>
+            <li><a href="https://git.wtf-eg.de/kompetenzinventar/ki-frontend/issues/new">Problem melden</a></li>
          </ul>
        </div>
      </div>
--- a/src/components/Paginator.vue
+++ b/src/components/Paginator.vue
@ -1,50 +0,0 @@
-<!--
-SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
-
-SPDX-License-Identifier: AGPL-3.0-or-later
-->
-
-<template>
-  <ul class="pagination">
-    <li
-      class="page-item"
-        :class="{ active: page === current }"
-      v-for="page in pages"
-      :key="page"
-    >
-      <span
-        class="page-link pointer"
-        :class="{ 'bg-white': page !== current }"
-        @click="onPageClicked(page)"
-      >
-        {{ page }}
-      </span>
-    </li>
-  </ul>
-</template>
-<script>
-
-export default {
-  name: 'Paginator',
-  props: {
-    page: Number,
-    current: Number,
-    pages: Number
-  },
-  methods: {
-    onPageClicked(page) {
-      if (page == this.current) {
-        return
-      }
-
-      this.$emit('page', page)
-    }
-  }
-}
-
-</script>
-<style>
-.pointer {
-  cursor: pointer;
-}
-</style>
--- a/src/components/ProfileList.vue
+++ b/src/components/ProfileList.vue
@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
 <template>
  <ul class="list-group list-group-flush">
    <li
-      class="list-group-item bg-white"
+      class="list-group-item"
      v-for="(value, valueKey) in values"
      :key="value.id"
    >
--- a/src/components/SearchResult.vue
+++ b/src/components/SearchResult.vue
@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
    class="text-decoration-none d-flex"
    :to="{ path: `/s/profile/${profile.user_id}` }"
  >
-    <div class="card w-100 bg-white">
+    <div class="card w-100">
      <div class="card-body d-flex">
        <div class="d-flex align-items-center justify-content-center me-3">
          <Avatar :name="profile.nickname"/>
--- a/src/components/profile/Header.vue
+++ b/src/components/profile/Header.vue
@ -16,14 +16,6 @@ SPDX-License-Identifier: AGPL-3.0-or-later
          </span>
        </div>
      </div>
-      <div v-if="profile?.address?.name">
-        <div class="d-flex align-items-center">
-          <i class="fs-4 bi bi-person-fill text-dark mx-2"></i>
-          <div class="text-white">
-            a.k.a. {{ profile.address.name }}
-          </div>
-        </div>
-      </div>
      <div v-if="location">
        <div class="d-flex align-items-center">
          <i class="fs-4 bi bi-geo-alt-fill text-dark mx-2"></i>
--- a/src/components/profile/Section.vue
+++ b/src/components/profile/Section.vue
@ -11,7 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
    </h3>
    <div class="card w-100">
      <slot name="card-body">
-        <div class="card-body bg-white">
+        <div class="card-body">
          <slot></slot>
        </div>
      </slot>
--- a/src/mixins/request.mixin.js
+++ b/src/mixins/request.mixin.js
@ -95,11 +95,10 @@ export default {
        console.error(error);
      }
    },
-    async submitFormEdit(isProfileVisible) {
+    async submitFormEdit() {
      this.showErrorMessage = false
      this.showSuccessMessage = false
      const userId = store.state.currentUserId
-      this.profile.visible = isProfileVisible;

      try {
        const body = JSON.stringify(this.profile)
--- a/src/store/search.js
+++ b/src/store/search.js
@ -12,10 +12,8 @@ export default {
      profiles: [],
      error: false,
      errorMessage: '',
-      pages: 1,
      query: {
-        search: '',
-        page: 1
+        search: ''
      }
    }
  },
@ -42,17 +40,11 @@ export default {
      state.errorMessage = errorMessage
    },
    setQuerySearch(state, search) {
-      state.query = {...state.query, search}
-    },
-    setPages(state, pages) {
-      state.pages = pages
-    },
-    setQueryPage(state, page) {
-      state.query = {...state.query, page}
+      state.query.search = search
    }
  },
  actions: {
-    async search({state, commit, rootState, dispatch}) {
+    async search({state, commit, rootState}) {
      if (state.searching) {
        return
      }
@ -73,8 +65,6 @@ export default {
        url.searchParams.append('search', state.query.search)
      }

-      url.searchParams.append('page', state.query.page)
-
      const headers = {
        Authorization: `Bearer ${rootState.token}`,
      }
@ -91,19 +81,8 @@ export default {
        return
      }

-      console.log(response.ok)
-      console.log(response.status)
-      console.log(state.query.page)
-
      clearTimeout(timeoutId)

-      if (!response.ok && response.status === 404 && state.query.page != 1) {
-        commit('setQueryPage', 1)
-        commit('setSearching', false)
-        await dispatch('search')
-        return
-      }
-
      if (!response.ok) {
        commit('setError', true)
        commit('clearProfiles')
@ -114,7 +93,6 @@ export default {

      const responseData = await response.json()
      commit('setProfiles', responseData.profiles)
-      commit('setPages', responseData.pages)
      commit('setSearching', false)
      commit('hideSpinner')
    }
--- a/src/views/Search.vue
+++ b/src/views/Search.vue
@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
                    class="form-control"
                    id="searchText"
                    v-model="searchText"
-                    placeholder="Nick, Name, Fähigkeit, Sprache"
+                    placeholder="Nick, Fähigkeit, Sprache"
                    ref="searchTextInput"
                  />
                </div>
@ -53,26 +53,12 @@ SPDX-License-Identifier: AGPL-3.0-or-later
        <p v-if="searchText !== ''">Probiere eine andere Suche.</p>
      </div>
      <div v-else-if="showResults">
-        <div class="d-flex justify-content-around">
-          <Paginator 
-            :pages="pages" 
-            :current="currentPage"
-            @page="handlePageSelected"
-          />
-        </div>
        <SearchResult
          v-for="profile in profiles"
          :key="profile.user_id"
          class="mb-3"
          :profile="profile"
        />
-        <div class="d-flex justify-content-around">
-          <Paginator 
-            :pages="pages" 
-            :current="currentPage"
-            @page="handlePageSelected"
-          />
-        </div>
      </div>
    </div>
  </div>
@ -81,29 +67,21 @@ SPDX-License-Identifier: AGPL-3.0-or-later
 <script>
 import { mapState } from 'vuex'

-import Paginator from '@/components/Paginator'
 import SearchResult from '@/components/SearchResult'
 import Spinner from '@/components/Spinner'

 export default {
  name: 'Search',
  components: {
-    Paginator,
    SearchResult,
    Spinner,
  },
-  data() {
-    return {
-      textChanged: false
-    }
-  },
  computed: {
    ...mapState({
      searching: state => state.search.searching,
      profiles: state => state.search.profiles,
      error: state => state.search.error,
      showSpinner: state => state.search.showSpinner,
-      pages: state => state.search.pages,
    }),
      searchText: {
        get() {
@ -111,15 +89,6 @@ export default {
        },
        set(text) {
          this.$store.commit('search/setQuerySearch', text)
-          this.textChanged = true
-        }
-      },
-      currentPage: {
-        get() {
-          return this.$store.state.search.query.page
-        },
-        set(page) {
-          this.$store.commit('search/setQueryPage', page)
        }
      },
      showNoResults() {
@ -140,37 +109,21 @@ export default {
  },
  methods: {
    handleSubmit() {
-      if (this.textChanged === true) {
-        this.$store.commit('search/setQueryPage', 1)
-      }
-      this.pushState()
+      this.$router.push({ query: { query: this.searchText }})
      this.$store.dispatch('search/search')
    },
    focusSearchText() {
      this.$nextTick(() => {
        this.$refs.searchTextInput.focus()
      })
-    },
-    handlePageSelected(page) {
-      this.currentPage = page
-      this.pushState()
-      this.$store.dispatch('search/search')
-    },
-    pushState() {
-      this.$router.push({ query: { query: this.searchText, page: this.currentPage }})
    }
  },
  created() {
-    if (this.$route.query.query) {
+    if (this.$route.query.query !== undefined) {
      this.searchText = this.$route.query.query
      this.$store.commit('search/clearProfiles')
    }

-    if (this.$route.query.page) {
-      this.currentPage = parseInt(this.$route.query.page, 10)
-      this.$store.commit('search/clearProfiles')
-    }
-
    this.$store.dispatch('search/search')
  }
 };
--- a/src/views/profile/Edit.vue
+++ b/src/views/profile/Edit.vue
@ -12,10 +12,27 @@ SPDX-License-Identifier: AGPL-3.0-or-later
      </div>
    </div>
    <div class="container">
-      <form @submit.prevent="submitFormEdit(false)">
+      <form @submit.prevent="submitFormEdit()">
        <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">
+            <div class="col-6 mb-3">
              <label class="form-label">Nickname</label>
              <input
                type="text"
@ -26,17 +43,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
                required
              />
            </div>
-            <div class="col-12 col-md-4 mb-3 mb-md-0">
-              <label class="form-label">Klarname (optional)</label>
-              <input
-                type="text"
-                class="form-control"
-                id="realname"
-                maxlength="25"
-                v-model="profile.address.name"
-              />
-            </div>
-            <div class="col-12 col-md-4">
+            <div class="col-6 mb-3">
              <label class="form-label">
                Pronomen
                <i class="bi bi-info-circle" v-tooltip="pronounsTooltip"></i>
@ -167,7 +174,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
            </Section>

            <Section title="Sonstiges">
-              <div class="mb-3 bg-white">
+              <div class="mb-3">
                <label class="form-label">Über mich</label>
                <textarea
                  class="form-control"
@ -205,17 +212,11 @@ SPDX-License-Identifier: AGPL-3.0-or-later
              <i class="bi bi-check-lg"></i>
              Gespeichert
            </div>
-            <button
-              class="btn btn-secondary ms-3"
-              @click="submitFormEdit(false)"
-            >
-              Entwurf Speichern
-            </button>
            <button
              class="btn btn-primary ms-3"
-              @click="submitFormEdit(true)"
+              @click="submitFormEdit()"
            >
-              Speichern und Veröffentlichen
+              Speichern
            </button>
          </div>
        </div>