@genexus/genexus-ide-ui 1.1.35 → 1.1.36

package/dist/components/gx-ide-team-dev-commit.js

@@ -1,14 +1,277 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { g as getIconPath } from './MERCURY_ASSETS.js';
-import { r as renderObjectTypeWithIcon, a as renderObjectStateWithIcon } from './utilities.js';
+import { h, proxyCustomElement, HTMLElement, Host } from '@stencil/core/internal/client';
 import { L as Locale } from './locale.js';
-import { c as config } from './config.js';
+import { g as getIconPath } from './MERCURY_ASSETS.js';
+import { r as renderObjectTypeWithIcon } from './utilities.js';
 import { f as formatDate } from './helpers.js';
-import { m as mapGxOptionsToComboBoxItemModel, a as mapObjectTypeToComboBoxItemModel } from './helpers2.js';
+import { h as hiChar } from './helpers2.js';
+import { c as config } from './config.js';
 import { d as defineCustomElement$3 } from './gx-ide-empty-state2.js';
 import { d as defineCustomElement$2 } from './ide-loader.js';
 
-const commitCss = ".custom-icon-text-wrapper{display:flex;align-items:center;gap:10px}:host{display:grid;block-size:100%;overflow:auto;grid-template-rows:max-content 1fr max-content}section{display:contents}.header__first-row{grid-template-columns:1fr max-content}.field-comment{flex:1}.filters-container{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--mer-timing--fast)}.filters-container-visible{grid-template-rows:1fr}.filters-container>div{overflow:hidden}.filter{grid-template-areas:\"field-pattern field-folder field-type\" \"field-changeset field-changeset field-category\";padding-block-start:var(--mer-spacing--sm)}.field-pattern{grid-area:field-pattern}.field-folder{grid-area:field-folder}.field-type{grid-area:field-type}.field-changeset{grid-area:field-changeset}.field-category{grid-area:field-category}.ch-tab-slot{inline-size:100%;overflow:auto}.tab{border:none !important}.tabular-grid{block-size:100%;position:relative;overflow:auto}.tabular-grid-cell.tabular-grid-cell-description{max-inline-size:600px}gx-ide-loader{position:absolute;inline-size:100%;block-size:100%}ch-tabular-grid-rowset-empty{position:relative}ch-tabular-grid.tabular-grid--empty::part(main){overflow:hidden}.tooltip{position:absolute}";
+/**
+ * Filters a grid selection to only include rows from the given source ("pending" or "ignored").
+ * Rows from the other category are unselected.
+ *
+ * @param {SourceType} gridSource - The source category of the selection.
+ * @param {string[]} selectedRowsIds - The currently selected row IDs.
+ * @returns {string[]} Filtered row IDs belonging to the specified source.
+ */
+const clearGridSelection = (gridSource, selectedRowsIds, pendingIdsSet, ignoredIdsSet, gridReference) => {
+    let filteredSelectedRowsIds = [];
+    if (selectedRowsIds.length > 1 && gridSource === "pending") {
+        selectedRowsIds.forEach(async (selectedRowId) => {
+            if (ignoredIdsSet.has(selectedRowId)) {
+                await gridReference.selectRow(selectedRowId, false);
+            }
+            else {
+                filteredSelectedRowsIds.push(selectedRowId);
+            }
+        });
+    }
+    else if (selectedRowsIds.length > 1 && gridSource === "ignored") {
+        selectedRowsIds.forEach(async (selectedRowId) => {
+            if (pendingIdsSet.has(selectedRowId)) {
+                await gridReference.selectRow(selectedRowId, false);
+            }
+            else {
+                filteredSelectedRowsIds.push(selectedRowId);
+            }
+        });
+    }
+    else {
+        filteredSelectedRowsIds = selectedRowsIds;
+    }
+    return filteredSelectedRowsIds;
+};
+
+const headerDetail = (type = "text", caption, description, callback, cssClass) => {
+    return (h("div", { class: { [cssClass]: true, "field field-block": true } },
+        h("span", { class: "detail__label body-semi-bold-s" }, caption),
+        type === "text" ? (h("p", { class: "body-regular-s" }, description)) : (h("button", { class: "detail__link body-regular-s", onClick: callback }, description))));
+};
+const headerTitle = (caption, cssClass) => {
+    return (h("h2", { class: { [cssClass]: true, "header__title subtitle-semi-bold-s": true } }, caption));
+};
+
+const changesetToComboBoxModel = (changesetModel) => {
+    if (!changesetModel)
+        return [];
+    return changesetModel.map(changeset => ({
+        value: changeset.id,
+        caption: changeset.name === "All"
+            ? "All Changesets"
+            : changeset.label || changeset.name || ""
+    }));
+};
+
+const foldersToComboBoxModel = (foldersModel) => foldersModel.map(folder => ({
+    value: folder.name,
+    caption: folder.name === "All" ? "All Modules" : folder.label || folder.name || ""
+}));
+
+const typesToComboBoxItemModel = (objectTypeModel) => objectTypeModel.map(objectType => ({
+    value: objectType.id,
+    caption: objectType.name === "All" ? "All Types" : objectType.name || "",
+    startImgSrc: objectType.icon
+}));
+
+const ALL_VALUE = "All";
+const CSS_SELECTORS = {
+    HEADER: "header spacing-body-inline spacing-body-block-start field-group",
+    HEADER_DETAILS: "header__details",
+    FILTER: "filter",
+    MAIN: "main spacing-body",
+    GRID_CELL_DESCRIPTION: "tabular-grid-cell-description-custom-selector"
+};
+const ICONS = {
+    add: getIconPath({
+        category: "system",
+        name: "add",
+        colorType: "on-elevation"
+    }),
+    edit: getIconPath({
+        category: "system",
+        name: "edit",
+        colorType: "on-elevation"
+    }),
+    error: getIconPath({
+        category: "system",
+        name: "error",
+        colorType: "error"
+    }),
+    filter: getIconPath({
+        category: "window-tools",
+        name: "filter",
+        colorType: "neutral"
+    }),
+    filterWithConditions: getIconPath({
+        category: "window-tools",
+        name: "filter-conditions",
+        colorType: "neutral"
+    }),
+    info: getIconPath({
+        category: "system",
+        name: "information",
+        colorType: "on-elevation"
+    }),
+    refresh: getIconPath({
+        category: "gemini-tools",
+        name: "reset",
+        colorType: "neutral"
+    }),
+    search: getIconPath({
+        category: "system",
+        name: "search",
+        colorType: "on-elevation"
+    }),
+    success: getIconPath({
+        category: "system",
+        name: "check",
+        colorType: "success"
+    }),
+    substract: getIconPath({
+        category: "system",
+        name: "substract",
+        colorType: "on-elevation"
+    }),
+    warning: getIconPath({
+        category: "system",
+        name: "warning",
+        colorType: "warning"
+    })
+};
+
+// stencil
+const BUTTON_ACTION_SELECTOR = "button-action-custom-selector";
+const renderStateCellContent = (action, componentLocale) => {
+    let icon;
+    let caption;
+    let iconColor;
+    if (action === "deleted") {
+        icon = ICONS.substract;
+        caption = componentLocale.states.deleted;
+        iconColor = "--mer-icon__error";
+    }
+    else if (action === "inserted") {
+        icon = ICONS.add;
+        caption = componentLocale.states.inserted;
+        iconColor = "--mer-icon__success";
+    }
+    else if (action === "modified") {
+        icon = ICONS.edit;
+        caption = componentLocale.states.modified;
+        iconColor = "--mer-icon__warning";
+    }
+    else if (action === "conflicted") {
+        icon = ICONS.warning;
+        caption = componentLocale.states.conflicted;
+        iconColor = "--mer-icon__warning";
+    }
+    else if (!action) {
+        // proably is "ignored"
+        return null;
+    }
+    return (h("span", { class: "custom-icon-text-wrapper" },
+        h("ch-image", { type: "mask", class: "icon-md", src: icon, style: { backgroundColor: `var(${iconColor})` } }),
+        `${caption}`));
+};
+const renderObjectStatus = (objectId, objectsStatusMap, updatePillAsButton, commitSingleObject, componentLocale) => {
+    const status = objectsStatusMap.get(objectId);
+    const caption = status === "pending" && updatePillAsButton
+        ? componentLocale.status.commit
+        : componentLocale.status[status];
+    if (status === "commiting") {
+        return h("span", { class: "spinner-caption" }, caption);
+    }
+    const classes = `pill pill--${status}`;
+    if (updatePillAsButton && status === "pending") {
+        return (h("button", { class: {
+                "button-secondary": true,
+                "button-icon-and-text": true,
+                "pill": true,
+                "pill--update": true,
+                [BUTTON_ACTION_SELECTOR]: true
+            }, onClick: commitSingleObject(objectId) }, caption));
+    }
+    else {
+        return h("span", { class: classes }, caption);
+    }
+};
+const renderTabularGridRows = (type, pendingObjectsAfterFilter, ignoredObjectsAfterFilter, alreadyUpdatedObjectsIdsSet, markedObjectsSet, objectsMessagesDataMap, updatePillAsButton, commitSingleObject, objectsStatusMap, searchValue, componentLocale) => {
+    let objects;
+    if (type === "pending") {
+        objects = pendingObjectsAfterFilter;
+    }
+    else if (type === "ignored") {
+        objects = ignoredObjectsAfterFilter;
+    }
+    searchValue = searchValue.toLowerCase();
+    const filteredRows = objects.map(object => {
+        const alreadyUpdated = alreadyUpdatedObjectsIdsSet.has(object.id);
+        const hideCheckbox = alreadyUpdated || type === "ignored";
+        const marked = markedObjectsSet.has(object.id);
+        const messages = objectsMessagesDataMap.get(object.id);
+        return (h("ch-tabular-grid-row", { class: "tabular-grid-row", key: object.id, rowid: object.id, ref: (el) => marked && (el === null || el === void 0 ? void 0 : el.setAttribute("marked", "true")) },
+            h("ch-tabular-grid-cell", { "cell-type": "rich", "row-selector": "true", class: {
+                    "tabular-grid-cell": true,
+                    "no-checkbox-custom-selector": hideCheckbox
+                }, size: "max-content" },
+                h("div", null, hiChar(object.name, searchValue))),
+            h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, renderObjectTypeWithIcon(object.type)),
+            h("ch-tabular-grid-cell", { class: {
+                    "tabular-grid-cell": true,
+                    [CSS_SELECTORS.GRID_CELL_DESCRIPTION]: true
+                } },
+                h("div", null, hiChar(object.description, searchValue))),
+            h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, formatDate(object.modifiedOn)),
+            h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, object.module),
+            h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, renderStateCellContent(object.state, componentLocale)),
+            h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, formatDate(object.lastSynchronized)),
+            h("ch-tabular-grid-cell", { class: "tabular-grid-cell tabular-grid-cell--for-pill" }, renderObjectStatus(object.id, objectsStatusMap, updatePillAsButton, commitSingleObject, componentLocale)),
+            (messages === null || messages === void 0 ? void 0 : messages.length) && (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" },
+                h("ch-tabular-grid-rowset-empty", { class: {
+                        "tabular-grid-rowset-empty": true
+                    } },
+                    h("ul", { class: "messages-list" }, messages.map(message => {
+                        let MESSAGE_ICON;
+                        if (message.type === "error") {
+                            MESSAGE_ICON = ICONS.error;
+                        }
+                        else if (message.type === "warning") {
+                            MESSAGE_ICON = ICONS.warning;
+                        }
+                        else if (message.type === "success") {
+                            MESSAGE_ICON = ICONS.success;
+                        }
+                        else {
+                            // info
+                            MESSAGE_ICON = ICONS.info;
+                        }
+                        return (h("li", { class: "message-description" },
+                            h("ch-image", { class: "icon-md message-icon", src: MESSAGE_ICON }),
+                            message.text));
+                    })))))));
+    });
+    // this.objectsRenderedAlready = true;
+    return filteredRows;
+};
+const renderTabularGridColumns = (ignoredGridColumns, gridIsEmpty = false, componentLocale) => {
+    const colSize = gridIsEmpty
+        ? config.tabularGrid.colSize.auto
+        : config.tabularGrid.colSize.maxContent;
+    return (h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" },
+        !ignoredGridColumns.includes("name") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "name", columnName: componentLocale.objects.name, columnType: "rich", richRowSelector: true, richRowSelectorMode: "mark", settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("type") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "type", columnName: componentLocale.objects.type, settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("description") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "description", columnName: componentLocale.objects.description, settingable: false, size: config.tabularGrid.colSize.description })),
+        !ignoredGridColumns.includes("modifiedOn") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "modifiedOn", columnName: componentLocale.objects.modifiedOn, settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("module") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "module", columnName: componentLocale.objects.module, settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("localState") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "localState", columnName: componentLocale.objects.localState, settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("lastSynchronized") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "lastSynchronized", columnName: componentLocale.objects.lastSynchronized, settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("action") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "action", columnName: componentLocale.objects.action, settingable: false, size: colSize })),
+        !ignoredGridColumns.includes("status") && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnId: "status", columnName: componentLocale.objects.status, settingable: false, size: gridIsEmpty ? "auto" : "100px" }))));
+};
+
+const commitCss = ".detail__knowledge-base{padding-inline:24px;border-inline-end:1px solid var(--mer-border-color__on-elevation--01)}.detail__genexus-server{padding-inline-end:24px;border-inline-end:1px solid var(--mer-border-color__on-elevation--01)}.detail__version{padding-inline-start:24px}.filter,.filter-secondary>div{display:grid;gap:12px}:host{display:grid;block-size:100%;overflow:auto;grid-template-rows:max-content max-content 1fr;--pill-border-radius:12px;--pill-padding-inline:8px;--pill-padding-block:2px;--pill-font-size:var(--font-size-body-s)}.section{display:grid;display:contents}.header__details{display:grid;row-gap:var(--mer-spacing--md);grid-auto-columns:max-content;grid-auto-rows:max-content;margin-block-end:var(--mer-spacing--lg)}.detail__label{color:var(--mer-color__neutral-gray--400)}.detail__link{align-items:start;color:var(--mer-text__primary);text-decoration:underline}.detail__link:hover{color:var(--mer-text__primary--hover)}.detail__link:active{color:var(--mer-text__primary--active)}.filter__combo{max-block-size:minmax(0, 200px)}.main{position:relative;display:grid;overflow:auto}.loader{position:relative;inline-size:100%;block-size:100%;inset-block-start:0;--elevation-background-color:var(--mer-surface__elevation--01)}.empty-state{block-size:100%}.tabular-grid.disabled-custom-selector .tabular-grid-cell::part(selector-label),.tabular-grid.disabled-custom-selector .tabular-grid-column::part(bar-selector),.tabular-grid.disabled-custom-selector .tabular-grid-cell::part(actions-icon){pointer-events:none;opacity:0.5}.tabular-grid-cell.no-checkbox-custom-selector::part(selector-label){visibility:hidden}.tabular-grid{border-radius:4px;overflow:hidden}.tabular-grid .tabular-grid-cell--for-pill{--grid-cell__padding-block:4px;align-items:center;justify-content:center}.tabular-grid .button-action-custom-selector{--control__padding-block:var(--pill-padding-block);--control__padding-inline:var(--pill-padding-inline);font-size:inherit;font-weight:inherit;}.tabular-grid.empty-result::part(main){overflow:hidden}.messages-list{margin:0;padding:0;list-style:none;max-inline-size:800px;padding:8px 0;list-style-type:none;display:flex;flex-direction:column;gap:var(--mer-spacing--3xs)}.message-description{line-height:1.5;display:flex;align-items:center;gap:8px}.message-icon{flex-shrink:0}.pill{--pill-background-color:transparent;--pill-color:transparent;--pill-border-color:transparent;background-color:var(--pill-background-color);color:var(--pill-color);border:1px solid var(--pill-border-color);inline-size:100%;padding:var(--pill-padding-block) var(--pill-padding-inline);display:flex;align-items:center;justify-content:center;border-radius:var(--pill-border-radius);position:relative;font-weight:var(--font-weight-semi-bold)}.pill--update,.pill--pending{--pill-background-color:var();--pill-color:var(--mer-color__neutral-gray--400);--pill-border-color:var()}.pill--to-merge-marked{--pill-background-color:var();--pill-color:var(--mer-border-color__primary);--pill-border-color:var()}.pill--ignored{--pill-background-color:var(--mer-surface__elevation--02);--pill-color:var(--mer-text__on-disabled);--pill-border-color:var(--mer-border-color__primary--disabled)}.pill--pending{--pill-background-color:var(--mer-color__tinted-primary--8);--pill-color:var(--mer-border-color__primary);--pill-border-color:var(--mer-color__tinted-primary--50)}.pill--warning{--pill-background-color:var(--mer-color__tinted-yellow--5);--pill-color:var(--mer-border-color__warning);--pill-border-color:var(--mer-color__tinted-yellow--60)}.pill--error{--pill-background-color:var(--mer-color__tinted-red--5);--pill-color:var(--mer-border-color__error);--pill-border-color:var(--mer-color__tinted-red--60)}.pill--commited{--pill-background-color:var(--mer-color__tinted-green--5);--pill-color:var(--mer-border-color__success);--pill-border-color:var(--mer-color__tinted-green--60)}.pill--transitioning{--pill-color:transparent}.spinner-caption{display:flex;align-items:center;gap:6px;--status-circle-color:transparent;--status-circle-size:$size;--status-circle-inset-inline-start:14px;--pill-color:var(--mer-border-color__primary)}.spinner-caption::before{display:inline-block;content:\"\";width:14px;height:14px;border:calc(14px / 7) solid var(--mer-color__tinted-primary--50);border-top:calc(14px / 7) solid var(--mer-color__primary--300);border-radius:50%;animation:spin var(--mer-timing--regular) linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.hiChar{color:var(--mer-color__primary--200);filter:brightness(1.3)}.custom-icon-text-wrapper{display:flex;align-items:center;gap:10px}.header__details{grid-template-areas:\"detail-heading-gx . . .\" \"detail-genexus-server detail-knowledge-base detail-version detail-last-full-update\"}.detail__heading-genexus-server{grid-area:detail-heading-gx}.detail__genexus-server{grid-area:detail-genexus-server}.detail__knowledge-base{grid-area:detail-knowledge-base}.detail__version{grid-area:detail-version}.filter-container{container-type:inline-size;box-sizing:border-box;display:grid;column-gap:12px;grid-template-areas:\"filter-primary filter-toggle-button filter-action-buttons\" \"filter-secondary . .\" \"comments comments comments\";grid-template-columns:minmax(0, max-content) max-content 1fr}.filter-primary{grid-area:filter-primary;grid-template-columns:minmax(0, 200px) minmax(0, 200px) minmax(0, 200px)}.filter-container>:nth-child(2){grid-area:filter-toggle-button}.filter-container>:nth-child(3){grid-area:filter-action-buttons;justify-content:end}.filter__toggle-secondary-filter-btn{grid-area:filter-toggle-button}.filter__buttons{grid-area:filter-buttons;margin-inline-start:auto}.filter-secondary{display:grid;grid-template-rows:0fr;grid-area:filter-secondary;transition:grid-template-rows var(--mer-timing--fast)}.filter-secondary--visible{grid-template-rows:1fr}.filter-secondary>div{display:grid;overflow:hidden;font-size:0;grid-template-columns:repeat(3, minmax(0, 200px))}.filter-secondary>div>.combo-box,.comments{margin-block-start:12px}.comments{grid-area:comments}.input-comments-container{position:relative}.input-comments{--control__border-color:transparent;padding-block:0 !important;padding-inline:0 !important;--line-height-tight:1.4;block-size:100%;background-color:var(--mer-surface);transition:var(--mer-timing--super-fast) block-size, var(--mer-timing--super-fast) background-color, var(--mer-timing--super-fast) padding-block, var(--mer-timing--super-fast) padding-inline}.input-comments:focus{position:absolute;block-size:minmax(0, 200px);inline-size:100%;z-index:99;background-color:var(--mer-surface__elevation--01);padding-block:var(--control__padding-block) !important;padding-inline:var(--control__padding-inline) !important}";
 
 var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
     if (kind === "a" && !f)
