this.toggleStatusView(e)}
+ onClick={(e) => this.toggleStatusView(e)}
data-no-instant
>
{isStatusViewValid ? 'View Archive' : 'View Reading List'}
diff --git a/app/javascript/searchableItemList/searchableItemList.js b/app/javascript/searchableItemList/searchableItemList.js
index dca05149d..109866bcd 100644
--- a/app/javascript/searchableItemList/searchableItemList.js
+++ b/app/javascript/searchableItemList/searchableItemList.js
@@ -1,5 +1,5 @@
// Shared behavior between the reading list and history pages
-import setupAlgoliaIndex from '../src/utils/algolia';
+import { fetchSearch } from '../src/utils/search';
// Provides the initial state for the component
export function defaultState(options) {
@@ -59,25 +59,24 @@ export function clearSelectedTags(event) {
}
// Perform the initial search
-export function performInitialSearch({
- containerId,
- indexName,
- searchOptions = {},
-}) {
+export function performInitialSearch({ searchOptions = {} }) {
const component = this;
const { hitsPerPage } = component.state;
+ const dataHash = { page: 0, per_page: hitsPerPage };
- const index = setupAlgoliaIndex({ containerId, indexName });
+ if (searchOptions.status) {
+ dataHash.status = searchOptions.status.split(',');
+ }
- index.search('', searchOptions).then(result => {
+ const responsePromise = fetchSearch('reactions', dataHash);
+ return responsePromise.then((response) => {
+ const reactions = response.result;
component.setState({
- items: result.hits,
- totalCount: result.nbHits,
- index, // set the index in the component state, to be retrieved later
+ page: 0,
+ items: reactions,
itemsLoaded: true,
- // show the button if the number of total results is greater
- // than the number of results for the current page
- showLoadMoreButton: result.nbHits > hitsPerPage,
+ totalCount: response.total,
+ showLoadMoreButton: hitsPerPage < response.total,
});
});
}
@@ -90,28 +89,31 @@ export function search(query, { page, tags, statusView }) {
// we check `undefined` because page can be 0
const newPage = page === undefined ? component.state.page : page;
- const { index, hitsPerPage, items } = component.state;
+ const { hitsPerPage } = component.state;
+ const dataHash = {
+ search_fields: query,
+ page: newPage,
+ per_page: hitsPerPage,
+ };
- const filters = { hitsPerPage, page: newPage };
if (tags && tags.length > 0) {
- filters.tagFilters = tags;
+ dataHash.tag_names = tags;
+ dataHash.tag_boolean_mode = 'all';
}
if (statusView) {
- filters.filters = `status:${statusView}`;
+ dataHash.status = statusView.split(',');
}
- index.search(query, filters).then(result => {
- // append new items at the end
- const allItems =
- page === undefined ? result.hits : [...items, ...result.hits];
+
+ const responsePromise = fetchSearch('reactions', dataHash);
+ return responsePromise.then((response) => {
+ const reactions = response.result;
component.setState({
query,
page: newPage,
- items: result.hits,
- totalCount: allItems.length,
- // show the button if the number of items is lower than the number
- // of available results
- showLoadMoreButton: allItems.length < result.nbHits,
+ items: reactions,
+ totalCount: response.total,
+ showLoadMoreButton: reactions.length < response.total,
});
});
}
diff --git a/app/javascript/src/components/ItemList/ItemListItem.jsx b/app/javascript/src/components/ItemList/ItemListItem.jsx
index d755bfd97..6e9cfd515 100644
--- a/app/javascript/src/components/ItemList/ItemListItem.jsx
+++ b/app/javascript/src/components/ItemList/ItemListItem.jsx
@@ -4,13 +4,12 @@ import { PropTypes } from 'preact-compat';
export const ItemListItem = ({ item, children }) => {
const adaptedItem = {
- path: item.article_path || item.searchable_reactable_path,
- title: item.article_title || item.searchable_reactable_title,
- user: item.article_user || item.reactable_user,
- publishedDate: item.reactable_published_date,
- visitedDate: item.readable_visited_at,
- readingTime: item.article_reading_time || item.reading_time,
- tags: item.article_tags || item.reactable_tags,
+ path: item.reactable.path,
+ title: item.reactable.title,
+ user: item.reactable.user,
+ publishedDate: item.reactable.published_date_string,
+ readingTime: item.reactable.reading_time,
+ tags: item.reactable.tags,
};
// update readingTime to 1 min if the reading time is less than 1 min
@@ -24,17 +23,15 @@ export const ItemListItem = ({ item, children }) => {
{`${adaptedItem.user.name}・`}
- {adaptedItem.visitedDate
- ? `visited on ${adaptedItem.visitedDate}・`
- : `${adaptedItem.publishedDate}・`}
+ {`${adaptedItem.publishedDate}・`}
{`${adaptedItem.readingTime} min read・`}
{adaptedItem.tags.length > 0 ? (
- {adaptedItem.tags.map(tag => (
-
- {`#${tag}`}
+ {adaptedItem.tags.map((tag) => (
+
+ {`#${tag.name}`}
))}
@@ -49,30 +46,19 @@ export const ItemListItem = ({ item, children }) => {
);
};
-const historyItemPropTypes = PropTypes.shape({
- article_path: PropTypes.string.isRequired,
- article_title: PropTypes.string.isRequired,
- article_user: PropTypes.shape({
- username: PropTypes.string.isRequired,
- profile_image_90: PropTypes.string.isRequired,
- name: PropTypes.string.isRequired,
- }),
- article_reading_time: PropTypes.number.isRequired,
- readable_visited_at: PropTypes.string.isRequired,
- article_tags: PropTypes.arrayOf(PropTypes.string).isRequired,
-});
-
const readingListItemPropTypes = PropTypes.shape({
- searchable_reactable_path: PropTypes.string.isRequired,
- searchable_reactable_title: PropTypes.string.isRequired,
- reactable_user: PropTypes.shape({
- username: PropTypes.string.isRequired,
- profile_image_90: PropTypes.string.isRequired,
- name: PropTypes.string.isRequired,
- }),
- reading_time: PropTypes.number.isRequired,
- reactable_published_date: PropTypes.string.isRequired,
- reactable_tags: PropTypes.arrayOf(PropTypes.string).isRequired,
+ reactable: {
+ path: PropTypes.string.isRequired,
+ title: PropTypes.string.isRequired,
+ reading_time: PropTypes.number.isRequired,
+ published_date_string: PropTypes.string.isRequired,
+ user: PropTypes.shape({
+ username: PropTypes.string.isRequired,
+ profile_image_90: PropTypes.string.isRequired,
+ name: PropTypes.string.isRequired,
+ }),
+ tags: PropTypes.arrayOf(PropTypes.string).isRequired,
+ },
});
ItemListItem.defaultProps = {
@@ -80,7 +66,6 @@ ItemListItem.defaultProps = {
};
ItemListItem.propTypes = {
- item: PropTypes.oneOfType([historyItemPropTypes, readingListItemPropTypes])
- .isRequired,
+ item: PropTypes.oneOfType([readingListItemPropTypes]).isRequired,
children: PropTypes.element,
};
diff --git a/app/javascript/src/components/ItemList/__tests__/ItemListItem.test.jsx b/app/javascript/src/components/ItemList/__tests__/ItemListItem.test.jsx
index f3f090700..c194ece8e 100644
--- a/app/javascript/src/components/ItemList/__tests__/ItemListItem.test.jsx
+++ b/app/javascript/src/components/ItemList/__tests__/ItemListItem.test.jsx
@@ -3,55 +3,61 @@ import render from 'preact-render-to-json';
import { shallow } from 'preact-render-spy';
import { ItemListItem } from '../ItemListItem';
-const historyItem = {
- article_path: '/article',
- article_title: 'Title',
- article_user: {
- username: 'bob',
- profile_image_90: 'https://dummyimage.com/90x90',
- name: 'Bob',
- },
- article_reading_time: 1,
- readable_visited_at: 'Jun 29',
- article_tags: ['discuss'],
-};
-
const item = {
- searchable_reactable_path: '/article',
- searchable_reactable_title: 'Title',
- reactable_user: {
- username: 'bob',
- profile_image_90: 'https://dummyimage.com/90x90',
- name: 'Bob',
+ reactable: {
+ path: '/article',
+ title: 'Title',
+ published_date_string: 'Jun 29',
+ reading_time: 1,
+ user: {
+ username: 'bob',
+ profile_image_90: 'https://dummyimage.com/90x90',
+ name: 'Bob',
+ },
+ tags: [{ name: 'discuss' }],
},
- reading_time: 1,
- reactable_published_date: 'Jun 29',
- reactable_tags: ['discuss'],
};
describe('
', () => {
- it('renders properly with a history item', () => {
- const tree = render(
);
- expect(tree).toMatchSnapshot();
- });
-
it('renders properly with a readinglist item', () => {
const tree = render(
);
expect(tree).toMatchSnapshot();
});
it('renders with readingtime of 1 min if reading time is less than 1 min.', () => {
- const wrapper = shallow(
);
+ item.reactable.reading_time = 0.5;
+ const wrapper = shallow(
);
expect(wrapper.find('.item-user').text()).toContain('1 min read');
});
it('renders with readingtime of 1 min if reading time is null.', () => {
- const wrapper = shallow(
);
+ item.reactable.reading_time = null;
+ const wrapper = shallow(
);
expect(wrapper.find('.item-user').text()).toContain('1 min read');
});
+ it('renders correct readingtime.', () => {
+ item.reactable.reading_time = 10;
+ const wrapper = shallow(
);
+ expect(wrapper.find('.item-user').text()).toContain('10 min read');
+ });
+
it('renders without any tags if the tags array is empty.', () => {
- const wrapper = shallow(
);
- expect(wrapper.find('.item-user').text()).toContain('1 min read');
+ item.reactable.tags = [];
+ const wrapper = shallow(
);
+ expect(wrapper.find('.item-tags').exists()).toEqual(false);
+ });
+
+ it('renders tags with links if present.', () => {
+ item.reactable.tags = [{ name: 'discuss' }];
+ const wrapper = shallow(
);
+ expect(wrapper.find('.item-tag')[0].attributes.href).toEqual('/t/discuss');
+ expect(wrapper.find('.item-tag').text()).toContain('discuss');
+ });
+
+ it('renders user information', () => {
+ const wrapper = shallow(
);
+ expect(wrapper.find('.item-user')[0].attributes.href).toEqual('/bob');
+ expect(wrapper.find('.item-user').text()).toContain('Bob');
});
});
diff --git a/app/javascript/src/components/ItemList/__tests__/__snapshots__/ItemListItem.test.jsx.snap b/app/javascript/src/components/ItemList/__tests__/__snapshots__/ItemListItem.test.jsx.snap
index 4c324d433..8595095ad 100644
--- a/app/javascript/src/components/ItemList/__tests__/__snapshots__/ItemListItem.test.jsx.snap
+++ b/app/javascript/src/components/ItemList/__tests__/__snapshots__/ItemListItem.test.jsx.snap
@@ -1,46 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`
renders properly with a history item 1`] = `
-
-`;
-
exports[`
renders properly with a readinglist item 1`] = `
val } } }
else
{ terms: { search_key => values } }
diff --git a/spec/services/search/reaction_spec.rb b/spec/services/search/reaction_spec.rb
index 05a407be8..0528d1c80 100644
--- a/spec/services/search/reaction_spec.rb
+++ b/spec/services/search/reaction_spec.rb
@@ -92,7 +92,7 @@ RSpec.describe Search::Reaction, type: :service do
it "filters by status" do
reaction1.update(status: "invalid")
index_documents([reaction1, reaction2])
- query_params[:status] = ["valid"]
+ query_params[:status] = %w[valid confirmed]
reaction_docs = described_class.search_documents(params: query_params)["reactions"]
expect(reaction_docs.count).to eq(1)