From a0a999c5847bcb33ccfa03ec2563d0755eec635c Mon Sep 17 00:00:00 2001 From: Mo <24444046+schogges@users.noreply.github.com> Date: Wed, 22 Jan 2025 12:34:28 +0000 Subject: [PATCH] feat: in summary drawers use dropdown to select config format (#3445) As a continuation of #3414 this brings the dropdown to select the preferred config format to all the other summary drawers. ![image](https://github.com/user-attachments/assets/7fb7f9a1-40a8-42a5-bea4-e83e306ecff6) ![Screenshot 2025-01-22 at 10 47 11](https://github.com/user-attachments/assets/f15b1472-a3fa-49aa-940f-b4bab4fe67de) Part of #3283 --------- Signed-off-by: schogges --- .../application/MainNavigation.feature | 2 +- .../HostnameGeneratorSummary.feature | 32 ++ .../BuiltinGatewaySummary.feature | 40 +++ .../dataplanes/DataplanePolicySummary.feature | 39 +- .../mesh/dataplanes/DataplaneSummary.feature | 20 ++ .../overview/summary/Clusters.feature | 4 +- .../mesh/policies/PolicySummary.feature | 20 ++ .../MeshExternalServiceSummary.feature | 47 +++ .../MeshMultiZoneServiceSummary.feature | 47 +++ .../mesh-services/MeshServiceSummary.feature | 47 +++ .../egresses/ZoneEgressSummary.feature | 20 ++ .../ingresses/ZoneIngressSummary.feature | 2 - .../app/data-planes/locales/en-us/index.yaml | 6 +- .../views/DataPlanePolicySummaryView.vue | 32 ++ .../views/DataPlaneSummaryView.vue | 334 ++++++++++-------- .../src/app/gateways/locales/en-us/index.yaml | 6 +- .../views/BuiltinGatewaySummaryView.vue | 119 ++++--- .../locales/en-us/index.yaml | 6 +- .../views/HostnameGeneratorSummaryView.vue | 151 ++++---- .../app/policies/components/PolicySummary.vue | 37 +- .../src/app/policies/locales/en-us/index.yaml | 7 +- .../app/policies/views/PolicySummaryView.vue | 32 ++ .../src/app/services/locales/en-us/index.yaml | 6 +- .../views/MeshExternalServiceSummaryView.vue | 177 ++++++---- .../views/MeshMultiZoneServiceSummaryView.vue | 141 +++++--- .../services/views/MeshServiceSummaryView.vue | 267 +++++++------- .../subscriptions/locales/en-us/index.yaml | 5 + .../kuma-gui/src/app/subscriptions/routes.ts | 13 - .../views/SubscriptionSummaryConfigView.vue | 34 -- .../views/SubscriptionSummaryOverviewView.vue | 154 -------- .../views/SubscriptionSummaryView.vue | 216 +++++++++-- .../zone-egresses/locales/en-us/index.yaml | 6 +- .../views/ZoneEgressSummaryView.vue | 194 +++++----- 33 files changed, 1413 insertions(+), 850 deletions(-) create mode 100644 packages/kuma-gui/features/hostname-generators/HostnameGeneratorSummary.feature create mode 100644 packages/kuma-gui/features/mesh/builtin-gateways/BuiltinGatewaySummary.feature create mode 100644 packages/kuma-gui/features/mesh/services/mesh-external-services/MeshExternalServiceSummary.feature create mode 100644 packages/kuma-gui/features/mesh/services/mesh-multi-zone-services/MeshMultiZoneServiceSummary.feature create mode 100644 packages/kuma-gui/features/mesh/services/mesh-services/MeshServiceSummary.feature delete mode 100644 packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryConfigView.vue delete mode 100644 packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryOverviewView.vue diff --git a/packages/kuma-gui/features/application/MainNavigation.feature b/packages/kuma-gui/features/application/MainNavigation.feature index 8e0a84d16c..559893b6a3 100644 --- a/packages/kuma-gui/features/application/MainNavigation.feature +++ b/packages/kuma-gui/features/application/MainNavigation.feature @@ -95,4 +95,4 @@ Feature: application / MainNavigation inbound: - port: 51112 """ - And the "[data-testid='data-plane-connection-inbound-summary-stats-view-tab'].active" element exists + And the "[data-testid='data-plane-connection-inbound-summary-stats-view-tab'].active" element exists diff --git a/packages/kuma-gui/features/hostname-generators/HostnameGeneratorSummary.feature b/packages/kuma-gui/features/hostname-generators/HostnameGeneratorSummary.feature new file mode 100644 index 0000000000..511aead1e7 --- /dev/null +++ b/packages/kuma-gui/features/hostname-generators/HostnameGeneratorSummary.feature @@ -0,0 +1,32 @@ +Feature: HostnameGenerator summary + + Background: + Given the CSS selectors + | Alias | Selector | + | summary | [data-testid='summary'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | + + Scenario: Switching to YAML format and back + Given the URL "/hostnamegenerators" responds with + """ + body: + items: + - name: + """ + When I visit the "/hostname-generators/" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists + + Examples: + | HostnameGenerator | + | local-mesh-external-service | diff --git a/packages/kuma-gui/features/mesh/builtin-gateways/BuiltinGatewaySummary.feature b/packages/kuma-gui/features/mesh/builtin-gateways/BuiltinGatewaySummary.feature new file mode 100644 index 0000000000..5a10c468b0 --- /dev/null +++ b/packages/kuma-gui/features/mesh/builtin-gateways/BuiltinGatewaySummary.feature @@ -0,0 +1,40 @@ +Feature: BuiltinGateway summary + + Background: + Given the CSS selectors + | Alias | Selector | + | summary | [data-testid='summary'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | + And the environment + """ + KUMA_MESHGATEWAY_COUNT: 1 + """ + And the URL "/meshes/default/meshgateways" responds with + """ + body: + items: + - name: gateway-1 + labels: + kuma.io/origin: zone + kuma.io/zone: zone-1 + kuma.io/display-name: gateway-1 + """ + + Scenario: Switching to YAML format and back + When I visit the "" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists + + Examples: + | URL | + | /meshes/default/gateways/builtin/gateway-1 | diff --git a/packages/kuma-gui/features/mesh/dataplanes/DataplanePolicySummary.feature b/packages/kuma-gui/features/mesh/dataplanes/DataplanePolicySummary.feature index 1f0373273e..9dafba37f7 100644 --- a/packages/kuma-gui/features/mesh/dataplanes/DataplanePolicySummary.feature +++ b/packages/kuma-gui/features/mesh/dataplanes/DataplanePolicySummary.feature @@ -3,9 +3,12 @@ Feature: Dataplane policy summary Background: Given the CSS selectors | Alias | Selector | - | summary-slideout-container | [data-testid='summary'] [data-testid='slideout-container'] | + | summary | [data-testid='summary'] | + | summary-slideout-container | $summary [data-testid='slideout-container'] | | summary-title | $summary-slideout-container [data-testid='slideout-title'] | | summary-content | $summary-slideout-container [data-testid='data-plane-policy-summary-view'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | Scenario: Policy Summary View has expected content Given the URL "/meshes/default/meshhttproutes/the-other-http-route" responds with @@ -46,4 +49,36 @@ Feature: Dataplane policy summary And the "$summary-content" element contains "MeshGateway:foo" And the "$summary-content" element contains "Namespace" And the "$summary-content" element contains "kuma-system" - And the "$summary-content [data-testid='k-code-block']" element exists + And the "$select-preference" element exists + + Scenario: Switching to YAML format and back + Given the URL "/meshes/default/meshhttproutes/" responds with + """ + body: + type: MeshHTTPRoute + mesh: default + name: + labels: + k8s.kuma.io/namespace: kuma-system + kuma.io/display-name: foo + spec: + targetRef: + kind: MeshGateway + name: foo + """ + When I visit the "/meshes/default/data-planes/dataplane-1/policies/meshhttproutes/" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists + + Examples: + | PolicyName | + | the-other-http-route | diff --git a/packages/kuma-gui/features/mesh/dataplanes/DataplaneSummary.feature b/packages/kuma-gui/features/mesh/dataplanes/DataplaneSummary.feature index 08df8a6628..6009c964cd 100644 --- a/packages/kuma-gui/features/mesh/dataplanes/DataplaneSummary.feature +++ b/packages/kuma-gui/features/mesh/dataplanes/DataplaneSummary.feature @@ -6,6 +6,8 @@ Feature: Dataplane summary | item | [data-testid='data-plane-collection'] tbody tr | | summary | [data-testid='summary'] | | close-summary-button | $summary [data-testid='slideout-close-icon'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | And the environment """ KUMA_SUBSCRIPTION_COUNT: 2 @@ -47,3 +49,21 @@ Feature: Dataplane summary """ When I visit the "/meshes/default/data-planes/test-data-plane-1?page=2&size=50" URL Then the "$summary" element exists + + Scenario: Switching to YAML format and back + Given the environment + """ + KUMA_DATAPLANE_COUNT: 1 + """ + When I visit the "/meshes/default/data-planes/test-data-plane-1" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists diff --git a/packages/kuma-gui/features/mesh/dataplanes/overview/summary/Clusters.feature b/packages/kuma-gui/features/mesh/dataplanes/overview/summary/Clusters.feature index c45e1acf7e..a4d0df2cfa 100644 --- a/packages/kuma-gui/features/mesh/dataplanes/overview/summary/Clusters.feature +++ b/packages/kuma-gui/features/mesh/dataplanes/overview/summary/Clusters.feature @@ -2,7 +2,7 @@ Feature: mesh / dataplanes / connections / clusters Scenario: The inbound clusters tab correctly filters by 'localhost_' Given the CSS selectors - | Alias | Selector | + | Alias | Selector | | code | [data-testid='data-plane-connection-inbound-summary-clusters-view'] [data-testid='k-code-block'] | And the URL "/meshes/mesh-name/dataplanes/service-64cbb7b8b5-6g94n.namespace/_overview" responds with """ @@ -30,7 +30,7 @@ Feature: mesh / dataplanes / connections / clusters Scenario: The outbound clusters tab correctly filters by '' Given the CSS selectors - | Alias | Selector | + | Alias | Selector | | code | [data-testid='data-plane-connection-outbound-summary-clusters-view'] [data-testid='k-code-block'] | And the URL "/meshes/mesh-name/dataplanes/service-64cbb7b8b5-6g94n.namespace/stats" responds with """ diff --git a/packages/kuma-gui/features/mesh/policies/PolicySummary.feature b/packages/kuma-gui/features/mesh/policies/PolicySummary.feature index 30e56a28c0..c0d53935eb 100644 --- a/packages/kuma-gui/features/mesh/policies/PolicySummary.feature +++ b/packages/kuma-gui/features/mesh/policies/PolicySummary.feature @@ -7,6 +7,8 @@ Feature: Policy summary | item | $items tbody tr | | summary | [data-testid='summary'] | | close-summary-button | $summary [data-testid='slideout-close-icon'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | And the URL "/meshes/default/meshfaultinjections" responds with """ body: @@ -38,3 +40,21 @@ Feature: Policy summary """ When I visit the "/meshes/default/policies/meshfaultinjections/mfi-1?page=2&size=50" URL Then the "$summary" element exists + + Scenario: Switching to YAML format and back + Given the environment + """ + KUMA_MESHFAULTINJECTION_COUNT: 1 + """ + When I visit the "/meshes/default/policies/meshfaultinjections/mfi-1" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists diff --git a/packages/kuma-gui/features/mesh/services/mesh-external-services/MeshExternalServiceSummary.feature b/packages/kuma-gui/features/mesh/services/mesh-external-services/MeshExternalServiceSummary.feature new file mode 100644 index 0000000000..58544e3aaa --- /dev/null +++ b/packages/kuma-gui/features/mesh/services/mesh-external-services/MeshExternalServiceSummary.feature @@ -0,0 +1,47 @@ +Feature: MeshExternalService summary + + Background: + Given the CSS selectors + | Alias | Selector | + | summary | [data-testid='summary'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | + And the environment + """ + KUMA_SERVICE_COUNT: 1 + """ + + Rule: In a namespaced environment + + Background: + Given the environment + """ + KUMA_ENVIRONMENT: kubernetes + """ + And the URL "/meshes/default/meshexternalservices" responds with + """ + body: + items: + - name: monitor-proxy-0.kuma-demo + labels: + kuma.io/display-name: monitor-proxy-0 + k8s.kuma.io/namespace: kuma-demo + """ + + Scenario Outline: Switching to YAML format and back + When I visit the "" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists + + Examples: + | URL | + | /meshes/default/services/mesh-external-services/monitor-proxy-0.kuma-demo | diff --git a/packages/kuma-gui/features/mesh/services/mesh-multi-zone-services/MeshMultiZoneServiceSummary.feature b/packages/kuma-gui/features/mesh/services/mesh-multi-zone-services/MeshMultiZoneServiceSummary.feature new file mode 100644 index 0000000000..08f1b484dc --- /dev/null +++ b/packages/kuma-gui/features/mesh/services/mesh-multi-zone-services/MeshMultiZoneServiceSummary.feature @@ -0,0 +1,47 @@ +Feature: MeshMultiZoneService summary + + Background: + Given the CSS selectors + | Alias | Selector | + | summary | [data-testid='summary'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | + And the environment + """ + KUMA_SERVICE_COUNT: 1 + """ + + Rule: In a namespaced environment + + Background: + Given the environment + """ + KUMA_ENVIRONMENT: kubernetes + """ + And the URL "/meshes/default/meshmultizoneservices" responds with + """ + body: + items: + - name: monitor-proxy-0.kuma-demo + labels: + kuma.io/display-name: monitor-proxy-0 + k8s.kuma.io/namespace: kuma-demo + """ + + Scenario Outline: Switching to YAML format and back + When I visit the "" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists + + Examples: + | URL | + | /meshes/default/services/mesh-multi-zone-services/monitor-proxy-0.kuma-demo | diff --git a/packages/kuma-gui/features/mesh/services/mesh-services/MeshServiceSummary.feature b/packages/kuma-gui/features/mesh/services/mesh-services/MeshServiceSummary.feature new file mode 100644 index 0000000000..877c4fff8b --- /dev/null +++ b/packages/kuma-gui/features/mesh/services/mesh-services/MeshServiceSummary.feature @@ -0,0 +1,47 @@ +Feature: MeshService summary + + Background: + Given the CSS selectors + | Alias | Selector | + | summary | [data-testid='summary'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | + And the environment + """ + KUMA_SERVICE_COUNT: 1 + """ + + Rule: In a namespaced environment + + Background: + Given the environment + """ + KUMA_ENVIRONMENT: kubernetes + """ + And the URL "/meshes/default/meshservices" responds with + """ + body: + items: + - name: monitor-proxy-0.kuma-demo + labels: + kuma.io/display-name: monitor-proxy-0 + k8s.kuma.io/namespace: kuma-demo + """ + + Scenario Outline: Switching to YAML format and back + When I visit the "" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists + + Examples: + | URL | + | /meshes/default/services/mesh-services/monitor-proxy-0.kuma-demo | diff --git a/packages/kuma-gui/features/zones/zone-cps/egresses/ZoneEgressSummary.feature b/packages/kuma-gui/features/zones/zone-cps/egresses/ZoneEgressSummary.feature index 7f7ea5ee32..200792d82e 100644 --- a/packages/kuma-gui/features/zones/zone-cps/egresses/ZoneEgressSummary.feature +++ b/packages/kuma-gui/features/zones/zone-cps/egresses/ZoneEgressSummary.feature @@ -6,6 +6,8 @@ Feature: Zone Egress summary | item | [data-testid='zone-egress-collection'] tbody tr | | summary | [data-testid='summary'] | | close-summary-button | $summary [data-testid='slideout-close-icon'] | + | select-preference | $summary [data-testid='select-input'] | + | structured-view | $summary [data-testid='structured-view'] | And the URL "/zoneegresses/_overview" responds with """ body: @@ -39,3 +41,21 @@ Feature: Zone Egress summary """ When I visit the "/zones/zone-1/egresses/zone-egress-1?page=2&size=50" URL Then the "$summary" element exists + + Scenario: Switching to YAML format and back + Given the environment + """ + KUMA_ZONEEGRESS_COUNT: 1 + """ + When I visit the "/zones/zone-1/egresses/zone-egress-1" URL + Then the "$select-preference" element exists + And the "$structured-view" element exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-yaml'] button" element + Then the URL contains "format=yaml" + And the "[data-testid='k-code-block']" element exists + And the "$structured-view" element doesn't exists + When I click the "$select-preference" element + When I click the "[data-testid='select-item-structured'] button" element + Then the URL contains "format=structured" + And the "$structured-view" element exists diff --git a/packages/kuma-gui/features/zones/zone-cps/ingresses/ZoneIngressSummary.feature b/packages/kuma-gui/features/zones/zone-cps/ingresses/ZoneIngressSummary.feature index 4aad544f04..48abba5f00 100644 --- a/packages/kuma-gui/features/zones/zone-cps/ingresses/ZoneIngressSummary.feature +++ b/packages/kuma-gui/features/zones/zone-cps/ingresses/ZoneIngressSummary.feature @@ -59,5 +59,3 @@ Feature: Zone Ingress summary When I click the "[data-testid='select-item-structured'] button" element Then the URL contains "format=structured" And the "$structured-view" element exists - - diff --git a/packages/kuma-gui/src/app/data-planes/locales/en-us/index.yaml b/packages/kuma-gui/src/app/data-planes/locales/en-us/index.yaml index a178e977a2..f8cf8250dd 100644 --- a/packages/kuma-gui/src/app/data-planes/locales/en-us/index.yaml +++ b/packages/kuma-gui/src/app/data-planes/locales/en-us/index.yaml @@ -66,7 +66,11 @@ data-planes: about: title: About this Data Plane Proxy gateway: 'Gateway' - config: YAML + config: Configuration + format: Format + formats: + yaml: YAML + structured: Structured inbounds: 'Inbounds' inbound_name: '{service}' port: ':{port}' diff --git a/packages/kuma-gui/src/app/data-planes/views/DataPlanePolicySummaryView.vue b/packages/kuma-gui/src/app/data-planes/views/DataPlanePolicySummaryView.vue index 43699a5168..bccbe2b2bd 100644 --- a/packages/kuma-gui/src/app/data-planes/views/DataPlanePolicySummaryView.vue +++ b/packages/kuma-gui/src/app/data-planes/views/DataPlanePolicySummaryView.vue @@ -8,6 +8,7 @@ codeSearch: '', codeFilter: false, codeRegExp: false, + format: 'structured', }" v-slot="{ route, t }" > @@ -41,7 +42,38 @@ + + @@ -53,191 +54,222 @@ - -
- +
+ - - - - + {{ t(`data-planes.routes.item.formats.${value}`) }} + + +
+ + + - + +
- - - - + + - - + + - - - - - - - - - -
+ - -

{{ t('data-planes.routes.item.gateway') }}

+ + -
+ + + +
- - - -

- {{ t('data-planes.routes.item.config') }} -

+ +

{{ t('data-planes.routes.item.gateway') }}

+ +
+ + + + + + + + + + + +
+ + + - + - - - + + + + + diff --git a/packages/kuma-gui/src/app/gateways/locales/en-us/index.yaml b/packages/kuma-gui/src/app/gateways/locales/en-us/index.yaml index 73907ce430..a9e5ee4768 100644 --- a/packages/kuma-gui/src/app/gateways/locales/en-us/index.yaml +++ b/packages/kuma-gui/src/app/gateways/locales/en-us/index.yaml @@ -15,7 +15,11 @@ gateways: A Delegated Gateway allows the integration of existing API gateway solutions into the mesh by adding an Envoy sidecar proxy to an existing Gateway. It then manages the traffic between the services inside the mesh and external clients (North/South). item: namespace: Namespace - config: YAML + config: Configuration + format: Format + formats: + yaml: YAML + structured: Structured builtin-gateways: routes: diff --git a/packages/kuma-gui/src/app/gateways/views/BuiltinGatewaySummaryView.vue b/packages/kuma-gui/src/app/gateways/views/BuiltinGatewaySummaryView.vue index 9cd519a0d2..c9be20ec38 100644 --- a/packages/kuma-gui/src/app/gateways/views/BuiltinGatewaySummaryView.vue +++ b/packages/kuma-gui/src/app/gateways/views/BuiltinGatewaySummaryView.vue @@ -7,6 +7,7 @@ codeSearch: '', codeFilter: false, codeRegExp: false, + format: 'structured', }" v-slot="{ route, t }" > @@ -52,53 +53,81 @@ + +
+ +

