fix: dashboard menu clickability + expiration date UX (#753)

* fix: dashboard menu clickability + expiration date UX

Dashboard actions menu:
- Inactive (expired/removed) rows dimmed via their cells instead of the
  row, so `opacity` no longer creates a stacking context that trapped the
  actions dropdown beneath later rows and made its items unclickable.
- Add an "Extend 6 months" menu item for expired repos/PRs/gists.

Expiration form (anonymize):
- Fix the "After , the content will be removed." blank date: guard the
  helper text and add min/max validation feedback so an invalid pick no
  longer nulls the model into a broken sentence.
- Add a `min` (today) so past dates can no longer be selected, and
  compute min/max from local date parts (not UTC) to avoid a timezone
  off-by-one in the native picker.
- Default expiration is now 6 months (single source of truth, removing a
  latent double-offset bug); max stays at 1 year.
- Block submitting a missing/out-of-range expiration date.

Backend:
- New POST /:id/extend endpoint for repos, PRs and gists that pushes the
  expiration +6 months and re-anonymizes so expired items come back
  online, mirroring the refresh flow. Shared extendExpirationDate helper.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* fix: add frontend translation for invalid_status error code

The new /extend endpoints throw an "invalid_status" AnonymousError, which
the error-code coverage test requires to have a locale entry.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>

public/asset-manifest.json

@@ -1,6 +1,6 @@
 {
   "core.min.js": "core.6332b3c288.min.js",
-  "vendor.min.js": "vendor.cbded43ef0.min.js",
+  "vendor.min.js": "vendor.c42de05f19.min.js",
   "mermaid.min.js": "mermaid.f848a72d16.min.js",
-  "all.min.css": "all.1a9babcb45.min.css"
+  "all.min.css": "all.be6d7c2c8b.min.css"
 }

public/css/style.css

@@ -4289,7 +4289,12 @@ textarea::selection {
 .paper-table .paper-table-row:hover {
   background: var(--hover-bg-color);
 }
-.paper-table .paper-table-row.repo-inactive { opacity: 0.55; }
+/* Dim inactive rows through their cells rather than the row itself. Applying
+   opacity to the row creates a stacking context that traps the actions
+   dropdown menu (z-index) beneath the rows rendered after it, making its
+   items unclickable. Leave the actions column at full opacity so it stays
+   interactive. */
+.paper-table .paper-table-row.repo-inactive > *:not(.cell-actions) { opacity: 0.55; }
 .paper-table .paper-table-row.repo-error {
   background: rgba(180, 35, 24, 0.04);
   border-left: 2px solid #B42318;

public/i18n/locale-en.json

@@ -15,6 +15,7 @@
     "repo_empty": "The selected branch has no commits on GitHub. Push at least one commit, or pick a different branch, then retry.",
     "repo_not_accessible": "Anonymous GitHub cannot access this repository. Verify the repository exists and that Anonymous GitHub has been authorized for the owning organization.",
     "repository_expired": "The repository is expired.",
+    "invalid_status": "This action cannot be performed while the resource is in its current state.",
     "repository_not_ready": "Anonymous GitHub is still processing the repository, it can take several minutes.",
     "repository_not_accessible": "This repository is currently not accessible.",
     "repo_is_updating": "Anonymous GitHub is still processing the repository, it can take several minutes.",

public/partials/anonymize.htm

@@ -269,11 +269,14 @@
               </div>
               <div class="form-group">
                 <label class="paper-field-label" for="expirationDate">Expiration date</label>
-                <input class="form-control" type="date" name="expirationDate" id="expirationDate" ng-model="options.expirationDate" max="{{maxExpirationDate}}" />
+                <input class="form-control" type="date" name="expirationDate" id="expirationDate" ng-model="options.expirationDate" ng-class="{'is-invalid': anonymize.expirationDate.$invalid}" min="{{minExpirationDate}}" max="{{maxExpirationDate}}" required />
+                <div class="invalid-feedback" ng-show="anonymize.expirationDate.$error.min">Pick a date in the future.</div>
+                <div class="invalid-feedback" ng-show="anonymize.expirationDate.$error.max">Pick a date on or before {{maxExpirationDate | date}}.</div>
+                <div class="invalid-feedback" ng-show="anonymize.expirationDate.$error.required || anonymize.expirationDate.$error.date">Enter a valid expiration date.</div>
               </div>
             </div>
-            <small class="form-text text-muted" ng-show="options.expirationMode=='remove'">After {{options.expirationDate | date}}, the content will be removed.</small>
-            <small class="form-text text-muted" ng-show="options.expirationMode=='redirect'">After {{options.expirationDate | date}}, visitors will be redirected to GitHub.</small>
+            <small class="form-text text-muted" ng-show="options.expirationMode=='remove' && options.expirationDate">After {{options.expirationDate | date}}, the content will be removed.</small>
+            <small class="form-text text-muted" ng-show="options.expirationMode=='redirect' && options.expirationDate">After {{options.expirationDate | date}}, visitors will be redirected to GitHub.</small>
           </section>
 
           <section class="paper-settings-section" ng-show="isUpdate && detectedType === 'repo'">

public/partials/dashboard.htm

@@ -236,6 +236,9 @@
               <a class="dropdown-item" href="#" ng-show="item.status == 'removed'" ng-click="refreshItem(item)">
                 <i class="fas fa-check-circle"></i> Enable
               </a>
+              <a class="dropdown-item" href="#" ng-show="item.status == 'expired'" ng-click="extendItem(item)">
+                <i class="fas fa-calendar-plus"></i> Extend 6 months
+              </a>
               <a class="dropdown-item" href="#" ng-show="(item.status == 'ready' || item.status == 'expired' || item.status == 'error') && item.role !== 'coauthor'" ng-click="removeItem(item)">
                 <i class="fas fa-trash-alt"></i> Remove
               </a>

public/script/app.js

@@ -1546,6 +1546,37 @@ angular
         );
       };
 
+      $scope.extendItem = (item) => {
+        const label = labelOf(item._type);
+        const toast = {
+          title: `Extending ${item._id}...`,
+          date: new Date(),
+          body: `The expiration of ${label} ${item._id} is going to be extended by 6 months.`,
+        };
+        $scope.addToast(toast);
+        const endpoint = `${apiBaseOf(item._type)}/${item._id}/extend`;
+        $http.post(endpoint).then(
+          () => {
+            if (item._type === "repo") {
+              waitRepoToBeReady(item._id, () => {
+                toast.title = `${item._id} is extended.`;
+                toast.body = `The expiration of ${label} ${item._id} is extended by 6 months.`;
+                $scope.$apply();
+              });
+            } else {
+              toast.title = `${item._id} is extended.`;
+              toast.body = `The expiration of ${label} ${item._id} is extended by 6 months.`;
+              loadAll();
+            }
+          },
+          (error) => {
+            toast.title = `Error during the extension of ${item._id}.`;
+            toast.body = (error.data && error.data.error) || error.body;
+            loadAll();
+          }
+        );
+      };
+
       $scope.itemFilter = (item) => {
         if ($scope.typeFilter !== "all" && item._type !== $scope.typeFilter) return false;
         if ($scope.filters.status[item.status] == false) return false;
@@ -1698,12 +1729,29 @@ angular
         username: true,
         date: true,
       };
-      $scope.options.expirationDate.setDate(
-        $scope.options.expirationDate.getDate() + 90
-      );
+      // Default expiration: 6 months from today.
+      function defaultExpirationDate() {
+        const d = new Date();
+        d.setMonth(d.getMonth() + 6);
+        return d;
+      }
+      $scope.options.expirationDate = defaultExpirationDate();
+      // Format a Date to a "yyyy-MM-dd" string using local date parts. Using
+      // toISOString() here would convert to UTC and can shift the bound by a
+      // day for users in negative-offset timezones, which the native date
+      // picker (local calendar) would then render off by one.
+      function toLocalDateString(d) {
+        const y = d.getFullYear();
+        const m = String(d.getMonth() + 1).padStart(2, "0");
+        const day = String(d.getDate()).padStart(2, "0");
+        return `${y}-${m}-${day}`;
+      }
+      // Bound the expiration date: no earlier than today, no later than 1 year
+      // out.
+      $scope.minExpirationDate = toLocalDateString(new Date());
       const maxDate = new Date();
       maxDate.setFullYear(maxDate.getFullYear() + 1);
-      $scope.maxExpirationDate = maxDate.toISOString().split("T")[0];
+      $scope.maxExpirationDate = toLocalDateString(maxDate);
       $scope.anonymize_readme = "";
       $scope.readme = "";
       $scope.html_readme = "";
@@ -1716,12 +1764,13 @@ angular
             $scope.defaultTerms = data.terms.join("\n");
           }
           $scope.options = Object.assign({}, $scope.options, data.options);
