Fix harvester name visually editable without authed

foxypool · Oct 23, 2023 · 5e47e57 · 5e47e57
1 parent a616041
commit 5e47e57
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/src/app/harvester-card/harvester-card.component.html b/src/app/harvester-card/harvester-card.component.html
@@ -5,7 +5,7 @@ <h5 class="d-flex align-items-center gap-1">
         <span *ngIf="(statusDotColorClass$ | async) !== null" class="dot" [ngClass]="statusDotColorClass$ | async" ngbTooltip="Last updated {{relativeLastUpdated$ | async}}"></span>
         <editable [enabled]="canEditName" (save)="updateName()" (cancel)="cancelNameUpdate()">
           <ng-template viewMode>
-            <div class="d-flex harvester-name-or-peer-id-container">
+            <div class="d-flex harvester-name-or-peer-id-container" [ngClass]="{ 'is-editable': canEditName }">
               <div class="harvester-name-or-peer-id-view-mode">{{nameOrPeerIdSlug}}</div>
               <div class="ps-1 visible-on-hover"><fa-icon [icon]="faPencil"></fa-icon></div>
             </div>

diff --git a/src/app/harvester-card/harvester-card.component.scss b/src/app/harvester-card/harvester-card.component.scss
@@ -24,19 +24,21 @@
   color: var(--highlight-color-hover);
 }
 
-:host ::ng-deep editable {
-  cursor: default !important;
+editable {
+  cursor: default;
 }
 
 .harvester-name-or-peer-id-container {
   width: fit-content;
+}
+.is-editable {
   cursor: pointer;
 }
 
 .harvester-name-or-peer-id-view-mode + .visible-on-hover {
   display: none;
 }
 
-.harvester-name-or-peer-id-view-mode:hover + .visible-on-hover {
+.is-editable .harvester-name-or-peer-id-view-mode:hover + .visible-on-hover {
   display: block;
 }