From c0383ad5f5f34db844e5ce514c57dd3dfc91da4b Mon Sep 17 00:00:00 2001 From: Mark McDowall Date: Thu, 5 Jan 2023 18:20:49 -0800 Subject: [PATCH] Refactor Indexer index to use react-window (cherry picked from commit d022679b7dcbce3cec98e6a1fd0879e3c0d92523) --- frontend/src/App/AppRoutes.js | 4 +- .../src/App/AppUpdatedModalContent.css.d.ts | 9 + frontend/src/App/ConnectionLostModal.css.d.ts | 7 + frontend/src/App/ModelBase.ts | 5 + frontend/src/App/SelectContext.tsx | 163 ++++++ frontend/src/Components/Alert.css.d.ts | 11 + frontend/src/Components/Alert.js | 8 +- frontend/src/Components/Card.css.d.ts | 9 + .../DescriptionList/DescriptionList.css.d.ts | 7 + .../DescriptionListItemDescription.css.d.ts | 7 + .../DescriptionListItemTitle.css.d.ts | 7 + .../src/Components/DragPreviewLayer.css.d.ts | 7 + .../Components/Error/ErrorBoundaryError.css | 4 + .../Error/ErrorBoundaryError.css.d.ts | 12 + .../Components/Error/ErrorBoundaryError.js | 60 -- .../Components/Error/ErrorBoundaryError.tsx | 74 +++ frontend/src/Components/FieldSet.css.d.ts | 8 + .../FileBrowser/FileBrowserModal.css.d.ts | 7 + .../FileBrowserModalContent.css.d.ts | 12 + .../FileBrowser/FileBrowserRow.css.d.ts | 7 + .../DateFilterBuilderRowValue.css.d.ts | 9 + .../FilterBuilderModalContent.css.d.ts | 10 + .../Filter/Builder/FilterBuilderRow.css.d.ts | 10 + .../Builder/FilterBuilderRowValueTag.css.d.ts | 10 + .../CustomFilters/CustomFilter.css.d.ts | 9 + .../CustomFiltersModalContent.css.d.ts | 7 + .../Components/Form/AutoSuggestInput.css.d.ts | 15 + .../src/Components/Form/CaptchaInput.css.d.ts | 12 + .../src/Components/Form/CheckInput.css.d.ts | 18 + .../src/Components/Form/DeviceInput.css.d.ts | 8 + .../Form/EnhancedSelectInput.css.d.ts | 22 + .../Components/Form/EnhancedSelectInput.js | 40 +- .../Form/EnhancedSelectInputOption.css.d.ts | 14 + .../EnhancedSelectInputSelectedValue.css.d.ts | 8 + frontend/src/Components/Form/Form.css.d.ts | 7 + .../src/Components/Form/FormGroup.css.d.ts | 11 + .../Components/Form/FormInputButton.css.d.ts | 8 + .../Components/Form/FormInputGroup.css.d.ts | 14 + .../src/Components/Form/FormInputGroup.js | 12 +- .../Form/FormInputHelpText.css.d.ts | 12 + .../src/Components/Form/FormLabel.css.d.ts | 11 + frontend/src/Components/Form/FormLabel.js | 26 +- .../Form/HintedSelectInputOption.css.d.ts | 9 + .../HintedSelectInputSelectedValue.css.d.ts | 9 + .../Form/KeyValueListInput.css.d.ts | 10 + .../Form/KeyValueListInputItem.css.d.ts | 11 + .../Components/Form/PasswordInput.css.d.ts | 7 + .../src/Components/Form/PathInput.css.d.ts | 10 + .../src/Components/Form/SelectInput.css.d.ts | 10 + .../src/Components/Form/TagInput.css.d.ts | 9 + .../Components/Form/TagInputInput.css.d.ts | 7 + .../src/Components/Form/TagInputTag.css.d.ts | 7 + .../src/Components/Form/TextArea.css.d.ts | 10 + .../src/Components/Form/TextInput.css.d.ts | 11 + frontend/src/Components/Icon.css.d.ts | 13 + frontend/src/Components/Label.css.d.ts | 19 + frontend/src/Components/Label.js | 1 + frontend/src/Components/Link/Button.css.d.ts | 18 + .../Components/Link/ClipboardButton.css.d.ts | 10 + .../src/Components/Link/IconButton.css.d.ts | 8 + frontend/src/Components/Link/IconButton.js | 2 + frontend/src/Components/Link/Link.css.d.ts | 8 + .../Components/Link/SpinnerButton.css.d.ts | 11 + frontend/src/Components/Link/SpinnerButton.js | 1 + .../Link/SpinnerErrorButton.css.d.ts | 10 + .../src/Components/Link/SpinnerIconButton.js | 2 + .../Loading/LoadingIndicator.css.d.ts | 9 + .../Loading/LoadingMessage.css.d.ts | 7 + .../src/Components/Menu/FilterMenu.css.d.ts | 7 + frontend/src/Components/Menu/Menu.css.d.ts | 7 + .../src/Components/Menu/MenuButton.css.d.ts | 8 + .../src/Components/Menu/MenuContent.css.d.ts | 8 + .../src/Components/Menu/MenuItem.css.d.ts | 8 + .../Menu/MenuItemSeparator.css.d.ts | 7 + .../Components/Menu/SelectedMenuItem.css.d.ts | 9 + frontend/src/Components/Menu/SortMenu.js | 5 +- .../Menu/ToolbarMenuButton.css.d.ts | 10 + frontend/src/Components/Menu/ViewMenu.js | 5 +- frontend/src/Components/Modal/Modal.css.d.ts | 15 + frontend/src/Components/Modal/Modal.js | 2 +- .../src/Components/Modal/ModalBody.css.d.ts | 9 + .../Components/Modal/ModalContent.css.d.ts | 8 + .../src/Components/Modal/ModalError.css.d.ts | 8 + .../src/Components/Modal/ModalFooter.css.d.ts | 7 + .../src/Components/Modal/ModalHeader.css.d.ts | 7 + frontend/src/Components/NotFound.css.d.ts | 9 + .../src/Components/Page/ErrorPage.css.d.ts | 8 + .../Page/Header/IndexerSearchInput.css.d.ts | 18 + .../Page/Header/IndexerSearchResult.css.d.ts | 12 + .../KeyboardShortcutsModalContent.css.d.ts | 8 + .../Page/Header/PageHeader.css.d.ts | 16 + .../Header/PageHeaderActionsMenu.css.d.ts | 8 + .../src/Components/Page/LoadingPage.css.d.ts | 8 + frontend/src/Components/Page/Page.css.d.ts | 8 + .../src/Components/Page/PageContent.css.d.ts | 7 + .../Components/Page/PageContentBody.css.d.ts | 8 + .../src/Components/Page/PageContentBody.js | 74 --- .../src/Components/Page/PageContentBody.tsx | 51 ++ .../Components/Page/PageContentError.css.d.ts | 7 + .../src/Components/Page/PageContentFooter.css | 10 +- .../Page/PageContentFooter.css.d.ts | 7 + .../src/Components/Page/PageJumpBar.css.d.ts | 8 + .../Components/Page/PageJumpBarItem.css.d.ts | 7 + .../Page/Sidebar/Messages/Message.css.d.ts | 13 + .../Page/Sidebar/Messages/Messages.css.d.ts | 7 + .../Page/Sidebar/PageSidebar.css.d.ts | 8 + .../Page/Sidebar/PageSidebarItem.css.d.ts | 15 + .../Page/Toolbar/PageToolbar.css.d.ts | 7 + .../Page/Toolbar/PageToolbarButton.css.d.ts | 10 + .../Page/Toolbar/PageToolbarButton.js | 3 +- .../Toolbar/PageToolbarOverflowMenuItem.css | 3 + .../PageToolbarOverflowMenuItem.css.d.ts | 7 + .../Toolbar/PageToolbarOverflowMenuItem.tsx | 41 ++ .../Page/Toolbar/PageToolbarSection.css.d.ts | 13 + .../Page/Toolbar/PageToolbarSection.js | 24 +- .../Toolbar/PageToolbarSeparator.css.d.ts | 7 + frontend/src/Components/ProgressBar.css.d.ts | 21 + .../Scroller/OverlayScroller.css.d.ts | 9 + .../src/Components/Scroller/Scroller.css.d.ts | 12 + frontend/src/Components/Scroller/Scroller.js | 95 ---- frontend/src/Components/Scroller/Scroller.tsx | 90 +++ frontend/src/Components/SpinnerIcon.js | 1 + .../Table/Cells/RelativeDateCell.css.d.ts | 7 + .../Table/Cells/TableRowCell.css.d.ts | 7 + .../Table/Cells/VirtualTableRowCell.css.d.ts | 7 + .../Cells/VirtualTableSelectCell.css.d.ts | 8 + frontend/src/Components/Table/Column.ts | 10 + frontend/src/Components/Table/Table.css.d.ts | 9 + .../Components/Table/TableHeaderCell.css.d.ts | 8 + .../TableOptions/TableOptionsColumn.css.d.ts | 13 + .../TableOptionsColumnDragPreview.css.d.ts | 7 + .../TableOptionsColumnDragSource.css.d.ts | 10 + .../TableOptions/TableOptionsModal.css.d.ts | 7 + .../src/Components/Table/TablePager.css.d.ts | 17 + .../src/Components/Table/TableRow.css.d.ts | 7 + .../Components/Table/TableRowButton.css.d.ts | 7 + .../Table/TableSelectAllHeaderCell.css.d.ts | 8 + .../Components/Table/VirtualTable.css.d.ts | 8 + .../Table/VirtualTableHeader.css.d.ts | 7 + .../Table/VirtualTableHeaderCell.css.d.ts | 8 + .../Components/Table/VirtualTableRow.css.d.ts | 7 + .../VirtualTableSelectAllHeaderCell.css.d.ts | 8 + frontend/src/Components/TagList.css.d.ts | 7 + frontend/src/Components/Tooltip/Popover.css | 1 + .../src/Components/Tooltip/Popover.css.d.ts | 9 + frontend/src/Components/Tooltip/Popover.js | 8 +- .../src/Components/Tooltip/Tooltip.css.d.ts | 19 + frontend/src/Components/Tooltip/Tooltip.js | 4 +- frontend/src/Components/withScrollPosition.js | 30 - .../src/Components/withScrollPosition.tsx | 25 + ...uthenticationRequiredModalContent.css.d.ts | 7 + frontend/src/Helpers/Hooks/useMeasure.ts | 21 + frontend/src/Helpers/Props/ScrollDirection.ts | 8 + frontend/src/Helpers/Props/SortDirection.ts | 6 + frontend/src/Helpers/Props/icons.js | 10 +- .../History/Details/HistoryDetails.css.d.ts | 7 + .../Details/HistoryDetailsModal.css.d.ts | 7 + .../src/History/HistoryEventTypeCell.css.d.ts | 7 + frontend/src/History/HistoryRow.css.d.ts | 15 + .../src/History/HistoryRowParameter.css.d.ts | 9 + .../src/Indexer/Add/AddIndexerModal.css.d.ts | 7 + .../Add/AddIndexerModalContent.css.d.ts | 14 + .../src/Indexer/Add/SelectIndexerRow.css.d.ts | 8 + .../src/Indexer/Delete/DeleteIndexerModal.js | 1 + frontend/src/Indexer/Edit/EditIndexerModal.js | 3 +- .../Indexer/Edit/EditIndexerModalConnector.js | 1 + .../Edit/EditIndexerModalContent.css.d.ts | 7 + .../Editor/Delete/DeleteIndexerModal.js | 31 -- .../Delete/DeleteIndexerModalContent.js | 74 --- .../DeleteIndexerModalContentConnector.js | 43 -- .../Indexer/Editor/IndexerEditorFooter.css | 57 -- .../src/Indexer/Editor/IndexerEditorFooter.js | 208 ------- .../Editor/IndexerEditorFooterLabel.css | 8 - .../Editor/IndexerEditorFooterLabel.js | 40 -- frontend/src/Indexer/Editor/Tags/TagsModal.js | 31 -- .../Indexer/Editor/Tags/TagsModalContent.js | 188 ------- .../Editor/Tags/TagsModalContentConnector.js | 36 -- .../src/Indexer/Index/IndexerIndex.css.d.ts | 12 + frontend/src/Indexer/Index/IndexerIndex.js | 516 ------------------ frontend/src/Indexer/Index/IndexerIndex.tsx | 326 +++++++++++ .../Indexer/Index/IndexerIndexConnector.js | 101 ---- .../Indexer/Index/IndexerIndexFilterModal.tsx | 48 ++ .../Index/IndexerIndexFilterModalConnector.js | 24 - .../Indexer/Index/IndexerIndexFooter.css.d.ts | 14 + .../src/Indexer/Index/IndexerIndexFooter.js | 103 ---- .../src/Indexer/Index/IndexerIndexFooter.tsx | 115 ++++ .../Index/IndexerIndexFooterConnector.js | 49 -- .../Index/IndexerIndexItemConnector.js | 91 --- ...lterMenu.js => IndexerIndexFilterMenu.tsx} | 13 +- ...exSortMenu.js => IndexerIndexSortMenu.tsx} | 14 +- .../Select/Delete/DeleteIndexerModal.tsx | 24 + .../Delete/DeleteIndexerModalContent.css | 0 .../Delete/DeleteIndexerModalContent.css.d.ts | 9 + .../Delete/DeleteIndexerModalContent.tsx | 74 +++ .../Index/Select/Edit/EditIndexerModal.tsx | 26 + .../Select/Edit/EditIndexerModalContent.css | 16 + .../Edit/EditIndexerModalContent.css.d.ts | 8 + .../Select/Edit/EditIndexerModalContent.tsx | 130 +++++ .../Select/IndexerIndexSelectAllButton.tsx | 42 ++ .../Select/IndexerIndexSelectAllMenuItem.tsx | 43 ++ .../Index/Select/IndexerIndexSelectFooter.css | 72 +++ .../Select/IndexerIndexSelectFooter.css.d.ts | 11 + .../Index/Select/IndexerIndexSelectFooter.tsx | 180 ++++++ .../Select/IndexerIndexSelectModeButton.tsx | 39 ++ .../Select/IndexerIndexSelectModeMenuItem.tsx | 38 ++ .../Indexer/Index/Select/Tags/TagsModal.tsx | 22 + .../Select}/Tags/TagsModalContent.css | 0 .../Select/Tags/TagsModalContent.css.d.ts | 9 + .../Index/Select/Tags/TagsModalContent.tsx | 167 ++++++ .../Indexer/Index/Table/CapabilitiesLabel.js | 57 -- .../Indexer/Index/Table/CapabilitiesLabel.tsx | 39 ++ .../Index/Table/IndexerIndexActionsCell.js | 103 ---- .../Indexer/Index/Table/IndexerIndexHeader.js | 132 ----- .../Table/IndexerIndexHeaderConnector.js | 13 - .../Index/Table/IndexerIndexRow.css.d.ts | 19 + .../Indexer/Index/Table/IndexerIndexRow.js | 323 ----------- .../Indexer/Index/Table/IndexerIndexRow.tsx | 256 +++++++++ .../Indexer/Index/Table/IndexerIndexTable.css | 6 +- .../Index/Table/IndexerIndexTable.css.d.ts | 7 + .../Indexer/Index/Table/IndexerIndexTable.js | 140 ----- .../Indexer/Index/Table/IndexerIndexTable.tsx | 213 ++++++++ .../Index/Table/IndexerIndexTableConnector.js | 29 - ...Header.css => IndexerIndexTableHeader.css} | 0 .../Table/IndexerIndexTableHeader.css.d.ts | 16 + .../Index/Table/IndexerIndexTableHeader.tsx | 110 ++++ .../Index/Table/IndexerIndexTableOptions.js | 77 --- .../Index/Table/IndexerIndexTableOptions.tsx | 49 ++ .../IndexerIndexTableOptionsConnector.js | 14 - .../Index/Table/IndexerStatusCell.css.d.ts | 8 + .../Indexer/Index/Table/IndexerStatusCell.js | 66 --- .../Indexer/Index/Table/IndexerStatusCell.tsx | 57 ++ .../Index/Table/ProtocolLabel.css.d.ts | 8 + .../src/Indexer/Index/Table/ProtocolLabel.js | 20 - .../src/Indexer/Index/Table/ProtocolLabel.tsx | 17 + .../Indexer/Index/Table/selectTableOptions.ts | 8 + .../Index/createIndexerIndexItemSelector.ts | 28 + frontend/src/Indexer/Indexer.ts | 42 ++ .../Info/IndexerInfoModalContent.css.d.ts | 7 + frontend/src/Indexer/NoIndexer.css.d.ts | 8 + frontend/src/Indexer/Stats/Stats.css.d.ts | 8 + .../Mobile/SearchIndexOverview.css.d.ts | 14 + .../Mobile/SearchIndexOverviews.css.d.ts | 9 + frontend/src/Search/NoSearchResults.css.d.ts | 7 + .../src/Search/QueryParameterModal.css.d.ts | 11 + .../src/Search/QueryParameterOption.css.d.ts | 13 + frontend/src/Search/SearchFooter.css.d.ts | 13 + .../src/Search/SearchFooterLabel.css.d.ts | 8 + frontend/src/Search/SearchIndex.css.d.ts | 12 + frontend/src/Search/SearchIndex.js | 16 +- frontend/src/Search/SearchIndexConnector.js | 5 - .../src/Search/Table/ProtocolLabel.css.d.ts | 8 + .../Search/Table/SearchIndexHeader.css.d.ts | 17 + .../src/Search/Table/SearchIndexRow.css.d.ts | 21 + .../Search/Table/SearchIndexTable.css.d.ts | 7 + .../Settings/AdvancedSettingsButton.css.d.ts | 13 + .../Applications/AddApplicationItem.css.d.ts | 13 + .../AddApplicationModalContent.css.d.ts | 7 + .../Applications/Application.css.d.ts | 9 + .../Applications/Applications.css.d.ts | 9 + .../EditApplicationModalContent.css.d.ts | 8 + .../AddDownloadClientItem.css.d.ts | 13 + .../AddDownloadClientModalContent.css.d.ts | 7 + .../AddCategoryModalContent.css.d.ts | 7 + .../Categories/Category.css.d.ts | 11 + .../DownloadClients/DownloadClient.css.d.ts | 9 + .../DownloadClients/DownloadClients.css.d.ts | 9 + .../EditDownloadClientModalContent.css.d.ts | 8 + .../AddIndexerProxyItem.css.d.ts | 13 + .../AddIndexerProxyModalContent.css.d.ts | 7 + .../EditIndexerProxyModalContent.css.d.ts | 8 + .../IndexerProxies/IndexerProxies.css.d.ts | 9 + .../IndexerProxies/IndexerProxy.css.d.ts | 10 + .../AddNotificationItem.css.d.ts | 13 + .../AddNotificationModalContent.css.d.ts | 7 + .../EditNotificationModalContent.css.d.ts | 8 + .../Notifications/Notification.css.d.ts | 9 + .../NotificationEventItems.css.d.ts | 7 + .../Notifications/Notifications.css.d.ts | 9 + .../Settings/Profiles/App/AppProfile.css.d.ts | 11 + .../Profiles/App/AppProfiles.css.d.ts | 9 + .../App/EditAppProfileModalContent.css.d.ts | 7 + frontend/src/Settings/Settings.css.d.ts | 8 + .../Details/TagDetailsModalContent.css.d.ts | 10 + frontend/src/Settings/Tags/Tag.css.d.ts | 8 + frontend/src/Settings/Tags/Tags.css.d.ts | 7 + frontend/src/Store/Actions/commandActions.js | 24 +- .../src/Store/Actions/indexerIndexActions.js | 32 +- .../Store/Middleware/createPersistState.js | 2 + frontend/src/Store/Migrators/migrate.js | 3 + .../createClientSideCollectionSelector.js | 9 +- .../createIndexerAppProfileSelector.js | 4 +- .../Store/Selectors/createIndexerSelector.js | 21 +- frontend/src/Store/scrollPositions.js | 2 +- frontend/src/System/Backup/BackupRow.css.d.ts | 8 + .../Backup/RestoreBackupModalContent.css.d.ts | 10 + .../Events/LogsTableDetailsModal.css.d.ts | 7 + .../src/System/Events/LogsTableRow.css.d.ts | 14 + .../Logs/Files/LogFilesTableRow.css.d.ts | 7 + .../src/System/Status/About/About.css.d.ts | 7 + .../src/System/Status/Health/Health.css.d.ts | 11 + frontend/src/System/Status/styles.css.d.ts | 8 + .../Tasks/Queued/QueuedTaskRow.css.d.ts | 15 + .../Tasks/Scheduled/ScheduledTaskRow.css.d.ts | 11 + .../src/System/Updates/UpdateChanges.css.d.ts | 7 + frontend/src/System/Updates/Updates.css.d.ts | 16 + .../Array/getIndexOfFirstCharacter.js | 4 +- .../src/Utilities/Table/toggleSelected.js | 16 +- .../src/Utilities/{mobile.js => browser.js} | 4 + frontend/src/index.css.d.ts | 7 + frontend/typings/Globals.d.ts | 10 + package.json | 8 +- .../Indexers/IndexerEditorController.cs | 4 +- .../Indexers/IndexerEditorResource.cs | 2 +- yarn.lock | 143 ++++- 314 files changed, 4927 insertions(+), 3016 deletions(-) create mode 100644 frontend/src/App/AppUpdatedModalContent.css.d.ts create mode 100644 frontend/src/App/ConnectionLostModal.css.d.ts create mode 100644 frontend/src/App/ModelBase.ts create mode 100644 frontend/src/App/SelectContext.tsx create mode 100644 frontend/src/Components/Alert.css.d.ts create mode 100644 frontend/src/Components/Card.css.d.ts create mode 100644 frontend/src/Components/DescriptionList/DescriptionList.css.d.ts create mode 100644 frontend/src/Components/DescriptionList/DescriptionListItemDescription.css.d.ts create mode 100644 frontend/src/Components/DescriptionList/DescriptionListItemTitle.css.d.ts create mode 100644 frontend/src/Components/DragPreviewLayer.css.d.ts create mode 100644 frontend/src/Components/Error/ErrorBoundaryError.css.d.ts delete mode 100644 frontend/src/Components/Error/ErrorBoundaryError.js create mode 100644 frontend/src/Components/Error/ErrorBoundaryError.tsx create mode 100644 frontend/src/Components/FieldSet.css.d.ts create mode 100644 frontend/src/Components/FileBrowser/FileBrowserModal.css.d.ts create mode 100644 frontend/src/Components/FileBrowser/FileBrowserModalContent.css.d.ts create mode 100644 frontend/src/Components/FileBrowser/FileBrowserRow.css.d.ts create mode 100644 frontend/src/Components/Filter/Builder/DateFilterBuilderRowValue.css.d.ts create mode 100644 frontend/src/Components/Filter/Builder/FilterBuilderModalContent.css.d.ts create mode 100644 frontend/src/Components/Filter/Builder/FilterBuilderRow.css.d.ts create mode 100644 frontend/src/Components/Filter/Builder/FilterBuilderRowValueTag.css.d.ts create mode 100644 frontend/src/Components/Filter/CustomFilters/CustomFilter.css.d.ts create mode 100644 frontend/src/Components/Filter/CustomFilters/CustomFiltersModalContent.css.d.ts create mode 100644 frontend/src/Components/Form/AutoSuggestInput.css.d.ts create mode 100644 frontend/src/Components/Form/CaptchaInput.css.d.ts create mode 100644 frontend/src/Components/Form/CheckInput.css.d.ts create mode 100644 frontend/src/Components/Form/DeviceInput.css.d.ts create mode 100644 frontend/src/Components/Form/EnhancedSelectInput.css.d.ts create mode 100644 frontend/src/Components/Form/EnhancedSelectInputOption.css.d.ts create mode 100644 frontend/src/Components/Form/EnhancedSelectInputSelectedValue.css.d.ts create mode 100644 frontend/src/Components/Form/Form.css.d.ts create mode 100644 frontend/src/Components/Form/FormGroup.css.d.ts create mode 100644 frontend/src/Components/Form/FormInputButton.css.d.ts create mode 100644 frontend/src/Components/Form/FormInputGroup.css.d.ts create mode 100644 frontend/src/Components/Form/FormInputHelpText.css.d.ts create mode 100644 frontend/src/Components/Form/FormLabel.css.d.ts create mode 100644 frontend/src/Components/Form/HintedSelectInputOption.css.d.ts create mode 100644 frontend/src/Components/Form/HintedSelectInputSelectedValue.css.d.ts create mode 100644 frontend/src/Components/Form/KeyValueListInput.css.d.ts create mode 100644 frontend/src/Components/Form/KeyValueListInputItem.css.d.ts create mode 100644 frontend/src/Components/Form/PasswordInput.css.d.ts create mode 100644 frontend/src/Components/Form/PathInput.css.d.ts create mode 100644 frontend/src/Components/Form/SelectInput.css.d.ts create mode 100644 frontend/src/Components/Form/TagInput.css.d.ts create mode 100644 frontend/src/Components/Form/TagInputInput.css.d.ts create mode 100644 frontend/src/Components/Form/TagInputTag.css.d.ts create mode 100644 frontend/src/Components/Form/TextArea.css.d.ts create mode 100644 frontend/src/Components/Form/TextInput.css.d.ts create mode 100644 frontend/src/Components/Icon.css.d.ts create mode 100644 frontend/src/Components/Label.css.d.ts create mode 100644 frontend/src/Components/Link/Button.css.d.ts create mode 100644 frontend/src/Components/Link/ClipboardButton.css.d.ts create mode 100644 frontend/src/Components/Link/IconButton.css.d.ts create mode 100644 frontend/src/Components/Link/Link.css.d.ts create mode 100644 frontend/src/Components/Link/SpinnerButton.css.d.ts create mode 100644 frontend/src/Components/Link/SpinnerErrorButton.css.d.ts create mode 100644 frontend/src/Components/Loading/LoadingIndicator.css.d.ts create mode 100644 frontend/src/Components/Loading/LoadingMessage.css.d.ts create mode 100644 frontend/src/Components/Menu/FilterMenu.css.d.ts create mode 100644 frontend/src/Components/Menu/Menu.css.d.ts create mode 100644 frontend/src/Components/Menu/MenuButton.css.d.ts create mode 100644 frontend/src/Components/Menu/MenuContent.css.d.ts create mode 100644 frontend/src/Components/Menu/MenuItem.css.d.ts create mode 100644 frontend/src/Components/Menu/MenuItemSeparator.css.d.ts create mode 100644 frontend/src/Components/Menu/SelectedMenuItem.css.d.ts create mode 100644 frontend/src/Components/Menu/ToolbarMenuButton.css.d.ts create mode 100644 frontend/src/Components/Modal/Modal.css.d.ts create mode 100644 frontend/src/Components/Modal/ModalBody.css.d.ts create mode 100644 frontend/src/Components/Modal/ModalContent.css.d.ts create mode 100644 frontend/src/Components/Modal/ModalError.css.d.ts create mode 100644 frontend/src/Components/Modal/ModalFooter.css.d.ts create mode 100644 frontend/src/Components/Modal/ModalHeader.css.d.ts create mode 100644 frontend/src/Components/NotFound.css.d.ts create mode 100644 frontend/src/Components/Page/ErrorPage.css.d.ts create mode 100644 frontend/src/Components/Page/Header/IndexerSearchInput.css.d.ts create mode 100644 frontend/src/Components/Page/Header/IndexerSearchResult.css.d.ts create mode 100644 frontend/src/Components/Page/Header/KeyboardShortcutsModalContent.css.d.ts create mode 100644 frontend/src/Components/Page/Header/PageHeader.css.d.ts create mode 100644 frontend/src/Components/Page/Header/PageHeaderActionsMenu.css.d.ts create mode 100644 frontend/src/Components/Page/LoadingPage.css.d.ts create mode 100644 frontend/src/Components/Page/Page.css.d.ts create mode 100644 frontend/src/Components/Page/PageContent.css.d.ts create mode 100644 frontend/src/Components/Page/PageContentBody.css.d.ts delete mode 100644 frontend/src/Components/Page/PageContentBody.js create mode 100644 frontend/src/Components/Page/PageContentBody.tsx create mode 100644 frontend/src/Components/Page/PageContentError.css.d.ts create mode 100644 frontend/src/Components/Page/PageContentFooter.css.d.ts create mode 100644 frontend/src/Components/Page/PageJumpBar.css.d.ts create mode 100644 frontend/src/Components/Page/PageJumpBarItem.css.d.ts create mode 100644 frontend/src/Components/Page/Sidebar/Messages/Message.css.d.ts create mode 100644 frontend/src/Components/Page/Sidebar/Messages/Messages.css.d.ts create mode 100644 frontend/src/Components/Page/Sidebar/PageSidebar.css.d.ts create mode 100644 frontend/src/Components/Page/Sidebar/PageSidebarItem.css.d.ts create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbar.css.d.ts create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbarButton.css.d.ts create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbarOverflowMenuItem.css create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbarOverflowMenuItem.css.d.ts create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbarOverflowMenuItem.tsx create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbarSection.css.d.ts create mode 100644 frontend/src/Components/Page/Toolbar/PageToolbarSeparator.css.d.ts create mode 100644 frontend/src/Components/ProgressBar.css.d.ts create mode 100644 frontend/src/Components/Scroller/OverlayScroller.css.d.ts create mode 100644 frontend/src/Components/Scroller/Scroller.css.d.ts delete mode 100644 frontend/src/Components/Scroller/Scroller.js create mode 100644 frontend/src/Components/Scroller/Scroller.tsx create mode 100644 frontend/src/Components/Table/Cells/RelativeDateCell.css.d.ts create mode 100644 frontend/src/Components/Table/Cells/TableRowCell.css.d.ts create mode 100644 frontend/src/Components/Table/Cells/VirtualTableRowCell.css.d.ts create mode 100644 frontend/src/Components/Table/Cells/VirtualTableSelectCell.css.d.ts create mode 100644 frontend/src/Components/Table/Column.ts create mode 100644 frontend/src/Components/Table/Table.css.d.ts create mode 100644 frontend/src/Components/Table/TableHeaderCell.css.d.ts create mode 100644 frontend/src/Components/Table/TableOptions/TableOptionsColumn.css.d.ts create mode 100644 frontend/src/Components/Table/TableOptions/TableOptionsColumnDragPreview.css.d.ts create mode 100644 frontend/src/Components/Table/TableOptions/TableOptionsColumnDragSource.css.d.ts create mode 100644 frontend/src/Components/Table/TableOptions/TableOptionsModal.css.d.ts create mode 100644 frontend/src/Components/Table/TablePager.css.d.ts create mode 100644 frontend/src/Components/Table/TableRow.css.d.ts create mode 100644 frontend/src/Components/Table/TableRowButton.css.d.ts create mode 100644 frontend/src/Components/Table/TableSelectAllHeaderCell.css.d.ts create mode 100644 frontend/src/Components/Table/VirtualTable.css.d.ts create mode 100644 frontend/src/Components/Table/VirtualTableHeader.css.d.ts create mode 100644 frontend/src/Components/Table/VirtualTableHeaderCell.css.d.ts create mode 100644 frontend/src/Components/Table/VirtualTableRow.css.d.ts create mode 100644 frontend/src/Components/Table/VirtualTableSelectAllHeaderCell.css.d.ts create mode 100644 frontend/src/Components/TagList.css.d.ts create mode 100644 frontend/src/Components/Tooltip/Popover.css.d.ts create mode 100644 frontend/src/Components/Tooltip/Tooltip.css.d.ts delete mode 100644 frontend/src/Components/withScrollPosition.js create mode 100644 frontend/src/Components/withScrollPosition.tsx create mode 100644 frontend/src/FirstRun/AuthenticationRequiredModalContent.css.d.ts create mode 100644 frontend/src/Helpers/Hooks/useMeasure.ts create mode 100644 frontend/src/Helpers/Props/ScrollDirection.ts create mode 100644 frontend/src/Helpers/Props/SortDirection.ts create mode 100644 frontend/src/History/Details/HistoryDetails.css.d.ts create mode 100644 frontend/src/History/Details/HistoryDetailsModal.css.d.ts create mode 100644 frontend/src/History/HistoryEventTypeCell.css.d.ts create mode 100644 frontend/src/History/HistoryRow.css.d.ts create mode 100644 frontend/src/History/HistoryRowParameter.css.d.ts create mode 100644 frontend/src/Indexer/Add/AddIndexerModal.css.d.ts create mode 100644 frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts create mode 100644 frontend/src/Indexer/Add/SelectIndexerRow.css.d.ts create mode 100644 frontend/src/Indexer/Edit/EditIndexerModalContent.css.d.ts delete mode 100644 frontend/src/Indexer/Editor/Delete/DeleteIndexerModal.js delete mode 100644 frontend/src/Indexer/Editor/Delete/DeleteIndexerModalContent.js delete mode 100644 frontend/src/Indexer/Editor/Delete/DeleteIndexerModalContentConnector.js delete mode 100644 frontend/src/Indexer/Editor/IndexerEditorFooter.css delete mode 100644 frontend/src/Indexer/Editor/IndexerEditorFooter.js delete mode 100644 frontend/src/Indexer/Editor/IndexerEditorFooterLabel.css delete mode 100644 frontend/src/Indexer/Editor/IndexerEditorFooterLabel.js delete mode 100644 frontend/src/Indexer/Editor/Tags/TagsModal.js delete mode 100644 frontend/src/Indexer/Editor/Tags/TagsModalContent.js delete mode 100644 frontend/src/Indexer/Editor/Tags/TagsModalContentConnector.js create mode 100644 frontend/src/Indexer/Index/IndexerIndex.css.d.ts delete mode 100644 frontend/src/Indexer/Index/IndexerIndex.js create mode 100644 frontend/src/Indexer/Index/IndexerIndex.tsx delete mode 100644 frontend/src/Indexer/Index/IndexerIndexConnector.js create mode 100644 frontend/src/Indexer/Index/IndexerIndexFilterModal.tsx delete mode 100644 frontend/src/Indexer/Index/IndexerIndexFilterModalConnector.js create mode 100644 frontend/src/Indexer/Index/IndexerIndexFooter.css.d.ts delete mode 100644 frontend/src/Indexer/Index/IndexerIndexFooter.js create mode 100644 frontend/src/Indexer/Index/IndexerIndexFooter.tsx delete mode 100644 frontend/src/Indexer/Index/IndexerIndexFooterConnector.js delete mode 100644 frontend/src/Indexer/Index/IndexerIndexItemConnector.js rename frontend/src/Indexer/Index/Menus/{IndexerIndexFilterMenu.js => IndexerIndexFilterMenu.tsx} (75%) rename frontend/src/Indexer/Index/Menus/{IndexerIndexSortMenu.js => IndexerIndexSortMenu.tsx} (91%) create mode 100644 frontend/src/Indexer/Index/Select/Delete/DeleteIndexerModal.tsx rename frontend/src/Indexer/{Editor => Index/Select}/Delete/DeleteIndexerModalContent.css (100%) create mode 100644 frontend/src/Indexer/Index/Select/Delete/DeleteIndexerModalContent.css.d.ts create mode 100644 frontend/src/Indexer/Index/Select/Delete/DeleteIndexerModalContent.tsx create mode 100644 frontend/src/Indexer/Index/Select/Edit/EditIndexerModal.tsx create mode 100644 frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.css create mode 100644 frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.css.d.ts create mode 100644 frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectAllButton.tsx create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectAllMenuItem.tsx create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectFooter.css create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectFooter.css.d.ts create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectFooter.tsx create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectModeButton.tsx create mode 100644 frontend/src/Indexer/Index/Select/IndexerIndexSelectModeMenuItem.tsx create mode 100644 frontend/src/Indexer/Index/Select/Tags/TagsModal.tsx rename frontend/src/Indexer/{Editor => Index/Select}/Tags/TagsModalContent.css (100%) create mode 100644 frontend/src/Indexer/Index/Select/Tags/TagsModalContent.css.d.ts create mode 100644 frontend/src/Indexer/Index/Select/Tags/TagsModalContent.tsx delete mode 100644 frontend/src/Indexer/Index/Table/CapabilitiesLabel.js create mode 100644 frontend/src/Indexer/Index/Table/CapabilitiesLabel.tsx delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexActionsCell.js delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexHeader.js delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexHeaderConnector.js create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexRow.css.d.ts delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexRow.js create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexRow.tsx create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTable.css.d.ts delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTable.js create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTable.tsx delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTableConnector.js rename frontend/src/Indexer/Index/Table/{IndexerIndexHeader.css => IndexerIndexTableHeader.css} (100%) create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTableHeader.css.d.ts create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTableHeader.tsx delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTableOptions.js create mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTableOptions.tsx delete mode 100644 frontend/src/Indexer/Index/Table/IndexerIndexTableOptionsConnector.js create mode 100644 frontend/src/Indexer/Index/Table/IndexerStatusCell.css.d.ts delete mode 100644 frontend/src/Indexer/Index/Table/IndexerStatusCell.js create mode 100644 frontend/src/Indexer/Index/Table/IndexerStatusCell.tsx create mode 100644 frontend/src/Indexer/Index/Table/ProtocolLabel.css.d.ts delete mode 100644 frontend/src/Indexer/Index/Table/ProtocolLabel.js create mode 100644 frontend/src/Indexer/Index/Table/ProtocolLabel.tsx create mode 100644 frontend/src/Indexer/Index/Table/selectTableOptions.ts create mode 100644 frontend/src/Indexer/Index/createIndexerIndexItemSelector.ts create mode 100644 frontend/src/Indexer/Indexer.ts create mode 100644 frontend/src/Indexer/Info/IndexerInfoModalContent.css.d.ts create mode 100644 frontend/src/Indexer/NoIndexer.css.d.ts create mode 100644 frontend/src/Indexer/Stats/Stats.css.d.ts create mode 100644 frontend/src/Search/Mobile/SearchIndexOverview.css.d.ts create mode 100644 frontend/src/Search/Mobile/SearchIndexOverviews.css.d.ts create mode 100644 frontend/src/Search/NoSearchResults.css.d.ts create mode 100644 frontend/src/Search/QueryParameterModal.css.d.ts create mode 100644 frontend/src/Search/QueryParameterOption.css.d.ts create mode 100644 frontend/src/Search/SearchFooter.css.d.ts create mode 100644 frontend/src/Search/SearchFooterLabel.css.d.ts create mode 100644 frontend/src/Search/SearchIndex.css.d.ts create mode 100644 frontend/src/Search/Table/ProtocolLabel.css.d.ts create mode 100644 frontend/src/Search/Table/SearchIndexHeader.css.d.ts create mode 100644 frontend/src/Search/Table/SearchIndexRow.css.d.ts create mode 100644 frontend/src/Search/Table/SearchIndexTable.css.d.ts create mode 100644 frontend/src/Settings/AdvancedSettingsButton.css.d.ts create mode 100644 frontend/src/Settings/Applications/Applications/AddApplicationItem.css.d.ts create mode 100644 frontend/src/Settings/Applications/Applications/AddApplicationModalContent.css.d.ts create mode 100644 frontend/src/Settings/Applications/Applications/Application.css.d.ts create mode 100644 frontend/src/Settings/Applications/Applications/Applications.css.d.ts create mode 100644 frontend/src/Settings/Applications/Applications/EditApplicationModalContent.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/AddDownloadClientItem.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/AddDownloadClientModalContent.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/Categories/AddCategoryModalContent.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/Categories/Category.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/DownloadClient.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/DownloadClients.css.d.ts create mode 100644 frontend/src/Settings/DownloadClients/DownloadClients/EditDownloadClientModalContent.css.d.ts create mode 100644 frontend/src/Settings/Indexers/IndexerProxies/AddIndexerProxyItem.css.d.ts create mode 100644 frontend/src/Settings/Indexers/IndexerProxies/AddIndexerProxyModalContent.css.d.ts create mode 100644 frontend/src/Settings/Indexers/IndexerProxies/EditIndexerProxyModalContent.css.d.ts create mode 100644 frontend/src/Settings/Indexers/IndexerProxies/IndexerProxies.css.d.ts create mode 100644 frontend/src/Settings/Indexers/IndexerProxies/IndexerProxy.css.d.ts create mode 100644 frontend/src/Settings/Notifications/Notifications/AddNotificationItem.css.d.ts create mode 100644 frontend/src/Settings/Notifications/Notifications/AddNotificationModalContent.css.d.ts create mode 100644 frontend/src/Settings/Notifications/Notifications/EditNotificationModalContent.css.d.ts create mode 100644 frontend/src/Settings/Notifications/Notifications/Notification.css.d.ts create mode 100644 frontend/src/Settings/Notifications/Notifications/NotificationEventItems.css.d.ts create mode 100644 frontend/src/Settings/Notifications/Notifications/Notifications.css.d.ts create mode 100644 frontend/src/Settings/Profiles/App/AppProfile.css.d.ts create mode 100644 frontend/src/Settings/Profiles/App/AppProfiles.css.d.ts create mode 100644 frontend/src/Settings/Profiles/App/EditAppProfileModalContent.css.d.ts create mode 100644 frontend/src/Settings/Settings.css.d.ts create mode 100644 frontend/src/Settings/Tags/Details/TagDetailsModalContent.css.d.ts create mode 100644 frontend/src/Settings/Tags/Tag.css.d.ts create mode 100644 frontend/src/Settings/Tags/Tags.css.d.ts create mode 100644 frontend/src/Store/Migrators/migrate.js create mode 100644 frontend/src/System/Backup/BackupRow.css.d.ts create mode 100644 frontend/src/System/Backup/RestoreBackupModalContent.css.d.ts create mode 100644 frontend/src/System/Events/LogsTableDetailsModal.css.d.ts create mode 100644 frontend/src/System/Events/LogsTableRow.css.d.ts create mode 100644 frontend/src/System/Logs/Files/LogFilesTableRow.css.d.ts create mode 100644 frontend/src/System/Status/About/About.css.d.ts create mode 100644 frontend/src/System/Status/Health/Health.css.d.ts create mode 100644 frontend/src/System/Status/styles.css.d.ts create mode 100644 frontend/src/System/Tasks/Queued/QueuedTaskRow.css.d.ts create mode 100644 frontend/src/System/Tasks/Scheduled/ScheduledTaskRow.css.d.ts create mode 100644 frontend/src/System/Updates/UpdateChanges.css.d.ts create mode 100644 frontend/src/System/Updates/Updates.css.d.ts rename frontend/src/Utilities/{mobile.js => browser.js} (69%) create mode 100644 frontend/src/index.css.d.ts diff --git a/frontend/src/App/AppRoutes.js b/frontend/src/App/AppRoutes.js index bf08d82b1..0df7d2a49 100644 --- a/frontend/src/App/AppRoutes.js +++ b/frontend/src/App/AppRoutes.js @@ -4,7 +4,7 @@ import { Redirect, Route } from 'react-router-dom'; import NotFound from 'Components/NotFound'; import Switch from 'Components/Router/Switch'; import HistoryConnector from 'History/HistoryConnector'; -import IndexerIndexConnector from 'Indexer/Index/IndexerIndexConnector'; +import IndexerIndex from 'Indexer/Index/IndexerIndex'; import StatsConnector from 'Indexer/Stats/StatsConnector'; import SearchIndexConnector from 'Search/SearchIndexConnector'; import ApplicationSettingsConnector from 'Settings/Applications/ApplicationSettingsConnector'; @@ -38,7 +38,7 @@ function AppRoutes(props) { { diff --git a/frontend/src/App/AppUpdatedModalContent.css.d.ts b/frontend/src/App/AppUpdatedModalContent.css.d.ts new file mode 100644 index 000000000..70ddbf6a1 --- /dev/null +++ b/frontend/src/App/AppUpdatedModalContent.css.d.ts @@ -0,0 +1,9 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'changes': string; + 'maintenance': string; + 'version': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/App/ConnectionLostModal.css.d.ts b/frontend/src/App/ConnectionLostModal.css.d.ts new file mode 100644 index 000000000..027f2a9a3 --- /dev/null +++ b/frontend/src/App/ConnectionLostModal.css.d.ts @@ -0,0 +1,7 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'automatic': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/App/ModelBase.ts b/frontend/src/App/ModelBase.ts new file mode 100644 index 000000000..187b12fb2 --- /dev/null +++ b/frontend/src/App/ModelBase.ts @@ -0,0 +1,5 @@ +interface ModelBase { + id: number; +} + +export default ModelBase; diff --git a/frontend/src/App/SelectContext.tsx b/frontend/src/App/SelectContext.tsx new file mode 100644 index 000000000..6980129c1 --- /dev/null +++ b/frontend/src/App/SelectContext.tsx @@ -0,0 +1,163 @@ +import { cloneDeep } from 'lodash'; +import React, { useEffect } from 'react'; +import areAllSelected from 'Utilities/Table/areAllSelected'; +import selectAll from 'Utilities/Table/selectAll'; +import toggleSelected from 'Utilities/Table/toggleSelected'; +import ModelBase from './ModelBase'; + +export enum SelectActionType { + Reset, + SelectAll, + UnselectAll, + ToggleSelected, + RemoveItem, + UpdateItems, +} + +type SelectedState = Record; + +interface SelectState { + selectedState: SelectedState; + lastToggled: number | null; + allSelected: boolean; + allUnselected: boolean; + // eslint-disable-next-line @typescript-eslint/no-explicit-any + items: any[]; +} + +type SelectAction = + | { type: SelectActionType.Reset } + | { type: SelectActionType.SelectAll } + | { type: SelectActionType.UnselectAll } + | { + type: SelectActionType.ToggleSelected; + id: number; + isSelected: boolean; + shiftKey: boolean; + } + | { + type: SelectActionType.RemoveItem; + id: number; + } + | { + type: SelectActionType.UpdateItems; + items: ModelBase[]; + }; + +type Dispatch = (action: SelectAction) => void; + +const initialState = { + selectedState: {}, + lastToggled: null, + allSelected: false, + allUnselected: true, + items: [], +}; + +interface SelectProviderOptions { + // eslint-disable-next-line @typescript-eslint/no-explicit-any + children: any; + items: Array; +} + +function getSelectedState(items: ModelBase[], existingState: SelectedState) { + return items.reduce((acc: SelectedState, item) => { + const id = item.id; + + acc[id] = existingState[id] ?? false; + + return acc; + }, {}); +} + +// TODO: Can this be reused? + +const SelectContext = React.createContext<[SelectState, Dispatch] | undefined>( + cloneDeep(undefined) +); + +function selectReducer(state: SelectState, action: SelectAction): SelectState { + const { items, selectedState } = state; + + switch (action.type) { + case SelectActionType.Reset: { + return cloneDeep(initialState); + } + case SelectActionType.SelectAll: { + return { + items, + ...selectAll(selectedState, true), + }; + } + case SelectActionType.UnselectAll: { + return { + items, + ...selectAll(selectedState, false), + }; + } + case SelectActionType.ToggleSelected: { + const result = { + items, + ...toggleSelected( + state, + items, + action.id, + action.isSelected, + action.shiftKey + ), + }; + + return result; + } + case SelectActionType.UpdateItems: { + const nextSelectedState = getSelectedState(action.items, selectedState); + + return { + ...state, + ...areAllSelected(nextSelectedState), + selectedState: nextSelectedState, + items: action.items, + }; + } + default: { + throw new Error(`Unhandled action type: ${action.type}`); + } + } +} + +export function SelectProvider( + props: SelectProviderOptions +) { + const { items } = props; + const selectedState = getSelectedState(items, {}); + + const [state, dispatch] = React.useReducer(selectReducer, { + selectedState, + lastToggled: null, + allSelected: false, + allUnselected: true, + items, + }); + + const value: [SelectState, Dispatch] = [state, dispatch]; + + useEffect(() => { + dispatch({ type: SelectActionType.UpdateItems, items }); + }, [items]); + + return ( + + {props.children} + + ); +} + +export function useSelect() { + const context = React.useContext(SelectContext); + + if (context === undefined) { + throw new Error('useSelect must be used within a SelectProvider'); + } + + return context; +} diff --git a/frontend/src/Components/Alert.css.d.ts b/frontend/src/Components/Alert.css.d.ts new file mode 100644 index 000000000..daffec2e6 --- /dev/null +++ b/frontend/src/Components/Alert.css.d.ts @@ -0,0 +1,11 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'alert': string; + 'danger': string; + 'info': string; + 'success': string; + 'warning': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Alert.js b/frontend/src/Components/Alert.js index 10f124c78..418cbf5e6 100644 --- a/frontend/src/Components/Alert.js +++ b/frontend/src/Components/Alert.js @@ -4,7 +4,9 @@ import React from 'react'; import { kinds } from 'Helpers/Props'; import styles from './Alert.css'; -function Alert({ className, kind, children, ...otherProps }) { +function Alert(props) { + const { className, kind, children, ...otherProps } = props; + return (
-
- {message} -
- -
- -
- -
- { - error && -
- {error.toString()} -
- } - -
- {info.componentStack} -
-
-
- ); -} - -ErrorBoundaryError.propTypes = { - className: PropTypes.string.isRequired, - messageClassName: PropTypes.string.isRequired, - detailsClassName: PropTypes.string.isRequired, - message: PropTypes.string.isRequired, - error: PropTypes.object.isRequired, - info: PropTypes.object.isRequired -}; - -ErrorBoundaryError.defaultProps = { - className: styles.container, - messageClassName: styles.message, - detailsClassName: styles.details, - message: 'There was an error loading this content' -}; - -export default ErrorBoundaryError; diff --git a/frontend/src/Components/Error/ErrorBoundaryError.tsx b/frontend/src/Components/Error/ErrorBoundaryError.tsx new file mode 100644 index 000000000..b3db237b1 --- /dev/null +++ b/frontend/src/Components/Error/ErrorBoundaryError.tsx @@ -0,0 +1,74 @@ +import React, { useEffect, useState } from 'react'; +import StackTrace from 'stacktrace-js'; +import styles from './ErrorBoundaryError.css'; + +interface ErrorBoundaryErrorProps { + className: string; + messageClassName: string; + detailsClassName: string; + message: string; + error: Error; + info: { + componentStack: string; + }; +} + +function ErrorBoundaryError(props: ErrorBoundaryErrorProps) { + const { + className = styles.container, + messageClassName = styles.message, + detailsClassName = styles.details, + message = 'There was an error loading this content', + error, + info, + } = props; + + const [detailedError, setDetailedError] = useState(null); + + useEffect(() => { + if (error) { + StackTrace.fromError(error).then((de) => { + setDetailedError(de); + }); + } else { + setDetailedError(null); + } + }, [error, setDetailedError]); + + return ( +
+
{message}
+ +
+ +
+ +
+ {error ?
{error.message}
: null} + + {detailedError ? ( + detailedError.map((d, index) => { + return ( +
+ {` at ${d.functionName} (${d.fileName}:${d.lineNumber}:${d.columnNumber})`} +
+ ); + }) + ) : ( +
{info.componentStack}
+ )} + + { +
+ Version: {window.Prowlarr.version} +
+ } +
+
+ ); +} + +export default ErrorBoundaryError; diff --git a/frontend/src/Components/FieldSet.css.d.ts b/frontend/src/Components/FieldSet.css.d.ts new file mode 100644 index 000000000..b669ac6d0 --- /dev/null +++ b/frontend/src/Components/FieldSet.css.d.ts @@ -0,0 +1,8 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'fieldSet': string; + 'legend': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/FileBrowser/FileBrowserModal.css.d.ts b/frontend/src/Components/FileBrowser/FileBrowserModal.css.d.ts new file mode 100644 index 000000000..5d00cca7e --- /dev/null +++ b/frontend/src/Components/FileBrowser/FileBrowserModal.css.d.ts @@ -0,0 +1,7 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'modal': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/FileBrowser/FileBrowserModalContent.css.d.ts b/frontend/src/Components/FileBrowser/FileBrowserModalContent.css.d.ts new file mode 100644 index 000000000..e83c13075 --- /dev/null +++ b/frontend/src/Components/FileBrowser/FileBrowserModalContent.css.d.ts @@ -0,0 +1,12 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'faqLink': string; + 'loading': string; + 'mappedDrivesWarning': string; + 'modalBody': string; + 'pathInput': string; + 'scroller': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/FileBrowser/FileBrowserRow.css.d.ts b/frontend/src/Components/FileBrowser/FileBrowserRow.css.d.ts new file mode 100644 index 000000000..127d00928 --- /dev/null +++ b/frontend/src/Components/FileBrowser/FileBrowserRow.css.d.ts @@ -0,0 +1,7 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'type': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Filter/Builder/DateFilterBuilderRowValue.css.d.ts b/frontend/src/Components/Filter/Builder/DateFilterBuilderRowValue.css.d.ts new file mode 100644 index 000000000..d391a1f30 --- /dev/null +++ b/frontend/src/Components/Filter/Builder/DateFilterBuilderRowValue.css.d.ts @@ -0,0 +1,9 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'container': string; + 'numberInput': string; + 'selectInput': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Filter/Builder/FilterBuilderModalContent.css.d.ts b/frontend/src/Components/Filter/Builder/FilterBuilderModalContent.css.d.ts new file mode 100644 index 000000000..033d2edca --- /dev/null +++ b/frontend/src/Components/Filter/Builder/FilterBuilderModalContent.css.d.ts @@ -0,0 +1,10 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'label': string; + 'labelContainer': string; + 'labelInputContainer': string; + 'rows': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Filter/Builder/FilterBuilderRow.css.d.ts b/frontend/src/Components/Filter/Builder/FilterBuilderRow.css.d.ts new file mode 100644 index 000000000..aba698af4 --- /dev/null +++ b/frontend/src/Components/Filter/Builder/FilterBuilderRow.css.d.ts @@ -0,0 +1,10 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'actionsContainer': string; + 'filterRow': string; + 'inputContainer': string; + 'valueInputContainer': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Filter/Builder/FilterBuilderRowValueTag.css.d.ts b/frontend/src/Components/Filter/Builder/FilterBuilderRowValueTag.css.d.ts new file mode 100644 index 000000000..80bcf1464 --- /dev/null +++ b/frontend/src/Components/Filter/Builder/FilterBuilderRowValueTag.css.d.ts @@ -0,0 +1,10 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'isLastTag': string; + 'label': string; + 'or': string; + 'tag': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Filter/CustomFilters/CustomFilter.css.d.ts b/frontend/src/Components/Filter/CustomFilters/CustomFilter.css.d.ts new file mode 100644 index 000000000..af5bfa967 --- /dev/null +++ b/frontend/src/Components/Filter/CustomFilters/CustomFilter.css.d.ts @@ -0,0 +1,9 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'actions': string; + 'customFilter': string; + 'label': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Filter/CustomFilters/CustomFiltersModalContent.css.d.ts b/frontend/src/Components/Filter/CustomFilters/CustomFiltersModalContent.css.d.ts new file mode 100644 index 000000000..b505d0767 --- /dev/null +++ b/frontend/src/Components/Filter/CustomFilters/CustomFiltersModalContent.css.d.ts @@ -0,0 +1,7 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'addButtonContainer': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/AutoSuggestInput.css.d.ts b/frontend/src/Components/Form/AutoSuggestInput.css.d.ts new file mode 100644 index 000000000..2b8f51924 --- /dev/null +++ b/frontend/src/Components/Form/AutoSuggestInput.css.d.ts @@ -0,0 +1,15 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'hasError': string; + 'hasWarning': string; + 'input': string; + 'inputContainer': string; + 'suggestion': string; + 'suggestionHighlighted': string; + 'suggestionsContainer': string; + 'suggestionsContainerOpen': string; + 'suggestionsList': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/CaptchaInput.css.d.ts b/frontend/src/Components/Form/CaptchaInput.css.d.ts new file mode 100644 index 000000000..b6844144e --- /dev/null +++ b/frontend/src/Components/Form/CaptchaInput.css.d.ts @@ -0,0 +1,12 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'captchaInputWrapper': string; + 'hasButton': string; + 'hasError': string; + 'hasWarning': string; + 'input': string; + 'recaptchaWrapper': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/CheckInput.css.d.ts b/frontend/src/Components/Form/CheckInput.css.d.ts new file mode 100644 index 000000000..bba6b63bb --- /dev/null +++ b/frontend/src/Components/Form/CheckInput.css.d.ts @@ -0,0 +1,18 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'checkbox': string; + 'container': string; + 'dangerIsChecked': string; + 'helpText': string; + 'input': string; + 'isDisabled': string; + 'isIndeterminate': string; + 'isNotChecked': string; + 'label': string; + 'primaryIsChecked': string; + 'successIsChecked': string; + 'warningIsChecked': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/DeviceInput.css.d.ts b/frontend/src/Components/Form/DeviceInput.css.d.ts new file mode 100644 index 000000000..e44e3fce0 --- /dev/null +++ b/frontend/src/Components/Form/DeviceInput.css.d.ts @@ -0,0 +1,8 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'deviceInputWrapper': string; + 'input': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/EnhancedSelectInput.css.d.ts b/frontend/src/Components/Form/EnhancedSelectInput.css.d.ts new file mode 100644 index 000000000..edcf0079b --- /dev/null +++ b/frontend/src/Components/Form/EnhancedSelectInput.css.d.ts @@ -0,0 +1,22 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'dropdownArrowContainer': string; + 'dropdownArrowContainerDisabled': string; + 'dropdownArrowContainerEditable': string; + 'editableContainer': string; + 'enhancedSelect': string; + 'hasError': string; + 'hasWarning': string; + 'isDisabled': string; + 'loading': string; + 'mobileCloseButton': string; + 'mobileCloseButtonContainer': string; + 'options': string; + 'optionsContainer': string; + 'optionsModal': string; + 'optionsModalBody': string; + 'optionsModalScroller': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/EnhancedSelectInput.js b/frontend/src/Components/Form/EnhancedSelectInput.js index fd8e48b9b..4df54092c 100644 --- a/frontend/src/Components/Form/EnhancedSelectInput.js +++ b/frontend/src/Components/Form/EnhancedSelectInput.js @@ -12,9 +12,9 @@ import ModalBody from 'Components/Modal/ModalBody'; import Portal from 'Components/Portal'; import Scroller from 'Components/Scroller/Scroller'; import { icons, scrollDirections, sizes } from 'Helpers/Props'; +import { isMobile as isMobileUtil } from 'Utilities/browser'; import * as keyCodes from 'Utilities/Constants/keyCodes'; import getUniqueElememtId from 'Utilities/getUniqueElementId'; -import { isMobile as isMobileUtil } from 'Utilities/mobile'; import HintedSelectInputOption from './HintedSelectInputOption'; import HintedSelectInputSelectedValue from './HintedSelectInputSelectedValue'; import TextInput from './TextInput'; @@ -113,10 +113,12 @@ class EnhancedSelectInput extends Component { this._scheduleUpdate(); } - if (!Array.isArray(this.props.value) && prevProps.value !== this.props.value) { - this.setState({ - selectedIndex: getSelectedIndex(this.props) - }); + if (!Array.isArray(this.props.value)) { + if (prevProps.value !== this.props.value || prevProps.values !== this.props.values) { + this.setState({ + selectedIndex: getSelectedIndex(this.props) + }); + } } } @@ -332,6 +334,11 @@ class EnhancedSelectInput extends Component { const isMultiSelect = Array.isArray(value); const selectedOption = getSelectedOption(selectedIndex, values); + let selectedValue = value; + + if (!values.length) { + selectedValue = isMultiSelect ? [] : ''; + } return (
@@ -372,15 +379,17 @@ class EnhancedSelectInput extends Component { onPress={this.onPress} > { - isFetching && + isFetching ? + /> : + null } { - !isFetching && + isFetching ? + null : @@ -400,7 +409,7 @@ class EnhancedSelectInput extends Component { onPress={this.onPress} > { - isFetching && + isFetching ? + /> : + null } { - !isFetching && + isFetching ? + null : @@ -505,7 +516,7 @@ class EnhancedSelectInput extends Component { { - isMobile && + isMobile ? - + : + null }
); diff --git a/frontend/src/Components/Form/EnhancedSelectInputOption.css.d.ts b/frontend/src/Components/Form/EnhancedSelectInputOption.css.d.ts new file mode 100644 index 000000000..59675cd91 --- /dev/null +++ b/frontend/src/Components/Form/EnhancedSelectInputOption.css.d.ts @@ -0,0 +1,14 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'iconContainer': string; + 'isDisabled': string; + 'isHidden': string; + 'isMobile': string; + 'isSelected': string; + 'option': string; + 'optionCheck': string; + 'optionCheckInput': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/EnhancedSelectInputSelectedValue.css.d.ts b/frontend/src/Components/Form/EnhancedSelectInputSelectedValue.css.d.ts new file mode 100644 index 000000000..5377239a8 --- /dev/null +++ b/frontend/src/Components/Form/EnhancedSelectInputSelectedValue.css.d.ts @@ -0,0 +1,8 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'isDisabled': string; + 'selectedValue': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/Form.css.d.ts b/frontend/src/Components/Form/Form.css.d.ts new file mode 100644 index 000000000..178f2fec1 --- /dev/null +++ b/frontend/src/Components/Form/Form.css.d.ts @@ -0,0 +1,7 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'validationFailures': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/FormGroup.css.d.ts b/frontend/src/Components/Form/FormGroup.css.d.ts new file mode 100644 index 000000000..86145f643 --- /dev/null +++ b/frontend/src/Components/Form/FormGroup.css.d.ts @@ -0,0 +1,11 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'extraSmall': string; + 'group': string; + 'large': string; + 'medium': string; + 'small': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/FormInputButton.css.d.ts b/frontend/src/Components/Form/FormInputButton.css.d.ts new file mode 100644 index 000000000..d469cdfe3 --- /dev/null +++ b/frontend/src/Components/Form/FormInputButton.css.d.ts @@ -0,0 +1,8 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'button': string; + 'middleButton': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/FormInputGroup.css.d.ts b/frontend/src/Components/Form/FormInputGroup.css.d.ts new file mode 100644 index 000000000..267257c44 --- /dev/null +++ b/frontend/src/Components/Form/FormInputGroup.css.d.ts @@ -0,0 +1,14 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'helpLink': string; + 'inputContainer': string; + 'inputGroup': string; + 'inputGroupContainer': string; + 'inputUnit': string; + 'inputUnitNumber': string; + 'pendingChangesContainer': string; + 'pendingChangesIcon': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/FormInputGroup.js b/frontend/src/Components/Form/FormInputGroup.js index 8e39cd36a..f25946f59 100644 --- a/frontend/src/Components/Form/FormInputGroup.js +++ b/frontend/src/Components/Form/FormInputGroup.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import Link from 'Components/Link/Link'; -import { inputTypes } from 'Helpers/Props'; +import { inputTypes, kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import AppProfileSelectInputConnector from './AppProfileSelectInputConnector'; import AutoCompleteInput from './AutoCompleteInput'; @@ -253,16 +253,24 @@ FormInputGroup.propTypes = { className: PropTypes.string.isRequired, containerClassName: PropTypes.string.isRequired, inputClassName: PropTypes.string, + name: PropTypes.string.isRequired, + value: PropTypes.any, + values: PropTypes.arrayOf(PropTypes.any), type: PropTypes.string.isRequired, + kind: PropTypes.oneOf(kinds.all), unit: PropTypes.string, buttons: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]), helpText: PropTypes.string, helpTexts: PropTypes.arrayOf(PropTypes.string), helpTextWarning: PropTypes.string, helpLink: PropTypes.string, + includeNoChange: PropTypes.bool, + includeNoChangeDisabled: PropTypes.bool, + selectedValueOptions: PropTypes.object, pending: PropTypes.bool, errors: PropTypes.arrayOf(PropTypes.object), - warnings: PropTypes.arrayOf(PropTypes.object) + warnings: PropTypes.arrayOf(PropTypes.object), + onChange: PropTypes.func.isRequired }; FormInputGroup.defaultProps = { diff --git a/frontend/src/Components/Form/FormInputHelpText.css.d.ts b/frontend/src/Components/Form/FormInputHelpText.css.d.ts new file mode 100644 index 000000000..0e163f134 --- /dev/null +++ b/frontend/src/Components/Form/FormInputHelpText.css.d.ts @@ -0,0 +1,12 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'details': string; + 'helpText': string; + 'isCheckInput': string; + 'isError': string; + 'isWarning': string; + 'link': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/FormLabel.css.d.ts b/frontend/src/Components/Form/FormLabel.css.d.ts new file mode 100644 index 000000000..c23dd30a4 --- /dev/null +++ b/frontend/src/Components/Form/FormLabel.css.d.ts @@ -0,0 +1,11 @@ +// This file is automatically generated. +// Please do not change this file! +interface CssExports { + 'hasError': string; + 'isAdvanced': string; + 'label': string; + 'large': string; + 'small': string; +} +export const cssExports: CssExports; +export default cssExports; diff --git a/frontend/src/Components/Form/FormLabel.js b/frontend/src/Components/Form/FormLabel.js index d419039b3..d4a4bcffc 100644 --- a/frontend/src/Components/Form/FormLabel.js +++ b/frontend/src/Components/Form/FormLabel.js @@ -4,16 +4,18 @@ import React from 'react'; import { sizes } from 'Helpers/Props'; import styles from './FormLabel.css'; -function FormLabel({ - children, - className, - errorClassName, - size, - name, - hasError, - isAdvanced, - ...otherProps -}) { +function FormLabel(props) { + const { + children, + className, + errorClassName, + size, + name, + hasError, + isAdvanced, + ...otherProps + } = props; + return (