import React from "react";
import { inject, observer } from "mobx-react"

import { ConfigStore, CONFIG_STORE } from "../stores/ConfigStore"
import { JDKProject, Task } from "../stores/model"
import JDKProjectForm from "./JDKProjectForm";
import TaskForm from "./TaskForm";

import "../styles/Forms.css";

interface Props {
    configStore?: ConfigStore
}

class ConfigForm extends React.PureComponent<Props> {

    renderForm = () => {
        const { selectedConfig, selectedGroupId } = this.props.configStore!;
        if (!selectedConfig) {
            return
        }
        switch (selectedGroupId) {
            case "jdkProjects":
                return (
                    <JDKProjectForm project={selectedConfig as JDKProject} />
                );
            case "tasks":
                return (
                    <TaskForm task={selectedConfig as Task} />
                );
            default:
                return null;
        }
    }

    render() {
        return (
            <div className="form-container">
                <form>
                    {this.renderForm()}
                </form>
            </div>
        )
    }
}

export default inject(CONFIG_STORE)(observer(ConfigForm));

import React from "react";
import { inject, observer } from "mobx-react"

import { ConfigStore, CONFIG_STORE } from "../stores/ConfigStore"
import { JDKProject, Task } from "../stores/model"
import JDKProjectForm from "./JDKProjectForm";
import TaskForm from "./TaskForm";

import "../styles/Forms.css";

interface Props {
    configStore?: ConfigStore
}

class ConfigForm extends React.PureComponent<Props> {

    renderForm = () => {
        const { selectedConfig, selectedGroupId } = this.props.configStore!;
        switch (selectedGroupId) {
            case "jdkProjects":
                return (
                    <JDKProjectForm project={selectedConfig as JDKProject} />
                );
            case "tasks":
                return (
                    <TaskForm task={selectedConfig as Task} />
                );
            default:
                return null;
        }
    }

    render() {
        return (
            <div className="form-container">
                <form>
                    {this.renderForm()}
                </form>
            </div>
        )
    }
}

export default inject(CONFIG_STORE)(observer(ConfigForm));

--- 
+++ 
@@ -16,6 +16,9 @@
 
     renderForm = () => {
         const { selectedConfig, selectedGroupId } = this.props.configStore!;
+        if (!selectedConfig) {
+            return
+        }
         switch (selectedGroupId) {
             case "jdkProjects":
                 return (
Return null if no config is selected
