title: Making a toggle button in react-admin in Show
body: <p>In <code>react-admin</code>, I want to create a toggle button which on the basis of default value from database will allow user to change the state and make corresponding changes both in the <code>Show</code> as well as in backend database.</p>
  
  <p>Currently My code looks like this:</p>
  
  <pre><code>default class Deploy extends React.Component&lt;{ data: any }&gt; {
      handleClick = () =&gt; {
          const status = this.props.data.status;
          alert(status);
      };
      render() {
          const status = this.props.data.status;
          return (
              &lt;Fragment&gt;
                  &lt;Button color="primary" onClick={this.handleClick}&gt;
                      &lt;ActionEject /&gt;
                      {status === "DEPLOYED" ? "UNDEPLOY" : "DEPLOY"}
                  &lt;/Button&gt;
              &lt;/Fragment&gt;
          );
  
      }
  }
  
  class Actions extends React.Component&lt;{ basePath: any; data: any; resource: any }, any&gt; {
      render() {
          const basePath = this.props.basePath;
          const data = this.props.data;
          const resource = this.props.resource;
          if (this.props.data) {
              const defaultValue = this.props.data.default;
              return (
                   &lt;Deploy data={data} /&gt;
                 );
          }
          return null;
        }
  
     }
  
  export default class ModelShow extends React.Component {
      render() {
          return (
              &lt;Show title={&lt;ModelName /&gt;} actions={&lt;Action /&gt;} {...this.props}&gt;
                  &lt;TabbedShowLayout&gt;
                      &lt;Tab label="Summary"&gt;
                          &lt;TextField source="id" /&gt;
                          &lt;TextField source="status" /&gt;
                      &lt;/Tab&gt;
                  &lt;/TabbedShowLayout&gt;
              &lt;/Show&gt;
          );
      }
  }
  </code></pre>
  
  <p>P.S: I'm using Typescript.</p>