feat(client): display star map on ship page

client/app/controllers/ships/get.ts

@@ -5,13 +5,21 @@ import { service } from '@ember/service';
 
 import Ship from 'sokown-client/models/ship';
 import type CurrentUserService from 'sokown-client/services/current-user';
+import type LocationsService from 'sokown-client/services/locations';
+import type Location from 'sokown-client/models/location';
 
 export default class ShipsGetController extends Controller {
   @service declare currentUser: CurrentUserService;
+  @service declare locations: LocationsService;
+
   declare model: Ship;
   @tracked newDestinationPositionX = '';
   @tracked newDestinationPositionY = '';
 
+  get starMapLocations(): Location[] {
+    return this.locations.getAll();
+  }
+
   @action
   async setDestination(event: Event) {
     event.preventDefault();

client/app/templates/ships/get.hbs

@@ -49,6 +49,8 @@
   </dd>
 </dl>
 
+<StarMap @locations={{this.starMapLocations}} @ship={{@model}} />
+
 <h3>Autopilot</h3>
 {{#if this.currentUser.isAuthenticated}}
   <form class="row row-cols-lg-auto g-3 align-items-center" {{on "submit" this.setDestination}}>

client/tests/acceptance/ship-test.ts

@@ -18,7 +18,7 @@ module('Acceptance | ship', function (hooks) {
   setupMirage(hooks);
 
   module('visiting /ships/:id', function () {
-    test('it displays ship public information', async function (assert) {
+    test('it displays ship public information and star map', async function (assert) {
       // when
       const screen = await visit('/');
       await click(screen.getByRole('link', { name: 'Ships' }));
@@ -53,6 +53,9 @@ module('Acceptance | ship', function (hooks) {
       assert
         .dom(screen.getByRole('definition', { name: 'Est. time of arrival' }))
         .hasText('—');
+      assert
+        .dom(screen.getByLabelText('A star map of the solar system'))
+        .exists();
     });
 
     module('when ship is moving', function () {