@@ -26,418 +289,521 @@ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) ||
         throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _GxIdeTeamDevCommit_componentLocale, _GxIdeTeamDevCommit_loadDataCalledFirstTime, _GxIdeTeamDevCommit_renderedFirstTime, _GxIdeTeamDevCommit_commitsTabModel, _GxIdeTeamDevCommit_categoriesEl, _GxIdeTeamDevCommit_changeSetEl, _GxIdeTeamDevCommit_commitCommentEl, _GxIdeTeamDevCommit_foldersEl, _GxIdeTeamDevCommit_patternEl, _GxIdeTeamDevCommit_typesEl, _GxIdeTeamDevCommit_chGridIgnoredObjectsEl, _GxIdeTeamDevCommit_chGridPendingCommitsEl, _GxIdeTeamDevCommit_initializeComboBoxModels, _GxIdeTeamDevCommit_commitCallbackHandler, _GxIdeTeamDevCommit_evaluateFilterConditions, _GxIdeTeamDevCommit_getRecentCommentHandler, _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler, _GxIdeTeamDevCommit_handleColumnSortChanged, _GxIdeTeamDevCommit_loadData, _GxIdeTeamDevCommit_markAllPendingCommitsRows, _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, _GxIdeTeamDevCommit_renderTabularGridColumnSet, _GxIdeTeamDevCommit_renderTabularGridCommonCells, _GxIdeTeamDevCommit_renderIgnoredObjectsGrid, _GxIdeTeamDevCommit_renderPendingCommitsGrid, _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes, _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes, _GxIdeTeamDevCommit_updateTabModel, _GxIdeTeamDevCommit_commentInputHandler, _GxIdeTeamDevCommit_toggleFiltersHandler, _GxIdeTeamDevCommit_onTabActivated;
