You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@datalab.apache.org by dg...@apache.org on 2020/12/16 12:26:41 UTC

[incubator-datalab] 04/06: [DATALAB-2182]: Code refactoring

This is an automated email from the ASF dual-hosted git repository.

dgnatyshyn pushed a commit to branch DATALAB-2182
in repository https://gitbox.apache.org/repos/asf/incubator-datalab.git

commit b04578835e7c7c47d03be7b9e86739344442ebd4
Author: Dmytro_Gnatyshyn <di...@ukr.net>
AuthorDate: Fri Dec 11 18:51:19 2020 +0200

    [DATALAB-2182]: Code refactoring
---
 .../convert-action-pipe/convert-action.pipe.ts     |  1 +
 .../bucket-browser/bucket-browser.component.html   |  7 +-
 .../bucket-browser/bucket-browser.component.scss   | 75 ++++++----------------
 .../bucket-confirmation-dialog.component.html      |  5 +-
 .../bucket-confirmation-dialog.component.scss      |  2 +-
 .../src/app/shared/navbar/navbar.component.ts      |  2 +-
 .../resources/webapp/src/assets/styles/_theme.scss |  7 +-
 7 files changed, 32 insertions(+), 67 deletions(-)

diff --git a/services/self-service/src/main/resources/webapp/src/app/core/pipes/convert-action-pipe/convert-action.pipe.ts b/services/self-service/src/main/resources/webapp/src/app/core/pipes/convert-action-pipe/convert-action.pipe.ts
index 0a1a1a0..41b7ebc 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/pipes/convert-action-pipe/convert-action.pipe.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/pipes/convert-action-pipe/convert-action.pipe.ts
@@ -26,6 +26,7 @@ export class ConvertActionPipe implements PipeTransform {
     if (!!lowercase) {
       return value.toLowerCase().replace(/_/g, ' ');
     }
+
     return value.charAt(0) + value.slice(1).toLowerCase().replace(/_/g, ' ');
   }
 }
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html
index dead714..fd4a925 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html
@@ -23,7 +23,6 @@
     <button type="button" class="close" (click)="dialogRef.close()">&times;</button>
   </header>
 
-<!--  <div class="dialog-content tabs">-->
   <div class="dialog-content tabs">
     <div class="submit m-bott-10 m-top-10">
       <div class="left-side-butts">
@@ -109,7 +108,7 @@
       </span>
     </p>
     <div class="bucket-wrapper" [ngClass]="{'added-upload': addedFiles.length}" id="scrolling">
-      <div class="backet-selection" [ngClass]="{'opened': isSelectionOpened}">
+      <div class="bucket-selection" [ngClass]="{'opened': isSelectionOpened}">
         <div class="button-wrapper" [ngClass]="{'cursor-not-allow': bucketDataService.emptyFolder}">
           <i (click)="toggleBucketSelection()" class="material-icons close" *ngIf="!isSelectionOpened" [ngClass]="{'not-allowed': bucketDataService.emptyFolder}">chevron_right</i>
         </div>
@@ -121,7 +120,7 @@
         >
         </datalab-bucket-tree>
       </div>
-      <div class="navigation" [ngClass]="{'selection-opened': isSelectionOpened}" [hidden]="!path">
+      <div class="navigation scrolling" [ngClass]="{'selection-opened': isSelectionOpened}" [hidden]="!path">
           <datalab-folder-tree
                   (showFolderContent)=onFolderClick($event)
                   (disableAll)=dissableAll($event)
@@ -150,7 +149,7 @@
             <div class="date"><span class="th_date">Last modified</span></div>
           </div>
         </div>
-        <ul class="folder-tree" [ngClass]="{'cursor-not-allow': bucketDataService.emptyFolder}">
+        <ul class="folder-tree scrolling" [ngClass]="{'cursor-not-allow': bucketDataService.emptyFolder}" >
           <li *ngFor="let file of folderItems" class="folder-item" [ngClass]="{'not-allowed': bucketDataService.emptyFolder}">
             <div class="folder-item-wrapper" *ngIf="file.children && file.item" (click)="showItem(file)">
               <div class="name name-folder">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss
index 5fd829e..4a2bc04 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss
@@ -124,6 +124,7 @@
       }
     }
   }
