Merge branch 'develop'

.eslintignore

@@ -0,0 +1,6 @@
+# Ignore Directories
+
+/.nuxt
+/.output
+/.vscode
+/node_modules

.eslintrc

@@ -1,5 +1,15 @@
 {
     "extends": [
       "@nuxtjs/eslint-config-typescript"
-    ]
-  }
+    ],
+    "rules": {
+      "semi": [
+        "error",
+        "always"
+      ],
+      "vue/valid-v-slot": [
+        "error", {
+        "allowModifiers": true
+      }]
+    }
+  }

.github/workflows/starter.yaml

@@ -0,0 +1,136 @@
+name: workflows starter
+on:
+  push: {}
+  workflow_dispatch: {}
+jobs:
+  setup_workflow_env:
+    runs-on: ubuntu-latest
+    outputs:
+      environment: ${{ steps.get_environment_from_git_ref.outputs.environment }}
+      environment_short: ${{ steps.get_environment_from_git_ref.outputs.environment_short }}
+      image_tagged: openatlas-discovery
+      registry_root: ghcr.io/acdh-oeaw/openatlas-discovery/
+      default_port: "5000"
+      submodules: "true"
+      herokuish_base_image: ghcr.io/acdh-oeaw/herokuish-for-cypress/main:latest-22
+      APP_NAME: openatlas-discovery
+# This together with the branch name is also used as the namespace to deploy to
+      APP_ROOT: "/"
+      # SERVICE_ID: "99999" # Better use GtiHub environment variables for this
+      # PUBLIC_URL: "https://some-stuff.acdh-ch-dev.oeaw.ac.at" # Better use GitHub environment variables for this
+      # POSTGRES_ENABLED: "false" # needs to be set to true to enable a postgres db installed next to the deployed app
+# You should not need to have to change anything below this line
+#-----------------------------------------------------------------------------------------------------
+    steps:
+      - name: Get environment from git ref
+        id: get_environment_from_git_ref
+        run: |
+          echo "Running on branch ${{ github.ref_name }}"
+          if [ "${{ github.ref }}" = "refs/heads/main" ]; then
+            echo "environment=production"
+            echo "environment=production" >> $GITHUB_OUTPUT
+            echo "environment_short=prod" >> $GITHUB_OUTPUT
+          else
+            echo "environment=review/${{ github.ref_name }}"
+            echo "environment=review/${{ github.ref_name }}" >> $GITHUB_OUTPUT
+            echo "environment_short=$(echo -n ${{ github.ref_name }} | sed s/feature_// | tr '_' '-' | tr '[:upper:]' '[:lower:]' )" >> $GITHUB_OUTPUT
+          fi
+  _1:
+    needs: [setup_workflow_env]
+    uses:  acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/build-cnb-and-push-to-registry.yaml@main
+    secrets: inherit
+# if you run this outside of of an org that provides KUBE_CONFIG etc as a secret, you need to specify every secret you want to pass by name
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment }}
+      registry_root: ${{ needs.setup_workflow_env.outputs.registry_root }}
+      image_tagged: ${{ needs.setup_workflow_env.outputs.image_tagged }}
+      source_image: ${{ needs.setup_workflow_env.outputs.source_image }}
+      default_port: ${{ needs.setup_workflow_env.outputs.default_port }}
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}
+  _1-mamems:
+    needs: [setup_workflow_env]
+    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/build-herokuish-and-push-to-registry.yaml@main
+    secrets: inherit
+    # if you run this outside of acdh-oeaw yo uneed to specify every secret you want to pass by name
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment}}-mamems
+      registry_root: ${{ needs.setup_workflow_env.outputs.registry_root }}
+      image_tagged: ${{ needs.setup_workflow_env.outputs.image_tagged }}-mamems
+      source_image: ${{ needs.setup_workflow_env.outputs.source_image }}
+      default_port: ${{ needs.setup_workflow_env.outputs.default_port }}
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}
+  _1-approaching-byzantium:
+    needs: [setup_workflow_env]
+    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/build-herokuish-and-push-to-registry.yaml@main
+    secrets: inherit
+    # if you run this outside of acdh-oeaw yo uneed to specify every secret you want to pass by name
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment}}-approaching-byzantium
+      registry_root: ${{ needs.setup_workflow_env.outputs.registry_root }}
+      image_tagged: ${{ needs.setup_workflow_env.outputs.image_tagged }}-approaching-byzantium
+      source_image: ${{ needs.setup_workflow_env.outputs.source_image }}
+      default_port: ${{ needs.setup_workflow_env.outputs.default_port }}
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}
+  _2:
+    needs: [setup_workflow_env]
+    uses:  acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/herokuish-tests-db-url.yaml@main
+    secrets: inherit
+# if you run this outside of acdh-oeaw yo uneed to specify every secret you want to pass by name
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment}}
+      registry_root: ${{ needs.setup_workflow_env.outputs.registry_root }}
+      image_tagged: ${{ needs.setup_workflow_env.outputs.image_tagged }}
+      source_image: ${{ needs.setup_workflow_env.outputs.source_image }}
+      default_port: ${{ needs.setup_workflow_env.outputs.default_port }}
+      herokuish_base_image: ${{ needs.setup_workflow_env.outputs.herokuish_base_image }}
+      POSTGRES_ENABLED: ${{ needs.setup_workflow_env.outputs.POSTGRES_ENABLED }}
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}
+  _3:
+    needs: [setup_workflow_env, _1, _2]
+    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/deploy-cluster-2.yml@main
+    secrets: inherit
+# if you run this outside of acdh-oeaw yo uneed to specify every secret you want to pass by name
+#      KUBE_CONFIG: ${{ secrets.KUBE_CONFIG }}
+#      KUBE_INGRESS_BASE_DOMAIN: ${{ secrets.KUBE_INGRESS_BASE_DOMAIN }}
+#      POSTGRES_USER: ${{ secrets.POSTGRES_USER }}
+#      POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }}
+#      POSTGRES_DB: ${{ secrets.POSTGRES_DB }}
+#      K8S_SECRET_A_VAR_NAME: ${{  }}
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment}}
+      DOCKER_TAG: ${{ needs.setup_workflow_env.outputs.registry_root }}${{ needs.setup_workflow_env.outputs.image_tagged }}
+      APP_NAME: ${{ needs.setup_workflow_env.outputs.APP_NAME }}-${{ needs.setup_workflow_env.outputs.environment_short }}
+      APP_ROOT: ${{ needs.setup_workflow_env.outputs.APP_ROOT }}
+      SERVICE_ID: ${{ needs.setup_workflow_env.outputs.SERVICE_ID }}
+      PUBLIC_URL: ${{ needs.setup_workflow_env.outputs.PUBLIC_URL }}
+      POSTGRES_ENABLED: ${{ needs.setup_workflow_env.outputs.POSTGRES_ENABLED == 'true'}}
+      default_port: "${{ needs.setup_workflow_env.outputs.default_port}}"
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}
+  _3-mamems:
+    needs: [setup_workflow_env, _1-mamems, _2]
+    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/deploy-cluster-2.yml@main
+    secrets: inherit
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment}}-mamems
+      DOCKER_TAG: ${{ needs.setup_workflow_env.outputs.registry_root }}${{ needs.setup_workflow_env.outputs.image_tagged }}-mamems
+      APP_NAME: mamems-app-${{ needs.setup_workflow_env.outputs.environment_short }}
+      APP_ROOT: ${{ needs.setup_workflow_env.outputs.APP_ROOT }}
+      SERVICE_ID: ${{ needs.setup_workflow_env.outputs.SERVICE_ID }}
+      PUBLIC_URL: ${{ needs.setup_workflow_env.outputs.PUBLIC_URL }}
+      POSTGRES_ENABLED: ${{ needs.setup_workflow_env.outputs.POSTGRES_ENABLED == 'true'}}
+      default_port: "${{ needs.setup_workflow_env.outputs.default_port}}"
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}
+  _3-approaching-byzantium:
+    needs: [setup_workflow_env, _1-approaching-byzantium, _2]
+    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/deploy-cluster-2.yml@main
+    secrets: inherit
+    with:
+      environment: ${{ needs.setup_workflow_env.outputs.environment}}-approaching-byzantium
+      DOCKER_TAG: ${{ needs.setup_workflow_env.outputs.registry_root }}${{ needs.setup_workflow_env.outputs.image_tagged }}-approaching-byzantium
+      APP_NAME: approaching-byzantium-app-${{ needs.setup_workflow_env.outputs.environment_short }}
+      APP_ROOT: ${{ needs.setup_workflow_env.outputs.APP_ROOT }}
+      SERVICE_ID: ${{ needs.setup_workflow_env.outputs.SERVICE_ID }}
+      PUBLIC_URL: ${{ needs.setup_workflow_env.outputs.PUBLIC_URL }}
+      POSTGRES_ENABLED: ${{ needs.setup_workflow_env.outputs.POSTGRES_ENABLED == 'true'}}
+      default_port: "${{ needs.setup_workflow_env.outputs.default_port}}"
+      submodules: ${{ needs.setup_workflow_env.outputs.submodules }}