+ {{ t('gateways.routes.item.config') }} +

+
+ + + +
+ +
-
- - - - - -
-
-

- {{ t('gateways.routes.item.config') }} -

- -
- +
- - -
-
+ + + + + +
+ + + diff --git a/packages/kuma-gui/src/app/hostname-generators/locales/en-us/index.yaml b/packages/kuma-gui/src/app/hostname-generators/locales/en-us/index.yaml index dbe6f239e3..3034547e6f 100644 --- a/packages/kuma-gui/src/app/hostname-generators/locales/en-us/index.yaml +++ b/packages/kuma-gui/src/app/hostname-generators/locales/en-us/index.yaml @@ -18,7 +18,11 @@ hostname-generators: title: "{name}" subtitle: "{name} HostnameGenerator" breadcrumbs: Hostname Generators - config: YAML + config: Configuration + format: Format + formats: + yaml: YAML + structured: Structured about: title: About this Hostname Generator items: diff --git a/packages/kuma-gui/src/app/hostname-generators/views/HostnameGeneratorSummaryView.vue b/packages/kuma-gui/src/app/hostname-generators/views/HostnameGeneratorSummaryView.vue index ca7cf853ee..dc7be07e9b 100644 --- a/packages/kuma-gui/src/app/hostname-generators/views/HostnameGeneratorSummaryView.vue +++ b/packages/kuma-gui/src/app/hostname-generators/views/HostnameGeneratorSummaryView.vue @@ -6,6 +6,7 @@ codeSearch: '', codeFilter: false, codeRegExp: false, + format: 'structured', }" v-slot="{ route, t, can }" > @@ -35,73 +36,99 @@ -
-
- + - - - - - - - - - + {{ t(`hostname-generators.routes.item.formats.${value}`) }} + + +
+ + + + + diff --git a/packages/kuma-gui/src/app/policies/components/PolicySummary.vue b/packages/kuma-gui/src/app/policies/components/PolicySummary.vue index ce42e3eac8..eeb4d46a4b 100644 --- a/packages/kuma-gui/src/app/policies/components/PolicySummary.vue +++ b/packages/kuma-gui/src/app/policies/components/PolicySummary.vue @@ -1,13 +1,13 @@ + + diff --git a/packages/kuma-gui/src/app/policies/locales/en-us/index.yaml b/packages/kuma-gui/src/app/policies/locales/en-us/index.yaml index 5a72a9c312..82531eb5c6 100644 --- a/packages/kuma-gui/src/app/policies/locales/en-us/index.yaml +++ b/packages/kuma-gui/src/app/policies/locales/en-us/index.yaml @@ -7,8 +7,11 @@ policies: item: title: "{name}" breadcrumbs: Policies - overview: 'Overview' - config: 'YAML' + config: 'Configuration' + format: Format + formats: + yaml: YAML + structured: Structured navigation: policy-detail-view: Overview policy-detail-config-view: YAML diff --git a/packages/kuma-gui/src/app/policies/views/PolicySummaryView.vue b/packages/kuma-gui/src/app/policies/views/PolicySummaryView.vue index 4bc5a5f763..042564d083 100644 --- a/packages/kuma-gui/src/app/policies/views/PolicySummaryView.vue +++ b/packages/kuma-gui/src/app/policies/views/PolicySummaryView.vue @@ -8,6 +8,7 @@ codeSearch: '', codeFilter: false, codeRegExp: false, + format: 'structured', }" v-slot="{ route, t }" > @@ -58,7 +59,38 @@ + + @@ -37,87 +38,113 @@ -
-
- + - - - - - - - - - + {{ t(`services.routes.item.formats.${value}`) }} + + +
+ + + + + + + + + + + + + + + + + +
+ + + diff --git a/packages/kuma-gui/src/app/services/views/MeshMultiZoneServiceSummaryView.vue b/packages/kuma-gui/src/app/services/views/MeshMultiZoneServiceSummaryView.vue index 9412cb5d86..039b7a1858 100644 --- a/packages/kuma-gui/src/app/services/views/MeshMultiZoneServiceSummaryView.vue +++ b/packages/kuma-gui/src/app/services/views/MeshMultiZoneServiceSummaryView.vue @@ -7,6 +7,7 @@ codeSearch: '', codeFilter: false, codeRegExp: false, + format: 'structured', }" v-slot="{ route, t }" > @@ -37,69 +38,95 @@ -
-
- + - - - - + {{ t(`services.routes.item.formats.${value}`) }} + + +
+ + + + - -
-
-

