people: Extract helper functions for medium avatar urls.

The new is obviously parallel with the small avatar URL construction,
and allows us to deduplicate this construction between the popovers
and full user profile logic for getting a medium avatar URL.

Fixes #20140.

frontend_tests/node_tests/people.js

@@ -747,6 +747,12 @@ test_people("message_methods", () => {
         people.small_avatar_url_for_person(maria),
         "https://secure.gravatar.com/avatar/6dbdd7946b58d8b11351fcb27e5cdd55?d=identicon&s=50",
     );
+    assert.equal(
+        people.medium_avatar_url_for_person(maria),
+        "https://secure.gravatar.com/avatar/6dbdd7946b58d8b11351fcb27e5cdd55?d=identicon&s=500",
+    );
+    assert.equal(people.medium_avatar_url_for_person(charles), "/avatar/301/medium");
+    assert.equal(people.medium_avatar_url_for_person(ashton), "/avatar/303/medium");
 
     muted_users.add_muted_user(30);
     assert.deepEqual(people.sender_info_for_recent_topics_row([30]), [

frontend_tests/node_tests/popovers.js

@@ -206,12 +206,10 @@ test_ui("sender_hover", ({override, mock_template}) => {
 
     $.create(".user_popover_email", {children: []});
     const image_stubber = make_image_stubber();
-    const base_url = window.location.href;
     handler.call(target, e);
 
     const avatar_img = image_stubber.get(0);
-    const expected_url = new URL("avatar/42/medium?v=" + alice.avatar_version, base_url);
+    assert.equal(avatar_img.src.toString(), "/avatar/42/medium");
-    assert.equal(avatar_img.src.toString(), expected_url.toString());
 
     // todo: load image
 });

static/js/people.js

@@ -659,6 +659,26 @@ export function small_avatar_url_for_person(person) {
     return format_small_avatar_url("/avatar/" + person.user_id);
 }
 
+function medium_gravatar_url_for_email(email) {
+    const hash = md5(email.toLowerCase());
+    const avatar_url = "https://secure.gravatar.com/avatar/" + hash + "?d=identicon";
+    const url = new URL(avatar_url, location);
+    url.search += (url.search ? "&" : "") + "s=500";
+    return url.href;
+}
+
+export function medium_avatar_url_for_person(person) {
+    /* Unlike the small avatar URL case, we don't generally have a
+     * medium avatar URL included in person objects. So only have the
+     * gravatar and server endpoints here. */
+
+    if (person.avatar_url === null) {
+        return medium_gravatar_url_for_email(person.email);
+    }
+
+    return "/avatar/" + person.user_id + "/medium";
+}
+
 export function sender_info_for_recent_topics_row(sender_ids) {
     const senders_info = [];
     for (const id of sender_ids) {

static/js/popovers.js

@@ -158,8 +158,7 @@ function init_email_tooltip(user) {
 }
 
 function load_medium_avatar(user, elt) {
-    const avatar_path = "avatar/" + user.user_id + "/medium?v=" + user.avatar_version;
+    const user_avatar_url = people.medium_avatar_url_for_person(user);
-    const user_avatar_url = new URL(avatar_path, window.location.href);
     const sender_avatar_medium = new Image();
 
     sender_avatar_medium.src = user_avatar_url;

static/js/user_profile.js

@@ -154,7 +154,7 @@ export function show_user_profile(user) {
         full_name: user.full_name,
         email: people.get_visible_email(user),
         profile_data,
-        user_avatar: "avatar/" + user.user_id + "/medium",
+        user_avatar: people.medium_avatar_url_for_person(user),
         is_me: people.is_current_user(user.email),
         date_joined: dateFormat.format(parseISO(user.date_joined)),
         last_seen: buddy_data.user_last_seen_time_status(user.user_id),