From ec5ae70b677a3379dfd236b872b8793442b0a67a Mon Sep 17 00:00:00 2001
From: Daniel Bachler <daniel@danielbachler.de>
Date: Thu, 21 Dec 2023 19:27:19 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20incorporate=20PR=20feedback?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../core-table/src/CoreTableColumns.ts        |  6 +---
 .../grapher/src/core/Grapher.tsx              |  2 +-
 .../grapher/src/dataTable/DataTable.tsx       | 34 ++++++++++++-------
 3 files changed, 23 insertions(+), 19 deletions(-)

diff --git a/packages/@ourworldindata/core-table/src/CoreTableColumns.ts b/packages/@ourworldindata/core-table/src/CoreTableColumns.ts
index a23575ea8dc..05132fff1bd 100644
--- a/packages/@ourworldindata/core-table/src/CoreTableColumns.ts
+++ b/packages/@ourworldindata/core-table/src/CoreTableColumns.ts
@@ -282,11 +282,7 @@ export abstract class AbstractCoreColumn<JS_TYPE extends PrimitiveType> {
                   attributionShort: this.def.presentation?.attributionShort,
                   titleVariant: this.def.presentation?.titleVariant,
               }
-            : { title: this.display?.name ?? this.name ?? "" }
-    }
-
-    @imemo get nonEmptyDisplayName(): string {
-        return this.display?.name || this.nonEmptyName
+            : { title: this.display?.name || this.name || "" }
     }
 
     @imemo get datasetId(): number | undefined {
diff --git a/packages/@ourworldindata/grapher/src/core/Grapher.tsx b/packages/@ourworldindata/grapher/src/core/Grapher.tsx
index 1026c00835a..e032c14fb21 100644
--- a/packages/@ourworldindata/grapher/src/core/Grapher.tsx
+++ b/packages/@ourworldindata/grapher/src/core/Grapher.tsx
@@ -1475,7 +1475,7 @@ export class Grapher
         // sort y-columns by their display name
         const sortedYColumnSlugs = sortBy(
             yColumnSlugs,
-            (slug) => this.inputTable.get(slug).nonEmptyDisplayName
+            (slug) => this.inputTable.get(slug).titlePublicOrDisplayName
         )
 
         const columnSlugs = excludeUndefined([
diff --git a/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx b/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx
index 3212b2ee107..b3678348263 100644
--- a/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx
+++ b/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx
@@ -549,21 +549,29 @@ export class DataTable extends React.Component<{
     @computed private get tableCaption(): JSX.Element | null {
         if (this.hasDimensionHeaders) return null
         const singleDimension = this.displayDimensions[0]
+        const titleFragments = (singleDimension.display.columnName
+            .attributionShort ||
+            singleDimension.display.columnName.titleVariant) && (
+            <>
+                <span className="title-fragments">
+                    {joinTitleFragments(
+                        singleDimension.display.columnName.attributionShort,
+                        singleDimension.display.columnName.titleVariant
+                    )}
+                </span>
+            </>
+        )
+        const separator =
+            (singleDimension.display.columnName.attributionShort ||
+                singleDimension.display.columnName.titleVariant) &&
+            singleDimension.display.unit
+                ? " – "
+                : " "
+
         return singleDimension ? (
             <div className="caption">
-                {singleDimension.display.columnName.title}{" "}
-                {(singleDimension.display.columnName.attributionShort ||
-                    singleDimension.display.columnName.titleVariant) && (
-                    <>
-                        <span className="title-fragments">
-                            {joinTitleFragments(
-                                singleDimension.display.columnName
-                                    .attributionShort,
-                                singleDimension.display.columnName.titleVariant
-                            )}
-                        </span>{" "}
-                    </>
-                )}
+                {singleDimension.display.columnName.title} {titleFragments}
+                {separator}
                 {singleDimension.display.unit && (
                     <span className="unit">{singleDimension.display.unit}</span>
                 )}