Kamu UI 546 set transform ux deleting datasets with same name (#548)

* Fixed bug with alias

* Added unit test

* changed CHANGELOG.md

---------

Co-authored-by: Dmitriy Borzenko <[email protected]>

Author: dmitriy-borzenko

CHANGELOG.md

@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [Unreleased]
 ### Fixed
 - Batching trigger form: removed disabled state when updates turn off
+- Edit SetTransform: deleting input datasets with same name
 
 ## [0.39.1] - 2025-02-03
 ### Changed

src/app/common/app.values.ts

@@ -27,6 +27,7 @@ export default class AppValues {
     public static readonly SHORT_DELAY_MS = 200;
     public static readonly LONG_DELAY_MS = 2000;
     public static readonly SIMULATION_START_CONDITION_DELAY_MS = 1200;
+    public static readonly SET_TRANSFORM_UNAVAILABLE_INPUT_LABEL = "-  Dataset is unavailable";
     public static readonly DEFAULT_OFFSET_COLUMN_NAME = "offset";
     public static readonly DEFAULT_FLOW_INITIATOR = "system process";
     public static readonly HEADERS_SKIP_LOADING_KEY = "Skip-loading";

src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/search-section/search-section.component.html

@@ -5,7 +5,7 @@
         <div class="d-flex flex-row position-relative">
             <input
                 type="text"
-                class="form-control w-350"
+                class="form-control w-350 search-control"
                 data-test-id="searchInputDatasets"
                 #searchDatasets
                 placeholder="Look up a dataset..."
@@ -37,7 +37,7 @@
         <mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle>
             {{ node.name }}&nbsp;&nbsp; <span *ngIf="node.type" class="fw-bold">({{ node.type }})</span>
             <button
-                *ngIf="!node.children?.length"
+                *ngIf="node.name === UNAVAILABLE_INPUT_LABEL"
                 class="no-button d-flex"
                 (click)="deleteInputDataset(node.name)"
                 title="Delete input dataset"
@@ -60,7 +60,7 @@
                     </div>
                     <button
                         class="no-button d-flex"
-                        (click)="deleteInputDataset(node.name)"
+                        (click)="deleteInputDataset(node.owner + '/' + node.name)"
                         title="Delete input dataset"
                     >
                         <mat-icon class="fs-4 hover">delete</mat-icon>

src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/search-section/search-section.component.scss

@@ -73,3 +73,7 @@ mat-tree {
         min-height: 30px;
     }
 }
+
+.search-control {
+    padding: 6px 33px 6px 10px;
+}

src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/search-section/search-section.component.spec.ts

@@ -120,12 +120,36 @@ describe("SearchSectionComponent", () => {
     });
 
     it("should check delete input dataset", () => {
-        const deletedName = "mockDataset1";
-        component.inputDatasets = new Set([deletedName, "mockDataset2"]);
-        component.TREE_DATA = [{ name: deletedName }, { name: "mockDataset2" }];
+        const deletedDatasetAlias = "test-account/com.youtube.playlist.featuring-kamu-data.videos.stats";
+        component.inputDatasets = new Set([
+            '{"datasetRef":"did:odf:fed0176ed321fcd2fc471d4d1ab06662223be2c76b7e3d3f14c37413e0802e1dca3c1","alias":"kamu/github.stats"}',
+            '{"datasetRef":"did:odf:fed01ae1c46fe64c9d50d741989b406b89b6c40f3810e1b7bcc0ed83edc050fba2d9d","alias":"test-account/com.youtube.playlist.featuring-kamu-data.videos.stats"}',
+        ]);
+        component.TREE_DATA = [
+            { name: "kamu/github.stats", owner: "kamu" },
+            { name: "com.youtube.playlist.featuring-kamu-data.videos.stats", owner: "test-account" },
+        ];
         fixture.detectChanges();
 
-        component.deleteInputDataset(deletedName);
+        component.deleteInputDataset(deletedDatasetAlias);
+
+        expect(component.inputDatasets.size).toBe(1);
+        expect(component.TREE_DATA.length).toBe(1);
+    });
+
+    it("should check deleting with same dataset name, but different account name", () => {
+        const deletedDatasetAlias = "test-account/com.youtube.playlist.featuring-kamu-data.videos.stats";
+        component.inputDatasets = new Set([
+            '{"datasetRef":"did:odf:fed0176ed321fcd2fc471d4d1ab06662223be2c76b7e3d3f14c37413e0802e1dca3c1","alias":"kamu/com.youtube.playlist.featuring-kamu-data.videos.stats"}',
+            '{"datasetRef":"did:odf:fed01ae1c46fe64c9d50d741989b406b89b6c40f3810e1b7bcc0ed83edc050fba2d9d","alias":"test-account/com.youtube.playlist.featuring-kamu-data.videos.stats"}',
+        ]);
+        component.TREE_DATA = [
+            { name: "com.youtube.playlist.featuring-kamu-data.videos.stats", owner: "kamu" },
+            { name: "com.youtube.playlist.featuring-kamu-data.videos.stats", owner: "test-account" },
+        ];
+        fixture.detectChanges();
+
+        component.deleteInputDataset(deletedDatasetAlias);
 
         expect(component.inputDatasets.size).toBe(1);
         expect(component.TREE_DATA.length).toBe(1);

src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/search-section/search-section.component.ts

@@ -31,6 +31,7 @@ export class SearchSectionComponent extends BaseComponent {
     public treeControl = new NestedTreeControl<DatasetNode>((node) => node.children);
     @Input({ required: true }) public dataSource: MatTreeNestedDataSource<DatasetNode>;
     @Input({ required: true }) public TREE_DATA: DatasetNode[];
+    public readonly UNAVAILABLE_INPUT_LABEL: string = AppValues.SET_TRANSFORM_UNAVAILABLE_INPUT_LABEL;
 
     private appSearchAPI = inject(SearchApi);
     private datasetService = inject(DatasetService);
@@ -51,10 +52,10 @@ export class SearchSectionComponent extends BaseComponent {
     public onSelectItem(event: NgbTypeaheadSelectItemEvent): void {
         const value = event.item as DatasetAutocompleteItem;
         const id = value.dataset.id;
-        const name = value.dataset.name;
+        const alias = value.dataset.alias;
         const inputDataset = JSON.stringify({
             datasetRef: id,
-            alias: name,
+            alias,
         });
         if (value.__typename !== TypeNames.allDataType && !this.inputDatasets.has(inputDataset)) {
             this.inputDatasets.add(inputDataset);
@@ -68,9 +69,12 @@ export class SearchSectionComponent extends BaseComponent {
                         const schema: MaybeNull<DatasetSchema> = parseCurrentSchema(
                             data.datasets.byId.metadata.currentSchema,
                         );
+
                         this.TREE_DATA.push({
                             name: value.dataset.name,
-                            children: schema?.fields,
+                            children: schema?.fields.length
+                                ? schema.fields
+                                : [{ name: "No schema", type: "", repetition: "" }],
                             owner,
                         });
                         this.dataSource.data = this.TREE_DATA;
@@ -83,11 +87,11 @@ export class SearchSectionComponent extends BaseComponent {
         this.searchDataset = "";
     }
 
-    public deleteInputDataset(datasetName: string): void {
-        this.TREE_DATA = this.TREE_DATA.filter((item: DatasetNode) => item.name !== datasetName);
+    public deleteInputDataset(alias: string): void {
+        this.TREE_DATA = this.TREE_DATA.filter((item: DatasetNode) => `${item.owner}/${item.name}` !== alias);
         this.dataSource.data = this.TREE_DATA;
         this.inputDatasets.forEach((item) => {
-            if (item.includes(datasetName)) {
+            if (item.includes(alias)) {
                 this.inputDatasets.delete(item);
             }
         });

src/app/dataset-view/additional-components/metadata-component/components/set-transform/set-transform.component.ts

@@ -28,6 +28,7 @@ export class SetTransformComponent extends BaseMainEventComponent implements OnI
     public queries: Omit<SqlQueryStep, "__typename">[] = [];
     public dataSource = new MatTreeNestedDataSource<DatasetNode>();
     public TREE_DATA: DatasetNode[] = [];
+    private readonly UNAVAILABLE_INPUT_LABEL: string = AppValues.SET_TRANSFORM_UNAVAILABLE_INPUT_LABEL;
 
     private editService = inject(EditSetTransformService);
 
@@ -85,6 +86,7 @@ export class SetTransformComponent extends BaseMainEventComponent implements OnI
                             const schema: MaybeNull<DatasetSchema> = parseCurrentSchema(
                                 data.datasets.byId.metadata.currentSchema,
                             );
+
                             const datasetInfo = item.alias.split("/");
                             this.TREE_DATA.push({
                                 name: datasetInfo.length > 1 ? datasetInfo[1] : item.alias,
@@ -93,7 +95,7 @@ export class SetTransformComponent extends BaseMainEventComponent implements OnI
                             });
                         } else {
                             this.TREE_DATA.push({
-                                name: "-  Dataset is unavailable",
+                                name: this.UNAVAILABLE_INPUT_LABEL,
                                 children: [],
                                 owner: "",
                             });