Date converter form

src/about/ui/__snapshots__/about.test.tsx.snap

@@ -110,6 +110,17 @@ exports[`Snapshot 1`] = `
         >
           Dictionary
         </a>
+        <a
+          aria-controls="about-tabpane-date-converter"
+          aria-selected="false"
+          class="nav-item nav-link"
+          data-rb-event-key="date-converter"
+          href="#"
+          id="about-tab-date-converter"
+          role="tab"
+        >
+          Date converter
+        </a>
         <a
           aria-controls="about-tabpane-bibliography"
           aria-selected="false"

src/about/ui/about.tsx

@@ -12,6 +12,9 @@ import AboutSigns from 'about/ui/signs'
 import AboutDictionary from 'about/ui/dictionary'
 import AboutBibliography from 'about/ui/bibliography'
 import AboutListOfKings from 'about/ui/chronology'
+import DateConverterForm, {
+  AboutDateConverter,
+} from 'chronology/ui/DateConverterForm'
 import _ from 'lodash'
 
 export const tabIds = [
@@ -69,6 +72,10 @@ export default function About({
         <Tab eventKey="dictionary" title="Dictionary">
           {AboutDictionary(markupService)}
         </Tab>
+        <Tab eventKey="date-converter" title="Date converter">
+          {AboutDateConverter(markupService)}
+          <DateConverterForm />
+        </Tab>
         <Tab eventKey="bibliography" title="Bibliography">
           {AboutBibliography(markupService)}
         </Tab>

src/about/ui/chronology.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { Markdown } from 'common/Markdown'
-import BrinkmanKingsTable from 'common/BrinkmanKings'
+import BrinkmanKingsTable from 'chronology/ui/BrinkmanKings'
 
-export default function AboutChronology(): JSX.Element {
+export default function AboutListOfKings(): JSX.Element {
   return (
     <>
       <Markdown

src/chronology/application/DateConverterFormChange.ts

@@ -0,0 +1,97 @@
+import DateConverter from 'chronology/domain/DateConverter'
+import { CalendarProps } from 'chronology/domain/DateConverterBase'
+import { FormChangeProps } from 'chronology/ui/DateConverterForm'
+
+export function handleDateConverterFormChange({
+  event,
+  scenario,
+  formData,
+  dateConverter,
+  setFormData,
+}: FormChangeProps): void {
+  const { name, value } = event.target
+  const data = {
+    ...formData,
+    [name]: name === 'ruler' ? value : parseInt(value),
+  } as CalendarProps
+  if (scenario === 'setToGregorianDate') {
+    setFormToGregorianDate(data, dateConverter)
+  } else if (scenario === 'setToJulianDate') {
+    setFormToJulianDate(data, dateConverter)
+  } else if (isSetSeBabylonianDate(scenario, data)) {
+    setFormToSeBabylonianDate(data, dateConverter)
+  } else if (isSetMesopotamianDate(scenario, data)) {
+    setFormToMesopotamianDate(data, dateConverter)
+  }
+  setFormData({ ...dateConverter.calendar })
+}
+
+function isSetSeBabylonianDate(scenario: string, data: CalendarProps): boolean {
+  const setToSeBabylonianDateArgs = [
+    data.seBabylonianYear,
+    data.mesopotamianMonth,
+    data.mesopotamianDay,
+  ]
+  return !!(
+    scenario === 'setToSeBabylonianDate' &&
+    !setToSeBabylonianDateArgs.includes(undefined)
+  )
+}
+
+function isSetMesopotamianDate(scenario: string, data: CalendarProps): boolean {
+  const setToMesopotamianDateArgs = [
+    data.ruler,
+    data.regnalYear,
+    data.mesopotamianMonth,
+    data.mesopotamianDay,
+  ]
+  return !!(
+    scenario === 'setToMesopotamianDate' &&
+    !setToMesopotamianDateArgs.includes(undefined)
+  )
+}
+
+function setFormToGregorianDate(
+  data: CalendarProps,
+  dateConverter: DateConverter
+): void {
+  dateConverter.setToGregorianDate(
+    data.gregorianYear as number,
+    data.gregorianMonth as number,
+    data.gregorianDay as number
+  )
+}
+
+function setFormToSeBabylonianDate(
+  data: CalendarProps,
+  dateConverter: DateConverter
+): void {
+  dateConverter.setToSeBabylonianDate(
+    data.seBabylonianYear as number,
+    data.mesopotamianMonth as number,
+    data.mesopotamianDay as number
+  )
+}
+
+function setFormToMesopotamianDate(
+  data: CalendarProps,
+  dateConverter: DateConverter
+): void {
+  dateConverter.setToMesopotamianDate(
+    data.ruler as string,
+    data.regnalYear as number,
+    data.mesopotamianMonth as number,
+    data.mesopotamianDay as number
+  )
+}
+
+function setFormToJulianDate(
+  data: CalendarProps,
+  dateConverter: DateConverter
+): void {
+  dateConverter.setToJulianDate(
+    data.julianYear as number,
+    data.julianMonth as number,
+    data.julianDay as number
+  )
+}

src/chronology/application/DateConverterFormFieldData.ts

@@ -0,0 +1,151 @@
+const generalInformationFields = [
+  {
+    name: 'gregorianYear',
+    type: 'number',
+    placeholder: 'Year',
+    required: true,
+    help: 'The modern (proleptic Gregorian) year.',
+  },
+  {
+    name: 'gregorianMonth',
+    type: 'number',
+    placeholder: 'Month',
+    required: true,
+    help: 'The modern (proleptic Gregorian) month.',
+  },
+  {
+    name: 'gregorianDay',
+    type: 'number',
+    placeholder: 'Day',
+    required: true,
+    help: 'The modern (proleptic Gregorian) day of the month.',
+  },
+  {
+    name: 'weekDay',
+    type: 'number',
+    placeholder: 'Week Day',
+    required: true,
+    help: 'The modern day of the week.',
+  },
+]
+
+const julianDateInformationFields = [
+  {
+    name: 'julianYear',
+    type: 'number',
+    placeholder: 'Julian Year',
+    required: true,
+    help: 'The (proleptic) Julian year.',
+  },
+  {
+    name: 'julianMonth',
+    type: 'number',
+    placeholder: 'Julian Month',
+    required: true,
+    help: 'The (proleptic) Julian month.',
+  },
+  {
+    name: 'julianDay',
+    type: 'number',
+    placeholder: 'Julian Day',
+    required: true,
+    help: 'The (proleptic) Julian day of the month.',
+  },
+]
+
+const specializedDateInformationFields = [
+  {
+    name: 'cjdn',
+    type: 'number',
+    placeholder: 'CJDN',
+    required: true,
+    help:
+      'Chronological Julian Day Number, a continuous count of days since the beginning of the Julian Period.',
+  },
+  {
+    name: 'lunationNabonassar',
+    type: 'number',
+    placeholder: 'Lunation Nabonassar',
+    help:
+      'Lunation following the Nabonassar (Nabû-nāṣir, 747-734 BCE) Era. Begins on Wednesday, February 26, 747 BCE.',
+    required: true,
+  },
+]
+
+const seleucidEraInformationFields = [
+  {
+    name: 'seBabylonianYear',
+    type: 'number',
+    placeholder: 'SE Babylonian Year',
+    required: true,
+    help: 'Seleucid Era Babylonian year, counting from the year 312 BCE.',
+  },
+  {
+    name: 'seMacedonianYear',
+    type: 'number',
+    placeholder: 'SE Macedonian Year',
+    help: 'Seleucid Era Macedonian year, counting from the year 312 BCE.',
+  },
+  {
+    name: 'seArsacidYear',
+    type: 'number',
+    placeholder: 'SE Arsacid Year',
+    help: 'Year count during the Arsacid (Parthian) Dynasty, 247 BCE - 224 CE.',
+  },
+]
+
+const mesopotamianDateInformationFields = [
+  {
+    name: 'ruler',
+    type: 'text',
+    placeholder: 'Ruler',
+    help: 'Name of the ruler or king reigning at the time.',
+  },
+  {
+    name: 'regnalYear',
+    type: 'number',
+    placeholder: 'Regnal Year',
+    help:
+      'Regnal year, or the year of the ruler’s reign, as a number starting from 1.',
+  },
+  {
+    name: 'mesopotamianMonth',
+    type: 'number',
+    placeholder: 'Mesopotamian Month',
+    required: true,
+    help:
+      'Mesopotamian month as a number from 1 to 12 or 13 (depending on the year).',
+  },
+  {
+    name: 'mesopotamianDay',
+    type: 'number',
+    placeholder: 'Mesopotamian Day',
+    help:
+      'Mesopotamian day of the month as a number from 1 to 29-30 (depending on the month) or 31 (Nabonassar lunation 2916)',
+  },
+  {
+    name: 'mesopotamianMonthLength',
+    type: 'number',
+    placeholder: 'Mesopotamian Month Length',
+    help: 'Length of the Mesopotamian month, either 29 or 30 days.',
+  },
+]
+
+export const sections = [
+  { title: 'Modern', fields: generalInformationFields },
+  { title: 'Julian', fields: julianDateInformationFields },
+  { title: 'Mesopotamian', fields: mesopotamianDateInformationFields },
+  { title: 'Seleucid', fields: seleucidEraInformationFields },
+  {
+    title: 'Specialized',
+    fields: specializedDateInformationFields,
+  },
+]
+
+export type Field = {
+  name: string
+  type: string
+  placeholder: string
+  required?: boolean
+  help: string
+}