From dfc12bc023c24da59a6879d7b78b9e15f038b653 Mon Sep 17 00:00:00 2001
From: Anish Aggarwal <anish17122000@gmail.com>
Date: Mon, 16 Mar 2020 23:29:03 +0530
Subject: [PATCH 1/7] added title to truncated table heads

---
 .../__snapshots__/in_memory_table.test.tsx.snap        |  1 +
 src/components/table/__snapshots__/table.test.tsx.snap |  2 ++
 .../__snapshots__/table_header_cell.test.tsx.snap      |  5 +++++
 src/components/table/table_header_cell.tsx             | 10 ++++++++--
 4 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
index 626acbbb17a..96243575c7f 100644
--- a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
+++ b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
@@ -165,6 +165,7 @@ exports[`EuiInMemoryTable behavior pagination 1`] = `
                       >
                         <span
                           className="euiTableCellContent__text"
+                          title="Name"
                         >
                           Name
                         </span>
diff --git a/src/components/table/__snapshots__/table.test.tsx.snap b/src/components/table/__snapshots__/table.test.tsx.snap
index 934ecf17f33..242a5a8b819 100644
--- a/src/components/table/__snapshots__/table.test.tsx.snap
+++ b/src/components/table/__snapshots__/table.test.tsx.snap
@@ -18,6 +18,7 @@ exports[`renders EuiTable 1`] = `
         >
           <span
             class="euiTableCellContent__text"
+            title="Hi Title"
           >
             Hi Title
           </span>
@@ -33,6 +34,7 @@ exports[`renders EuiTable 1`] = `
         >
           <span
             class="euiTableCellContent__text"
+            title="Bye Title"
           >
             Bye Title
           </span>
diff --git a/src/components/table/__snapshots__/table_header_cell.test.tsx.snap b/src/components/table/__snapshots__/table_header_cell.test.tsx.snap
index abbec8cae31..595609fca2a 100644
--- a/src/components/table/__snapshots__/table_header_cell.test.tsx.snap
+++ b/src/components/table/__snapshots__/table_header_cell.test.tsx.snap
@@ -61,6 +61,7 @@ exports[`renders EuiTableHeaderCell 1`] = `
   >
     <span
       class="euiTableCellContent__text"
+      title="children"
     >
       children
     </span>
@@ -98,6 +99,7 @@ exports[`width and style accepts style attribute 1`] = `
   >
     <span
       class="euiTableCellContent__text"
+      title="Test"
     >
       Test
     </span>
@@ -117,6 +119,7 @@ exports[`width and style accepts width attribute 1`] = `
   >
     <span
       class="euiTableCellContent__text"
+      title="Test"
     >
       Test
     </span>
@@ -136,6 +139,7 @@ exports[`width and style accepts width attribute as number 1`] = `
   >
     <span
       class="euiTableCellContent__text"
+      title="Test"
     >
       Test
     </span>
@@ -155,6 +159,7 @@ exports[`width and style resolves style and width attribute 1`] = `
   >
     <span
       class="euiTableCellContent__text"
+      title="Test"
     >
       Test
     </span>
diff --git a/src/components/table/table_header_cell.tsx b/src/components/table/table_header_cell.tsx
index db0e2dcdb88..a3d985f2a60 100644
--- a/src/components/table/table_header_cell.tsx
+++ b/src/components/table/table_header_cell.tsx
@@ -130,7 +130,11 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
           onClick={onSort}
           data-test-subj="tableHeaderSortButton">
           <span className={contentClasses}>
