fix(resources/summary): structured causes empty default select option (#5007)

Switches from using `format` query param to `environment` in the summary
view, as long as there is no `structured` view option.

Closes #4979

---------

Signed-off-by: schogges <moritz.fleck@konghq.com>

Author: schogges

packages/kuma-gui/src/app/policies/sources.ts

@@ -85,6 +85,10 @@ export const sources = (api: KumaApi) => {
             mesh,
             name,
           },
+          // @ts-expect-error - query parameter not listed in OAS
+          query: {
+            format: 'kubernetes',
+          },
         },
       })
       return YAML.stringify(res.data)

packages/kuma-gui/src/app/resources/sources.ts

@@ -83,9 +83,10 @@ export const sources = (api: KumaApi) => {
           path: {
             kri: params.kri,
           },
-        },
-        query: {
-          format: 'kubernetes',
+          // @ts-expect-error - query parameter not listed in OAS
+          query: {
+            format: 'kubernetes',
+          },
         },
       })
 

packages/kuma-gui/src/app/resources/views/ResourceDetailView.vue

@@ -5,7 +5,7 @@
       mesh: '',
       kri: '',
       resourcePath: '',
-      format: String,
+      environment: String,
       codeSearch: '',
       codeFilter: false,
       codeRegExp: false,
@@ -143,11 +143,11 @@
             >
               <XSelect
                 :label="t('resources.routes.item.format')"
-                :selected="route.params.format"
+                :selected="route.params.environment"
                 @change="(value) => {
-                  route.update({ format: value })
+                  route.update({ environment: value })
                 }"
-                @vue:before-mount="$event?.props?.selected && options.includes($event.props.selected) && $event.props.selected !== route.params.format && route.update({ format: $event.props.selected })"
+                @vue:before-mount="$event?.props?.selected && options.includes($event.props.selected) && $event.props.selected !== route.params.environment && route.update({ environment: $event.props.selected })"
               >
                 <template
                   v-for="value in options"
@@ -163,7 +163,7 @@
             :data="[sourceData]"
             v-slot="{ data: [data] }"
           >
-            <template v-if="route.params.format !== 'k8s'">
+            <template v-if="route.params.environment !== 'k8s'">
               <XCodeBlock
                 data-testid="codeblock-yaml-universal"
                 language="yaml"

packages/kuma-gui/src/app/resources/views/ResourceSummaryView.vue

@@ -6,7 +6,7 @@
       codeSearch: '',
       codeFilter: false,
       codeRegExp: false,
-      format: String,
+      environment: String,
     }"
     v-slot="{ route, t, uri }"
   >
@@ -73,11 +73,11 @@
                   >
                     <XSelect
                       :label="t('resources.routes.item.format')"
-                      :selected="route.params.format"
+                      :selected="route.params.environment"
                       @change="(value) => {
-                        route.update({ format: value })
+                        route.update({ environment: value })
                       }"
-                      @vue:before-mount="$event?.props?.selected && options.includes($event.props.selected) && $event.props.selected !== route.params.format && route.update({ format: $event.props.selected })"
+                      @vue:before-mount="$event?.props?.selected && options.includes($event.props.selected) && $event.props.selected !== route.params.environment && route.update({ environment: $event.props.selected })"
                     >
                       <template
                         v-for="value in options"
@@ -92,7 +92,7 @@
               </header>
             </XLayout>
 
-            <template v-if="route.params.format !== 'k8s'">
+            <template v-if="route.params.environment !== 'k8s'">
               <XCodeBlock
                 data-testid="codeblock-yaml-universal"
                 language="yaml"