-const FILTER_ICON = getIconPath({
-    category: "window-tools",
-    name: "filter",
-    colorType: "primary"
-});
-const FILTER_ICON_EMPTY = getIconPath({
-    category: "window-tools",
-    name: "filter",
-    colorType: "on-surface"
-});
-const FILTER_WITH_CONDITIONS_ICON = getIconPath({
-    category: "window-tools",
-    name: "filter-conditions",
-    colorType: "primary"
-});
-const RESET_ICON = getIconPath({
-    category: "gemini-tools",
-    name: "reset",
-    colorType: "primary"
-});
-const ALL_OPTION = "All";
+var _GxIdeTeamDevCommit_componentLocale, _GxIdeTeamDevCommit_localStatesComboBoxModel, _GxIdeTeamDevCommit_rowCheckedChangedByTheUser, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, _GxIdeTeamDevCommit_commitCheckedClickedHandler, _GxIdeTeamDevCommit_commitSingleObject, _GxIdeTeamDevCommit_commitObjectsHandler, _GxIdeTeamDevCommit_rowMarkingChangedHandler, _GxIdeTeamDevCommit_rowSelectionChangedHandler, _GxIdeTeamDevCommit_commentsInputHandler, _GxIdeTeamDevCommit_applyClientFilter, _GxIdeTeamDevCommit_filteredObjects, _GxIdeTeamDevCommit_evaluateSecondaryFilterHasConditions, _GxIdeTeamDevCommit_toggleFiltersHandler, _GxIdeTeamDevCommit_searchInputHandler, _GxIdeTeamDevCommit_typeChangedHandler, _GxIdeTeamDevCommit_stateChangedHandler, _GxIdeTeamDevCommit_folderChanged, _GxIdeTeamDevCommit_onRowContextMenuHandler, _GxIdeTeamDevCommit_updatePendingCheckedItems, _GxIdeTeamDevCommit_setInitialObjectsStatus, _GxIdeTeamDevCommit_loadData, _GxIdeTeamDevCommit_markPendingObjects, _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes, _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes;
+const FILTER_SECONDARY_CONTAINER_ID = "filters-secondary-container";
+const FILTER_SECONDARY_BUTTON_ID = "filter-toggle-button";
 const CSS_BUNDLES = [
     "resets/box-sizing",
-    "components/button",
-    "components/checkbox",
-    "components/combo-box",
-    "components/edit",
-    "components/tab",
-    "components/icon",
     "components/tabular-grid",
-    "components/tooltip",
-    "chameleon/scrollbar",
-    "utils/form",
+    "utils/form--full",
     "utils/layout",
     "utils/typography",
-    "utils/spacing"
+    "utils/spacing",
+    "chameleon/scrollbar"
 ];
 const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class GxIdeTeamDevCommit extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.componentDidLoadEvent = createEvent(this, "componentDidLoadEvent", 7);
-        this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
         /**
          * The component hard-coded strings translations.
          */
         // eslint-disable-next-line @stencil-community/own-props-must-be-private
         _GxIdeTeamDevCommit_componentLocale.set(this, void 0);
