at the end of the day, it was inevitable

2022-12-09 08:36:26 -06:00
commit 1218570914
1768 changed files with 887087 additions and 0 deletions
@@ -0,0 +1,186 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { translate } from 'react-i18next'
+import SourceIndexTable from './SourceIndexTable'
+import SourceIndexUpdatePopup from './SourceIndexUpdatePopup'
+import FiltersTable from '../../../../common/FiltersTable/FiltersTable'
+import { withRouter } from 'react-router-dom'
+import reduxConnect from '../../../../../redux/utils/connect'
+import { compose } from 'redux'
+import { Button, ButtonGroup, Input, InputGroup, InputGroupAddon } from 'reactstrap'
+import { setDocumentData } from '../../../../../common/helper'
+
+class SourceIndexSubTab extends React.Component {
+  static propTypes = {
+    sourcesState: PropTypes.object.isRequired,
+    actions: PropTypes.object.isRequired,
+    t: PropTypes.func.isRequired
+  };
+
+  componentDidMount() {
+    setDocumentData('title', 'Source Index | Search')
+  }
+
+  componentWillUnmount() {
+    setDocumentData('title')
+  }
+
+  _sourceIndexesState = () => this.props.sourcesState.sourceIndexesState;
+  _sourceLists = () => this.props.sourcesState.sourceListsState.data;
+
+  loadSourceIndexes = (params) => {
+    this.props.actions.getSourceIndexes(params || null)
+  };
+
+  onSearchSources = () => {
+    this.loadSourceIndexes()
+  };
+
+  onEnterSearchInput = (e) => {
+    if (e.keyCode === 13) this.loadSourceIndexes()
+  };
+
+  onChangeSearchInput = (e) => {
+    this.props.actions.setSourceIndexSearchQuery(e.target.value)
+  };
+
+  onFetchData = (params) => {
+    this.loadSourceIndexes(params)
+  };
+
+  showAddToListPopup = () => {
+    const { actions } = this.props
+    const sourceIndexesState = this._sourceIndexesState()
+    if (sourceIndexesState.selectedIds.length === 0) {
+      actions.addAlert({
+        type: 'notice',
+        transKey: 'noListsSelected',
+        id: 'noListsSelected'
+      })
+
+      return false
+    }
+
+    actions.toggleAddSourceToListPopup()
+  };
+
+  onSelectFilter = (groupName, filterValue) => {
+    this.props.actions.selectSourcesFilter(groupName, filterValue)
+  };
+
+  onClearFilters = (groupName) => {
+    this.props.actions.clearSourcesFilters(groupName)
+  };
+
+  onClearAllFilters = () => {
+    this.props.actions.clearAllSourcesFilters()
+  };
+
+  onMoreFilters = (groupName) => {
+    this.props.actions.loadMoreSourcesFilters(groupName)
+  };
+
+  onLessFilters = (groupName) => {
+    this.props.actions.loadLessSourcesFilters(groupName)
+  };
+
+  render () {
+    const { t, actions } = this.props
+    const sourceIndexesState = this._sourceIndexesState()
+    const sourceLists = this._sourceLists()
+    const {
+      searchQuery,
+      selectedIds,
+      chosenListsToAddSources,
+      chosenSourceToUpdate,
+      advancedFilters
+    } = sourceIndexesState
+
+    return (
+      <div className="mb-3">
+        <InputGroup className="mb-3">
+          <Input
+            type="text"
+            id="source-index-search"
+            placeholder={t('sourceIndexTab.mainInputPlaceholder')}
+            value={searchQuery}
+            onChange={this.onChangeSearchInput}
+            onKeyUp={this.onEnterSearchInput}
+          />
+          <InputGroupAddon addonType="append">
+            <Button
+              color="primary"
+              className="btn-icon btn-icon-only"
+              onClick={this.onSearchSources}
+            >
+              <i className="lnr-magnifier btn-icon-wrapper"></i>
+            </Button>
+          </InputGroupAddon>
+        </InputGroup>
+
+        <ButtonGroup className="mb-3">
+          <Button
+            onClick={this.showAddToListPopup}
+            color="secondary"
+          >
+            <i className="fa fa-plus fa-1px for-small mr-1"> </i>{" "}
+            {t('sourceIndexTab.addToSourceListsBtn')}
+          </Button>
+        </ButtonGroup>
+
+        <div className="search-content">
+          <SourceIndexTable
+            tableState={sourceIndexesState}
+            type="sourceIndexesState"
+            onFetch={this.onFetchData}
+            actions={actions}
+          />
+
+          <FiltersTable
+            filters={advancedFilters.all}
+            pages={advancedFilters.pages}
+            selectedFilters={advancedFilters.selected}
+            clearPending={advancedFilters.pending}
+            callbacks={{
+              selectFilter: this.onSelectFilter,
+              clearFilters: this.onClearFilters,
+              clearAllFilters: this.onClearAllFilters,
+              moreFilters: this.onMoreFilters,
+              lessFilters: this.onLessFilters,
+              refine: this.onSearchSources
+            }}
+          />
+        </div>
+
+        {sourceIndexesState.isAddPopupVisible && (
+          <SourceIndexUpdatePopup
+            type="add"
+            sourceLists={sourceLists}
+            chosenLists={chosenListsToAddSources}
+            chosenSourceIndexes={selectedIds}
+            actions={actions}
+          />
+        )}
+
+        {sourceIndexesState.isUpdatePopupVisible && (
+          <SourceIndexUpdatePopup
+            type="update"
+            sourceLists={sourceLists}
+            chosenLists={chosenSourceToUpdate.listIds}
+            chosenSourceIndexes={[chosenSourceToUpdate.id]}
+            updateItemTitle={chosenSourceToUpdate.title}
+            actions={actions}
+          />
+        )}
+      </div>
+    )
+  }
+}
+
+const applyDecorators = compose(
+  withRouter,
+  reduxConnect('sourcesState', ['appState', 'sourcesState']),
+  translate(['tabsContent'], { wait: true })
+)
+
+export default applyDecorators(SourceIndexSubTab)