message: Reduced SnapshotContainer prop drilling and imported state contexts
diff: -import React from 'react';
  +import React, {useContext} from 'react';
  import SnapshotsList from '../components/SnapshotList/SnapshotList';
  +import {filter} from '../components/App';
  import {stateSnapshot, selectedTypes, stateSnapshotDiff} from '../../types';
  interface SnapshotsContainerProps {
  - // index of current snapshot rendered in devtool
  - renderIndex: number;
  // length of snapshotHistory array
  snapshotHistoryLength: number;
  - // setState functionality to update curRender
  - setRenderIndex: React.Dispatch<React.SetStateAction<number>>;
  - selected: selectedTypes[];
  - filter: stateSnapshotDiff[];
  - snapshotHistory: stateSnapshot[];
  }
  const SnapshotsContainer: React.FC<SnapshotsContainerProps> = ({
  - renderIndex,
  snapshotHistoryLength,
  - setRenderIndex,
  - selected,
  - filter,
  - snapshotHistory,
  }) => {
  //indexDiff is used to ensure the index of filter matches the index of the snapshots array in the backend
  let indexDiff: number = 0;
  @@ -55,13 +44,8 @@ const SnapshotsContainer: React.FC<SnapshotsContainerProps> = ({
  Snapshots
  </span>
  <SnapshotsList
  - renderIndex={renderIndex}
  snapshotHistoryLength={snapshotHistoryLength}
  - setRenderIndex={setRenderIndex}
  timeTravelFunc={timeTravelFunc}
  - selected={selected}
  - filter={filter}
  - snapshotHistory={snapshotHistory}
  />
  </div>
  );
  