-        _GxIdeTeamDevCommit_loadDataCalledFirstTime.set(this, false); // pending commits grid checkboxes, should be checked, after loadData has loaded commits for the first time.
-        _GxIdeTeamDevCommit_renderedFirstTime.set(this, false);
-        _GxIdeTeamDevCommit_commitsTabModel.set(this, [
-            { id: "pending-commits", name: "Pending Commits" },
-            { id: "ignored-objects", name: "Ignored Objects" }
-        ]);
-        // filters
-        _GxIdeTeamDevCommit_categoriesEl.set(this, void 0);
-        _GxIdeTeamDevCommit_changeSetEl.set(this, void 0);
-        _GxIdeTeamDevCommit_commitCommentEl.set(this, void 0);
-        _GxIdeTeamDevCommit_foldersEl.set(this, void 0);
-        _GxIdeTeamDevCommit_patternEl.set(this, void 0);
-        _GxIdeTeamDevCommit_typesEl.set(this, void 0);
-        // other
-        _GxIdeTeamDevCommit_chGridIgnoredObjectsEl.set(this, void 0);
-        _GxIdeTeamDevCommit_chGridPendingCommitsEl.set(this, void 0);
-        _GxIdeTeamDevCommit_initializeComboBoxModels.set(this, () => {
-            this.foldersChangedHandler(this.folders);
-            this.typesChangedHandler(this.types);
-            this.changeSetChangedHandler(this.changeSet);
-            this.categoriesChangedHandler(this.categories);
+        /**
+         * The ComboBoxModel for "Local State" filter.
+         */
+        _GxIdeTeamDevCommit_localStatesComboBoxModel.set(this, void 0);
+        /**
+         * Used to determine if pendingItemsCheckedCallback callback has to be
+         * called or not. It should be ignored if the grid checkboxes state is
+         * changed programmatically, by setting markRow to false once the object
+         * has been successfully updated, for example.
+         */
+        _GxIdeTeamDevCommit_rowCheckedChangedByTheUser.set(this, true);
+        /**
+         * A reference to the tablar grid. Used to call methods.
+         */
+        _GxIdeTeamDevCommit_chGridPendingForUpdateEl.set(this, void 0);
+        // commit related
+        _GxIdeTeamDevCommit_commitCheckedClickedHandler.set(this, () => {
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitObjectsHandler, "f").call(this, [...this.markedObjectsSet]);
         });
-        _GxIdeTeamDevCommit_commitCallbackHandler.set(this, async () => {
-            const comment = __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f").value;
-            if (!comment.length) {
+        _GxIdeTeamDevCommit_commitSingleObject.set(this, objectId => async () => {
+            const newobjectsStatusMap = new Map(this.objectsStatusMap);
+            newobjectsStatusMap.set(objectId, "commiting");
+            this.objectsStatusMap = newobjectsStatusMap;
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitObjectsHandler, "f").call(this, [objectId]);
+        });
+        _GxIdeTeamDevCommit_commitObjectsHandler.set(this, async (selection) => {
+            if (this.commentsValue.length === 0) {
                 // A comment is required to commit.
                 this.commentInputHasError = true;
                 return;
             }
-            this.commitingObjects = true;
             this.commentInputHasError = false;
-            const pendingCommitsCheckedIds = await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").getMarkedRows();
-            await this.commitCallback(pendingCommitsCheckedIds, comment);
-            this.commitingObjects = false;
+            this.commiting = true;
+            selection.forEach(itemToUpdate => {
+                this.objectsStatusMap.set(itemToUpdate, "commiting");
+            });
+            const commitResult = await this.commitCallback(selection, this.commentsValue);
+            commitResult.forEach(async (objectResult) => {
+                const messages = objectResult.messages;
+                if (messages.length) {
+                    this.objectsMessagesDataMap.set(objectResult.id, objectResult.messages);
+                }
+                else {
+                    // clear messages
+                    this.objectsMessagesDataMap.delete(objectResult.id);
+                }
+                if (objectResult.result === "commited") {
+                    this.alreadyCommitedObjectsIdsSet.add(objectResult.id);
+                    this.objectsStatusMap.set(objectResult.id, "commited");
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f").markRow(objectResult.id, false);
+                }
+                else {
+                    this.objectsStatusMap.set(objectResult.id, "pending");
+                }
+            });
+            this.commiting = false;
         });
-        _GxIdeTeamDevCommit_evaluateFilterConditions.set(this, () => {
-            // TODO: This should update
-            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_patternEl, "f").value !== "" ||
-                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_changeSetEl, "f").value !== ALL_OPTION ||
-                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_typesEl, "f").value !== ALL_OPTION ||
-                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_foldersEl, "f").value !== ALL_OPTION ||
-                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_categoriesEl, "f").value !== ALL_OPTION) {
-                this.filterHasConditions = true;
+        // handlers
+        _GxIdeTeamDevCommit_rowMarkingChangedHandler.set(this, async (event) => {
+            const markedRowsIds = event.detail.rowsId;
+            this.markedObjectsSet = new Set(markedRowsIds.filter(markedObjectId => !this.alreadyCommitedObjectsIdsSet.has(markedObjectId)));
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_rowCheckedChangedByTheUser, "f")) {
+                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_updatePendingCheckedItems, "f").call(this, event);
             }
