**Enhance property field handling with transformations** (#115)

* **Enhance property field handling with transformations**

- Added support for property field transformations in `FieldDefinition`, including `uppercase`, `lowercase`, `capitalize`, `encode`, and `decode`.
- Updated utilities like `getResourceValueByJsonPath` to apply these transformations.
- Enhanced documentation to reflect the new `propertyField` behavior.
- Added unit tests to validate transformations and edge cases.
- Updated dependencies in `package-lock.json` and `package.json`.

* fix tests

---------

Co-authored-by: Grzegorz Krajniak <[email protected]>

Author: gkrajniak

docs/readme-generic-ui.md

@@ -52,6 +52,14 @@ Each field definition supports the following properties:
 
 - `"label"`: Display name for the field
 - `"property"`: JSON path to the resource property (string or array of strings for fallback values)
+- `"propertyField"`: In case the property is a scalar value that represents an object, this property can be used to specify the field to be used for display within that object
+  - `"key"`: The name of the field to be used for display
+  - `"transform"`: An array of text manipulations to be applied to the value, the available are:  
+    | 'uppercase'
+    | 'lowercase'
+    | 'capitalize'
+    | 'decode'
+    | 'encode'
 - `"jsonPathExpression"`: Alternative JSONPath expression for complex data access (takes precedence over `property`)
 - `"required"`: Boolean flag indicating if the field is mandatory (for create views)
 - `"values"`: Array of predefined values for selection
@@ -106,7 +114,7 @@ Below is an example content-configuration for an accounts node using the generic
               "namespace": null,
               "readyCondition": {
                 "jsonPathExpression": "status.conditions[?(@.type=='Ready' && @.status=='True')]",
-                "property": ["status.conditions.status", "status.conditions.type"],
+                "property": ["status.conditions.status", "status.conditions.type"]
               },
               "ui": {
                 "logoUrl": "https://www.kcp.io/icons/logo.svg",
@@ -120,6 +128,14 @@ Below is an example content-configuration for an accounts node using the generic
                       "label": "Display Name",
                       "property": "spec.displayName"
                     },
+                    {
+                      "label": "Key",
+                      "property": "data",
+                      "propertyField": {
+                        "key": "OPENAI_API_KEY",
+                        "transform": ["uppercase", "encode"]
+                      }
+                    },
                     {
                       "label": "Type",
                       "property": "spec.type",
@@ -213,7 +229,7 @@ Below is an example content-configuration for an accounts node using the generic
                         "operation": "cities",
                         "gqlQuery": "subscription { cities { data { id name } } }",
                         "value": "data.id",
-                        "key": "data.name",
+                        "key": "data.name"
                       }
                     }
                   ]

package-lock.json

@@ -40,13 +40,13 @@
     "@types/jmespath": "0.15.2",
     "@types/jsonpath": "0.2.4",
     "@ui5/webcomponents-ngx": "0.5.6",
-    "kubernetes-types": "1.30.0",
     "cpx2": "8.0.0",
     "jest": "29.7.0",
     "jest-jasmine2": "29.7.0",
     "jest-junit": "16.0.0",
     "jest-mock-extended": "3.0.7",
     "jmespath": "0.16.0",
+    "kubernetes-types": "1.30.0",
     "mkdirp": "3.0.1",
     "move-cli": "2.0.0",
     "ng-packagr": "20.3.0",

package.json

@@ -10,7 +10,7 @@ module.exports = {
       branches: 90,
       functions: 95,
       lines: 95,
-      statements: -3,
+      statements: -4,
     },
   },
   moduleNameMapper: {

projects/lib/jest.config.js

@@ -1,6 +1,5 @@
 import { Condition, ObjectMeta } from 'kubernetes-types/meta/v1';
 
-
 export interface LabelDisplay {
   backgroundColor?: string;
   color?: string;
@@ -10,9 +9,22 @@ export interface LabelDisplay {
   textTransform?: string;
 }
 
+export type TransformType =
+  | 'uppercase'
+  | 'lowercase'
+  | 'capitalize'
+  | 'decode'
+  | 'encode';
+
+export interface PropertyField {
+  key: string;
+  transform?: TransformType[];
+}
+
 export interface FieldDefinition {
   label?: string;
   property: string | string[];
+  propertyField?: PropertyField;
   jsonPathExpression?: string;
   required?: boolean;
   values?: string[];
@@ -56,6 +68,7 @@ export interface Resource extends Record<string, any> {
   status?: ResourceStatus;
   __typename?: string;
   ready?: boolean;
+  data?: Record<string, any>;
 }
 
 export interface ResourceDefinition {
@@ -83,4 +96,4 @@ export interface UIDefinition {
   detailView?: UiView;
 }
 
-export type KubernetesScope = 'Cluster' | 'Namespaced';
+export type KubernetesScope = 'Cluster' | 'Namespaced';

projects/lib/models/models/resource.ts

@@ -7,6 +7,5 @@ export const getValueByPath = <T extends object, R = unknown>(
 ): R | undefined => {
   return getResourceValueByJsonPath(obj as Resource, {
     jsonPathExpression: path,
-    property: '',
   });
 };