refactor: 💡 fix active link style issue with SR Player (#183)

* refactor: 💡 fix active link style issue with SR Player

✅ Closes: ICU-8774

* refactor: 💡 update player hds link to hds button and styles

* refactor: 💡 add translation for "Back to channels" text

* test: 💍 add Intl setup hook to player test

addons/core/translations/resources/en-us.yaml

@@ -232,6 +232,8 @@ session-recording:
     title: Channel
     title_plural: Channels
     details: Channel details
+    player:
+      back-navigation: Back to channels
   session:
     title: Session Playback
   form:

ui/admin/app/components/session-recording/player/index.hbs

@@ -1,8 +1,9 @@
 <div class='session-recording-player'>
   <div class='session-recording-player-header'>
-    <Hds::Link::Standalone
+    <Hds::Button
       @icon='arrow-left'
-      @text='Back to channels'
+      @text={{t 'resources.session-recording.channel.player.back-navigation'}}
+      @color='tertiary'
       @route={{@route}}
       @model={{@model}}
     />

ui/admin/app/styles/app.scss

@@ -788,20 +788,18 @@
   &-header {
     border-bottom: var(--player-divider) 0.125rem solid;
 
-    // override of standalone link styles to allow for
+    // override of button styles to allow for
     // static colors in light and dark mode
     a {
       color: var(--link-color);
       padding: 1rem;
     }
 
-    a:hover {
+    .hds-button--color-tertiary:hover,
+    .hds-button--color-tertiary:active {
       color: var(--link-color);
-
-      /* stylelint-disable selector-class-pattern */
-      .hds-link-standalone__text {
-        text-decoration-color: var(--link-color);
-      }
+      background-color: transparent;
+      border-color: transparent;
     }
   }
 

ui/admin/tests/integration/components/session-recording/player-test.js

@@ -2,9 +2,11 @@ import { module, test } from 'qunit';
 import { setupRenderingTest } from 'admin/tests/helpers';
 import { render } from '@ember/test-helpers';
 import { hbs } from 'ember-cli-htmlbars';
+import { setupIntl } from 'ember-intl/test-support';
 
 module('Integration | Component | session-recording/player', function (hooks) {
   setupRenderingTest(hooks);
+  setupIntl(hooks);
 
   test('it renders', async function (assert) {
     const castConfig = {