Feature: Use native Object.groupBy

src/external/lodash/index.ts

@@ -1 +1 @@
-export { debounce, clamp, groupBy, camelCase } from 'lodash-es';
+export { debounce, clamp, camelCase } from 'lodash-es';

src/packages/settings/data-types/modals/data-type-picker-flow/data-type-picker-flow-modal.element.ts

@@ -1,7 +1,6 @@
 import { UmbDataTypeRepository } from '../../repository/data-type.repository.js';
 import { css, html, repeat, customElement, property, state, when, nothing } from '@umbraco-cms/backoffice/external/lit';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
-import { groupBy } from '@umbraco-cms/backoffice/external/lodash';
 import type { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
 import {
 	UMB_DATA_TYPE_PICKER_FLOW_DATA_TYPE_PICKER_MODAL,
@@ -139,12 +138,16 @@ export class UmbDataTypePickerFlowModalElement extends UmbLitElement {
 	}
 	private _performFiltering() {
 		if (this.#currentFilterQuery) {
-			this._groupedDataTypes = groupBy(
-				this.#dataTypes.filter((dataType) => {
-					return dataType.name?.toLowerCase().includes(this.#currentFilterQuery);
-				}),
-				'meta.group',
+			const filteredDataTypes = this.#dataTypes.filter(
+				(dataType) => dataType.name?.toLowerCase().includes(this.#currentFilterQuery),
 			);
+
+			/* TODO: data type items doesn't have a group property. We will need a reference to the property editor UI to get the group.
+				this is a temp solution to group them as uncategorized. The same result as with the lodash groupBy.
+			*/
+			this._groupedDataTypes = {
+				undefined: filteredDataTypes,
+			};
 		} else {
 			this._groupedDataTypes = undefined;
 		}
@@ -158,7 +161,13 @@ export class UmbDataTypePickerFlowModalElement extends UmbLitElement {
 					);
 			  });
 
-		this._groupedPropertyEditorUIs = groupBy(filteredUIs, 'meta.group');
+		// TODO: groupBy is not known by TS yet
+		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+		// @ts-expect-error
+		this._groupedPropertyEditorUIs = Object.groupBy(
+			filteredUIs,
+			(propertyEditorUI: ManifestPropertyEditorUi) => propertyEditorUI.meta.group,
+		);
 	}
 
 	private _close() {

src/packages/settings/data-types/modals/property-editor-ui-picker/property-editor-ui-picker-modal.element.ts

@@ -1,6 +1,5 @@
 import { css, html, customElement, property, state, repeat } from '@umbraco-cms/backoffice/external/lit';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
-import { groupBy } from '@umbraco-cms/backoffice/external/lodash';
 import type { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
 import {
 	UmbPropertyEditorUIPickerModalData,
@@ -51,7 +50,13 @@ export class UmbPropertyEditorUIPickerModalElement extends UmbLitElement {
 				(propertyEditorUi) => !!propertyEditorUi.meta.propertyEditorSchemaAlias,
 			);
 
-			this._groupedPropertyEditorUIs = groupBy(this._propertyEditorUIs, 'meta.group');
+			// TODO: groupBy is not known by TS yet
+			// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+			// @ts-expect-error
+			this._groupedPropertyEditorUIs = Object.groupBy(
+				this._propertyEditorUIs,
+				(propertyEditorUi: ManifestPropertyEditorUi) => propertyEditorUi.meta.group,
+			);
 		});
 	}
 
@@ -75,7 +80,13 @@ export class UmbPropertyEditorUIPickerModalElement extends UmbLitElement {
 					);
 			  });
 
-		this._groupedPropertyEditorUIs = groupBy(result, 'meta.group');
+		// TODO: groupBy is not known by TS yet
+		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+		// @ts-expect-error
+		this._groupedPropertyEditorUIs = Object.groupBy(
+			result,
+			(propertyEditorUI: ManifestPropertyEditorUi) => propertyEditorUI.meta.group,
+		);
 	}
 
 	private _close() {

src/packages/user/user-permission/components/entity-user-permission-settings-list/entity-user-permission-settings-list.element.ts

@@ -1,11 +1,6 @@
 import { UmbChangeEvent, UmbSelectionChangeEvent } from '@umbraco-cms/backoffice/event';
-import {
-	ManifestEntityAction,
-	ManifestUserPermission,
-	umbExtensionsRegistry,
-} from '@umbraco-cms/backoffice/extension-registry';
+import { ManifestUserPermission, umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
 import { css, html, customElement, property, state, nothing, ifDefined } from '@umbraco-cms/backoffice/external/lit';
-import { groupBy } from '@umbraco-cms/backoffice/external/lodash';
 import { UmbObserverController } from '@umbraco-cms/backoffice/observable-api';
 import { UmbUserPermissionSettingElement } from '@umbraco-cms/backoffice/user';
 import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
@@ -68,7 +63,13 @@ export class UmbEntityUserPermissionSettingsListElement extends UmbLitElement {
 	}
 
 	#renderGroupedPermissions(permissionManifests: Array<ManifestUserPermission>) {
-		const groupedPermissions = groupBy(permissionManifests, (manifest) => manifest.meta.group);
+		// TODO: groupBy is not known by TS yet
+		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+		// @ts-expect-error
+		const groupedPermissions = Object.groupBy(
+			permissionManifests,
+			(manifest: ManifestUserPermission) => manifest.meta.group,
+		) as Record<string, Array<ManifestUserPermission>>;
 		return html`
 			${Object.entries(groupedPermissions).map(
 				([group, manifests]) => html`