import { formatMessage } from "../i18n/index.js";

/**
 * @param {{
 *   kind?: string,
 *   code?: string,
 *   buildId?: string,
 *   configSchemaVersion?: string,
 *   releaseId?: string,
 *   supportReference: string
 * }} props
 */
export function BootErrorShell({
  kind = "BOOT_CONFIG_FAILURE",
  code = "BOOT_FAILED",
  buildId,
  configSchemaVersion,
  releaseId,
  supportReference,
}) {
  return (
    <main role="alert">
      <h1>{formatMessage("ko-KR", "boot.failure.title")}</h1>
      <dl>
        <dt>{formatMessage("ko-KR", "boot.field.error")}</dt>
        <dd>{kind}</dd>
        <dt>{formatMessage("ko-KR", "boot.field.code")}</dt>
        <dd>{code}</dd>
        {buildId && (
          <>
            <dt>{formatMessage("ko-KR", "boot.field.build")}</dt>
            <dd>{buildId}</dd>
          </>
        )}
        {configSchemaVersion && (
          <>
            <dt>{formatMessage("ko-KR", "boot.field.configSchema")}</dt>
            <dd>{configSchemaVersion}</dd>
          </>
        )}
        {releaseId && (
          <>
            <dt>{formatMessage("ko-KR", "boot.field.release")}</dt>
            <dd>{releaseId}</dd>
          </>
        )}
      </dl>
      <p>
        {formatMessage("ko-KR", "boot.supportReference", {
          reference: supportReference,
        })}
      </p>
    </main>
  );
}