-          $scope.options.expirationDate = new Date(
-            $scope.options.expirationDate
-          );
-          $scope.options.expirationDate.setDate(
-            $scope.options.expirationDate.getDate() + 90
-          );
+          // Honour a server-provided default date, otherwise fall back to the
+          // 6-month default. (Previously this re-added the offset on top of the
+          // already-defaulted date, doubling it.)
+          $scope.options.expirationDate =
+            data.options && data.options.expirationDate
+              ? new Date(data.options.expirationDate)
+              : defaultExpirationDate();
           if (cb) cb();
         });
       }
@@ -2305,6 +2354,19 @@ angular
         $scope.termsRegexWarning = false;
       }
 
+      // Guards against submitting a missing or out-of-range expiration date.
+      // When the picked date fails min/max validation AngularJS sets the model
+      // to undefined, so we check both the field validity and the model value.
+      function expirationDateInvalid() {
+        const field = $scope.anonymize && $scope.anonymize.expirationDate;
+        if (!$scope.options.expirationDate || (field && field.$invalid)) {
+          if (field && field.$setDirty) field.$setDirty();
+          $scope.error = "Please choose a valid expiration date.";
+          return true;
+        }
+        return false;
+      }
+
       function displayErrorMessage(message) {
         const idField =
           $scope.detectedType === "pr"
@@ -2392,6 +2454,7 @@ angular
 
       // Submit: repo
       $scope.anonymizeRepo = (event) => {
+        if (expirationDateInvalid()) return;
         event.target.disabled = true;
         const o = parseGithubUrl($scope.sourceUrl);
         const payload = {
@@ -2419,6 +2482,7 @@ angular
 
       // Submit: Gist
       $scope.anonymizeGist = (event) => {
+        if (expirationDateInvalid()) return;
         event.target.disabled = true;
         const o = parseGithubUrl($scope.sourceUrl);
         const payload = {
@@ -2443,6 +2507,7 @@ angular
 
       // Submit: PR
       $scope.anonymizePullRequest = (event) => {
+        if (expirationDateInvalid()) return;
         event.target.disabled = true;
         const o = parseGithubUrl($scope.sourceUrl);
         const payload = {