Merge pull request #550 from keeps/aflores-dev-permission_expiry_visibility

Pill buttons for permission expiry

Author: AntonioG70

src/main/java/com/databasepreservation/common/client/common/utils/JavascriptUtils.java

@@ -354,9 +354,4 @@ public static native void removeAttribute(String elementId, String attribute) /*
                                                                                 var element = $wnd.jQuery("#" + elementId);
                                                                                 element.removeAttr(attribute);
                                                                                 }-*/;
-
-  public static native void setIndeterminate(String checkboxesJQuery) /*-{
-                                                                          var checkboxes = $wnd.jQuery(checkboxesJQuery);
-                                                                          checkboxes.prop("indeterminate", true);
-                                                                          }-*/;
 }

src/main/java/com/databasepreservation/common/client/common/visualization/manager/SIARDPanel/navigation/PermissionsNavigationPanel.java

@@ -39,14 +39,12 @@
 import com.google.gwt.cell.client.Cell;
 import com.google.gwt.cell.client.CheckboxCell;
 import com.google.gwt.core.client.GWT;
-import com.google.gwt.core.client.Scheduler;
 import com.google.gwt.i18n.client.DateTimeFormat;
 import com.google.gwt.i18n.client.TimeZone;
 import com.google.gwt.safehtml.shared.SafeHtml;
 import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
 import com.google.gwt.safehtml.shared.SafeHtmlUtils;
 import com.google.gwt.user.cellview.client.Column;
-import com.google.gwt.user.client.Command;
 import com.google.gwt.user.client.ui.Button;
 import com.google.gwt.user.client.ui.CheckBox;
 import com.google.gwt.user.client.ui.FlowPanel;
@@ -236,17 +234,6 @@ private FlowPanel getGroupsTables() {
       public Boolean getValue(AuthorizationGroup group) {
         return databasePermissionGroups.contains(group.getAttributeValue());
       }
-
-      @Override
-      public String getCellStyleNames(Cell.Context context, AuthorizationGroup group) {
-        if (groupDetails.getOrDefault(group.getAttributeValue(), new AuthorizationDetails()).hasExpiryDate()) {
-          Date now = new Date();
-          if (now.after(groupDetails.get(group.getAttributeValue()).getExpiry())) {
-            return "expired";
-          }
-        }
-        return "";
-      }
     };
 
     checkbox.setFieldUpdater((index, group, value) -> {
@@ -255,7 +242,6 @@ public String getCellStyleNames(Cell.Context context, AuthorizationGroup group)
         if (!databasePermissionGroups.contains(group.getAttributeValue())) {
           databasePermissionGroups.add(group.getAttributeValue());
         }
-        deferSetIndeterminateCheckboxes();
       } else {
         // Remove
         databasePermissionGroups.remove(group.getAttributeValue());
@@ -277,13 +263,24 @@ public String getValue(AuthorizationGroup database) {
         return ret;
       }
 
+      @Override
+      public String getCellStyleNames(Cell.Context context, AuthorizationGroup group) {
+        if (groupDetails.getOrDefault(group.getAttributeValue(), new AuthorizationDetails()).hasExpiryDate()) {
+          Date now = new Date();
+          if (now.after(groupDetails.get(group.getAttributeValue()).getExpiry())) {
+            return "expiry_column expired";
+          }
+        }
+        return "expiry_column";
+      }
+
       @Override
       public void render(Cell.Context context, AuthorizationGroup object, SafeHtmlBuilder sb) {
         String value = getValue(object);
         if (databasePermissionGroups.contains(object.getAttributeValue())) {
-          sb.appendHtmlConstant("<button class=\"btn btn-link-info\" type=\"button\" tabindex=\"-1\">");
+          sb.appendHtmlConstant("<button class=\"btn tag-button\" type=\"button\" tabindex=\"-1\">");
         } else {
-          sb.appendHtmlConstant("<button class=\"btn btn-link-info\" type=\"button\" tabindex=\"-1\" disabled>");
+          sb.appendHtmlConstant("<button class=\"btn tag-button\" type=\"button\" tabindex=\"-1\" disabled>");
         }
         if (value != null) {
           sb.append(SafeHtmlUtils.fromString(value));
@@ -392,7 +389,6 @@ public void onSuccess(Boolean confirmation) {
             }
             groupDetails.put(currentGroup.getAttributeValue(), authorizationDetails);
             cellTable.refresh();
-            deferSetIndeterminateCheckboxes();
           }
         }
       });
@@ -436,7 +432,6 @@ public SafeHtml getValue(AuthorizationGroup group) {
       new BasicTablePanel.ColumnInfo<AuthorizationGroup>(
         messages.SIARDHomePageLabelForPermissionsTableGroupExpiryDate(), 12, expiry,
         "force_column_ellipsis expiry_column"));
-    deferSetIndeterminateCheckboxes();
   }
 
   private void doSearch(String searchValue, FlowPanel permissionListPanel) {
@@ -493,12 +488,4 @@ private Map<String, AuthorizationDetails> createDatabasePermissionsMap() {
     }
     return permissions;
   }
-
-  private void deferSetIndeterminateCheckboxes() {
-    Scheduler.get().scheduleDeferred(new Command() {
-      public void execute() {
-        JavascriptUtils.setIndeterminate(".expired input");
-      }
-    });
-  }
 }

src/main/resources/com/databasepreservation/common/public/main.css

@@ -3532,6 +3532,43 @@ rgba(0, 0, 0, .125);
     flex: 1;
     padding: 3px 0px;
     font-size: 1.3rem;
+    border: 1px solid;
+    border-radius: 16px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.tag-button {
+    transition: 0.1s;
+    color: #78BEE7;
+    border: 1px solid;
+    border-color: #78BEE7;
+    border-radius: 16px;
+    background-color: transparent;
+    display: flex;
+    justify-content: center;
+}
+
+.tag-button:hover {
+    color: white;
+    border: none;
+    background-color: #78BEE7;
+}
+
+.expiry_column.expired .tag-button {
+    color: #d9534f;
+    border-color: #d9534f;
+}
+
+.expiry_column.expired .tag-button:hover {
+    color: white;
+    border: none;
+    background-color: #d9534f;
+}
+
+.expiry_column.expired .tag-button:after {
+    content: "\f273";
 }
 
 .expiry_column button:disabled {