Merge pull request #15 from launchrctl/ui-schema-2

Added UI schema and frontend implementation

client/src/pages/actions/Show.tsx

@@ -12,7 +12,7 @@ import { Show } from '@refinedev/mui'
 import type { IChangeEvent } from '@rjsf/core'
 import { withTheme } from '@rjsf/core'
 import { Theme } from '@rjsf/mui'
-import type { RJSFSchema } from '@rjsf/utils'
+import type { RJSFSchema, UiSchema } from '@rjsf/utils'
 import validator from '@rjsf/validator-ajv8'
 import type { FC } from 'react'
 import { useState } from 'react'
@@ -22,6 +22,7 @@ import { RunningActionsList } from '../../components/RunningActionsList'
 // @todo move to types
 interface IActionData extends BaseRecord {
   jsonschema: RJSFSchema
+  uischema: UiSchema
 }
 
 interface IFormValues {
@@ -52,6 +53,8 @@ export const ActionShow: FC<IResourceComponentsProps> = () => {
 
   const jsonschema = queryResult?.data?.data?.jsonschema
 
+  const uischema = queryResult?.data?.data?.uischema?.uiSchema || {}
+
   if (jsonschema) {
     // @todo I actually don't know for the moment how to overcome error
     //  "no schema with key or ref" produced when schema is defined.
@@ -117,7 +120,12 @@ export const ActionShow: FC<IResourceComponentsProps> = () => {
         }}
       />
       {jsonschema && (
-        <Form schema={jsonschema} validator={validator} onSubmit={onSubmit}>
+        <Form
+          schema={jsonschema}
+          uiSchema={uischema}
+          validator={validator}
+          onSubmit={onSubmit}
+        >
           <div>
             <Button variant="contained" type="submit" disabled={actionRunning}>
               Submit

example/rjsf/actions/arrays/action.yaml

@@ -0,0 +1,10 @@
+action:
+  title: RJSF Example of Arrays
+  description: RJSF Arrays arguments
+  image: alpine:latest
+  command: ["sh", "-c", "for i in $(seq 60); do echo $$i; sleep 1; done"]
+  arguments:
+    - name: optarr
+      title: Array
+      description: Some additional info for option
+      type: array

example/rjsf/actions/enumeration/action.yaml

@@ -11,9 +11,4 @@ action:
     - name: radio
       title: Radio
       type: string
-      enum: [ Ola, Hello, Bonjour, Buongiorno, GutenTag ]
-    - name: buttonGroup
-      type: string
-      enum: [ Ola, Hello, Bonjour, Buongiorno, GutenTag ]
-      default: Ola
-      description: With default value set
+      enum: [ Ola, Hello, Bonjour, Buongiorno, GutenTag ]

example/rjsf/actions/enumeration/ui-schema.yaml

@@ -1,5 +1,4 @@
 uiSchema:
-  buttonGroup:
-    'ui:widget': button
-  radio:
-    'ui:widget': radio
+  arguments:
+    radio:
+      'ui:widget': radio

example/rjsf/actions/numbers/ui-schema.yaml

@@ -1,5 +1,6 @@
 uiSchema:
-  range:
-    'ui:widget': range
-  rangeConstrained:
-    'ui:widget': range
+  arguments:
+    range:
+      'ui:widget': range
+    rangeConstrained:
+      'ui:widget': range

example/rjsf/actions/strings/ui-schema.yaml

@@ -1,6 +1,7 @@
 uiSchema:
-  textArea:
-    'ui:widget': textarea
-    'ui:placeholder': This is a placeholder
-  color:
-    'ui:widget': color
+  arguments:
+    textArea:
+      'ui:widget': textarea
+      'ui:placeholder': This is a placeholder
+    color:
+      'ui:widget': color

server/api.go

@@ -11,6 +11,7 @@ import (
 
 	"github.com/launchrctl/launchr"
 	"github.com/launchrctl/launchr/pkg/action"
+	"gopkg.in/yaml.v3"
 )
 
 type launchrServer struct {
@@ -185,11 +186,32 @@ func apiActionFull(baseURL string, a *action.Action) ActionFull {
 	jsonschema := a.JSONSchema()
 	jsonschema.ID = fmt.Sprintf("%s/actions/%s/schema.json", baseURL, url.QueryEscape(a.ID))
 	def := a.ActionDef()
+
+	var resultMap map[string]interface{}
+
+	yamlData, err := os.ReadFile(fmt.Sprintf("%s/ui-schema.yaml", a.Dir()))
+	if err != nil {
+		if os.IsNotExist(err) {
+			fmt.Println("Info: ui-schema.yaml not found, using empty UISchema")
+			resultMap = map[string]interface{}{}
+		} else {
+			panic(err)
+		}
+	} else {
+		var data interface{}
+		err = yaml.Unmarshal(yamlData, &data)
+		if err != nil {
+			panic(err)
+		}
+		resultMap, _ = data.(map[string]interface{})
+	}
+
 	return ActionFull{
 		ID:          a.ID,
 		Title:       def.Title,
 		Description: def.Description,
 		JSONSchema:  jsonschema,
+		UISchema:    resultMap,
 	}
 }
 

server/openapi.yaml

@@ -200,6 +200,11 @@ components:
               x-go-type: "jsonschema.Schema"
               x-go-type-import:
                 path: "github.com/launchrctl/launchr/pkg/jsonschema"
+            uischema:
+              type: object
+              x-go-name: "UISchema"
+              x-go-type: "map[string]interface{}"
+              x-go-type-skip-optional-pointer: true
     ActionRunParams:
       allOf:
         - type: object