-            <span className="euiTableCellContent__text">{children}</span>
+            <span
+              className="euiTableCellContent__text"
+              title={children as string}>
+              {children}
+            </span>
             {isSorted && (
               <EuiIcon
                 className="euiTableSortIcon"
@@ -156,7 +160,9 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
       style={styleObj}
       {...rest}>
       <div className={contentClasses}>
-        <span className="euiTableCellContent__text">{children}</span>
+        <span className="euiTableCellContent__text" title={children as string}>
+          {children}
+        </span>
       </div>
     </CellComponent>
   );

From c3295392a032e398475d8d19283d8a8b07a73981 Mon Sep 17 00:00:00 2001
From: Anish Aggarwal <anish17122000@gmail.com>
Date: Tue, 17 Mar 2020 01:17:36 +0530
Subject: [PATCH 2/7] used inner text util

---
 .../in_memory_table.test.tsx.snap             | 14 +++++----
 .../table/__snapshots__/table.test.tsx.snap   |  2 --
 .../table_header_cell.test.tsx.snap           |  5 ----
 src/components/table/table_header_button.tsx  | 10 ++++++-
 src/components/table/table_header_cell.tsx    | 30 ++++++++++++++-----
 5 files changed, 39 insertions(+), 22 deletions(-)

diff --git a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
index 96243575c7f..ca1efc513cd 100644
--- a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
+++ b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
@@ -163,12 +163,14 @@ exports[`EuiInMemoryTable behavior pagination 1`] = `
                       <div
                         className="euiTableCellContent"
                       >
-                        <span
-                          className="euiTableCellContent__text"
-                          title="Name"
-                        >
-                          Name
-                        </span>
+                        <EuiInnerText>
+                          <span
+                            className="euiTableCellContent__text"
+                            title="Name"
+                          >
+                            Name
+                          </span>
+                        </EuiInnerText>
                       </div>
                     </th>
                   </EuiTableHeaderCell>
diff --git a/src/components/table/__snapshots__/table.test.tsx.snap b/src/components/table/__snapshots__/table.test.tsx.snap
index 242a5a8b819..934ecf17f33 100644
--- a/src/components/table/__snapshots__/table.test.tsx.snap
+++ b/src/components/table/__snapshots__/table.test.tsx.snap
@@ -18,7 +18,6 @@ exports[`renders EuiTable 1`] = `
         >
           <span
             class="euiTableCellContent__text"
-            title="Hi Title"
           >
             Hi Title
           </span>
@@ -34,7 +33,6 @@ exports[`renders EuiTable 1`] = `
         >
           <span
             class="euiTableCellContent__text"
-            title="Bye Title"
           >
             Bye Title
           </span>
diff --git a/src/components/table/__snapshots__/table_header_cell.test.tsx.snap b/src/components/table/__snapshots__/table_header_cell.test.tsx.snap
index 595609fca2a..abbec8cae31 100644
--- a/src/components/table/__snapshots__/table_header_cell.test.tsx.snap
+++ b/src/components/table/__snapshots__/table_header_cell.test.tsx.snap
@@ -61,7 +61,6 @@ exports[`renders EuiTableHeaderCell 1`] = `
   >
     <span
       class="euiTableCellContent__text"
-      title="children"
     >
       children
     </span>
@@ -99,7 +98,6 @@ exports[`width and style accepts style attribute 1`] = `
   >
     <span
       class="euiTableCellContent__text"
-      title="Test"
     >
       Test
     </span>
@@ -119,7 +117,6 @@ exports[`width and style accepts width attribute 1`] = `
   >
     <span
       class="euiTableCellContent__text"
-      title="Test"
     >
       Test
     </span>
@@ -139,7 +136,6 @@ exports[`width and style accepts width attribute as number 1`] = `
   >
     <span
       class="euiTableCellContent__text"
-      title="Test"
     >
       Test
     </span>
@@ -159,7 +155,6 @@ exports[`width and style resolves style and width attribute 1`] = `
   >
     <span
       class="euiTableCellContent__text"
-      title="Test"
     >
       Test
     </span>
diff --git a/src/components/table/table_header_button.tsx b/src/components/table/table_header_button.tsx
index bf305e6d943..09003089881 100644
--- a/src/components/table/table_header_button.tsx
+++ b/src/components/table/table_header_button.tsx
@@ -1,6 +1,7 @@
 import React, { ButtonHTMLAttributes, FunctionComponent } from 'react';
 import classNames from 'classnames';
 import { CommonProps } from '../common';
+import { EuiInnerText } from '../inner_text';
 
 import { IconType, EuiIcon } from '../icon';
 
@@ -33,7 +34,14 @@ export const EuiTableHeaderButton: FunctionComponent<Props> = ({
 
   return (
     <button type="button" className={classes} {...rest}>
-      <span>{children}</span>
+      <EuiInnerText>
+        {(ref, innerText) => (
+          <span title={innerText} ref={ref}>
+            {children}
+          </span>
+        )}
+      </EuiInnerText>
+
       {buttonIcon}
     </button>
   );
diff --git a/src/components/table/table_header_cell.tsx b/src/components/table/table_header_cell.tsx
index a3d985f2a60..a6f4940f6d1 100644
--- a/src/components/table/table_header_cell.tsx
+++ b/src/components/table/table_header_cell.tsx
@@ -9,6 +9,7 @@ import { EuiScreenReaderOnly } from '../accessibility';
 import { CommonProps, NoArgCallback } from '../common';
 import { EuiIcon } from '../icon';
 import { resolveWidthAsStyle } from './utils';
+import { EuiInnerText } from '../inner_text';
 
 import {
   HorizontalAlignment,
@@ -130,11 +131,17 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
           onClick={onSort}
           data-test-subj="tableHeaderSortButton">
           <span className={contentClasses}>
-            <span
-              className="euiTableCellContent__text"
-              title={children as string}>
-              {children}
-            </span>
+            <EuiInnerText>
+              {(ref, innerText) => (
+                <span
+                  title={innerText}
+                  ref={ref}
+                  className="euiTableCellContent__text">
+                  {children}
+                </span>
+              )}
+            </EuiInnerText>
+
             {isSorted && (
               <EuiIcon
                 className="euiTableSortIcon"
@@ -160,9 +167,16 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
       style={styleObj}
       {...rest}>
       <div className={contentClasses}>
-        <span className="euiTableCellContent__text" title={children as string}>
-          {children}
-        </span>
+        <EuiInnerText>
+          {(ref, innerText) => (
+            <span
+              title={innerText}
+              ref={ref}
+              className="euiTableCellContent__text">
+              {children}
+            </span>
+          )}
+        </EuiInnerText>
       </div>
     </CellComponent>
   );

From f335e8a584293ff9ba5f30702e4394d4f5188749 Mon Sep 17 00:00:00 2001
From: Anish Aggarwal <anish17122000@gmail.com>
Date: Tue, 17 Mar 2020 01:39:25 +0530
Subject: [PATCH 3/7] CL

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index fadf630d538..d8f278b0790 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added title to headers of `EuiTable` when truncated ([#3007](https://github.com/elastic/eui/pull/3007))
 - Added props descriptions for `EuiComboBox` ([#3007](https://github.com/elastic/eui/pull/3007))
 - Exported `dateFormatAliases` as a part of the public API ([#3043](https://github.com/elastic/eui/pull/3043))
 - Exported `EuiTextProps` type definition ([#3039](https://github.com/elastic/eui/pull/3039))

From 589ac77fa70b6ee055bb31da081116bee4cadc41 Mon Sep 17 00:00:00 2001
From: Anish Aggarwal <43617894+anishagg17@users.noreply.github.com>
Date: Tue, 17 Mar 2020 01:39:58 +0530
Subject: [PATCH 4/7] Update CHANGELOG.md

---
 CHANGELOG.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d8f278b0790..91325fd0551 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-- Added title to headers of `EuiTable` when truncated ([#3007](https://github.com/elastic/eui/pull/3007))
+- Added title to headers of `EuiTable` when truncated ([#3094](https://github.com/elastic/eui/pull/3094))
 - Added props descriptions for `EuiComboBox` ([#3007](https://github.com/elastic/eui/pull/3007))
 - Exported `dateFormatAliases` as a part of the public API ([#3043](https://github.com/elastic/eui/pull/3043))
 - Exported `EuiTextProps` type definition ([#3039](https://github.com/elastic/eui/pull/3039))

From 404368432745171864edac7abdd42689c6d60818 Mon Sep 17 00:00:00 2001
From: Anish Aggarwal <anish17122000@gmail.com>
Date: Wed, 18 Mar 2020 13:10:01 +0530
Subject: [PATCH 5/7] updated title

---
 src/components/table/table_header_cell.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/table/table_header_cell.tsx b/src/components/table/table_header_cell.tsx
index a6f4940f6d1..f506b301554 100644
--- a/src/components/table/table_header_cell.tsx
+++ b/src/components/table/table_header_cell.tsx
@@ -134,7 +134,11 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
             <EuiInnerText>
               {(ref, innerText) => (
                 <span
-                  title={innerText}
+                  title={
+                    isSorted
+                      ? `${innerText} sorted in ${ariaSortValue} order`
+                      : innerText
+                  }
                   ref={ref}
                   className="euiTableCellContent__text">
                   {children}

From b04250f85132c2dbcee3d417bbe6a2dbdf83ffff Mon Sep 17 00:00:00 2001
From: Caroline Horn <549577+cchaos@users.noreply.github.com>
Date: Wed, 18 Mar 2020 10:24:15 -0400
Subject: [PATCH 6/7] Adding internationalization (#4)

---
 src/components/table/table_header_cell.tsx | 64 +++++++++++++++-------
 1 file changed, 45 insertions(+), 19 deletions(-)

diff --git a/src/components/table/table_header_cell.tsx b/src/components/table/table_header_cell.tsx
index f506b301554..9ddb2694118 100644
--- a/src/components/table/table_header_cell.tsx
+++ b/src/components/table/table_header_cell.tsx
@@ -17,6 +17,7 @@ import {
   RIGHT_ALIGNMENT,
   CENTER_ALIGNMENT,
 } from '../../services';
+import { EuiI18n } from '../i18n';
 
 export type TableHeaderCellScope = 'col' | 'row' | 'colgroup' | 'rowgroup';
 
@@ -106,14 +107,29 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
 
     function getScreenCasterDirection() {
       if (ariaSortValue === 'ascending') {
-        return 'Click to sort in descending order';
+        return (
+          <EuiI18n
+            token="euiTableHeaderCell.clickForDescending"
+            default="Click to sort in descending order"
+          />
+        );
       }
 
       if (allowNeutralSort && ariaSortValue === 'descending') {
-        return 'Click to unsort';
+        return (
+          <EuiI18n
+            token="euiTableHeaderCell.clickForUnsort"
+            default="Click to unsort"
+          />
+        );
       }
 
-      return 'Click to sort in ascending order';
+      return (
+        <EuiI18n
+          token="euiTableHeaderCell.clickForAscending"
+          default="Click to sort in ascending order"
+        />
+      );
     }
 
     return (
@@ -133,26 +149,36 @@ export const EuiTableHeaderCell: FunctionComponent<Props> = ({
           <span className={contentClasses}>
             <EuiInnerText>
               {(ref, innerText) => (
-                <span
-                  title={
-                    isSorted
-                      ? `${innerText} sorted in ${ariaSortValue} order`
-                      : innerText
-                  }
-                  ref={ref}
-                  className="euiTableCellContent__text">
-                  {children}
-                </span>
+                <EuiI18n
+                  token="euiTableHeaderCell.titleTextWithSort"
+                  default="{innerText}; Sorted in {ariaSortValue} order"
+                  values={{ innerText, ariaSortValue }}>
+                  {(titleTextWithSort: string) => (
+                    <span
+                      title={isSorted ? titleTextWithSort : innerText}
+                      ref={ref}
+                      className="euiTableCellContent__text">
+                      {children}
+                    </span>
+                  )}
+                </EuiI18n>
               )}
             </EuiInnerText>
 
             {isSorted && (
-              <EuiIcon
-                className="euiTableSortIcon"
-                type={isSortAscending ? 'sortUp' : 'sortDown'}
-                size="m"
-                aria-label={`Sorted in ${ariaSortValue} order`}
-              />
+              <EuiI18n
+                token="euiTableHeaderCell.sortedAriaLabel"
+                default="Sorted in {ariaSortValue} order"
+                values={{ ariaSortValue }}>
+                {(sortedAriaLabel: string) => (
+                  <EuiIcon
+                    className="euiTableSortIcon"
+                    type={isSortAscending ? 'sortUp' : 'sortDown'}
+                    size="m"
+                    aria-label={sortedAriaLabel}
+                  />
+                )}
+              </EuiI18n>
             )}
             <EuiScreenReaderOnly>
               <span>{getScreenCasterDirection()}</span>

From a580c0f0483b2948166cfc18cda532a1b08cc79d Mon Sep 17 00:00:00 2001
From: Anish Aggarwal <43617894+anishagg17@users.noreply.github.com>
Date: Wed, 18 Mar 2020 20:54:22 +0530
Subject: [PATCH 7/7] Update CHANGELOG.md

Co-Authored-By: Caroline Horn <549577+cchaos@users.noreply.github.com>
---
 CHANGELOG.md | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0d1a791cd99..5aa6fd51471 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,7 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-- Added title to headers of `EuiTable` when truncated ([#3094](https://github.com/elastic/eui/pull/3094))
+- Added `title` to headers of `EuiTable` in case of truncation ([#3094](https://github.com/elastic/eui/pull/3094))
+- Added i18n to `EuiTableHeaderCell` ([#3094](https://github.com/elastic/eui/pull/3094))
 - Added `Enter` key press functionality to `EuiSuperDatePicker` ([#3048](https://github.com/elastic/eui/pull/3048))
 
 ## [`21.1.0`](https://github.com/elastic/eui/tree/v21.1.0)