fix: autocomplete defensive code fix (#236)

feat: use shorthand check fix: lint fixes
openedx · Mar 3, 2022 · c5653a4 · c5653a4
1 parent 34abfa6
commit c5653a4
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 25 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,3 +3,5 @@
 node_modules
 lerna-debug.log
 .DS_Store
+coverage/
+dist/
diff --git a/packages/catalog-search/src/SearchSuggestions.jsx b/packages/catalog-search/src/SearchSuggestions.jsx
@@ -15,37 +15,39 @@ const SearchSuggestions = ({ autoCompleteHits, enterpriseSlug, handleViewAllClic
           Courses
         </div>
         {
-                    autoCompleteHits.filter(hit => hit.content_type === 'course')
-                      .slice(0, MAX_NUM_SUGGESTIONS)
-                      .map((hit) => (
-                        <SearchSuggestionItem
-                          url={getLinkToCourse(hit)}
-                          /* eslint-disable-next-line no-underscore-dangle */
-                          highlightedTitle={hit._highlightResult.title.value}
-                          authoringOrganization={hit.key && hit.key.split('+')[0]}
-                          title={hit.title}
-                        />
-                      ))
-                  }
+          autoCompleteHits.filter(hit => hit.content_type === 'course')
+            .slice(0, MAX_NUM_SUGGESTIONS)
+            .map((hit) => (
+              <SearchSuggestionItem
+                key={hit.title}
+                url={getLinkToCourse(hit)}
+                /* eslint-disable-next-line no-underscore-dangle */
+                highlightedTitle={hit._highlightResult.title.value}
+                authoringOrganization={hit.key && hit.key.split('+')[0]}
+                title={hit.title}
+              />
+            ))
+        }
       </div>
       <div>
         <div className="mb-2 mt-5 ml-2 font-weight-bold suggestions-section">
           Programs
         </div>
         {
-                    autoCompleteHits.filter(hit => hit.content_type === 'program')
-                      .slice(0, MAX_NUM_SUGGESTIONS)
-                      .map((hit) => (
-                        <SearchSuggestionItem
-                          url={getLinkToProgram(hit)}
-                          /* eslint-disable-next-line no-underscore-dangle */
-                          highlightedTitle={hit._highlightResult.title.value}
-                          authoringOrganization={hit.authoring_organizations && hit.authoring_organizations[0].key}
-                          title={hit.title}
-                          programType={hit.program_type}
-                        />
-                      ))
-                  }
+          autoCompleteHits.filter(hit => hit.content_type === 'program')
+            .slice(0, MAX_NUM_SUGGESTIONS)
+            .map((hit) => (
+              <SearchSuggestionItem
+                key={hit.title}
+                url={getLinkToProgram(hit)}
+                /* eslint-disable-next-line no-underscore-dangle */
+                highlightedTitle={hit._highlightResult.title.value}
+                authoringOrganization={hit.authoring_organizations.shift()?.key}
+                title={hit.title}
+                programType={hit.program_type}
+              />
+            ))
+        }
       </div>
       <button type="button" className="btn btn-light w-100 view-all-btn" onClick={handleViewAllClick}>
         View all results

diff --git a/packages/catalog-search/src/tests/SearchSuggestions.test.jsx b/packages/catalog-search/src/tests/SearchSuggestions.test.jsx
@@ -25,6 +25,22 @@ const fakeSuggestionsData = {
   ],
 };
 
+const fakeSuggestionsDataEmptyAuthoringOrgs = {
+  ...fakeSuggestionsData,
+  nbHits: 1,
+  hits: [
+    {
+      content_type: 'program',
+      key: 'harvard+programX',
+      title: 'test-program',
+      _highlightResult: { title: { value: 'test-<em>program</em>' } },
+      aggregation_key: '123:456',
+      authoring_organizations: [],
+      program_type: 'xSeries',
+    },
+  ],
+};
+
 const handleViewAllClick = jest.fn();
 
 describe('<SeachSuggestions />', () => {
@@ -45,6 +61,20 @@ describe('<SeachSuggestions />', () => {
     expect(screen.getByText('View all results')).not.toBeNull();
   });
 
+  test('renders no errors when no authoring orgs found for programs data', () => {
+    renderWithRouter(<SearchSuggestions
+      enterpriseSlug="test-enterprise"
+      autoCompleteHits={fakeSuggestionsDataEmptyAuthoringOrgs.hits}
+      handleViewAllClick={handleViewAllClick}
+    />);
+    expect(screen.getByText('Courses')).not.toBeNull();
+    expect(screen.getByText('Programs')).not.toBeNull();
+    expect(screen.getAllByText('test-').length).toBe(1);
+    expect(screen.getByText('program')).not.toBeNull();
+    expect(screen.getByText('xSeries')).not.toBeNull();
+    expect(screen.getByText('View all results')).not.toBeNull();
+  });
+
   test('calls click handler on view all results', () => {
     renderWithRouter(<SearchSuggestions
       enterpriseSlug="test-enterprise"