Add ability to save readme.md

kamu-data · Jul 31, 2023 · 851c837 · 851c837
1 parent 07877c8
commit 851c837
Show file tree

Hide file tree

Showing 6 changed files with 48 additions and 11 deletions.
diff --git a/src/app/dataset-view/additional-components/overview-component/overview-component.html b/src/app/dataset-view/additional-components/overview-component/overview-component.html
@@ -181,7 +181,11 @@ <h2 class="box-title align-items-center m-0">
                         >
                             Cancel changes
                         </button>
-                        <button class="button-changes">
+                        <button
+                            class="button-changes"
+                            [disabled]="!readmeChanged"
+                            (click)="commitChanges()"
+                        >
                             Commit changes...
                         </button>
                     </div>

diff --git a/src/app/dataset-view/additional-components/overview-component/overview-component.sass b/src/app/dataset-view/additional-components/overview-component/overview-component.sass
@@ -44,7 +44,8 @@
             border: 1px solid #DEDEDE
             &:hover:first-child
                 background-color: #e8e3e3
-
             &:nth-child(2)
                 background-color: rgb(26, 127, 55)
                 color: #fff
+            &:nth-child(2):disabled
+                background-color: rgb(148, 211, 162)
diff --git a/src/app/dataset-view/additional-components/overview-component/overview-component.ts b/src/app/dataset-view/additional-components/overview-component/overview-component.ts
@@ -25,6 +25,8 @@ import { MaybeNull } from "src/app/common/app.types";
 import { NgbModal, NgbModalRef } from "@ng-bootstrap/ng-bootstrap";
 import { EditDetailsModalComponent } from "./components/edit-details-modal/edit-details-modal.component";
 import { EditWatermarkModalComponent } from "./components/edit-watermark-modal/edit-watermark-modal.component";
+import { AppDatasetCreateService } from "src/app/dataset-create/dataset-create.service";
+import { TemplatesYamlEventsService } from "src/app/services/templates-yaml-events.service";
 
 @Component({
     selector: "app-overview",
@@ -42,6 +44,10 @@ export class OverviewComponent extends BaseComponent implements OnInit {
     public initialReadmeState = "";
     public readmeState = "";
 
+    public get readmeChanged(): boolean {
+        return this.initialReadmeState !== this.readmeState;
+    }
+
     public currentState?: {
         schema: MaybeNull<DatasetSchema>;
         data: DataRow[];
@@ -53,6 +59,8 @@ export class OverviewComponent extends BaseComponent implements OnInit {
         private appDatasetSubsService: AppDatasetSubscriptionsService,
         private navigationService: NavigationService,
         private modalService: NgbModal,
+        private createDatasetService: AppDatasetCreateService,
+        private yamlEventService: TemplatesYamlEventsService,
     ) {
         super();
     }
@@ -92,6 +100,22 @@ export class OverviewComponent extends BaseComponent implements OnInit {
         this.isEditMode = true;
     }
 
+    public commitChanges(): void {
+        console.log(this.readmeState);
+        if (this.datasetBasics)
+            this.trackSubscription(
+                this.createDatasetService
+                    .commitEventToDataset(
+                        this.datasetBasics.owner.name,
+                        this.datasetBasics.name as string,
+                        this.yamlEventService.buildYamlSetAttachmentsEvent(
+                            this.readmeState,
+                        ),
+                    )
+                    .subscribe(() => (this.isMarkdownEditView = false)),
+            );
+    }
+
     public selectTopic(topicName: string): void {
         this.selectTopicEmit.emit(topicName);
     }

diff --git a/src/app/dataset-view/dataset.component.spec.ts b/src/app/dataset-view/dataset.component.spec.ts
@@ -149,14 +149,6 @@ describe("DatasetComponent", () => {
         expect(getMainDataByLineageNodeSpy).toHaveBeenCalledTimes(1);
     });
 
-    it("should check toggle readme view", () => {
-        component.isMarkdownEditView = false;
-        component.toggleReadmeView();
-        expect(component.isMarkdownEditView).toBe(true);
-        component.toggleReadmeView();
-        expect(component.isMarkdownEditView).toBe(false);
-    });
-
     it("should check run SQL request", () => {
         const sqlQuery = "select * from test.table";
         const requestDatasetDataSqlRunSpy = spyOn(

diff --git a/src/app/services/templates-yaml-events.service.ts b/src/app/services/templates-yaml-events.service.ts
@@ -54,6 +54,22 @@ export class TemplatesYamlEventsService {
         return result;
     }
 
+    public buildYamlSetAttachmentsEvent(data: string): string {
+        this.initialTemplate.content = {
+            kind: "setAttachments",
+            attachments: {
+                kind: "embedded",
+                items: [
+                    {
+                        path: "README.md",
+                        content: data,
+                    },
+                ],
+            },
+        };
+        return stringify(this.initialTemplate);
+    }
+
     public buildYamlSetPollingSourceEvent(
         params: Omit<SetPollingSource, "__typename">,
         preprocessStepValue: MaybeNull<PreprocessStepValue>,

diff --git a/src/assets/styles/var.sass b/src/assets/styles/var.sass
@@ -390,7 +390,7 @@ $app-color-action-list-item-inline-divider: #d0d7de7a
     font-size: 12px
     line-height: 32px
   & .file-content
-    padding: 16px
+    padding: 40px 25px
   & .variable-textarea
     width: 100%
     min-height: 300px