Added error message when no course sections are found. Changed to

using combineReducers to create the store

schedules_web/src/actions/search/search.actions.ts

@@ -5,6 +5,7 @@ import { SET_SEARCH_RESULTS } from './search.action-types';
 export interface SearchAction {
     type: string;
     searchResults: CourseSection[];
+    error: string;
 }
 
 export const searchCourseSections = (crn: string) => async (dispatch: any) => {
@@ -27,5 +28,6 @@ export const searchCourseSections = (crn: string) => async (dispatch: any) => {
     dispatch({
         type: SET_SEARCH_RESULTS,
         searchResults: results,
+        error: results.length === 0 ? 'No course sections found with the given CRN.' : '',
     });
 };

schedules_web/src/components/SearchRoot.tsx

@@ -2,22 +2,36 @@ import * as React from 'react';
 import SearchBar from '../components/SearchBar';
 import CourseSection from '../util/CourseSection';
 import CourseSectionList from './CourseSectionList';
+import { Row, Col, Alert } from 'reactstrap';
+import { SearchState } from '../reducers/search.reducer';
 
 interface SearchRootProps {
-    searchResults: CourseSection[];
+    search: SearchState;
     searchCourseSections: (crn: string) => void;
     addCourseSection: (courseSectionToAdd: CourseSection) => void;
 }
 
-const SearchRoot = ({ searchResults, searchCourseSections, addCourseSection }: SearchRootProps) => (
+const SearchRoot = ({ search, searchCourseSections, addCourseSection }: SearchRootProps) => (
     <div>
         <SearchBar onSearch={searchCourseSections} />
-        <CourseSectionList
-            courseSectionActionButtonText="Add to schedule"
-            courseSections={searchResults}
-            courseSectionAction={addCourseSection}
-        />
+        {search.error !== '' ? (
+            <Error />
+        ) : (
+            <CourseSectionList
+                courseSectionActionButtonText="Add to schedule"
+                courseSections={search.courseSections}
+                courseSectionAction={addCourseSection}
+            />
+        )}
     </div>
 );
 
+const Error = () => (
+    <Row className="justify-content-center">
+        <Col md="8">
+            <Alert color="danger">Could not find course section with the given CRN.</Alert>
+        </Col>
+    </Row>
+);
+
 export default SearchRoot;

schedules_web/src/containers/Search.tsx

@@ -5,7 +5,7 @@ import SearchRoot from '../components/SearchRoot';
 import { State } from '../reducers';
 
 const mapStateToProps = (state: State) => ({
-    searchResults: state.searchResults,
+    search: state.search,
 });
 
 export default connect(

schedules_web/src/reducers/index.ts

@@ -5,26 +5,15 @@
  */
 import { schedule, ScheduleState } from './schedule.reducer';
 import { search, SearchState } from './search.reducer';
+import { combineReducers } from 'redux';
 
+// The global state
 export interface State {
     schedule: ScheduleState;
-    searchResults: SearchState;
+    search: SearchState;
 }
 
-/**
- * If there is no current state passed in then initialize as nothing.
- */
-const defaultState: State = {
-    schedule: [],
-    searchResults: [],
-};
-
 /**
  * Combine all reducers into one object to attach to the store
- * @param state The current state, initialized as nothing
- * @param action The action to be applied to the reducers
  */
-export const allReducers = (state: State = defaultState, action: any) => ({
-    schedule: schedule(state.schedule, action),
-    searchResults: search(state.searchResults, action),
-});
+export const allReducers = combineReducers({ search, schedule });

schedules_web/src/reducers/search.reducer.ts

@@ -8,12 +8,20 @@ import { SET_SEARCH_RESULTS } from '../actions/search/search.action-types';
 import { SearchAction } from '../actions/search/search.actions';
 import CourseSection from '../util/CourseSection';
 
-export type SearchState = CourseSection[];
+export interface SearchState {
+    courseSections: CourseSection[];
+    error: string;
+}
 
-export const search = (state: SearchState = [], action: SearchAction): SearchState => {
+const initialState: SearchState = {
+    courseSections: [],
+    error: '',
+};
+
+export const search = (state: SearchState = initialState, action: SearchAction): SearchState => {
     switch (action.type) {
         case SET_SEARCH_RESULTS:
-            return action.searchResults;
+            return { courseSections: action.searchResults, error: action.error };
         default:
             return state;
     }