src/TaxReturnView.tsx

   1 // Copyright 2020 Blue Static <https://www.bluestatic.org>
   2 // This program is free software licensed under the GNU General Public License,
   3 // version 3.0. The full text of the license can be found in LICENSE.txt.
   4 // SPDX-License-Identifier: GPL-3.0-only
   5
   6 import { createEffect, createMemo, createState } from 'solid-js';
   7 import { For } from 'solid-js/dom';
   8 import { Form, Person, TaxReturn } from 'ustaxlib/core';
   9
  10 import FormView from './FormView';
  11
  12 const S = require('./TaxReturnView.css');
  13
  14 interface Props {
  15   tr: TaxReturn;
  16   showForm?: string;
  17   onFormChange?: (formName: string) => void;
  18 }
  19
  20 function hashifyFormName(name: string): string {
  21   return '#' + name.replace(/[^\w]+/g, '_');
  22 }
  23
  24 export default function TaxReturnView(props: Props) {
  25   const [ state, setState ] = createState({ form: props.tr.forms[0] });
  26
  27   const changeForm = e => {
  28     setState({ form: props.tr.forms[e.target.value] });
  29     if (props.onFormChange)
  30       props.onFormChange(hashifyFormName(e.target.selectedOptions[0].textContent));
  31   };
  32
  33   const formIndexToName = createMemo(() => {
  34     let forms = props.tr.forms.map((form, i) => {
  35       let name = form.name;
  36       const person = form.person();
  37       if (person !== undefined) {
  38         const personName = person === Person.joint ? 'Joint' : person.name;
  39         name += ` (${personName})`;
  40       }
  41       return [i, name];
  42     });
  43     forms.sort((a, b) => {
  44       if (a[1] < b[1])
  45         return -1;
  46       if (a[1] > b[1])
  47         return 1;
  48       return 0;
  49     });
  50     return forms;
  51   });
  52
  53   createEffect(() => {
  54     if (props.showForm) {
  55       for (let f of formIndexToName()) {
  56         if (hashifyFormName(f[1] as string) === props.showForm) {
  57           setState({ form: props.tr.forms[f[0]] });
  58         }
  59       }
  60     }
  61   });
  62
  63   const formSelector = (
  64     <select onchange={changeForm}>
  65       <For each={formIndexToName()}>
  66         {tuple => (<option value={tuple[0]} selected={state.form === props.tr.forms[tuple[0]]}>{tuple[1]}</option>)}
  67       </For>
  68     </select>
  69   );
  70
  71   return (
  72     <div>
  73       <div class={S.header}>
  74         <h1>ustaxlib Federal {props.tr.year}</h1>
  75         {formSelector}
  76       </div>
  77
  78       <FormView tr={props.tr} form={state.form as Form<any>} />
  79     </div>
  80   );
  81 }
  82