IMPROVE: add spans to topic location text with tests

assets/javascripts/discourse/connectors/topic-list-after-title/topic-list-after-title.hbr

@@ -1 +1,3 @@
-{{~location-format context.topic.location}}
+<span class="location-after-title">
+  {{~location-format context.topic.location}}
+</span>

assets/javascripts/discourse/templates/components/location-label-container.hbs

@@ -1,6 +1,8 @@
 <div class="location-label" title={{i18n "location.label.title"}}>
   {{d-icon "map-marker-alt"}}
-  {{location-format this.topic.location this.opts}}
+  <span class="location-text">
+    {{location-format this.topic.location this.opts}}
+  </span>
 </div>
 
 {{#if this.showMapToggle}}

assets/stylesheets/common/locations.scss

@@ -312,8 +312,14 @@
   }
 }
 
-.topic-list-item .d-icon-map-marker-alt {
-  color: var(--primary);
+.topic-list-item {
+  span.location-after-title {
+    margin-left: 10px;
+  }
+
+  .d-icon-map-marker-alt {
+    color: var(--primary);
+  }
 }
 
 .topic-list-item.visited .d-icon-map-marker-alt {

assets/stylesheets/mobile/locations.scss

@@ -58,3 +58,7 @@
     padding: 0px;
   }
 }
+
+.private_message .topic-body .user-location {
+  margin-left: 44px;
+}

plugin.rb

@@ -1,6 +1,6 @@
 # name: discourse-locations
 # about: Tools for handling locations in Discourse
-# version: 6.2.9
+# version: 6.2.10
 # authors: Angus McLeod, Robert Barrow
 # contact_emails: development@pavilion.tech
 # url: https://github.com/angusmcleod/discourse-locations

test/javascripts/acceptance/user-card-test.js → test/javascripts/acceptance/topic-and-user-card-test.js

@@ -10,7 +10,7 @@ import topicFixtures from "../fixtures/topic-fixtures";
 import siteFixtures from "../fixtures/site-fixtures";
 import { cloneJSON } from "discourse-common/lib/object";
 
-acceptance("User Card - Show Correct User Location Format", function (needs) {
+acceptance("Topic & User Card - Show Correct User Location Format", function (needs) {
   needs.user();
   needs.settings({
     location_enabled: true,
@@ -20,16 +20,20 @@ acceptance("User Card - Show Correct User Location Format", function (needs) {
     location_users_map: true,
     hide_user_profiles_from_public: false,
   });
-  needs.site(cloneJSON(siteFixtures["country_codes.json"]));
+  needs.site(cloneJSON(siteFixtures["site.json"]));
   needs.pretender((server, helper) => {
     const cardResponse = cloneJSON(userFixtures["/u/merefield/card.json"]);
     server.get("/u/merefield/card.json", () => helper.response(cardResponse));
     const topicResponse = cloneJSON(topicFixtures["/t/51/1.json"]);
     server.get("/t/51/1.json", () => helper.response(topicResponse));
   });
 
-  test("post user & user card location - shows correct format", async function (assert) {
+  test("topic title location, post user & user card location - shows correct format", async function (assert) {
     await visit("/t/online-learning/51/1");
+    assert.equal(
+      query("span.location-text").innerText,
+      "Pompidou, Paris, France"
+    );
     assert.equal(
       query(".small-action-desc.timegap").innerText,
       "2 years later"

test/javascripts/acceptance/topic-list-test.js

@@ -0,0 +1,30 @@
+import {
+  acceptance,
+  exists,
+  query,
+} from "discourse/tests/helpers/qunit-helpers";
+import { click, visit } from "@ember/test-helpers";
+import { test } from "qunit";
+import topicListFixtures from "../fixtures/topic-list-with-location";
+import siteFixtures from "../fixtures/site-fixtures";
+import { cloneJSON } from "discourse-common/lib/object";
+
+acceptance("Topic List- Show Correct Topic Location Format", function (needs) {
+  needs.user();
+  needs.settings({
+    location_enabled: true,
+  });
+  needs.site(cloneJSON(siteFixtures["site.json"]));
+  needs.pretender((server, helper) => {
+    const topicListResponse = cloneJSON(topicListFixtures["/latest.json"]);
+    server.get("/latest.json", () => helper.response(topicListResponse));
+  });
+
+  test("topic on topic list location - shows correct format", async function (assert) {
+    await visit("/latest");
+    assert.equal(
+      query('tr[data-topic-id="36"] span.location-after-title').innerText,
+      "Pompidou, Paris, France"
+    );
+  });
+});

test/javascripts/fixtures/site-fixtures.js

@@ -1,5 +1,19 @@
 export default {
-  "country_codes.json": {
+  "site.json": {
+    categories: [
+      {
+        id: 11,
+        name: "Suggestions",
+        custom_fields:
+        {
+          has_chat_enabled: null,
+          location: null,
+          location_map_filter_closed: null,
+          location_enabled: true,
+          location_topic_status: true
+        },
+        allowed_tags: [], allowed_tag_groups: [], allow_global_tags: false, read_only_banner: null, uploaded_logo: null, uploaded_logo_dark: null, uploaded_background: null, required_tag_groups: [], can_edit: true
+      }],
     country_codes: [
       { code: "af", name: "Afghanistan" },
       { code: "ax", name: "Åland Islands" },

test/javascripts/fixtures/topic-fixtures.js

@@ -933,6 +933,30 @@ export default {
     show_read_indicator: false,
     thumbnails: null,
     slow_mode_enabled_until: null,
+    location: {
+      street: "Pompidou",
+      city: "Paris",
+      countrycode: "fr",
+      geo_location: {
+        lat: 48.835681,
+        lon: 2.3800937,
+        address: "Paris, Bercy Seine, Quai de Bercy, Quartier de Bercy, 12th Arrondissement, Paris, Ile-de-France, Metropolitan France, 75012, France",
+        countrycode: "fr",
+        city: "Paris",
+        state: "Ile-de-France",
+        country: "France",
+        postalcode: "75012",
+        boundingbox: [
+          "48.835631",
+          "48.835731",
+          "2.3800437",
+          "2.3801437"
+        ],
+        type: "bus_stop",
+        selected: true,
+        zoomTo: true
+      }
+    },
     details: {
       can_edit: true,
       notification_level: 2,