Romaji to Kana Converter: Angular & Express — Chapter 5, Exercise 3
=====================================================================

TASK
Rewire ConvertService.convertText() to call the real /api/convert
endpoint exactly as this chapter describes, with no changes to
RomajiInputComponent or KanaOutputComponent from Chapter 4. Confirm
typing "sushi" still correctly shows すし and スシ in the output
panel, and confirm in the DevTools Network tab that a real POST
request now fires for each keystroke.

SOLUTION

// src/app/convert.service.ts — the real Chapter 5 version

  import { Injectable, inject, signal, computed } from '@angular/core';
  import { HttpClient } from '@angular/common/http';

  interface ConvertResponse {
    hiragana: string;
    katakana: string;
  }

  @Injectable({ providedIn: 'root' })
  export class ConvertService {
    private http = inject(HttpClient);

    private readonly hiraganaResult = signal('');
    private readonly katakanaResult = signal('');

    readonly hiragana = this.hiraganaResult.asReadonly();
    readonly katakana = this.katakanaResult.asReadonly();
    readonly hasResult = computed(() => this.hiraganaResult().length > 0);

    convertText(romaji: string): void {
      this.http
        .post<ConvertResponse>('http://localhost:4000/api/convert', { romaji })
        .subscribe({
          next: (result) => {
            this.hiraganaResult.set(result.hiragana);
            this.katakanaResult.set(result.katakana);
          },
          error: (err) => {
            console.error('Conversion request failed:', err);
          },
        });
    }
  }

RomajiInputComponent and KanaOutputComponent, and app.ts, are left
completely untouched -- copied over from Chapter 4 verbatim, since
neither one was ever written against "how" convertText() gets its
answer.

Manual test: with both `npx nodemon server.js` and `ng serve`
running, typing "sushi" into the input field shows:

  Hiragana: すし
  Katakana: スシ

...in the output panel, exactly as it did in Chapter 4 -- the visible
behavior is unchanged. Opening the browser's own DevTools, switching
to the Network tab, and typing again shows a real POST request to
http://localhost:4000/api/convert firing on every keystroke, each one
with a real request body ({"romaji":"s"}, then {"romaji":"su"}, and so
on) and a real 200 response carrying the matching hiragana/katakana
pair.

WHY THIS WORKS AS AN ANSWER
----------------------------
It confirms both halves of Chapter 4's own promise at once: the
visible app behavior is identical to before (proving neither
component needed to change), and the DevTools Network tab shows real,
individual HTTP requests now genuinely firing per keystroke (proving
the conversion logic really did move behind a network boundary, not
just get renamed internally). Together they show the service's own
public shape -- convertText(romaji): void, plus the hiragana/katakana/
hasResult signals -- was the actual seam this whole architecture was
built around since Chapter 4, and it held.