fix: preserve push state across live updates

assets/js/hooks.js

@@ -817,6 +817,29 @@ export const Hooks = {
         this.restoreWebState()
       }
     },
+    updated() {
+      const previousButton = this.button
+      const nextButton = this.el.querySelector("[data-enable-push]")
+
+      if (previousButton && previousButton !== nextButton) {
+        previousButton.removeEventListener("click", this.enable)
+      }
+
+      this.button = nextButton
+      this.buttonLabel = this.el.querySelector("[data-enable-push-label]")
+      this.status = this.el.querySelector("[data-push-status]")
+
+      if (this.native && this.button) this.button.disabled = false
+
+      this.button?.removeEventListener("click", this.enable)
+      this.button?.addEventListener("click", this.enable)
+
+      if (this.native) {
+        this.postNative({action: "push_token_request"})
+      } else {
+        this.restoreWebState()
+      }
+    },
     destroyed() {
       window.removeEventListener("wnh:native-push-token", this.nativeToken)
       window.removeEventListener("wnh:native-push-error", this.nativeError)

lib/who_need_help_web/live/request_live/show.ex

@@ -1660,6 +1660,18 @@ defmodule WhoNeedHelpWeb.RequestLive.Show do
                     {gettext("Optional thank-you link")}
                   </a>
                 </div>
+              <% @request.status == :cancelled -> %>
+                <p class="mt-3 text-sm opacity-70">
+                  {gettext("This request was cancelled.")}
+                </p>
+              <% @request.status == :expired -> %>
+                <p class="mt-3 text-sm opacity-70">
+                  {gettext("This request has expired.")}
+                </p>
+              <% @request.status == :completed -> %>
+                <p class="mt-3 text-sm opacity-70">
+                  {gettext("Help completed and verified by both participants.")}
+                </p>
               <% true -> %>
                 <p class="mt-3 text-sm opacity-70">
                   {gettext("This request already has a helper.")}

test/who_need_help_web/live/mutual_aid_live_test.exs

@@ -916,6 +916,29 @@ defmodule WhoNeedHelpWeb.MutualAidLiveTest do
     stop_live_view(helper_view)
   end
 
+  test "cancelled open request shows a terminal action-center state", %{
+    conn: conn,
+    scope: requester_scope
+  } do
+    category = Catalog.seed_defaults()
+    {:ok, request} = Help.create_request(requester_scope, request_attrs(category))
+    {:ok, view, _html} = live(conn, ~p"/requests/#{request.id}")
+
+    view
+    |> form("#open-request-cancellation-form", %{
+      "cancellation" => %{
+        "cancellation_reason" => "no_longer_needed",
+        "cancellation_note" => ""
+      }
+    })
+    |> render_submit()
+
+    html = render(view)
+    assert html =~ "This request was cancelled."
+    refute html =~ "This request already has a helper."
+    refute has_element?(view, "#open-request-cancellation-form")
+  end
+
   test "terminal request updates stop Android foreground tracking", _context do
     category = Catalog.seed_defaults()
     requester = user_fixture(display_name: "Tracking requester")