-            else {
-                this.filterHasConditions = false;
+        });
+        _GxIdeTeamDevCommit_rowSelectionChangedHandler.set(this, async (event) => {
+            const selectedRowsIds = event.detail.rowsId;
+            const firstSelectedRowId = selectedRowsIds[0];
+            const gridSource = this.pendingIdsSet.has(firstSelectedRowId)
+                ? "pending"
+                : "ignored";
+            const filteredSelectedRowsIds = clearGridSelection(gridSource, selectedRowsIds, this.pendingIdsSet, this.ignoredIdsSet, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f"));
+            await this.selectCallback(gridSource, filteredSelectedRowsIds);
+        });
+        _GxIdeTeamDevCommit_commentsInputHandler.set(this, (event) => {
+            this.commentsValue = event.detail;
+            if (this.commentsValue.length && this.commentInputHasError) {
+                // remove error style and tooltip
+                this.commentInputHasError = false;
             }
         });
-        _GxIdeTeamDevCommit_getRecentCommentHandler.set(this, async () => {
-            if (this.getRecentCommentCallback) {
-                const response = await this.getRecentCommentCallback();
-                if (response) {
-                    __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f").value = response;
-                }
+        // filter related
+        _GxIdeTeamDevCommit_applyClientFilter.set(this, () => {
+            this.pendingObjectsAfterFilter = __classPrivateFieldGet(this, _GxIdeTeamDevCommit_filteredObjects, "f").call(this, this.pendingAndIgnored.pendingForCommit);
+            this.ignoredObjectsAfterFilter = __classPrivateFieldGet(this, _GxIdeTeamDevCommit_filteredObjects, "f").call(this, this.pendingAndIgnored.ignoredObjects);
+        });
+        _GxIdeTeamDevCommit_filteredObjects.set(this, (objects) => {
+            let filtered = objects;
+            // name or description
+            if (this.searchValue.length) {
+                filtered = filtered.filter(object => {
+                    const nameFiltered = object.name
+                        .toLowerCase()
+                        .includes(this.searchValue.toLowerCase());
+                    const descriptionFiltered = object.description
+                        .toLowerCase()
+                        .includes(this.searchValue.toLowerCase());
+                    return nameFiltered || descriptionFiltered;
+                });
+            }
+            // status
+            if (this.selectedState && this.selectedState !== ALL_VALUE) {
+                filtered = filtered.filter(object => object.state === this.selectedState);
             }
+            return filtered;
         });
-        _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler.set(this, (grid) => async (ev) => {
-            if (this.selectCallback) {
-                await this.selectCallback(grid, ev.detail.rowsId);
+        _GxIdeTeamDevCommit_evaluateSecondaryFilterHasConditions.set(this, () => {
+            if (
+            // this.selectedChangeset !== ALL_VALUE ||
+            this.selectedFolder !== ALL_VALUE
+            // this.selectedCategory !== ALL_VALUE
+            ) {
+                this.filterSecondaryHasConditions = true;
+            }
+            else {
+                this.filterSecondaryHasConditions = false;
             }
         });
-        _GxIdeTeamDevCommit_handleColumnSortChanged.set(this, (e) => {
-            const { columnId, sortDirection } = e.detail;
-            const aux = this.pendingCommits;
-            aux.sort((a, b) => {
-                if (a[columnId] < b[columnId]) {
-                    return sortDirection === "asc" ? -1 : 1;
-                }
-                if (a[columnId] > b[columnId]) {
-                    return sortDirection === "asc" ? 1 : -1;
-                }
-                return 0;
-            });
-            this.pendingCommits = [...aux];
+        _GxIdeTeamDevCommit_toggleFiltersHandler.set(this, () => {
+            this.filterSecondaryIsHidden = !this.filterSecondaryIsHidden;
         });
-        _GxIdeTeamDevCommit_loadData.set(this, async () => {
-            this.loading = true;
-            const filtersData = {
-                pattern: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_patternEl, "f").value,
-                changeSet: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_changeSetEl, "f").value,
-                folder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_foldersEl, "f").value,
-                category: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_categoriesEl, "f").value,
-                type: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_typesEl, "f").value
-            };
-            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_evaluateFilterConditions, "f").call(this);
-            await this.loadCallback(filtersData).then(async ({ pending, ignored }) => {
-                this.pendingCommits = [...pending];
-                this.ignoredObjects = [...ignored];
-            });
-            this.loading = false;
-            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_updateTabModel, "f").call(this);
+        _GxIdeTeamDevCommit_searchInputHandler.set(this, (event) => {
+            this.searchValue = event.detail.trim();
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_applyClientFilter, "f").call(this);
         });
-        _GxIdeTeamDevCommit_markAllPendingCommitsRows.set(this, async () => {
-            await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markAllRows();
+        _GxIdeTeamDevCommit_typeChangedHandler.set(this, (event) => {
+            this.selectedType = event.detail;
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
         });
-        _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler.set(this, (grid) => async (ev) => {
+        _GxIdeTeamDevCommit_stateChangedHandler.set(this, (event) => {
+            this.selectedState = event.detail;
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_applyClientFilter, "f").call(this);
+        });
+        // changeset is a WIP.
+        // #changesetChangedHandler = (event: CustomEvent<string> | InputEvent) => {
+        //   this.selectedChangeset = event.detail as string;
+        //   this.#loadData();
+        //   this.#evaluateSecondaryFilterHasConditions();
+        // };
+        _GxIdeTeamDevCommit_folderChanged.set(this, (event) => {
+            this.selectedFolder = event.detail;
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_evaluateSecondaryFilterHasConditions, "f").call(this);
+        });
+        // #categoryChangedHandler = (event: CustomEvent<string> | InputEvent) => {
+        //   this.selectedCategory = event.detail as string;
+        //   this.#loadData();
+        //   this.#evaluateSecondaryFilterHasConditions();
+        // };
+        _GxIdeTeamDevCommit_onRowContextMenuHandler.set(this, () => async (ev) => {
             ev.preventDefault();
             ev.stopPropagation();
-            let selection = [];
-            if (grid === "commit") {
-                selection = ev.detail.selectedRowsId;
-            }
-            else if (grid === "ignored") {
-                selection = await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridIgnoredObjectsEl, "f").getSelectedRows();
+            const selectedRowsIds = await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f").getSelectedRows();
+            const firstSelectedRowId = selectedRowsIds[0];
+            const gridSource = this.pendingIdsSet.has(firstSelectedRowId)
+                ? "pending"
+                : "ignored";
+            await this.objectsContextMenuCallback(gridSource, {
+                selection: selectedRowsIds,
+                clientX: ev.detail.clientX,
+                clientY: ev.detail.clientY
+            });
+        });
+        // other methods
+        _GxIdeTeamDevCommit_updatePendingCheckedItems.set(this, async (event) => {
+            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_rowCheckedChangedByTheUser, false, "f");
+            const addedRowsIds = event.detail.addedRowsId;
+            const removedRowsId = event.detail.removedRowsId;
+            const pendingItemCheckedResult = await this.pendingItemsCheckedCallback({
+                itemsChecked: addedRowsIds,
+                itemsUnchecked: removedRowsId
+            });
+            if (pendingItemCheckedResult === undefined) {
+                // undo check/uncheck
+                await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes, "f").call(this, addedRowsIds, removedRowsId);
             }
-            if (this.objectsContextMenuCallback) {
-                await this.objectsContextMenuCallback(grid, {
-                    selection: selection,
-                    clientX: ev.detail.clientX,
-                    clientY: ev.detail.clientY
-                });
+            else {
+                await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes, "f").call(this, pendingItemCheckedResult);
             }
+            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_rowCheckedChangedByTheUser, true, "f");
         });
-        _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler.set(this, async (e) => {
-            // remove "rowMarkingChanged" until checkboxes have been added/removed on #togglePendingCommitsCheckboxes, to prevent loops.
-            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").removeEventListener("rowMarkingChanged", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, "f"));
-            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f")) {
-                const addedRowsIds = e.detail.addedRowsId;
-                const removedRowsId = e.detail.removedRowsId;
-                const pendingItemCheckedResult = await this.pendingItemsCheckedCallback({
-                    itemsChecked: addedRowsIds,
-                    itemsUnchecked: removedRowsId
-                });
-                if (pendingItemCheckedResult === undefined) {
-                    // undo check/uncheck
-                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes, "f").call(this, addedRowsIds, removedRowsId);
-                }
-                else {
-                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes, "f").call(this, pendingItemCheckedResult);
-                }
-                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").addEventListener("rowMarkingChanged", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, "f"));
+        _GxIdeTeamDevCommit_setInitialObjectsStatus.set(this, () => {
+            if (this.objectsRenderedAlready) {
+                return;
             }
+            this.pendingAndIgnored.pendingForCommit.forEach(pendingObject => {
+                const status = "pending";
+                this.objectsStatusMap.set(pendingObject.id, status);
+            });
+            this.pendingAndIgnored.ignoredObjects.forEach(ignoredObject => {
+                const status = "ignored";
+                this.objectsStatusMap.set(ignoredObject.id, status);
+            });
         });
-        _GxIdeTeamDevCommit_renderTabularGridColumnSet.set(this, (withCheckboxes = false) => {
-            return (h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" }, withCheckboxes && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnType: "rich", richRowSelector: true, richRowSelectorMode: "mark", settingable: false, sortable: false, size: config.tabularGrid.colSize.maxContent })), h("ch-tabular-grid-column", { columnId: "name", class: "tabular-grid-column", sortable: true, columnName: "Name", settingable: false, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "type", class: "tabular-grid-column", sortable: true, columnName: "Type", settingable: false, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "description", class: "tabular-grid-column", columnName: "Description", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "modifiedOn", class: "tabular-grid-column", sortable: true, columnName: "Modified On", settingable: false, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "module", class: "tabular-grid-column", columnName: "Module", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "localState", class: "tabular-grid-column", columnName: "Local State", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "lastSynchronized", class: "tabular-grid-column", columnName: "Last Synchronized", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.auto })));
-        });
-        _GxIdeTeamDevCommit_renderTabularGridCommonCells.set(this, (object) => {
-            return [
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, object.name),
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, renderObjectTypeWithIcon(object.type)),
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell tabular-grid-cell-description" }, object.description),
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(object.modifiedOn)}`),
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, object.module),
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, renderObjectStateWithIcon(object.localState)),
-                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(object.lastSynchronized)}`)
-            ];
-        });
-        _GxIdeTeamDevCommit_renderIgnoredObjectsGrid.set(this, () => {
-            var _a;
-            const tabularGridEmpty = ((_a = this.ignoredObjects) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.ignoredObjects;
-            return (h("ch-tabular-grid", {
-                // ignored objects grid render
-                class: {
-                    "tabular-grid": true,
-                    "tabular-grid--empty": tabularGridEmpty
-                }, rowSelectionMode: "multiple", ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_chGridIgnoredObjectsEl, el, "f")), allowColumnReorder: false, part: "ch-grid-pending-commits", onRowContextMenu: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler, "f").call(this, "ignored"), onSelectionChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler, "f").call(this, "ignored")
-            }, this.commitingObjects && (h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.description, show: true })), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridColumnSet, "f").call(this), this.ignoredObjects.length > 0 ? (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, this.ignoredObjects.map((obj) => (h("ch-tabular-grid-row", { rowid: obj.id, selected: true, class: "tabular-grid-row" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridCommonCells, "f").call(this, obj)))))) : (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-empty", null, h("gx-ide-empty-state", { stateIconSrc: FILTER_ICON_EMPTY, stateTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").emptyIgnoredObjects, isAnimated: true }))))));
+        _GxIdeTeamDevCommit_loadData.set(this, async () => {
+            this.loading = true;
+            this.pendingAndIgnored = await this.loadCallback({
+                search: this.searchValue,
+                type: this.selectedType,
+                changeset: this.selectedChangeset,
+                folder: this.selectedFolder,
+                category: this.selectedCategory
+            });
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_setInitialObjectsStatus, "f").call(this);
+            this.loading = false;
+            // Is is required to mark/check all objects after loadCallback.
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_markPendingObjects, "f").call(this);
         });
-        _GxIdeTeamDevCommit_renderPendingCommitsGrid.set(this, () => {
-            var _a;
-            const withCheckboxes = true;
-            const tabularGridEmpty = ((_a = this.pendingCommits) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.pendingCommits;
-            if (this.loading) {
-                return (h("div", { class: "tabular-grid" }, h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").objectsLoader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").objectsLoader.description, show: true })));
+        /**
+         * Marks all pending objects that have not been committed yet.
+         *
+         * Iterates through all pending object IDs and adds them to the marked objects set
+         * if they are not already in the committed objects set. This effectively identifies
+         * and marks all the pending objects that still need to be processed.
+         **/
+        _GxIdeTeamDevCommit_markPendingObjects.set(this, () => {
+            for (const pendingId of this.pendingIdsSet) {
+                if (!this.alreadyCommitedObjectsIdsSet.has(pendingId)) {
+                    this.markedObjectsSet = new Set([...this.markedObjectsSet, pendingId]);
+                }
             }
-            return (h("ch-tabular-grid", {
-                // pending commits grid render
-                class: {
-                    "tabular-grid": true,
-                    "tabular-grid--empty": tabularGridEmpty
-                }, rowSelectionMode: "multiple", ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, el, "f")), allowColumnReorder: false, part: "ch-grid-pending-commits", onRowContextMenu: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler, "f").call(this, "commit"), onSelectionChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler, "f").call(this, "commit")
-            }, this.commitingObjects && (h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.description, show: true })), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridColumnSet, "f").call(this, withCheckboxes), this.pendingCommits.length > 0 ? (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, this.pendingCommits.map((obj) => (h("ch-tabular-grid-row", { rowid: obj.id, class: "tabular-grid-row" }, h("ch-tabular-grid-cell", { "cell-type": "rich", "row-selector": true, class: "tabular-grid-cell" }), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridCommonCells, "f").call(this, obj)))))) : (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-empty", null, h("gx-ide-empty-state", { stateIconSrc: FILTER_ICON_EMPTY, stateTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").emptyPendingCommitsObjects, isAnimated: true }))))));
         });