.gitignore

@@ -8,6 +8,11 @@ coverage
 .env
 dist
 
+temp
+
 # IDE / Editor
 .idea/
 
+# Cypress
+cypress/videos/
+cypress/screenshots/

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx lint-staged

App.vue

@@ -0,0 +1,20 @@
+<template>
+  <div>
+    <NuxtLayout>
+      <NuxtPage />
+    </NuxtLayout>
+  </div>
+</template>
+<script setup lang="ts">
+
+const { $discoveryConfig } = useNuxtApp();
+
+useHead({
+  titleTemplate: (titleChunk) => {
+    return titleChunk ? `${titleChunk} - ${$discoveryConfig.title}` : $discoveryConfig.title;
+  },
+  link: [
+    getFavicon()
+  ]
+});
+</script>

README.md

@@ -10,9 +10,8 @@ for further development.
 * [Wiki](https://redmine.openatlas.eu/projects/openatlas-discovery/wiki/Wiki)
 * [Issues](https://redmine.openatlas.eu/projects/openatlas-discovery/issues)
 
-# Content v2 Minimal Starter
-Look at the [Content documentation](https://content-v2.nuxtjs.org/) to learn
-more.
+# Content
+The content can be managed either by placing the content into the `content` directory as well as the configuration file `discoveryConfig.json`
 
 ## Setup
 Make sure to install the dependencies:
@@ -28,6 +27,40 @@ npm install
 pnpm install --shamefully-hoist
 ```
 
+and to set the environment variables:
+
+```
+NUXT_IMAGE_DOMAINS = domain-url-for-images // See nuxt image documentation
+```
+
+#### Development Setup
+To make use of automatic linting on commit, initiate husky by running the command
+
+```bash
+# npm
+npm run prepare
+```
+
+## Content Fetching
+
+If you want to fetch the content and configuration from a Content repository, you can do so by running the `..\deployment\loadContent.mjs` script.
+
+Set up the enviroment Variables `CONTENT_REPO` & `CONTENT_BRANCH`:
+
+```bash
+# Windows
+$env:CONTENT_REPO='link-to-clone-your-repository'
+
+$env:CONTENT_BRANCH='main'
+```
+
+Run the script:
+
+```bash
+# npm
+npm run load-content
+```
+
 ## Development Server
 Start the development server on http://localhost:3000
 
@@ -51,11 +84,20 @@ npm run preview
 Checkout the [deployment documentation](https://v3.nuxtjs.org/docs/deployment)
 for more information.
 
-# Configuration
-## Content
-The content management is handled by [Content V2](https://content.nuxtjs.org/).
-The content of the landing page is defined by the files in 
-`/content` + language e.g. `/en` + `index.md`.
+## Testing
+
+To test the frontend we use Cypress to run E2E tests.
+
+### Testing with Cypress
+
+1. To start the test with cypress, first start the nuxt server (`npm run dev`)
+2. To start the testing you have two options:
+	1. Start the UI with `npm run cy:open` this will open a new window that will allow you to run test individually, as well as inspect each of the steps during the test.
+	2. Run all the specs directly with `npm run cy:run`. This will run through all the tests and output the results in the console. If you run `npm run cy:run-record` cypress will also record videos of the tests and save them under `cypress/videos`.
+
+### Developing with and for Cypress
+
+- To enable tests to run properly even when changing component we should use selectors that are prone to stay the same. Therefore we should follow the [Best Practice](https://docs.cypress.io/guides/references/best-practices#Selecting-Elements) and add a `data-test` attribute to elements we intend to test.
 
 # Licensing
 All code unless otherwise noted is licensed under the terms of the MIT License

assets/classes.json

@@ -108,7 +108,7 @@
       "systemClass": "object_location",
       "crmClass": "E53",
       "view": null,
-      "icon": null,
+      "icon": "mdi-map-marker",
       "en": "Place"
     },
     {
@@ -160,4 +160,4 @@
       "icon": "mdi-code-braces",
       "en": "Type"
     }
-  ]
+  ]

components/ContentNavigation/CNCustom.vue

@@ -0,0 +1,52 @@
+<template>
+  <template v-if="navigation !== null">
+    <template
+      v-for="el of navigation"
+      :key="el._id"
+    >
+      <ContentNavigationCNElement :nav-item="el" />
+    </template>
+  </template>
+</template>
+<script setup lang="ts">
+import { QueryBuilderParams } from '@nuxt/content/dist/runtime/types';
+import { useI18n } from 'vue-i18n';
+const Locale = useI18n().locale;
+
+const updateNaviagation = ref(false);
+
+const navLocaleQuery = computed(() : QueryBuilderParams => {
+  return {
+    where: [
+      {
+        // Create a regex pattern to match the locale in the path
+        _path: { $contains: `/${Locale.value}/` }
+      }
+    ]
+  };
+});
+
+const { data: fetchedNavigation } = await useAsyncData(
+  'navigation',
+  () => {
+    const contentNav = fetchContentNavigation(navLocaleQuery.value);
+    return contentNav;
+  },
+  {
+    watch: [
+      navLocaleQuery,
+      updateNaviagation
+    ]
+  });
+
+onBeforeMount(() => {
+  if (!fetchedNavigation.value || !fetchedNavigation.value?.[0]?._path.includes(Locale.value)) {
+    updateNaviagation.value = true;
+  }
+});
+
+const navigation = computed(() => {
+  return fetchedNavigation.value?.[0]?.children ?? null;
+});
+
+</script>

components/ContentNavigation/CNElement.vue

@@ -0,0 +1,42 @@
+<template>
+  <template v-if="isDirectory">
+    <v-btn variant="plain" :ripple="false">
+      {{ navItem.title }}
+      <v-menu activator="parent">
+        <v-list>
+          <v-list-item
+            v-for="(item, index) in navItem.children"
+            :key="index"
+            :value="index"
+          >
+            <ContentNavigationCNElement :nav-item="item" />
+          </v-list-item>
+        </v-list>
+      </v-menu>
+    </v-btn>
+  </template>
+  <template v-else>
+    <v-btn variant="plain" :ripple="false" :to="navItem._path">
+      {{ navItem.title || navItem.navTitle }}
+    </v-btn>
+  </template>
+</template>
+<script setup lang="ts">
+import { defineProps } from 'vue';
+import { NavItem } from '@nuxt/content/dist/runtime/types';
+
+// Add a prop that takes a NavigationItem
+
+const props = defineProps<{
+  navItem: NavItem;
+}>();
+
+const isDirectory = computed(() => {
+  return props.navItem.children !== undefined;
+});
+
+const navItem = computed(() => {
+  return props.navItem;
+});
+
+</script>