+
   bottom: 0;
 
   .dialog-content{
@@ -137,6 +138,7 @@
   .submit{
     display: flex;
     justify-content: space-between;
+
     .left-side-butts{
       display: flex;
     }
@@ -146,6 +148,19 @@
       overflow: hidden;
       margin: 10px;
 
+      &.actions-btn{
+        margin: 10px 10px 0 10px;
+        padding-right: 38px;
+
+          .material-icons{
+            transition: ease-in-out 1s;
+            font-size: 25px;
+            position: absolute;
+            top: 7px;
+            right: 30px;
+          }
+      }
+
       &.first-btn{
         margin-left: 0;
       }
@@ -159,6 +174,7 @@
           color:  #00bcd4;
           background-color: #fafafa;
         }
+
         &.disabled{
           &:hover{
             color: #577289;
@@ -178,17 +194,6 @@
   }
 }
 
-.navigation-line{
-  display: flex;
-  margin-bottom: 25px;
-
-  .endpoint-select{
-    flex: 1;
-    position: relative;
-    opacity: 0;
-  }
-}
-
 .bucket-wrapper{
   height: 57vh;
   border: 2px solid rgba(0,0,0,.12);
@@ -199,12 +204,13 @@
   &.added-upload{
     height: 40vh;
   }
-   .backet-selection{
+   .bucket-selection{
      position: relative;
      width: 2%;
      border-right: 2px solid rgba(0,0,0,.12);
      padding-top: 6px;
      transition: .2s;
+
      &.opened{
        width: 33.3%;
 
@@ -212,7 +218,6 @@
          text-align: right;
          left: auto;
 
-
          i{
            padding-right: 3px;
          }
@@ -235,32 +240,8 @@
          }
        }
      }
-
-     .buckets-list{
-       color: rgba(0, 0, 0, 0.87);
-       padding-left: 20px;
-       line-height: 24px;
-
-       &-item{
-         &:hover{
-           color:  #00bcd4;
-           cursor: pointer;
-         }
-       }
-     }
    }
 
-     .buckets-list{
-       color: rgba(0, 0, 0, 0.87);
-       padding-left: 20px;
-       line-height: 24px;
-       &-item{
-         &:hover{
-           color:  #00bcd4;
-           cursor: pointer;
-         }
-       }
-     }
    }
 
   .navigation{
@@ -385,7 +366,7 @@
   }
 
   .folder-tree {
-    padding: 0px 15px;
+    padding: 0 15px;
     padding-top: 6px;
   }
 
@@ -395,7 +376,6 @@
 
     &.t_header{
       top: -41px;
-
       position: absolute;
       left: 0;
       right: 0;
@@ -522,16 +502,6 @@ input[type='file'] {
   }
 }
 
-.folder-item-name{
-  span{
-    color: #000;
-  }
-
-  .check-box {
-    background-color: red;
-  }
-}
-
 .upload-window{
   margin-top: 2vh;
   border: 2px solid rgba(0,0,0,.12);
@@ -546,12 +516,8 @@ input[type='file'] {
     height: 30px;
     line-height: 30px;
     position: relative;
+
     .modal-title {
-      width: 90%;
-      margin: 0;
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
       font-weight: 500;
       color: #455c74;
       font-size: 13px;
@@ -579,6 +545,7 @@ input[type='file'] {
     }
 
   }
+
   .upload-files{
     padding: 5px 0;
     height: calc(100% - 30px);
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.html
index c411779..3d31f7d 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.html
@@ -21,10 +21,7 @@
 
   <header class="dialog-header">
     <h4 class="modal-title">
-        <span *ngIf="data.type === 'delete'">{{data.type | convertaction}}</span>
-<!--        <span *ngIf="data.type === 'resolve_conflicts'">Resolve conflicts</span>-->
-<!--        <span *ngIf="data.type === 'cancel'">Cancel</span>-->
-<!--        <span *ngIf="data.type === 'upload_limitation'">Upload limitation</span>-->
+        <span>{{ data.type.toUpperCase() | convertaction}} </span>
     </h4>
     <button type="button" class="close" (click)="dialogRef.close()">&times;</button>
   </header>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.scss
index e739c5b..c882466 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-confirmation-dialog/bucket-confirmation-dialog.component.scss
@@ -76,7 +76,7 @@
   }
 
   .bottom-message{
-    padding-top: 15px;
+    padding-top: 20px;
     text-align: center;
     .confirm-message{
       color: #ef5c4b;
diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.ts b/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.ts
index 5d51e1e..bdb2b86 100644
--- a/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/shared/navbar/navbar.component.ts
@@ -96,7 +96,7 @@ export class NavbarComponent implements OnInit, OnDestroy {
     private schedulerService: SchedulerService,
     private storage: StorageService,
     private dialog: MatDialog,
-    private progressBarService: ProgressBarService,
+    public progressBarService: ProgressBarService,
   ) { }
 
   ngOnInit() {
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
index fc3887c..a68e96c 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
@@ -533,7 +533,7 @@ span.mat-slide-toggle-content {
 
     &.actions-btn{
       padding-right: 38px;
-
+      margin: 0;
 
       .material-icons{
         transition: ease-in-out 1s;
@@ -550,6 +550,7 @@ span.mat-slide-toggle-content {
     text-align: center;
     display: block;
     background-color: #fff;
+    top: 40px;
 
     &-item.mat-raised-button.butt{
       z-index: 101;
@@ -566,8 +567,8 @@ span.mat-slide-toggle-content {
       position: relative;
       overflow: hidden;
       line-height: 36px;
-      padding-left: 45px;
-      text-align: left;
+      //padding-left: 45px;
+      //text-align: left;
       &.action-menu-item{
         &:hover{
           color:  #00bcd4;


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@datalab.apache.org
For additional commands, e-mail: commits-help@datalab.apache.org