Merge branch 'master' into enh/virtual_table

.github/workflows/reuse-tool-lint.yaml

@@ -6,6 +6,6 @@ jobs:
   test:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
+      - uses: actions/checkout@d632683dd7b4114ad314bca15554477dd762a938 # v4.2.0
       - name: REUSE Compliance Check
         uses: fsfe/reuse-action@3ae3c6bdf1257ab19397fab11fd3312144692083 # v4.0.0

backend/__fixtures__/projects.js

@@ -45,6 +45,7 @@ function getProject ({ name, namespace, uid, resourceVersion = '42', createdBy,
   }
   if (costObject) {
     set(metadata, 'annotations["billing.gardener.cloud/costObject"]', costObject)
+    set(metadata, 'annotations["billing.gardener.cloud/costObjectType"]', 'CO')
   }
   return {
     metadata,

backend/lib/routes/config.js

@@ -50,7 +50,7 @@ function sanitizeFrontendConfig (frontendConfig) {
   const sanitizedFrontendConfig = _.cloneDeep(frontendConfig)
   const {
     alert = {},
-    costObject = {},
+    costObjects = [],
     sla = {},
     addonDefinition = {},
     accessRestriction: {
@@ -62,7 +62,9 @@ function sanitizeFrontendConfig (frontendConfig) {
   } = sanitizedFrontendConfig
 
   convertAndSanitize(alert, 'message')
-  convertAndSanitize(costObject, 'description')
+  for (const costObject of costObjects) {
+    convertAndSanitize(costObject, 'description')
+  }
   convertAndSanitize(sla, 'description')
   convertAndSanitize(addonDefinition, 'description')
   convertAndSanitize(resourceQuotaHelp, 'text')

charts/__tests__/gardener-dashboard/runtime/dashboard/__snapshots__/configmap.spec.js.snap

@@ -146,6 +146,22 @@ exports[`gardener-dashboard configmap controlPlaneHighAvailabilityHelp should re
 }
 `;
 
+exports[`gardener-dashboard configmap costObjects should render the template with costObjects configuration 1`] = `
+{
+  "frontend": {
+    "costObjects": [
+      {
+        "description": "Example Description",
+        "errorMessage": "Invalid cost object",
+        "regex": "^example.*$",
+        "title": "Cost Object",
+        "type": "CO",
+      },
+    ],
+  },
+}
+`;
+
 exports[`gardener-dashboard configmap experimental should render the template with experimental features 1`] = `
 {
   "frontend": {

charts/__tests__/gardener-dashboard/runtime/dashboard/configmap.spec.js

@@ -163,6 +163,34 @@ describe('gardener-dashboard', function () {
       })
     })
 
+    describe('costObjects', function () {
+      it('should render the template with costObjects configuration', async function () {
+        const values = {
+          global: {
+            dashboard: {
+              frontendConfig: {
+                costObjects: [
+                  {
+                    type: 'CO',
+                    title: 'Cost Object',
+                    description: 'Example Description',
+                    regex: '^example.*$',
+                    errorMessage: 'Invalid cost object'
+                  }
+                ]
+              }
+            }
+          }
+        }
+
+        const documents = await renderTemplates(templates, values)
+        expect(documents).toHaveLength(1)
+        const [configMap] = documents
+        const config = yaml.load(configMap.data['config.yaml'])
+        expect(pick(config, ['frontend.costObjects'])).toMatchSnapshot()
+      })
+    })
+
     describe('oidc', () => {
       let values
 

charts/gardener-dashboard/charts/runtime/templates/dashboard/configmap.yaml

@@ -261,12 +261,15 @@ data:
         identifier: {{ .Values.global.dashboard.frontendConfig.alert.identifier }}
         {{- end }}
       {{- end }}
-      {{- if .Values.global.dashboard.frontendConfig.costObject }}
-      costObject:
-        title: {{ .Values.global.dashboard.frontendConfig.costObject.title }}
-        description: {{ .Values.global.dashboard.frontendConfig.costObject.description }}
-        regex: {{ .Values.global.dashboard.frontendConfig.costObject.regex }}
-        errorMessage: {{ .Values.global.dashboard.frontendConfig.costObject.errorMessage }}
+      {{- if .Values.global.dashboard.frontendConfig.costObjects }}
+      costObjects:
+      {{- range .Values.global.dashboard.frontendConfig.costObjects }}
+      - type: {{ required ".Values.global.dashboard.frontendConfig.costObjects.type is required" (quote .type) }}
+        title: {{ required ".Values.global.dashboard.frontendConfig.costObjects.title is required" (quote .title) }}
+        description: {{ quote .description }}
+        regex: {{ quote .regex }}
+        errorMessage: {{ quote .errorMessage }}
+      {{- end }}
       {{- end }}
       {{- if .Values.global.dashboard.frontendConfig.sla }}
       sla:

charts/gardener-dashboard/values.yaml

@@ -273,8 +273,9 @@ global:
       #       - wide
       #   heartbeatIntervalSeconds: 60
 
-      # # costObject is used for billing purposes and is assigned to the gardener project
-      # costObject:
+      # # costObjects are used for billing purposes and the cost object and type is assigned to the gardener project
+      # costObjects:
+      # - type: CO
       #   title: Cost Object
       #   description: Costs for the control planes of the clusters in this project will be charged to this cost object.
       #   regex: ^([0-9]{10})$

frontend/__fixtures__/config.js

@@ -40,12 +40,15 @@ export default {
     maxExpirationSeconds: 86400,
   },
   seedCandidateDeterminationStrategy: 'MinimalDistance',
-  costObject: {
-    title: 'Cost Center',
-    description: 'Costs for the control planes of the clusters in this project will be charged to this cost center.',
-    regex: '^([0-9]{9,10})?$',
-    errorMessage: 'Must be a valid cost center',
-  },
+  costObjects: [
+    {
+      type: 'CO',
+      title: 'Cost Center',
+      description: 'Costs for the control planes of the clusters in this project will be charged to this cost center.',
+      regex: '^([0-9]{9,10})?$',
+      errorMessage: 'Must be a valid cost center',
+    },
+  ],
   sla: {
     title: 'Terms and Conditions',
     description: '<p><a href="https://gardener.cloud/terms-and-conditions" target="_blank">Terms and Conditions</a></p>',

frontend/src/components/GCodeBlock.vue

@@ -11,7 +11,7 @@ SPDX-License-Identifier: Apache-2.0
   >
     <div
       class="code-block-wrapper"
-      :style="{ 'max-height': height }"
+      :style="{ 'max-height': maxHeight, 'min-width': minWidth }"
     >
       <pre><code
           ref="block"
@@ -62,10 +62,15 @@ export default {
   },
   props: {
     lang: String,
-    height: {
+    maxHeight: {
       type: [Number, String],
       default: '450px',
     },
+    minWidth: {
+      type: [Number, String],
+      default: '100%',
+    },
+
     content: {
       type: String,
       default: '',

frontend/src/components/GCollapsibleItems.vue

@@ -0,0 +1,108 @@
+<!--
+SPDX-FileCopyrightText: 2024 SAP SE or an SAP affiliate company and Gardener contributors
+
+SPDX-License-Identifier: Apache-2.0
+-->
+
+<template>
+  <div
+    v-if="items.length"
+    class="d-flex"
+  >
+    <div
+      class="d-flex align-center"
+    >
+      <template v-if="!expanded">
+        <v-hover v-slot="{ props: hoverProps, isHovering }">
+          <v-chip
+            v-bind="hoverProps"
+            :variant="isHovering ? 'flat' : 'outlined'"
+            size="small"
+            :color="chipColor"
+            label
+            class="pointer"
+            @click="expanded = true"
+          >
+            {{ itemCount }}
+            <v-tooltip
+              location="top"
+              activator="parent"
+            >
+              Expand items
+            </v-tooltip>
+          </v-chip>
+        </v-hover>
+      </template>
+      <template v-else>
+        <div
+          class="d-flex flex-wrap"
+        >
+          <div
+            v-for="(item, i) in items"
+            :key="i"
+            class="d-flex align-center"
+          >
+            <slot
+              name="item"
+              :item="item"
+            />
+          </div>
+        </div>
+      </template>
+    </div>
+    <div>
+      <v-btn
+        v-if="expanded"
+        icon="mdi-close"
+        variant="plain"
+        size="small"
+        @click="expanded = false"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup>
+
+import {
+  toRefs,
+  computed,
+  inject,
+} from 'vue'
+
+const props = defineProps({
+  items: {
+    type: Array,
+    default: () => [],
+  },
+  uid: {
+    type: String,
+    required: false,
+  },
+  injectKey: {
+    type: String,
+    required: false,
+  },
+  chipColor: {
+    type: String,
+    default: 'primary',
+  },
+})
+
+const { items } = toRefs(props)
+const expandedItems = inject(props.injectKey, undefined)
+
+const itemCount = computed(() => {
+  return props.items.length
+})
+
+const expanded = computed({
+  get () {
+    return expandedItems[props.uid] ?? expandedItems.default
+  },
+  set (value) {
+    expandedItems[props.uid] = value
+  },
+})
+
+</script>

frontend/src/components/GCredentialRotationHelp.vue

@@ -0,0 +1,36 @@
+<!--
+SPDX-FileCopyrightText: 2023 SAP SE or an SAP affiliate company and Gardener contributors
+
+SPDX-License-Identifier: Apache-2.0
+-->
+
+<template>
+  <g-generic-action-button-dialog
+    icon="mdi-help-circle-outline"
+    color="toolbar-title"
+    class="mr-4"
+    caption="Credential Rotation Help"
+    can-perform-action
+    cancel-button-text=""
+    confirm-button-text="Close"
+  >
+    <template #tooltip>
+      <span>Help</span>
+    </template>
+    <template #content>
+      <v-card-text>
+        There are many different credentials for Shoots to ensure that various components can communicate with each other and to make sure they are usable and operable.<br>
+        <g-external-link url="https://github.com/gardener/gardener/blob/master/docs/usage/shoot_credentials_rotation.md">
+          This page
+        </g-external-link>
+        explains how these credentials can be rotated to ensure the cluster's security.
+      </v-card-text>
+    </template>
+  </g-generic-action-button-dialog>
+</template>
+
+<script setup>
+
+import GGenericActionButtonDialog from '@/components/dialogs/GGenericActionButtonDialog.vue'
+
+</script>