From 7052a7a5ec734d231301619235b20e6e0cb0257e Mon Sep 17 00:00:00 2001 From: Bogdan Date: Fri, 16 Jun 2023 23:40:40 +0300 Subject: [PATCH] New: Improved page loading errors Closes #8706 --- frontend/src/Activity/Blocklist/Blocklist.js | 9 +++++---- frontend/src/Activity/History/History.js | 11 ++++++----- frontend/src/Activity/Queue/Queue.js | 11 ++++++----- .../src/AddMovie/ImportMovie/Import/ImportMovie.js | 10 ++++++---- .../SelectFolder/ImportMovieSelectFolder.js | 4 ++-- frontend/src/Calendar/Calendar.js | 6 ++++-- frontend/src/Collection/Collection.js | 7 ++++--- frontend/src/Components/Page/PageSectionContent.js | 4 +++- frontend/src/DiscoverMovie/DiscoverMovie.js | 7 ++++--- .../Language/SelectLanguageModalContent.tsx | 5 ++++- .../Quality/SelectQualityModalContent.tsx | 5 ++++- frontend/src/Movie/Index/MovieIndex.tsx | 7 +++++-- frontend/src/MovieFile/Edit/FileEditModalContent.js | 5 +++-- .../MovieFile/Quality/SelectQualityModalContent.js | 5 +++-- frontend/src/RootFolder/RootFolders.js | 6 ++++-- .../CustomFormats/ExportCustomFormatModalContent.js | 5 +++-- .../CustomFormats/ImportCustomFormatModalContent.js | 7 ++++--- .../DownloadClients/Options/DownloadClientOptions.js | 4 ++-- frontend/src/Settings/General/GeneralSettings.js | 5 +++-- .../Settings/ImportLists/Options/ImportListOptions.js | 7 ++++--- .../src/Settings/Indexers/Options/IndexerOptions.js | 7 ++++--- .../src/Settings/MediaManagement/MediaManagement.js | 7 ++++--- .../src/Settings/MediaManagement/Naming/Naming.js | 7 ++++--- .../src/Settings/Metadata/Options/MetadataOptions.js | 7 ++++--- frontend/src/Settings/UI/UISettings.js | 7 ++++--- frontend/src/System/Backup/Backups.js | 11 ++++++----- 26 files changed, 105 insertions(+), 71 deletions(-) diff --git a/frontend/src/Activity/Blocklist/Blocklist.js b/frontend/src/Activity/Blocklist/Blocklist.js index e5f653ec9..39150b1fb 100644 --- a/frontend/src/Activity/Blocklist/Blocklist.js +++ b/frontend/src/Activity/Blocklist/Blocklist.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import ConfirmModal from 'Components/Modal/ConfirmModal'; import PageContent from 'Components/Page/PageContent'; @@ -156,16 +157,16 @@ class Blocklist extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadBlocklist')} -
+ } { isPopulated && !error && !items.length && -
+ {translate('NoHistoryBlocklist')} -
+ } { diff --git a/frontend/src/Activity/History/History.js b/frontend/src/Activity/History/History.js index 770f5569e..b8309ba2a 100644 --- a/frontend/src/Activity/History/History.js +++ b/frontend/src/Activity/History/History.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import FilterMenu from 'Components/Menu/FilterMenu'; import PageContent from 'Components/Page/PageContent'; @@ -11,7 +12,7 @@ import Table from 'Components/Table/Table'; import TableBody from 'Components/Table/TableBody'; import TableOptionsModalWrapper from 'Components/Table/TableOptions/TableOptionsModalWrapper'; import TablePager from 'Components/Table/TablePager'; -import { align, icons } from 'Helpers/Props'; +import { align, icons, kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import HistoryRowConnector from './HistoryRowConnector'; @@ -83,9 +84,9 @@ class History extends Component { { !isFetchingAny && hasError && -
+ {translate('UnableToLoadHistory')} -
+ } { @@ -93,9 +94,9 @@ class History extends Component { // wait for the episodes to populate because they are never coming. isPopulated && !hasError && !items.length && -
+ {translate('NoHistory')} -
+ } { diff --git a/frontend/src/Activity/Queue/Queue.js b/frontend/src/Activity/Queue/Queue.js index 98382d265..54cff620e 100644 --- a/frontend/src/Activity/Queue/Queue.js +++ b/frontend/src/Activity/Queue/Queue.js @@ -1,6 +1,7 @@ import _ from 'lodash'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; @@ -12,7 +13,7 @@ import Table from 'Components/Table/Table'; import TableBody from 'Components/Table/TableBody'; import TableOptionsModalWrapper from 'Components/Table/TableOptions/TableOptionsModalWrapper'; import TablePager from 'Components/Table/TablePager'; -import { align, icons } from 'Helpers/Props'; +import { align, icons, kinds } from 'Helpers/Props'; import getRemovedItems from 'Utilities/Object/getRemovedItems'; import hasDifferentItems from 'Utilities/Object/hasDifferentItems'; import translate from 'Utilities/String/translate'; @@ -231,17 +232,17 @@ class Queue extends Component { { !isRefreshing && hasError ? -
+ {translate('FailedToLoadQueue')} -
: + : null } { isAllPopulated && !hasError && !items.length ? -
+ {translate('QueueIsEmpty')} -
: + : null } diff --git a/frontend/src/AddMovie/ImportMovie/Import/ImportMovie.js b/frontend/src/AddMovie/ImportMovie/Import/ImportMovie.js index c4d069813..91e066650 100644 --- a/frontend/src/AddMovie/ImportMovie/Import/ImportMovie.js +++ b/frontend/src/AddMovie/ImportMovie/Import/ImportMovie.js @@ -1,9 +1,11 @@ import { reduce } from 'lodash'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; +import { kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import selectAll from 'Utilities/Table/selectAll'; import toggleSelected from 'Utilities/Table/toggleSelected'; @@ -105,9 +107,9 @@ class ImportMovie extends Component { { !rootFoldersFetching && !!rootFoldersError ? -
+ {translate('UnableToLoadRootFolders')} -
: + : null } @@ -116,9 +118,9 @@ class ImportMovie extends Component { !rootFoldersFetching && rootFoldersPopulated && !unmappedFolders.length ? -
+ {translate('AllMoviesInPathHaveBeenImported', [path])} -
: + : null } diff --git a/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js b/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js index 478fe9afc..95cb6e6c0 100644 --- a/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js +++ b/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js @@ -92,9 +92,9 @@ class ImportMovieSelectFolder extends Component { { !isFetching && error ? -
+ {translate('UnableToLoadRootFolders')} -
: + : null } diff --git a/frontend/src/Calendar/Calendar.js b/frontend/src/Calendar/Calendar.js index fec208a00..a0b22f92f 100644 --- a/frontend/src/Calendar/Calendar.js +++ b/frontend/src/Calendar/Calendar.js @@ -1,6 +1,8 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; +import { kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import AgendaConnector from './Agenda/AgendaConnector'; import * as calendarViews from './calendarViews'; @@ -31,9 +33,9 @@ class Calendar extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadTheCalendar')} -
+ } { diff --git a/frontend/src/Collection/Collection.js b/frontend/src/Collection/Collection.js index c1ad15c0b..c617d4667 100644 --- a/frontend/src/Collection/Collection.js +++ b/frontend/src/Collection/Collection.js @@ -1,6 +1,7 @@ import _ from 'lodash'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; @@ -9,7 +10,7 @@ import PageToolbar from 'Components/Page/Toolbar/PageToolbar'; import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton'; import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection'; import PageToolbarSeparator from 'Components/Page/Toolbar/PageToolbarSeparator'; -import { align, icons, sortDirections } from 'Helpers/Props'; +import { align, icons, kinds, sortDirections } from 'Helpers/Props'; import styles from 'Movie/Index/MovieIndex.css'; import hasDifferentItemsOrOrder from 'Utilities/Object/hasDifferentItemsOrOrder'; import translate from 'Utilities/String/translate'; @@ -313,9 +314,9 @@ class Collection extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadCollections')} -
+ } { diff --git a/frontend/src/Components/Page/PageSectionContent.js b/frontend/src/Components/Page/PageSectionContent.js index 774b88669..2cef9eef1 100644 --- a/frontend/src/Components/Page/PageSectionContent.js +++ b/frontend/src/Components/Page/PageSectionContent.js @@ -1,6 +1,8 @@ import PropTypes from 'prop-types'; import React from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; +import { kinds } from 'Helpers/Props'; function PageSectionContent(props) { const { @@ -17,7 +19,7 @@ function PageSectionContent(props) { ); } else if (!isFetching && !!error) { return ( -
{errorMessage}
+ {errorMessage} ); } else if (isPopulated && !error) { return ( diff --git a/frontend/src/DiscoverMovie/DiscoverMovie.js b/frontend/src/DiscoverMovie/DiscoverMovie.js index fb9272cb7..14298fa0b 100644 --- a/frontend/src/DiscoverMovie/DiscoverMovie.js +++ b/frontend/src/DiscoverMovie/DiscoverMovie.js @@ -1,6 +1,7 @@ import _ from 'lodash'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; @@ -10,7 +11,7 @@ import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton'; import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection'; import PageToolbarSeparator from 'Components/Page/Toolbar/PageToolbarSeparator'; import TableOptionsModalWrapper from 'Components/Table/TableOptions/TableOptionsModalWrapper'; -import { align, icons, sortDirections } from 'Helpers/Props'; +import { align, icons, kinds, sortDirections } from 'Helpers/Props'; import styles from 'Movie/Index/MovieIndex.css'; import hasDifferentItemsOrOrder from 'Utilities/Object/hasDifferentItemsOrOrder'; import translate from 'Utilities/String/translate'; @@ -369,9 +370,9 @@ class DiscoverMovie extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadMovies')} -
+ } { diff --git a/frontend/src/InteractiveImport/Language/SelectLanguageModalContent.tsx b/frontend/src/InteractiveImport/Language/SelectLanguageModalContent.tsx index 25cf450b8..dec65e63f 100644 --- a/frontend/src/InteractiveImport/Language/SelectLanguageModalContent.tsx +++ b/frontend/src/InteractiveImport/Language/SelectLanguageModalContent.tsx @@ -2,6 +2,7 @@ import React, { useCallback, useState } from 'react'; import { useSelector } from 'react-redux'; import { createSelector } from 'reselect'; import { LanguageSettingsAppState } from 'App/State/SettingsAppState'; +import Alert from 'Components/Alert'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; @@ -86,7 +87,9 @@ function SelectLanguageModalContent(props: SelectLanguageModalContentProps) { {isFetching ? : null} {!isFetching && error ? ( -
{translate('UnableToLoadLanguages')}
+ + {translate('UnableToLoadLanguages')} + ) : null} {isPopulated && !error ? ( diff --git a/frontend/src/InteractiveImport/Quality/SelectQualityModalContent.tsx b/frontend/src/InteractiveImport/Quality/SelectQualityModalContent.tsx index e8c280989..4d0a6d6ff 100644 --- a/frontend/src/InteractiveImport/Quality/SelectQualityModalContent.tsx +++ b/frontend/src/InteractiveImport/Quality/SelectQualityModalContent.tsx @@ -3,6 +3,7 @@ import { useDispatch, useSelector } from 'react-redux'; import { createSelector } from 'reselect'; import { Error } from 'App/State/AppSectionState'; import AppState from 'App/State/AppState'; +import Alert from 'Components/Alert'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; @@ -130,7 +131,9 @@ function SelectQualityModalContent(props: SelectQualityModalContentProps) { {isFetching && } {!isFetching && error ? ( -
{translate('UnableToLoadQualities')}
+ + {translate('UnableToLoadQualities')} + ) : null} {isPopulated && !error ? ( diff --git a/frontend/src/Movie/Index/MovieIndex.tsx b/frontend/src/Movie/Index/MovieIndex.tsx index dc9b48459..2d540ac2e 100644 --- a/frontend/src/Movie/Index/MovieIndex.tsx +++ b/frontend/src/Movie/Index/MovieIndex.tsx @@ -10,6 +10,7 @@ import { SelectProvider } from 'App/SelectContext'; import ClientSideCollectionAppState from 'App/State/ClientSideCollectionAppState'; import MoviesAppState, { MovieIndexAppState } from 'App/State/MoviesAppState'; import { RSS_SYNC } from 'Commands/commandNames'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; @@ -20,7 +21,7 @@ import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection'; import PageToolbarSeparator from 'Components/Page/Toolbar/PageToolbarSeparator'; import TableOptionsModalWrapper from 'Components/Table/TableOptions/TableOptionsModalWrapper'; import withScrollPosition from 'Components/withScrollPosition'; -import { align, icons } from 'Helpers/Props'; +import { align, icons, kinds } from 'Helpers/Props'; import SortDirection from 'Helpers/Props/SortDirection'; import InteractiveImportModal from 'InteractiveImport/InteractiveImportModal'; import NoMovie from 'Movie/NoMovie'; @@ -337,7 +338,9 @@ const MovieIndex = withScrollPosition((props: MovieIndexProps) => { {isFetching && !isPopulated ? : null} {!isFetching && !!error ? ( -
{translate('UnableToLoadMovies')}
+ + {translate('UnableToLoadMovies')} + ) : null} {isLoaded ? ( diff --git a/frontend/src/MovieFile/Edit/FileEditModalContent.js b/frontend/src/MovieFile/Edit/FileEditModalContent.js index f1187cd63..713111e89 100644 --- a/frontend/src/MovieFile/Edit/FileEditModalContent.js +++ b/frontend/src/MovieFile/Edit/FileEditModalContent.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; @@ -109,9 +110,9 @@ class FileEditModalContent extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadQualities')} -
+ } { diff --git a/frontend/src/MovieFile/Quality/SelectQualityModalContent.js b/frontend/src/MovieFile/Quality/SelectQualityModalContent.js index 9e4340c12..dc4c989dd 100644 --- a/frontend/src/MovieFile/Quality/SelectQualityModalContent.js +++ b/frontend/src/MovieFile/Quality/SelectQualityModalContent.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; @@ -92,9 +93,9 @@ class SelectQualityModalContent extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadQualities')} -
+ } { diff --git a/frontend/src/RootFolder/RootFolders.js b/frontend/src/RootFolder/RootFolders.js index ef81f2b61..f44e8e5e1 100644 --- a/frontend/src/RootFolder/RootFolders.js +++ b/frontend/src/RootFolder/RootFolders.js @@ -1,8 +1,10 @@ import PropTypes from 'prop-types'; import React from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import Table from 'Components/Table/Table'; import TableBody from 'Components/Table/TableBody'; +import { kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import RootFolderRowConnector from './RootFolderRowConnector'; @@ -44,9 +46,9 @@ function RootFolders(props) { if (!isFetching && !!error) { return ( -
+ {translate('UnableToLoadRootFolders')} -
+ ); } diff --git a/frontend/src/Settings/CustomFormats/CustomFormats/ExportCustomFormatModalContent.js b/frontend/src/Settings/CustomFormats/CustomFormats/ExportCustomFormatModalContent.js index 41f2a36bb..8ce77a957 100644 --- a/frontend/src/Settings/CustomFormats/CustomFormats/ExportCustomFormatModalContent.js +++ b/frontend/src/Settings/CustomFormats/CustomFormats/ExportCustomFormatModalContent.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import Button from 'Components/Link/Button'; import ClipboardButton from 'Components/Link/ClipboardButton'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; @@ -41,9 +42,9 @@ class ExportCustomFormatModalContent extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadCustomFormats')} -
+ } { diff --git a/frontend/src/Settings/CustomFormats/CustomFormats/ImportCustomFormatModalContent.js b/frontend/src/Settings/CustomFormats/CustomFormats/ImportCustomFormatModalContent.js index ba7d77902..5e2658801 100644 --- a/frontend/src/Settings/CustomFormats/CustomFormats/ImportCustomFormatModalContent.js +++ b/frontend/src/Settings/CustomFormats/CustomFormats/ImportCustomFormatModalContent.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; @@ -11,7 +12,7 @@ import ModalBody from 'Components/Modal/ModalBody'; import ModalContent from 'Components/Modal/ModalContent'; import ModalFooter from 'Components/Modal/ModalFooter'; import ModalHeader from 'Components/Modal/ModalHeader'; -import { inputTypes, sizes } from 'Helpers/Props'; +import { inputTypes, kinds, sizes } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import styles from './ImportCustomFormatModalContent.css'; @@ -95,9 +96,9 @@ class ImportCustomFormatModalContent extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadCustomFormats')} -
+ } { diff --git a/frontend/src/Settings/DownloadClients/Options/DownloadClientOptions.js b/frontend/src/Settings/DownloadClients/Options/DownloadClientOptions.js index 452d1fe09..953f90700 100644 --- a/frontend/src/Settings/DownloadClients/Options/DownloadClientOptions.js +++ b/frontend/src/Settings/DownloadClients/Options/DownloadClientOptions.js @@ -29,9 +29,9 @@ function DownloadClientOptions(props) { { !isFetching && error && -
+ {translate('UnableToLoadDownloadClientOptions')} -
+ } { diff --git a/frontend/src/Settings/General/GeneralSettings.js b/frontend/src/Settings/General/GeneralSettings.js index 17335a53f..9a057bd5c 100644 --- a/frontend/src/Settings/General/GeneralSettings.js +++ b/frontend/src/Settings/General/GeneralSettings.js @@ -1,6 +1,7 @@ import _ from 'lodash'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import Form from 'Components/Form/Form'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import ConfirmModal from 'Components/Modal/ConfirmModal'; @@ -123,9 +124,9 @@ class GeneralSettings extends Component { { !isFetching && error && -
+ {translate('UnableToLoadGeneralSettings')} -
+ } { diff --git a/frontend/src/Settings/ImportLists/Options/ImportListOptions.js b/frontend/src/Settings/ImportLists/Options/ImportListOptions.js index c3ff727a6..699b156a7 100644 --- a/frontend/src/Settings/ImportLists/Options/ImportListOptions.js +++ b/frontend/src/Settings/ImportLists/Options/ImportListOptions.js @@ -1,12 +1,13 @@ import PropTypes from 'prop-types'; import React from 'react'; +import Alert from 'Components/Alert'; import FieldSet from 'Components/FieldSet'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; import FormLabel from 'Components/Form/FormLabel'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; -import { inputTypes } from 'Helpers/Props'; +import { inputTypes, kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; function ImportListOptions(props) { @@ -37,9 +38,9 @@ function ImportListOptions(props) { { !isFetching && error && -
+ {translate('UnableToLoadListOptions')} -
+ } { diff --git a/frontend/src/Settings/Indexers/Options/IndexerOptions.js b/frontend/src/Settings/Indexers/Options/IndexerOptions.js index 1ff55de70..845ec6df6 100644 --- a/frontend/src/Settings/Indexers/Options/IndexerOptions.js +++ b/frontend/src/Settings/Indexers/Options/IndexerOptions.js @@ -1,12 +1,13 @@ import PropTypes from 'prop-types'; import React from 'react'; +import Alert from 'Components/Alert'; import FieldSet from 'Components/FieldSet'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; import FormLabel from 'Components/Form/FormLabel'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; -import { inputTypes } from 'Helpers/Props'; +import { inputTypes, kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; function IndexerOptions(props) { @@ -28,9 +29,9 @@ function IndexerOptions(props) { { !isFetching && error && -
+ {translate('UnableToLoadIndexerOptions')} -
+ } { diff --git a/frontend/src/Settings/MediaManagement/MediaManagement.js b/frontend/src/Settings/MediaManagement/MediaManagement.js index 06b65e481..74f03a54d 100644 --- a/frontend/src/Settings/MediaManagement/MediaManagement.js +++ b/frontend/src/Settings/MediaManagement/MediaManagement.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import FieldSet from 'Components/FieldSet'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; @@ -8,7 +9,7 @@ import FormLabel from 'Components/Form/FormLabel'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; -import { inputTypes, sizes } from 'Helpers/Props'; +import { inputTypes, kinds, sizes } from 'Helpers/Props'; import RootFoldersConnector from 'RootFolder/RootFoldersConnector'; import SettingsToolbarConnector from 'Settings/SettingsToolbarConnector'; import translate from 'Utilities/String/translate'; @@ -72,9 +73,9 @@ class MediaManagement extends Component { { !isFetching && error ?
-
+ {translate('UnableToLoadMediaManagementSettings')} -
+
: null } diff --git a/frontend/src/Settings/MediaManagement/Naming/Naming.js b/frontend/src/Settings/MediaManagement/Naming/Naming.js index 9631e4971..1a64d7d8b 100644 --- a/frontend/src/Settings/MediaManagement/Naming/Naming.js +++ b/frontend/src/Settings/MediaManagement/Naming/Naming.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import FieldSet from 'Components/FieldSet'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; @@ -7,7 +8,7 @@ import FormInputButton from 'Components/Form/FormInputButton'; import FormInputGroup from 'Components/Form/FormInputGroup'; import FormLabel from 'Components/Form/FormLabel'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; -import { inputTypes, sizes } from 'Helpers/Props'; +import { inputTypes, kinds, sizes } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import NamingModal from './NamingModal'; import styles from './Naming.css'; @@ -110,9 +111,9 @@ class Naming extends Component { { !isFetching && error && -
+ {translate('UnableToLoadNamingSettings')} -
+ } { diff --git a/frontend/src/Settings/Metadata/Options/MetadataOptions.js b/frontend/src/Settings/Metadata/Options/MetadataOptions.js index 79e83167d..27df5e20b 100644 --- a/frontend/src/Settings/Metadata/Options/MetadataOptions.js +++ b/frontend/src/Settings/Metadata/Options/MetadataOptions.js @@ -6,8 +6,9 @@ import FormGroup from 'Components/Form/FormGroup'; import FormInputGroup from 'Components/Form/FormInputGroup'; import FormLabel from 'Components/Form/FormLabel'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; -import { inputTypes } from 'Helpers/Props'; +import { inputTypes, kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; +import Alert from '../../../Components/Alert'; // Note: Do Not Translate Certification Countries @@ -43,9 +44,9 @@ function MetadataOptions(props) { { !isFetching && error && -
+ {translate('UnableToLoadIndexerOptions')} -
+ } { diff --git a/frontend/src/Settings/UI/UISettings.js b/frontend/src/Settings/UI/UISettings.js index 5f8c33fce..3964e46db 100644 --- a/frontend/src/Settings/UI/UISettings.js +++ b/frontend/src/Settings/UI/UISettings.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import FieldSet from 'Components/FieldSet'; import Form from 'Components/Form/Form'; import FormGroup from 'Components/Form/FormGroup'; @@ -8,7 +9,7 @@ import FormLabel from 'Components/Form/FormLabel'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; -import { inputTypes } from 'Helpers/Props'; +import { inputTypes, kinds } from 'Helpers/Props'; import SettingsToolbarConnector from 'Settings/SettingsToolbarConnector'; import themes from 'Styles/Themes'; import titleCase from 'Utilities/String/titleCase'; @@ -87,9 +88,9 @@ class UISettings extends Component { { !isFetching && error && -
+ {translate('UnableToLoadUISettings')} -
+ } { diff --git a/frontend/src/System/Backup/Backups.js b/frontend/src/System/Backup/Backups.js index 3f1e2b4eb..e94bcf7ac 100644 --- a/frontend/src/System/Backup/Backups.js +++ b/frontend/src/System/Backup/Backups.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; @@ -8,7 +9,7 @@ import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton'; import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection'; import Table from 'Components/Table/Table'; import TableBody from 'Components/Table/TableBody'; -import { icons } from 'Helpers/Props'; +import { icons, kinds } from 'Helpers/Props'; import translate from 'Utilities/String/translate'; import BackupRow from './BackupRow'; import RestoreBackupModalConnector from './RestoreBackupModalConnector'; @@ -107,16 +108,16 @@ class Backups extends Component { { !isFetching && !!error && -
+ {translate('UnableToLoadBackups')} -
+ } { noBackups && -
+ {translate('NoBackupsAreAvailable')} -
+ } {