+        // render methods
         _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes.set(this, async (addedRowsIds, removedRowsId) => {
-            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f")) {
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f")) {
                 for (const rowId of addedRowsIds) {
-                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, false);
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f").markRow(rowId, false);
                 }
                 for (const rowId of removedRowsId) {
-                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, true);
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f").markRow(rowId, true);
                 }
             }
         });
         _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes.set(this, async (itemsToToggle) => {
-            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f")) {
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f")) {
                 const itemsToCheck = itemsToToggle.itemsToCheck;
                 const itemsToUncheck = itemsToToggle.itemsToUncheck;
                 // check
                 for (const rowId of itemsToCheck) {
-                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, true);
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f").markRow(rowId, true);
                 }
                 // uncheck
                 for (const rowId of itemsToUncheck) {
-                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, false);
-                }
-            }
-        });
-        _GxIdeTeamDevCommit_updateTabModel.set(this, () => {
-            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_commitsTabModel, [
-                {
-                    id: "pending-commits",
-                    name: `${__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").tabs.pendingCommits} (${this.pendingCommits.length})`
-                },
-                {
-                    id: "ignored-objects",
-                    name: `${__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").tabs.ignoredObjects} (${this.ignoredObjects.length})`
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, "f").markRow(rowId, false);
                 }
-            ], "f");
-        });
-        _GxIdeTeamDevCommit_commentInputHandler.set(this, async (event) => {
-            const comment = event.detail;
-            if (comment.length && this.commentInputHasError) {
-                // remove error style and tooltip
-                this.commentInputHasError = false;
             }
         });
-        _GxIdeTeamDevCommit_toggleFiltersHandler.set(this, () => {
-            this.filtersHidden = !this.filtersHidden;
-        });
-        _GxIdeTeamDevCommit_onTabActivated.set(this, (evt) => {
-            evt.stopImmediatePropagation();
-        });
-        this.comment = "";
-        this.filterHasConditions = false;
-        this.ignoredObjects = [];
-        this.pendingCommits = [];
+        this.alreadyCommitedObjectsIdsSet = new Set([]);
+        this.ignoredIdsSet = new Set([]);
+        this.pendingIdsSet = new Set([]);
+        this.markedObjectsSet = new Set([]);
+        this.objectsStatusMap = new Map();
+        this.objectsMessagesDataMap = new Map();
+        this.atLeastOneObjectIsChecked = false;
         this.commentInputHasError = false;
-        this.commitingObjects = false;
-        this.filtersHidden = true;
-        this.folderOptionsModel = undefined;
-        this.typeOptionsModel = undefined;
-        this.changeSetOptionsModel = undefined;
-        this.categoryOptionsModel = undefined;
+        this.commiting = false;
+        this.filterSecondaryIsHidden = true;
+        this.filterSecondaryHasConditions = false;
         this.loading = true;
-        this.categories = undefined;
-        this.changeSet = undefined;
+        this.objectsRenderedAlready = false;
+        this.changesetsComboBoxModel = undefined;
+        this.pendingObjectsAfterFilter = [];
+        this.ignoredObjectsAfterFilter = [];
+        this.typesComboBoxModel = [];
+        this.pendingAndIgnored = {
+            pendingForCommit: [],
+            ignoredObjects: []
+        };
+        this.commentsValue = "";
+        this.searchValue = "";
+        this.selectedType = undefined;
+        this.selectedState = ALL_VALUE;
+        this.selectedChangeset = undefined;
+        this.selectedFolder = undefined;
+        this.selectedCategory = undefined;
+        this.foldersComboBoxModel = undefined;
         this.commitCallback = undefined;
-        this.folders = undefined;
-        this.getRecentCommentCallback = undefined;
-        this.loadCallback = undefined;
         this.objectsContextMenuCallback = undefined;
+        this.loadCallback = undefined;
+        this.openServerCallback = undefined;
         this.pendingItemsCheckedCallback = undefined;
         this.selectCallback = undefined;
         this.types = undefined;
+        this.changeset = undefined;
+        this.folders = undefined;
+        this.updatePillAsButton = false;
+        this.serverDetails = undefined;
     }
