diff --git a/services/web/app/views/project/editor/pdf.pug b/services/web/app/views/project/editor/pdf.pug index c5326ab6b3..3132bf78da 100644 --- a/services/web/app/views/project/editor/pdf.pug +++ b/services/web/app/views/project/editor/pdf.pug @@ -2,6 +2,8 @@ div.full-size.pdf(ng-controller="PdfController") if showNewLogsUI preview-pane( compiler-state=`{ + autoCompileHasChanges: changesToAutoCompile, + autoCompileHasLintingError: autoCompileLintingError, isAutoCompileOn: autocompile_enabled, isClearingCache: pdf.clearingCache, isCompiling: pdf.compiling, diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json index 2afba5ff53..c4038d96ce 100644 --- a/services/web/frontend/extracted-translations.json +++ b/services/web/frontend/extracted-translations.json @@ -25,6 +25,8 @@ "close": "", "clsi_maintenance": "", "clsi_unavailable": "", + "code_check_failed": "", + "code_check_failed_explanation": "", "collabs_per_proj": "", "collapse": "", "common": "", @@ -199,4 +201,4 @@ "zotero_reference_loading_error_expired": "", "zotero_reference_loading_error_forbidden": "", "zotero_sync_description": "" -} +} \ No newline at end of file diff --git a/services/web/frontend/js/features/preview/components/preview-logs-pane.js b/services/web/frontend/js/features/preview/components/preview-logs-pane.js index 73ea45e5f8..14df7b82c2 100644 --- a/services/web/frontend/js/features/preview/components/preview-logs-pane.js +++ b/services/web/frontend/js/features/preview/components/preview-logs-pane.js @@ -17,6 +17,7 @@ function PreviewLogsPane({ outputFiles = [], isClearingCache, isCompiling = false, + autoCompileHasLintingError = false, onLogEntryLocationClick, onClearCache }) { @@ -113,6 +114,7 @@ function PreviewLogsPane({
+ {autoCompileHasLintingError ? : null} {errors ? errorsUI : null} {validationIssues ? validationIssuesUI : null} {allCompilerIssues.length > 0 ? logEntriesUI : null} @@ -123,6 +125,22 @@ function PreviewLogsPane({ ) } +function AutoCompileLintingErrorEntry() { + const { t } = useTranslation() + return ( +
+
+
+ +
+

+ {t('code_check_failed_explanation')} +

+
+
+ ) +} + function LogsPaneBetaNotice() { const { t } = useTranslation() const [dismissedBetaNotice, setDismissedBetaNotice] = usePersistedState( @@ -173,6 +191,7 @@ PreviewLogsPane.propTypes = { warning: PropTypes.array, typesetting: PropTypes.array }), + autoCompileHasLintingError: PropTypes.bool, rawLog: PropTypes.string, outputFiles: PropTypes.array, isClearingCache: PropTypes.bool, diff --git a/services/web/frontend/js/features/preview/components/preview-logs-toggle-button.js b/services/web/frontend/js/features/preview/components/preview-logs-toggle-button.js index 1eabc13384..3a07e55539 100644 --- a/services/web/frontend/js/features/preview/components/preview-logs-toggle-button.js +++ b/services/web/frontend/js/features/preview/components/preview-logs-toggle-button.js @@ -10,24 +10,16 @@ const MAX_ERRORS_COUNT = 99 function PreviewLogsToggleButton({ onToggle, showLogs, + autoCompileLintingError = false, compileFailed = false, logsState: { nErrors, nWarnings }, showText }) { const { t } = useTranslation() - const toggleButtonClasses = classNames( - 'btn', - 'btn-xs', - 'btn-toggle-logs', - 'toolbar-item', - { - 'btn-danger': !showLogs && nErrors, - 'btn-warning': !showLogs && !nErrors && nWarnings, - 'btn-default': showLogs || (!nErrors && !nWarnings) - } - ) - let textStyle = {} + let btnColorCssClass = 'btn-default' + let buttonContents + if (!showText) { textStyle = { position: 'absolute', @@ -40,23 +32,40 @@ function PreviewLogsToggleButton({ onToggle() } + if (showLogs) { + buttonContents = + } else { + buttonContents = ( + + ) + if (autoCompileLintingError || nErrors > 0) { + btnColorCssClass = 'btn-danger' + } else if (nWarnings > 0) { + btnColorCssClass = 'btn-warning' + } + } + const buttonClasses = classNames( + 'btn', + 'btn-xs', + 'btn-toggle-logs', + 'toolbar-item', + btnColorCssClass + ) + const buttonElement = ( ) @@ -76,21 +85,40 @@ function PreviewLogsToggleButton({ ) } -function CompilationResultIndicator({ textStyle, nErrors, nWarnings }) { - if (nErrors || nWarnings) { +function CompilationResult({ + textStyle, + autoCompileLintingError, + nErrors, + nWarnings +}) { + if (autoCompileLintingError) { + return + } else if (nErrors || nWarnings) { return ( - ) } else { - return + return } } -function LogsCompilationResultIndicator({ textStyle, logType, nLogs }) { +function ViewPdf({ textStyle }) { + const { t } = useTranslation() + return ( + <> + + + {t('view_pdf')} + + + ) +} + +function LogsCompilationResult({ textStyle, logType, nLogs }) { const { t } = useTranslation() const label = logType === 'errors' ? t('your_project_has_errors') : t('view_warnings') @@ -110,7 +138,19 @@ function LogsCompilationResultIndicator({ textStyle, logType, nLogs }) { ) } -function ViewLogsButton({ textStyle }) { +function AutoCompileLintingError({ textStyle }) { + const { t } = useTranslation() + return ( + <> + + + {t('code_check_failed')} + + + ) +} + +function ViewLogs({ textStyle }) { const { t } = useTranslation() return ( <> @@ -122,41 +162,40 @@ function ViewLogsButton({ textStyle }) { ) } -function ViewPdfButton({ textStyle }) { - const { t } = useTranslation() - return ( - <> - - - {t('view_pdf')} - - - ) -} - PreviewLogsToggleButton.propTypes = { onToggle: PropTypes.func.isRequired, logsState: PropTypes.shape({ nErrors: PropTypes.number.isRequired, - nWarnings: PropTypes.number.isRequired, - nLogEntries: PropTypes.number.isRequired + nWarnings: PropTypes.number.isRequired }), showLogs: PropTypes.bool.isRequired, showText: PropTypes.bool.isRequired, - compileFailed: PropTypes.bool + compileFailed: PropTypes.bool, + autoCompileLintingError: PropTypes.bool } -LogsCompilationResultIndicator.propTypes = { +CompilationResult.propTypes = { + textStyle: PropTypes.object.isRequired, + autoCompileLintingError: PropTypes.bool, + nErrors: PropTypes.number.isRequired, + nWarnings: PropTypes.number.isRequired +} + +LogsCompilationResult.propTypes = { logType: PropTypes.string.isRequired, nLogs: PropTypes.number.isRequired, textStyle: PropTypes.object.isRequired } -ViewLogsButton.propTypes = { +AutoCompileLintingError.propTypes = { textStyle: PropTypes.object.isRequired } -ViewPdfButton.propTypes = { +ViewLogs.propTypes = { + textStyle: PropTypes.object.isRequired +} + +ViewPdf.propTypes = { textStyle: PropTypes.object.isRequired } diff --git a/services/web/frontend/js/features/preview/components/preview-pane.js b/services/web/frontend/js/features/preview/components/preview-pane.js index b4622fba78..1d2bac6233 100644 --- a/services/web/frontend/js/features/preview/components/preview-pane.js +++ b/services/web/frontend/js/features/preview/components/preview-pane.js @@ -53,10 +53,6 @@ function PreviewPane({ compilerState.logEntries && compilerState.logEntries.warnings ? compilerState.logEntries.warnings.length : 0 - const nLogEntries = - compilerState.logEntries && compilerState.logEntries.all - ? compilerState.logEntries.all.length - : 0 const hasCLSIErrors = compilerState.errors && @@ -84,7 +80,7 @@ function PreviewPane({ <>