Merge branch 'develop' into proddata/no-code-properties-seperation

.github/CONTRIBUTING.md

@@ -63,9 +63,9 @@ You can also build it from a terminal using `./gradlew build`, the Gradle wrappe
   - Configure the following environment variables:
     - `MICRONAUT_ENVIRONMENTS`: can be set to any string and will load a custom configuration file in `cli/src/main/resources/application-{env}.yml`.
     - `KESTRA_PLUGINS_PATH`: is the path where you will save plugins as Jar and will be load on startup.
-  - See the screenshot below for an example: ![Intellij IDEA Configuration ](./assets/run-app.png)
+  - See the screenshot below for an example: ![Intellij IDEA Configuration ](run-app.png)
   - If you encounter **JavaScript memory heap out** error during startup, configure `NODE_OPTIONS` environment variable with some large value.
-      - Example `NODE_OPTIONS: --max-old-space-size=4096` or `NODE_OPTIONS: --max-old-space-size=8192` ![Intellij IDEA Configuration ](./assets/node_option_env_var.png)
+      - Example `NODE_OPTIONS: --max-old-space-size=4096` or `NODE_OPTIONS: --max-old-space-size=8192` ![Intellij IDEA Configuration ](node_option_env_var.png)
 - The server starts by default on port 8080 and is reachable on `http://localhost:8080`
 
 If you want to launch all tests, you need Python and some packages installed on your machine, on Ubuntu you can install them with:

ui/src/components/inputs/KeyShortcuts.vue

@@ -6,7 +6,7 @@
                     <Keyboard />
                 </el-icon>
                 <span class="fs-6">
-                    {{ $t("editor_shortcuts.label") }}
+                    {{ t("editor_shortcuts.label") }}
                 </span>
             </div>
         </template>
@@ -27,7 +27,7 @@
                     </template>
                 </div>
                 <div class="text-break">
-                    {{ $t(command.description) }}
+                    {{ t(command.description) }}
                 </div>
             </div>
         </div>
@@ -35,9 +35,11 @@
 </template>
 
 <script setup lang="ts">
+    import {useI18n} from "vue-i18n";
     import Keyboard from "vue-material-design-icons/Keyboard.vue";
     import {useKeyShortcuts} from "../../utils/useKeyShortcuts";
 
+    const {t} = useI18n();
     const {isKeyShortcutsDialogShown} = useKeyShortcuts();
 
     const commands = [

ui/src/components/layout/TopNavBar.vue

@@ -1,11 +1,11 @@
 <template>
     <nav class="d-flex align-items-center w-100 gap-3 top-bar">
-        <SidebarToggleButton
-            v-if="layoutStore.sideMenuCollapsed"
-            @toggle="layoutStore.setSideMenuCollapsed(false)"
-        />
         <div class="d-flex flex-column flex-grow-1 flex-shrink-1 overflow-hidden top-title">
             <div class="d-flex align-items-end gap-2">
+                <SidebarToggleButton
+                    v-if="layoutStore.sideMenuCollapsed"
+                    @toggle="layoutStore.setSideMenuCollapsed(false)"
+                />
                 <div class="d-flex flex-column gap-2">
                     <el-breadcrumb v-if="breadcrumb">
                         <el-breadcrumb-item v-for="(item, x) in breadcrumb" :key="x" :class="{'pe-none': item.disabled}">

ui/src/components/no-code/components/tasks/TaskObject.vue

@@ -28,7 +28,15 @@
                         </Wrapper>
                     </template>
                 </el-collapse-item>
-
+                <el-collapse-item name="general" v-if="generalProperties?.length" :title="$t('no_code.sections.general')">
+                    <template v-for="[fieldKey, fieldSchema] in generalProperties" :key="fieldKey">
+                        <Wrapper>
+                            <template #tasks>
+                                <TaskObjectField v-bind="fieldProps(fieldKey, fieldSchema)" />
+                            </template>
+                        </Wrapper>
+                    </template>
+                </el-collapse-item>
                 <el-collapse-item name="deprecated" v-if="deprecatedProperties?.length" :title="$t('no_code.sections.deprecated')">
                     <template v-for="[fieldKey, fieldSchema] in deprecatedProperties" :key="fieldKey">
                         <Wrapper>
@@ -125,6 +133,16 @@
         return value?.$deprecated;
     }
 