-    categoriesChangedHandler(newCategoriesOptions) {
-        mapGxOptionsToComboBoxItemModel(newCategoriesOptions);
+    markedObjectsSetChanged(newMarkedObjectsSet) {
+        this.atLeastOneObjectIsChecked = newMarkedObjectsSet.size > 0;
     }
-    changeSetChangedHandler(newChangeSetOptions) {
-        this.changeSetOptionsModel =
-            mapGxOptionsToComboBoxItemModel(newChangeSetOptions);
+    objectsStatusMapChanged(newObjectsStatusMap) {
+        const someObjectIsUpdating = [...newObjectsStatusMap.entries()].find(([, state]) => state === "commiting");
+        if (!someObjectIsUpdating) {
+            this.commiting = false;
+        }
     }
-    foldersChangedHandler(newFolderOptions) {
-        this.folderOptionsModel = mapGxOptionsToComboBoxItemModel(newFolderOptions);
+    pendingAndIgnoredChanged() {
+        var _a, _b;
+        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_applyClientFilter, "f").call(this);
+        this.pendingIdsSet.clear();
+        (_a = this.pendingAndIgnored.pendingForCommit) === null || _a === void 0 ? void 0 : _a.forEach(pending => {
+            this.pendingIdsSet.add(pending.id);
+        });
+        this.ignoredIdsSet.clear();
+        (_b = this.pendingAndIgnored.ignoredObjects) === null || _b === void 0 ? void 0 : _b.forEach(ignored => {
+            this.ignoredIdsSet.add(ignored.id);
+        });
     }
-    typesChangedHandler(newTypesOptions) {
-        this.typeOptionsModel = mapObjectTypeToComboBoxItemModel(newTypesOptions);
+    typesChanged(newTypes) {
+        this.typesComboBoxModel = typesToComboBoxItemModel(newTypes);
     }
-    async componentDidLoad() {
-        await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
-        __classPrivateFieldSet(this, _GxIdeTeamDevCommit_loadDataCalledFirstTime, true, "f");
-        this.componentDidLoadEvent.emit(true);
-        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f").focus();
+    changesetChanged(newChangesetOptions) {
+        this.changesetsComboBoxModel =
+            changesetToComboBoxModel(newChangesetOptions);
     }
-    async componentDidRender() {
-        if (!__classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderedFirstTime, "f")) {
-            this.componentDidRenderFirstTime.emit(__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").componentName);
-            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_renderedFirstTime, true, "f");
-        }
-        if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadDataCalledFirstTime, "f")) {
-            // call this method only once
-            await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_markAllPendingCommitsRows, "f").call(this);
-            // attach "rowMarkingChanged" after rows have been checked for the first time.
-            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").addEventListener("rowMarkingChanged", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, "f"));
-            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_loadDataCalledFirstTime, false, "f");
-        }
+    folderChanged(newFolderOptions) {
+        this.foldersComboBoxModel = foldersToComboBoxModel(newFolderOptions);
     }
     async componentWillLoad() {
         __classPrivateFieldSet(this, _GxIdeTeamDevCommit_componentLocale, await Locale.getComponentStrings(this.el), "f");
-        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_initializeComboBoxModels, "f").call(this);
+        // Initiate "actions" combo box filter
+        __classPrivateFieldSet(this, _GxIdeTeamDevCommit_localStatesComboBoxModel, [
+            {
+                caption: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").states.all,
+                value: ALL_VALUE
+            },
+            {
+                caption: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").states.inserted,
+                value: "inserted"
+            },
+            {
+                caption: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").states.modified,
+                value: "modified"
+            },
+            {
+                caption: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").states.conflicted,
+                value: "conflicted"
+            },
+            {
+                caption: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").states.deleted,
+                value: "deleted"
+            }
+        ], "f");
+        // intialize combo-box models
+        this.typesComboBoxModel = typesToComboBoxItemModel(this.types);
+        this.selectedType = this.typesComboBoxModel[0].value;
+        this.selectedState = __classPrivateFieldGet(this, _GxIdeTeamDevCommit_localStatesComboBoxModel, "f")[0].value;
+        this.changesetChanged(this.changeset);
+        this.selectedChangeset =
+            this.changesetsComboBoxModel.length > 0
+                ? this.changesetsComboBoxModel[0].value
+                : ALL_VALUE;
+        this.folderChanged(this.folders);
+        this.selectedFolder =
+            this.foldersComboBoxModel && this.foldersComboBoxModel.length > 0
+                ? this.foldersComboBoxModel[0].value
+                : ALL_VALUE;
+        // this.categoryChanged(this.categories);
+        // this.selectedCategory =
+        //   this.categoriesComboBoxModel.length > 0
+        //     ? this.categoriesComboBoxModel[0].value
+        //     : ALL_VALUE;
+        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_evaluateSecondaryFilterHasConditions, "f").call(this);
+    }
+    async componentDidLoad() {
+        await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
     }
     /**
-     * Method used by the Host to force a data refresh in the grids
+     * Used by the host to instruct the component to force a data reload in the grids.
      */
     async reload() {
         __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
     }
     render() {
-        const filterIcon = this.filterHasConditions
-            ? FILTER_WITH_CONDITIONS_ICON
-            : FILTER_ICON;
-        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: "header spacing-body" }, h("div", { class: "header__first-row field-group" }, h("div", { class: "buttons-spacer" }, h("div", {
-            // pattern
-            class: "field field-inline field-comment"
-        }, h("label", { class: "label", htmlFor: "pattern-form-text" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.commentLabel), h("ch-edit", {
-            // commit comment
-            id: "comment", class: {
-                "input": true,
-                "commit-input": true,
-                "scrollable": true,
-                "input-error": this.commentInputHasError
-            }, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.commentPlaceholder, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commentInputHandler, "f"), value: this.comment, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_commitCommentEl, el, "f")), part: "comment"
-        })), h("button", { id: "filter-toggle-button", class: "button-teritary button-icon-only", "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.filterAriaLabel, "aria-expanded": this.filtersHidden ? "false" : "true", "aria-controls": "filters-container", onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_toggleFiltersHandler, "f"), title: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.filterAriaLabel }, h("ch-image", { class: "icon-md", src: filterIcon })), h("button", { class: "button-teritary button-icon-only", "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.reloadAriaLabel, title: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.reloadAriaLabel, onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.reloadAriaLabel }, h("ch-image", { class: "icon-md", src: RESET_ICON }))), this.commentInputHasError && (h("ch-tooltip", { class: "tooltip", actionElement: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f"), blockAlign: "outside-end", inlineAlign: config.tooltipSettings.inlineAlign, delay: config.tooltipSettings.delay }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.commentEmptyError)), h("div", { class: "buttons-spacer" }, h("button", { type: "button", class: "button-secondary recent-comments-btn", part: "button button-location", onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_getRecentCommentHandler, "f"), "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.recentCommentsButton, disabled: this.commitingObjects }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.recentCommentsButton))), h("div", { id: "filters-container", "aria-labelledby": "filter-toggle-button", class: {
-                "filters-container-visible": !this.filtersHidden,
-                "filters-container": true
-            }, inert: this.filtersHidden, hidden: this.filtersHidden }, h("div", null, h("div", { slot: "filter", class: "filter field-group" }, h("div", {
-            // pattern
-            class: "field field-block field-pattern"
-        }, h("label", { class: "label", htmlFor: "pattern-form-text" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.patternLabel), h("ch-edit", { id: "pattern-form-text", class: "input", value: "", ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_patternEl, el, "f")), debounce: config.inputDebounce, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "pattern-form-text" })), h("div", {
+        const disableControls = this.commiting || this.loading;
+        const gridIsEmpty = this.pendingObjectsAfterFilter.length === 0 &&
+            this.ignoredObjectsAfterFilter.length === 0;
+        const filterIcon = this.filterSecondaryHasConditions
+            ? ICONS.filterWithConditions
+            : ICONS.filter;
+        const commitButtonEnabled = this.atLeastOneObjectIsChecked && this.commentsValue.length > 0;
+        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: { [CSS_SELECTORS.HEADER]: true } }, h("div", {
+            // header details
+            class: { [CSS_SELECTORS.HEADER_DETAILS]: true }
+        }, headerTitle(__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").commitDetail.title), 
+        // genexus server
+        headerDetail("link", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").commitDetail.genexusServer, this.serverDetails ? this.serverDetails.serverUrl : "", this.openServerCallback, "detail__genexus-server"), 
+        // knowledge base
+        headerDetail("text", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").commitDetail.knowledgeBase, this.serverDetails ? this.serverDetails.kbName : "", undefined, "detail__knowledge-base"), 
+        // version
+        headerDetail("text", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").commitDetail.version, this.serverDetails ? this.serverDetails.versionName : "", undefined, "detail__version"))), h("div", { class: "filter-container spacing-body-inline" }, h("div", { class: { [CSS_SELECTORS.FILTER]: true, "filter-primary": true } }, h("ch-edit", {
+            // searchch-edit
+            class: "input filter__combo", disabled: disableControls, startImgSrc: ICONS.search, accessibleName: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.searchAccessibleName, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.searchPlaceholder, type: "search", onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_searchInputHandler, "f")
+        }), h("ch-combo-box-render", {
+            // types
+            class: "combo-box filter__combo", disabled: disableControls, model: this.typesComboBoxModel, value: this.selectedType, accessibleName: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.typeAccesibleName, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.typePlaceholder, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_typeChangedHandler, "f")
+        }), h("ch-combo-box-render", {
+            // local states
+            class: "combo-box filter__combo", disabled: disableControls, model: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_localStatesComboBoxModel, "f"), value: this.selectedState, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_stateChangedHandler, "f"), accessibleName: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.localStateAccesibleName, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.localStatePlaceholder
+        })), h("button", {
+            // toggle secondary filter button
+            id: FILTER_SECONDARY_BUTTON_ID, class: "button-secondary button-icon-only", disabled: disableControls, "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.secondaryFilterAriaLabel, "aria-expanded": this.filterSecondaryIsHidden ? "false" : "true", "aria-controls": FILTER_SECONDARY_CONTAINER_ID, onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_toggleFiltersHandler, "f"), title: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.secondaryFilterAriaLabel
+        }, h("ch-image", { class: "icon-md", src: filterIcon })), h("div", { class: "buttons-spacer" }, h("button", {
+            // reload button
+            class: "button-secondary button-icon-and-text", disabled: disableControls, onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f")
+        }, h("ch-image", { class: "icon-md", src: ICONS.refresh }), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.reload), h("button", {
+            // commit button
+            class: "button-primary", disabled: !commitButtonEnabled || disableControls, onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCheckedClickedHandler, "f")
+        }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.commit)), h("div", {
+            // secondary filter
+            id: FILTER_SECONDARY_CONTAINER_ID, "aria-labelledby": FILTER_SECONDARY_BUTTON_ID, class: {
+                [CSS_SELECTORS.FILTER]: true,
+                "filter-secondary": true,
+                "filter-secondary--visible": !this.filterSecondaryIsHidden
+            }, inert: this.filterSecondaryIsHidden, hidden: this.filterSecondaryIsHidden
+        }, h("div", null, h("ch-combo-box-render", {
             // folder
-            class: "field field-block field-folder"
-        }, h("label", { class: "label", htmlFor: "folder-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.folderLabel), h("ch-combo-box-render", { id: "folder-combo", class: "combo-box", value: this.folders[0].id, model: this.folderOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_foldersEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "folder-combo" })), h("div", {
-            // type
-            class: "field field-block field-type"
-        }, h("label", { class: "label", htmlFor: "type-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.typeLabel), h("ch-combo-box-render", { id: "type-combo", class: "combo-box", value: this.types[0].id, model: this.typeOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_typesEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "type-combo" })), h("div", {
-            // changeset
-            class: "field field-block field-changeset"
-        }, h("label", { class: "label", htmlFor: "changeset-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.changesetLabel), h("ch-combo-box-render", { id: "changeset-combo", class: "combo-box", value: this.changeSet[0].id, model: this.changeSetOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_changeSetEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "changeset-combo" })), h("div", {
-            // category
-            class: "field field-block field-category"
-        }, h("label", { class: "label", htmlFor: "category-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.categoryLabel), h("ch-combo-box-render", { id: "category-combo", class: "combo-box", value: this.categories[0].id, model: this.categoryOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_categoriesEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "category-combo" })))))), h("ch-tab-render", { class: "tab scrollable", tabListPosition: "block-start", model: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitsTabModel, "f"), selectedId: "pending-commits", showTabListEnd: true, overflow: "auto auto", contain: "size", onSelectedItemChange: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_onTabActivated, "f") }, h("div", { class: "ch-tab-slot", slot: "pending-commits", part: "pending-commits" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderPendingCommitsGrid, "f").call(this)), h("div", { class: "ch-tab-slot", slot: "ignored-objects", part: "ignored-objects" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderIgnoredObjectsGrid, "f").call(this))), h("footer", { class: "control-footer control-footer-with-border spacing-body-inline spacing-body-block-end" }, h("button", { class: "button-primary", onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCallbackHandler, "f"), part: "commit-button", disabled: this.commitingObjects }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").footer.commitButton)))));
+            class: "combo-box", disabled: disableControls, model: this.foldersComboBoxModel, value: this.selectedFolder, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_folderChanged, "f"), accessibleName: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.folderAccesibleName, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filter.folderPlaceholder
+        }))), h("ch-edit", {
+            // commit comments
+            class: "input comments", multiline: true, autoGrow: true, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").commitCommentPlaceholder, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commentsInputHandler, "f")
+        })), h("div", { class: CSS_SELECTORS.MAIN }, !this.loading ? (h("ch-tabular-grid", { class: {
+                "tabular-grid": true,
+                "objects-tabular-grid": true,
+                "disabled-custom-selector": this.commiting,
+                "empty-result": gridIsEmpty
+            }, keyboardNavigationMode: "focus", rowSelectionMode: "multiple", onSelectionChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_rowSelectionChangedHandler, "f"), onRowMarkingChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_rowMarkingChangedHandler, "f"), onRowContextMenu: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_onRowContextMenuHandler, "f").call(this), ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_chGridPendingForUpdateEl, el, "f")) }, renderTabularGridColumns(["action"], gridIsEmpty, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f")), !gridIsEmpty
+            ? [
+                h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-legend", { class: "tabular-grid-rowset-legend" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").objects.pendingCommits), renderTabularGridRows("pending", this.pendingObjectsAfterFilter, this.ignoredObjectsAfterFilter, this.alreadyCommitedObjectsIdsSet, this.markedObjectsSet, this.objectsMessagesDataMap, this.updatePillAsButton, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitSingleObject, "f"), this.objectsStatusMap, this.searchValue, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f"))),
+                h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-legend", { class: "tabular-grid-rowset-legend" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").objects.ignoredObjects), renderTabularGridRows("ignored", this.pendingObjectsAfterFilter, this.ignoredObjectsAfterFilter, this.alreadyCommitedObjectsIdsSet, this.markedObjectsSet, this.objectsMessagesDataMap, this.updatePillAsButton, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitSingleObject, "f"), this.objectsStatusMap, this.searchValue, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f")))
+            ]
+            : null, h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, gridIsEmpty && (h("ch-tabular-grid-rowset-empty", null, h("gx-ide-empty-state", { class: "empty-state", isAnimated: true, stateIconSrc: ICONS.filter, stateTitle: "No object matched your filter" })))))) : (h("gx-ide-loader", { cancelLabel: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.cancelLabel, loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.description, show: true, class: "loader" }))))));
     }
     static get assetsDirs() { return ["gx-ide-assets/team-dev-commit"]; }
     get el() { return this; }
     static get watchers() { return {
-        "categories": ["categoriesChangedHandler"],
-        "changeSet": ["changeSetChangedHandler"],
-        "folders": ["foldersChangedHandler"],
-        "types": ["typesChangedHandler"]
+        "markedObjectsSet": ["markedObjectsSetChanged"],
+        "objectsStatusMap": ["objectsStatusMapChanged"],
+        "pendingAndIgnored": ["pendingAndIgnoredChanged"],
+        "types": ["typesChanged"],
+        "changeset": ["changesetChanged"],
+        "folders": ["folderChanged"]
     }; }
     static get style() { return commitCss; }
 }, [1, "gx-ide-team-dev-commit", {
-        "categories": [16],
-        "changeSet": [16],
         "commitCallback": [16],
-        "folders": [16],
-        "getRecentCommentCallback": [16],
-        "loadCallback": [16],
         "objectsContextMenuCallback": [16],
+        "loadCallback": [16],
+        "openServerCallback": [16],
         "pendingItemsCheckedCallback": [16],
         "selectCallback": [16],
         "types": [16],
-        "comment": [32],
-        "filterHasConditions": [32],
-        "ignoredObjects": [32],
-        "pendingCommits": [32],
+        "changeset": [16],
+        "folders": [16],
+        "updatePillAsButton": [4, "update-pill-as-button"],
+        "serverDetails": [16],
+        "alreadyCommitedObjectsIdsSet": [32],
+        "ignoredIdsSet": [32],
+        "pendingIdsSet": [32],
+        "markedObjectsSet": [32],
+        "objectsStatusMap": [32],
+        "objectsMessagesDataMap": [32],
+        "atLeastOneObjectIsChecked": [32],
         "commentInputHasError": [32],
-        "commitingObjects": [32],
-        "filtersHidden": [32],
-        "folderOptionsModel": [32],
-        "typeOptionsModel": [32],
-        "changeSetOptionsModel": [32],
-        "categoryOptionsModel": [32],
+        "commiting": [32],
+        "filterSecondaryIsHidden": [32],
+        "filterSecondaryHasConditions": [32],
         "loading": [32],
+        "objectsRenderedAlready": [32],
+        "changesetsComboBoxModel": [32],
+        "pendingObjectsAfterFilter": [32],
+        "ignoredObjectsAfterFilter": [32],
+        "typesComboBoxModel": [32],
+        "pendingAndIgnored": [32],
+        "commentsValue": [32],
+        "searchValue": [32],
+        "selectedType": [32],
+        "selectedState": [32],
+        "selectedChangeset": [32],
+        "selectedFolder": [32],
+        "selectedCategory": [32],
+        "foldersComboBoxModel": [32],
         "reload": [64]
     }, undefined, {
-        "categories": ["categoriesChangedHandler"],
-        "changeSet": ["changeSetChangedHandler"],
-        "folders": ["foldersChangedHandler"],
-        "types": ["typesChangedHandler"]
+        "markedObjectsSet": ["markedObjectsSetChanged"],
+        "objectsStatusMap": ["objectsStatusMapChanged"],
+        "pendingAndIgnored": ["pendingAndIgnoredChanged"],
+        "types": ["typesChanged"],
+        "changeset": ["changesetChanged"],
+        "folders": ["folderChanged"]
     }]);
