title: How to "sort by" using a button for the data i am displaying out here
body: <p>How to add sort to the data by using a button</p>
  
  <pre><code>import React, { useState } from "react";
  import { Container, Row, Col } from "reactstrap";
  import EmployeeCard from "./EmployeeCard";
  import data from "./data.json";
  import Modal from "./Modal";
  import Subheader from "./Subheader";
  import "./Employeelist.css";
  
  function Employeelist() {
    const [state, setState] = useState({ search: null });
    const searchSpace = event =&gt; {
      let keyword = event.target.value;
      setState({ search: keyword });
    };
    const employeeCards = data.employee
      .filter(data =&gt; {
        if (state.search == null) return data;
        else if (
          data.firstName.toLowerCase().includes(state.search.toLowerCase()) ||
          data.lastName.toLowerCase().includes(state.search.toLowerCase())
        ) {
          return data;
        }
      })
      .map(person =&gt; {
        return (
          &lt;Col sm="4"&gt;
            &lt;EmployeeCard key={person.id} person={person} /&gt;
          &lt;/Col&gt;
        );
      });
    return (
      &lt;div&gt;
        &lt;input
          type="text"
          placeholder="Search"
          class="elementStyle"
          onChange={e =&gt; searchSpace(e)}
        /&gt;
        &lt;br /&gt;
        &lt;br /&gt;
        &lt;br /&gt;
        &lt;Container fluid&gt;
          &lt;Row&gt;{employeeCards}&lt;/Row&gt;
        &lt;/Container&gt;
      &lt;/div&gt;
    );
  }
  export default Employeelist;
  </code></pre>