this is a test

Author: murphybrandon

src/app/components/App.jsx

@@ -82,12 +82,13 @@ class App extends Component {
  if (newDataActionType.includes(searchField.toLowerCase())) {
  this.setState(state => ({
  data: [...state.data, newData],
- filteredData: [...state.data, newData],
  isPlayingIndex: state.data.length,
+ filteredData: [...state.filteredData, newData],
  }));
  } else {
  this.setState(state => ({
  data: [...state.data, newData],
+ isPlayingIndex: state.data.length,
  }));
  }
  });
@@ -107,12 +108,13 @@ class App extends Component {
 
  // functionality to change 'play' button to 'stop'
  setIsPlaying() {
- if (this.state.isPlayingIndex >= this.state.data.length) {
- this.setState(prevState => ({ ...prevState, isPlayingIndex: 0 }));
+ if (this.state.isPlayingIndex >= this.state.data.length - 1) {
+ return;
  }
 
  let { isPlaying } = this.state;
- this.setState(prevState => ({ ...prevState, isPlaying: !prevState.isPlaying }));
+ isPlaying = !isPlaying;
+ this.setState({ isPlaying });
 
  if (isPlaying) {
  this.actionInPlay();
@@ -142,23 +144,14 @@ class App extends Component {
  }
 
  actionInPlay() {
- let { isPlayingIndex } = this.state;
- const { isPlaying, data } = this.state;
-
- if (isPlayingIndex >= data.length - 1) isPlayingIndex = 0;
-
- this.setState(prevState => ({ ...prevState, isPlayingIndex: isPlayingIndex + 1 }));
- const { id, action, state } = data[isPlayingIndex + 1];
- this.toTheFuture();
+ const { data, isPlayingIndex } = this.state;
 
  setTimeout(() => {
- this.setState((prev, props) => {
- return { ...prev, id, action, state };
- });
- if (isPlaying && isPlayingIndex + 1 < data.length - 1) {
+ this.toTheFuture();
+ if (this.state.isPlaying && isPlayingIndex + 1 < data.length - 1) {
  this.actionInPlay();
  } else {
- this.setState(prevState => ({ ...prevState, isPlaying: false }));
+ this.setState({ isPlaying: false });
  }
  }, 1000);
  }
@@ -226,7 +219,7 @@ class App extends Component {
  direction: 'forward',
  });
 
- if (this.state.isPlayingIndex >= this.state.data.length - 1) this.setState(prev => ({ ...prev, isPlayingIndex: 0 }));
+ // if (isPlayingIndex >= this.state.data.length - 1) isPlayingIndex = 0;
 
  const { id, action, state } = data[isPlayingIndex + 1];
  this.setState(prev => ({
@@ -289,6 +282,7 @@ class App extends Component {
  setIsRecording,
  isRecording,
  filteredData,
+ searchField,
  } = this.state;
 
  return (
@@ -304,6 +298,7 @@ class App extends Component {
  activeEventId={id}
  searchChange={this.searchChange}
  filteredData={filteredData}
+ searchField={searchField}
  />
  )}
  right={
@@ -331,5 +326,4 @@ class App extends Component {
  );
  }
 }
-
-export default App;
+export default App;

src/app/components/EventCards/FilterBar.jsx

@@ -16,6 +16,7 @@ export default function FilterBar(props) {
  type="text"
  placeholder="filter actions by name..."
  onChange={searchChange}
+ value={props.searchField}
  />
  </FilterWrapper>
  </>

src/app/container/Events.jsx

@@ -18,11 +18,12 @@ class Events extends Component {
  data,
  searchChange,
  filteredData,
+ searchField,
  } = this.props;
  return (
  <>
  <EventsNav />
- <FilterBar searchChange={searchChange} />
+ <FilterBar searchChange={searchChange} searchField={searchField} />
  <EventsDisplay
  data={data}
  filteredData={filteredData}