-_GxIdeTeamDevCommit_componentLocale = new WeakMap(), _GxIdeTeamDevCommit_loadDataCalledFirstTime = new WeakMap(), _GxIdeTeamDevCommit_renderedFirstTime = new WeakMap(), _GxIdeTeamDevCommit_commitsTabModel = new WeakMap(), _GxIdeTeamDevCommit_categoriesEl = new WeakMap(), _GxIdeTeamDevCommit_changeSetEl = new WeakMap(), _GxIdeTeamDevCommit_commitCommentEl = new WeakMap(), _GxIdeTeamDevCommit_foldersEl = new WeakMap(), _GxIdeTeamDevCommit_patternEl = new WeakMap(), _GxIdeTeamDevCommit_typesEl = new WeakMap(), _GxIdeTeamDevCommit_chGridIgnoredObjectsEl = new WeakMap(), _GxIdeTeamDevCommit_chGridPendingCommitsEl = new WeakMap(), _GxIdeTeamDevCommit_initializeComboBoxModels = new WeakMap(), _GxIdeTeamDevCommit_commitCallbackHandler = new WeakMap(), _GxIdeTeamDevCommit_evaluateFilterConditions = new WeakMap(), _GxIdeTeamDevCommit_getRecentCommentHandler = new WeakMap(), _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler = new WeakMap(), _GxIdeTeamDevCommit_handleColumnSortChanged = new WeakMap(), _GxIdeTeamDevCommit_loadData = new WeakMap(), _GxIdeTeamDevCommit_markAllPendingCommitsRows = new WeakMap(), _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler = new WeakMap(), _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler = new WeakMap(), _GxIdeTeamDevCommit_renderTabularGridColumnSet = new WeakMap(), _GxIdeTeamDevCommit_renderTabularGridCommonCells = new WeakMap(), _GxIdeTeamDevCommit_renderIgnoredObjectsGrid = new WeakMap(), _GxIdeTeamDevCommit_renderPendingCommitsGrid = new WeakMap(), _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes = new WeakMap(), _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes = new WeakMap(), _GxIdeTeamDevCommit_updateTabModel = new WeakMap(), _GxIdeTeamDevCommit_commentInputHandler = new WeakMap(), _GxIdeTeamDevCommit_toggleFiltersHandler = new WeakMap(), _GxIdeTeamDevCommit_onTabActivated = new WeakMap();
+_GxIdeTeamDevCommit_componentLocale = new WeakMap(), _GxIdeTeamDevCommit_localStatesComboBoxModel = new WeakMap(), _GxIdeTeamDevCommit_rowCheckedChangedByTheUser = new WeakMap(), _GxIdeTeamDevCommit_chGridPendingForUpdateEl = new WeakMap(), _GxIdeTeamDevCommit_commitCheckedClickedHandler = new WeakMap(), _GxIdeTeamDevCommit_commitSingleObject = new WeakMap(), _GxIdeTeamDevCommit_commitObjectsHandler = new WeakMap(), _GxIdeTeamDevCommit_rowMarkingChangedHandler = new WeakMap(), _GxIdeTeamDevCommit_rowSelectionChangedHandler = new WeakMap(), _GxIdeTeamDevCommit_commentsInputHandler = new WeakMap(), _GxIdeTeamDevCommit_applyClientFilter = new WeakMap(), _GxIdeTeamDevCommit_filteredObjects = new WeakMap(), _GxIdeTeamDevCommit_evaluateSecondaryFilterHasConditions = new WeakMap(), _GxIdeTeamDevCommit_toggleFiltersHandler = new WeakMap(), _GxIdeTeamDevCommit_searchInputHandler = new WeakMap(), _GxIdeTeamDevCommit_typeChangedHandler = new WeakMap(), _GxIdeTeamDevCommit_stateChangedHandler = new WeakMap(), _GxIdeTeamDevCommit_folderChanged = new WeakMap(), _GxIdeTeamDevCommit_onRowContextMenuHandler = new WeakMap(), _GxIdeTeamDevCommit_updatePendingCheckedItems = new WeakMap(), _GxIdeTeamDevCommit_setInitialObjectsStatus = new WeakMap(), _GxIdeTeamDevCommit_loadData = new WeakMap(), _GxIdeTeamDevCommit_markPendingObjects = new WeakMap(), _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes = new WeakMap(), _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes = new WeakMap();
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;