Class UserInput

src/UserInput.tsx:104–306

];

export default class UserInput extends Component<IProps, IState> {
  constructor(props: IProps) {
    super(props);
    this.state = {
      npcOptions: {},
      isExpanded: localStorage.getItem("isExpanded") === "true",
    };
  }

  toggleExpand = () => {
    this.setState(
      (prevState) => ({
        isExpanded: !prevState.isExpanded,
      }),
      () => {
        localStorage.setItem("isExpanded", this.state.isExpanded.toString());
      },
    );
  };

  onSubmit = (event: React.FormEvent) => {
    event.preventDefault();
    this.props.generate(this.state.npcOptions);
  };

  private getCharacterText() {
    const elementData = document.getElementById("downloadData");

    if (!elementData) {
      alert("Unable to find character data");
      throw new Error("Missing element downloadData");
    }

    const body = (elementData.textContent || "").split("#").join("\r\n").split("#").join("\r\n");
    return body;
  }

  private getExportFileName() {
    const name = this.props.npc.description.name.split(" ")[0];
    const gender = this.props.npc.description.gender;
    const race = this.props.npc.description.race.split(" ").join("_");
    const occupation = this.props.npc.description.occupation.split(" ").join("_");

    const filename = name + "_" + gender + "_" + race + "_" + occupation;

    return filename;
  }

  private downloadTxtFile: React.MouseEventHandler<HTMLButtonElement> = (ev) => {
    ev.stopPropagation();

    const element = document.createElement("a");
    const characterDetails = this.getCharacterText();
    const file = new Blob([characterDetails], { type: "text/plain" });
    element.href = URL.createObjectURL(file);
    element.download = this.getExportFileName() + ".txt";
    document.body.appendChild(element);
    element.click();