- {{ t('services.routes.item.config') }} -

- + + {{ key }}:{{ value }} + + + + +
+ + + diff --git a/packages/kuma-gui/src/app/services/views/MeshServiceSummaryView.vue b/packages/kuma-gui/src/app/services/views/MeshServiceSummaryView.vue index b60d52d9a7..36388d30ca 100644 --- a/packages/kuma-gui/src/app/services/views/MeshServiceSummaryView.vue +++ b/packages/kuma-gui/src/app/services/views/MeshServiceSummaryView.vue @@ -7,6 +7,7 @@ codeSearch: '', codeFilter: false, codeRegExp: false, + format: 'structured', }" v-slot="{ route, t, can }" > @@ -39,138 +40,164 @@ -
-
- + - - - - - - - - - - - - + {{ t(`services.routes.item.formats.${value}`) }} + + +
+ + + - - - - + + + - - - - - - - - + + - - + - -
-
-

- {{ t('services.routes.item.config') }} -

- + + + + + + + + +
+ + + diff --git a/packages/kuma-gui/src/app/subscriptions/locales/en-us/index.yaml b/packages/kuma-gui/src/app/subscriptions/locales/en-us/index.yaml index 06808bd9fe..19aae6495e 100644 --- a/packages/kuma-gui/src/app/subscriptions/locales/en-us/index.yaml +++ b/packages/kuma-gui/src/app/subscriptions/locales/en-us/index.yaml @@ -1,6 +1,11 @@ subscriptions: routes: item: + config: Configuration + format: Format + formats: + yaml: YAML + structured: Structured navigation: zone-cp-subscription-summary-overview-view: Overview zone-cp-subscription-summary-config-view: YAML diff --git a/packages/kuma-gui/src/app/subscriptions/routes.ts b/packages/kuma-gui/src/app/subscriptions/routes.ts index fd24ae2eb8..abe00414e8 100644 --- a/packages/kuma-gui/src/app/subscriptions/routes.ts +++ b/packages/kuma-gui/src/app/subscriptions/routes.ts @@ -4,20 +4,7 @@ export const routes = (prefix: string): RouteRecordRaw[] => { { path: 'subscription/:subscription', name: `${prefix}-subscription-summary-view`, - redirect: { name: `${prefix}-subscription-summary-overview-view` }, component: () => import('@/app/subscriptions/views/SubscriptionSummaryView.vue'), - children: [ - { - path: 'overview', - name: `${prefix}-subscription-summary-overview-view`, - component: () => import('@/app/subscriptions/views/SubscriptionSummaryOverviewView.vue'), - }, - { - path: 'config', - name: `${prefix}-subscription-summary-config-view`, - component: () => import('@/app/subscriptions/views/SubscriptionSummaryConfigView.vue'), - }, - ], }, ] } diff --git a/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryConfigView.vue b/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryConfigView.vue deleted file mode 100644 index 8a21d563c9..0000000000 --- a/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryConfigView.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryOverviewView.vue b/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryOverviewView.vue deleted file mode 100644 index ca664b74c4..0000000000 --- a/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryOverviewView.vue +++ /dev/null @@ -1,154 +0,0 @@ - - - diff --git a/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryView.vue b/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryView.vue index ad0c584d40..0ad338a7a8 100644 --- a/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryView.vue +++ b/packages/kuma-gui/src/app/subscriptions/views/SubscriptionSummaryView.vue @@ -3,6 +3,10 @@ :name="props.routeName" :params="{ subscription: '', + codeSearch: '', + codeFilter: false, + codeRegExp: false, + format: 'structured', }" v-slot="{ route, t }" > @@ -19,34 +23,190 @@ {{ item.zoneInstanceId ?? item.globalInstanceId ?? item.controlPlaneInstanceId }} - - @@ -54,7 +214,11 @@