diff --git a/components/x-topic-search/__tests__/x-topic-search.test.jsx b/components/x-topic-search/__tests__/x-topic-search.test.jsx
index 5bc356fbc..04fe1b4da 100644
--- a/components/x-topic-search/__tests__/x-topic-search.test.jsx
+++ b/components/x-topic-search/__tests__/x-topic-search.test.jsx
@@ -3,17 +3,12 @@ const { h } = require('@financial-times/x-engine');
const { mount } = require('@financial-times/x-test-utils/enzyme');
const { TopicSearch } = require('../');
-const searchTerm = 'Dog';
-const searchTermNoResult = 'Blobfish';
-const searchTermAllFollowed = 'Cat';
const minSearchLength = 3;
const maxSuggestions = 3;
const apiUrl = 'api-url';
-const alreadyFollowedTopics = [
- { uuid: 'Cat-House-id', name: 'Cat House' },
- { uuid: 'Cat-Food-id', name: 'Cat Food' },
- { uuid: 'Cat-Toys-id', name: 'Cat Toys' }
-];
+const FOLLOWED_TOPIC_ID1 = 'Cat-House-id';
+const FOLLOWED_TOPIC_ID2 = 'Cat-Food-id';
+const UNFOLLOWED_TOPIC_ID1 = 'Cat-Toys-id';
describe('x-topic-search', () => {
const buildSearchUrl = term => `${apiUrl}?count=${maxSuggestions}&partial=${term}`;
@@ -29,7 +24,7 @@ describe('x-topic-search', () => {
minSearchLength,
maxSuggestions,
apiUrl,
- followedTopicIds: alreadyFollowedTopics.map(topic => topic.uuid),
+ followedTopicIds: [FOLLOWED_TOPIC_ID1, FOLLOWED_TOPIC_ID2],
};
target = mount();
});
@@ -64,17 +59,17 @@ describe('x-topic-search', () => {
});
describe('given searchTerm which has some topic suggestions to follow', () => {
- const apiUrlWithResults = buildSearchUrl(searchTerm);
- const unfollowedTopicSuggestions = [
- { id: 'Dog-House-id', prefLabel: 'Dog House', url: 'Dog-House-url' },
- { id: 'Dog-Food-id', prefLabel: 'Dog Food', url: 'Dog-Food-url' },
- { id: 'Dog-Toys-id', prefLabel: 'Dog Toys', url: 'Dog-Toys-url' }
+ const apiUrlWithResults = buildSearchUrl('Cat');
+ const results = [
+ { id: FOLLOWED_TOPIC_ID1, prefLabel: 'Cat House', url: 'Cat-House-url' },
+ { id: FOLLOWED_TOPIC_ID2, prefLabel: 'Cat Food', url: 'Cat-Food-url' },
+ { id: UNFOLLOWED_TOPIC_ID1, prefLabel: 'Cat Toys', url: 'Cat-Toys-url' }
];
- fetchMock.get(apiUrlWithResults, unfollowedTopicSuggestions);
+ fetchMock.get(apiUrlWithResults, results);
beforeEach(() => {
- return enterSearchTerm(searchTerm);
+ return enterSearchTerm('Cat');
});
it('requests the topic suggestions with count set to maxSuggestions', () => {
@@ -89,23 +84,23 @@ describe('x-topic-search', () => {
it('renders links and follow buttons for each suggestion', () => {
const suggestionsList = target.render().find('li');
- unfollowedTopicSuggestions.forEach((topic, index) => {
+ results.forEach((topic, index) => {
const suggestion = suggestionsList.eq(index);
expect(suggestion.find('a').text()).toEqual(topic.prefLabel);
expect(suggestion.find('a').attr('href')).toEqual(topic.url);
- expect(suggestion.find('button')).toHaveLength(1);
+ expect(suggestion.find('button').text()).toEqual(topic.id === UNFOLLOWED_TOPIC_ID1 ? 'Add to myFT' : 'Added');
});
})
});
describe('given searchTerm which has no topic suggestions to follow', () => {
- const apiUrlNoResults = buildSearchUrl(searchTermNoResult);
+ const apiUrlNoResults = buildSearchUrl('Dog');
fetchMock.get(apiUrlNoResults, []);
beforeEach(() => {
- return enterSearchTerm(searchTermNoResult);
+ return enterSearchTerm('Dog');
});
it('requests from the api and renders the no matching topics message', () => {
@@ -117,30 +112,4 @@ describe('x-topic-search', () => {
expect(resultContainer.find('h2').text()).toMatch('No topics matching');
});
});
-
- describe('given searchTerm which results in all suggestions already followed', () => {
- const apiUrlAllFollowed = buildSearchUrl(searchTermAllFollowed);
-
- fetchMock.get(apiUrlAllFollowed, alreadyFollowedTopics.map(topic => ({
- id: topic.uuid,
- prefLabel: topic.name,
- url: topic.name.replace(' ', '-')
- })));
-
- beforeEach(() => {
- return enterSearchTerm(searchTermAllFollowed);
- });
-
- it('requests the suggestions from the api', () => {
- expect(fetchMock.called(apiUrlAllFollowed)).toBe(true);
- });
-
- it('renders the "already followed" message with names of the topics', () => {
- const resultContainer = target.render().children('div').eq(1);
-
- expect(resultContainer).toHaveLength(1);
- expect(resultContainer.text())
- .toMatch(`You already follow ${alreadyFollowedTopics[0].name}, ${alreadyFollowedTopics[1].name} and ${alreadyFollowedTopics[2].name}`);
- });
- });
});
diff --git a/components/x-topic-search/src/ResultContainer.jsx b/components/x-topic-search/src/ResultContainer.jsx
deleted file mode 100644
index 75ab3dc22..000000000
--- a/components/x-topic-search/src/ResultContainer.jsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { h } from '@financial-times/x-engine';
-import styles from './TopicSearch.scss';
-import classNames from 'classnames';
-
-import SuggestionList from './SuggestionList';
-import NoSuggestions from './NoSuggestions';
-import SuggestionsAsSentence from './SuggestionsAsSentence';
-
-export default ({ followedSuggestions, searchTerm, csrfToken, followedTopicIds, unfollowedSuggestions }) => {
- const hasFollowedSuggestions = followedSuggestions.length > 0;
- const hasUnfollowedSuggestions = unfollowedSuggestions.length > 0;
-
- return (
-
- {hasUnfollowedSuggestions &&
-
}
-
- {!hasUnfollowedSuggestions && hasFollowedSuggestions &&
-
- You already follow
-
}
-
- {!hasUnfollowedSuggestions && !hasFollowedSuggestions &&
-
}
-
this.rootEl = el}>
@@ -107,13 +105,17 @@ class TopicSearch extends Component {
/>
- { showResult && searchTerm.length >= this.minSearchLength &&
- }
+ {showResult && searchTerm.length >= this.minSearchLength &&
+
+ {suggestions.length > 0 ?
+ :
+ }
+
}
);
}
diff --git a/components/x-topic-search/src/TopicSearch.scss b/components/x-topic-search/src/TopicSearch.scss
index bca94f69d..759982612 100644
--- a/components/x-topic-search/src/TopicSearch.scss
+++ b/components/x-topic-search/src/TopicSearch.scss
@@ -117,11 +117,3 @@
margin-bottom: 0;
list-style-type: disc;
}
-
-.all-followed {
- @include oTypographySans($scale: 1);
- color: oColorsGetPaletteColor('black-70');
- text-align: left;
- padding: 0;
- margin: 0;
-}
diff --git a/components/x-topic-search/src/lib/get-suggestions.js b/components/x-topic-search/src/lib/get-suggestions.js
index ce2caef4b..d7c85db08 100644
--- a/components/x-topic-search/src/lib/get-suggestions.js
+++ b/components/x-topic-search/src/lib/get-suggestions.js
@@ -4,7 +4,7 @@ const addQueryParamToUrl = (name, value, url, append = true) => {
return append === true ? `${url}&${queryParam}` : `${url}?${queryParam}`;
};
-export default (searchTerm, maxSuggestions, apiUrl, followedTopicIds) => {
+export default (searchTerm, maxSuggestions, apiUrl) => {
const dataSrc = addQueryParamToUrl('count', maxSuggestions, apiUrl, false);
const url = addQueryParamToUrl('partial', searchTerm.replace(' ', '+'), dataSrc);
@@ -16,8 +16,5 @@ export default (searchTerm, maxSuggestions, apiUrl, followedTopicIds) => {
return response.json();
})
- .then(suggestions => ({
- followedSuggestions: suggestions.filter(suggestion => followedTopicIds.includes(suggestion.id)),
- unfollowedSuggestions: suggestions.filter(suggestion => !followedTopicIds.includes(suggestion.id))
- }));
+ .then(suggestions => ({ suggestions }));
};