Renames in Frontend

2026-04-19 21:44:30 -04:00 · 2020-05-15 23:32:52 -04:00
parent ee4e44b81a
commit ee43ccf620
387 changed files with 4036 additions and 4364 deletions
@@ -0,0 +1,138 @@
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import Button from 'Components/Link/Button';
+import { scrollDirections } from 'Helpers/Props';
+import ModalContent from 'Components/Modal/ModalContent';
+import ModalHeader from 'Components/Modal/ModalHeader';
+import ModalBody from 'Components/Modal/ModalBody';
+import ModalFooter from 'Components/Modal/ModalFooter';
+import Table from 'Components/Table/Table';
+import TableBody from 'Components/Table/TableBody';
+import Scroller from 'Components/Scroller/Scroller';
+import TextInput from 'Components/Form/TextInput';
+import LoadingIndicator from 'Components/Loading/LoadingIndicator';
+import SelectBookRow from './SelectBookRow';
+import styles from './SelectBookModalContent.css';
+
+const columns = [
+  {
+    name: 'title',
+    label: 'Book Title',
+    isSortable: true,
+    isVisible: true
+  },
+  {
+    name: 'releaseDate',
+    label: 'Release Date',
+    isSortable: true,
+    isVisible: true
+  },
+  {
+    name: 'status',
+    label: 'Book Status',
+    isVisible: true
+  }
+];
+
+class SelectBookModalContent extends Component {
+
+  //
+  // Lifecycle
+
+  constructor(props, context) {
+    super(props, context);
+
+    this.state = {
+      filter: ''
+    };
+  }
+
+  //
+  // Listeners
+
+  onFilterChange = ({ value }) => {
+    this.setState({ filter: value.toLowerCase() });
+  }
+
+  //
+  // Render
+
+  render() {
+    const {
+      items,
+      onBookSelect,
+      onModalClose,
+      isFetching,
+      ...otherProps
+    } = this.props;
+
+    const filter = this.state.filter;
+
+    return (
+      <ModalContent onModalClose={onModalClose}>
+        <ModalHeader>
+          Manual Import - Select Book
+        </ModalHeader>
+
+        <ModalBody
+          className={styles.modalBody}
+          scrollDirection={scrollDirections.NONE}
+        >
+          {
+            isFetching &&
+              <LoadingIndicator />
+          }
+          <TextInput
+            className={styles.filterInput}
+            placeholder="Filter book"
+            name="filter"
+            value={filter}
+            autoFocus={true}
+            onChange={this.onFilterChange}
+          />
+
+          <Scroller className={styles.scroller}>
+            {
+              <Table
+                columns={columns}
+                {...otherProps}
+              >
+                <TableBody>
+                  {
+                    items.map((item) => {
+                      return item.title.toLowerCase().includes(filter) ?
+                        (
+                          <SelectBookRow
+                            key={item.id}
+                            columns={columns}
+                            onBookSelect={onBookSelect}
+                            {...item}
+                          />
+                        ) :
+                        null;
+                    })
+                  }
+                </TableBody>
+              </Table>
+            }
+          </Scroller>
+        </ModalBody>
+
+        <ModalFooter>
+          <Button onPress={onModalClose}>
+            Cancel
+          </Button>
+        </ModalFooter>
+      </ModalContent>
+    );
+  }
+}
+
+SelectBookModalContent.propTypes = {
+  items: PropTypes.arrayOf(PropTypes.object).isRequired,
+  isFetching: PropTypes.bool.isRequired,
+  onBookSelect: PropTypes.func.isRequired,
+  onModalClose: PropTypes.func.isRequired
+};
+
+export default SelectBookModalContent;