+    function isPartOfGroup(value: any, groups: string[]) {
+        if (value?.allOf) {
+            return value.allOf.some((item: any) => isPartOfGroup(item, groups));
+        }
+        if (value?.anyOf) {
+            return value.anyOf.some((item: any) => isPartOfGroup(item, groups));
+        }
+        return value?.$group && groups.includes(value.$group);
+    }
+
     const filteredProperties = computed<Entry[]>(() => {
         const propertiesProc = (props.properties ?? props.schema?.properties);
         const isOutputsContext = props.root?.startsWith("outputs[") || false;
@@ -159,9 +177,17 @@
     const protectedRequiredProperties = computed<Entry[]>(() => {
         return requiredProperties.value.length ? requiredProperties.value : sortedProperties.value;
     });
+    
+    const connectionProperties = computed<Entry[]>(() => {
+        return props.merge ? [] : sortedProperties.value.filter(([p, v]) => v && !isRequired(p) && isPartOfGroup(v, ["connection"]));
+    });
 
     const optionalProperties = computed<Entry[]>(() => {
-        return props.merge ? [] : sortedProperties.value.filter(([p, v]) => v && !isRequired(p) && !isDeprecated(v) && v.$group !== "connection");
+        return props.merge ? [] : sortedProperties.value.filter(([p, v]) => v && !isRequired(p) && !isDeprecated(v) && !isPartOfGroup(v, ["core","connection"]));
+    });
+
+    const generalProperties = computed<Entry[]>(() => {
+        return props.merge ? [] : sortedProperties.value.filter(([p, v]) => v && !isRequired(p) && !isDeprecated(v) && isPartOfGroup(v, ["core"]));
     });
 
     const deprecatedProperties = computed<Entry[]>(() => {
@@ -169,9 +195,6 @@
         return props.merge ? [] : sortedProperties.value.filter(([k, v]) => v && isDeprecated(v) && obj[k] !== undefined);
     });
 
-    const connectionProperties = computed<Entry[]>(() => {
-        return props.merge ? [] : sortedProperties.value.filter(([p, v]) => v && v.$group === "connection" && !isRequired(p));
-    });
 
     function onInput(value: any) {
         emit("update:modelValue", collapseEmptyValues(value));

ui/src/components/secrets/SecretsTable.vue

@@ -156,7 +156,7 @@
                 <el-form-item :label="$t('secret.key')" prop="key">
                     <el-input v-model="secret.key" :disabled="secret.update" required />
                 </el-form-item>
-                <el-form-item v-if="!secret.update" :label="$t('secret.name')" prop="value" required>
+                <el-form-item v-if="!secret.update" :label="$t('secret.name')" prop="value">
                     <MultilineSecret v-model="secret.value" :placeholder="secretModalTitle" />
                 </el-form-item>
                 <el-form-item v-if="secret.update" :label="$t('secret.name')" prop="value">

ui/src/composables/monaco/languages/yamlLanguageConfigurator.ts

@@ -1,4 +1,3 @@
-import {computed, watch} from "vue";
 import {useI18n} from "vue-i18n";
 import {configureMonacoYaml} from "monaco-yaml";
 import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
@@ -22,7 +21,6 @@ import {
     registerPebbleAutocompletion
 } from "./pebbleLanguageConfigurator";
 import {usePluginsStore} from "../../../stores/plugins";
-import {useBlueprintsStore} from "../../../stores/blueprints";
 import {languages} from "monaco-editor/esm/vs/editor/editor.api";
 import CompletionItem = languages.CompletionItem;
 
@@ -36,14 +34,11 @@ export class YamlLanguageConfigurator extends AbstractLanguageConfigurator {
     }
 
     async configureLanguage(pluginsStore: ReturnType<typeof usePluginsStore>) {
-        const validateYAML = computed(() => useBlueprintsStore().validateYAML);
-        watch(validateYAML, (shouldValidate) => configureMonacoYaml(monaco, {validate: shouldValidate}));
-
         configureMonacoYaml(monaco, {
             enableSchemaRequest: true,
             hover: localStorage.getItem("hoverTextEditor") === "true",
             completion: true,
-            validate: validateYAML.value ?? true,
+            validate: true,
             format: true,
             schemas: yamlSchemas()
         });

ui/src/override/components/LeftMenu.vue

@@ -1,11 +1,5 @@
 <template>
-    <SideBar
-        v-if="menu"
-        :menu
-        :showLink
-        @menu-collapse="onCollapse"
-        :class="{overlay: verticalLayout}"
-    >
+    <SideBar v-if="menu" :menu :showLink="showLink" @menu-collapse="onCollapse">
         <template #footer>
             <Auth />    
         </template>
@@ -17,9 +11,6 @@
     import SideBar from "../../components/layout/SideBar.vue";
     import Auth from "../../override/components/auth/Auth.vue";
 
-    import {useBreakpoints, breakpointsElement} from "@vueuse/core";
-    const verticalLayout = useBreakpoints(breakpointsElement).smallerOrEqual("sm");
-
     withDefaults(defineProps<{
         showLink?: boolean
     }>(), {

ui/src/override/components/flows/blueprints/BlueprintsBrowser.vue

@@ -56,10 +56,7 @@
                                 <div v-if="!system && blueprint.tags?.length > 0" class="tags-section">
                                     <span v-for="tag in processedTags(blueprint.tags)" :key="tag.original" class="tag-item">{{ tag.display }}</span>
                                 </div>
-                                <div v-if="blueprint.template" class="tags-section">
-                                    <span class="tag-item">{{ $t('template') }}</span>
-                                </div>
-                                <div class="text-section">                                        
+                                <div class="text-section">
                                     <h3 class="title">
                                         {{ blueprint.title ?? blueprint.id }}
                                     </h3>
@@ -154,7 +151,6 @@
         id: string;
         tags: string[];
         title?: string;
-        template?: Record<string, any>;
     }[] | undefined>(undefined);
     const error = ref(false);
     const icon = {ContentCopy};

ui/src/override/components/namespaces/Namespaces.vue

@@ -2,7 +2,7 @@
     <Navbar :title="routeInfo.title">
         <template #additional-right>
             <Action
-                v-if="!isOSS && canCreate"
+                v-if="canCreate"
                 :label="t('create')"
                 :to="{name: 'namespaces/create', params: {tab: 'edit'}}"
             />
@@ -142,8 +142,6 @@
     const systemNamespace = computed(
         () => miscStore.configs?.systemNamespace || "system",
     );
-    
-    const isOSS = computed(() => useMiscStore().configs?.edition === "OSS")
 
     const namespacesHierarchy = computed(() => {
         if (namespaces.value === undefined || namespaces.value.length === 0) {

ui/src/routes/routes.js

@@ -99,6 +99,7 @@ export default [
 
     //Namespaces
     {name: "namespaces/list", path: "/:tenant?/namespaces", component: () => import("override/components/namespaces/Namespaces.vue")},
+    {name: "namespaces/create", path: "/:tenant?/namespaces/new/:tab?", component: () => import("../components/namespaces/Namespace.vue")},
     {name: "namespaces/update", path: "/:tenant?/namespaces/edit/:id/:tab?", component: () => import("../components/namespaces/Namespace.vue")},
 
     //Docs

ui/src/stores/blueprints.ts

@@ -25,8 +25,6 @@ interface Blueprint {
     [key: string]: any;
 }
 
-export type TemplateArgument = Record<string, Input>;
-
 export interface BlueprintTemplate {
     source: string;
     templateArguments: Record<string, Input>;
@@ -57,8 +55,6 @@ export const useBlueprintsStore = defineStore("blueprints", () => {
     const source = ref<string | undefined>(undefined);
     const graph = ref<any | undefined>(undefined);
 
-    const validateYAML = ref<boolean>(true); // Used to enable/disable YAML validation in Monaco editor, for the purpose of Templated Blueprints
-
     const getBlueprints = async (options: Options) => {
         const PARAMS = {params: options.params, ...VALIDATE};
 
@@ -170,8 +166,6 @@ export const useBlueprintsStore = defineStore("blueprints", () => {
         source,
         graph,
 
-        validateYAML,
-
         getBlueprints,
         getBlueprint,
         getBlueprintSource,

ui/src/styles/components/sidebar-menu.scss

@@ -1,10 +1,6 @@
 @import "@kestra-io/ui-libs/src/scss/variables.scss";
 
 #app {
-    .v-sidebar-menu.vsm_expanded.overlay {
-        position: absolute;
-    }
-
     .vsm--item {
         padding: 0 30px;
         transition: padding 0.2s ease;