[Textbased] Moves the error message in the beginning of the footer (#161929)

## Summary

This PR just moves the error message to the beginning of the footer.

<img width="504" alt="image"
src="f215c416-0eba-4afb-bf28-44bca471e8b1">
This commit is contained in:
Stratoula Kalafateli 2023-07-14 12:18:38 +03:00 committed by GitHub
parent 43768537d6
commit 395d4c01e4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -56,42 +56,6 @@ export const EditorFooter = memo(function EditorFooter({
>
<EuiFlexItem grow={false}>
<EuiFlexGroup gutterSize="s" responsive={false} alignItems="center">
<EuiFlexItem grow={false} style={{ marginRight: '8px' }}>
<EuiText size="xs" color="subdued" data-test-subj="TextBasedLangEditor-footer-lines">
<p>
{i18n.translate('textBasedEditor.query.textBasedLanguagesEditor.lineCount', {
defaultMessage: '{count} {count, plural, one {line} other {lines}}',
values: { count: lines },
})}
</p>
</EuiText>
</EuiFlexItem>
<EuiFlexItem grow={false} style={{ marginRight: '16px' }}>
<EuiFlexGroup gutterSize="xs" responsive={false} alignItems="center">
<EuiFlexItem grow={false}>
<EuiIcon type="calendar" color="subdued" size="s" />
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText size="xs" color="subdued" data-test-subj="TextBasedLangEditor-date-info">
<p>
{detectTimestamp
? i18n.translate(
'textBasedEditor.query.textBasedLanguagesEditor.timestampDetected',
{
defaultMessage: '@timestamp detected',
}
)
: i18n.translate(
'textBasedEditor.query.textBasedLanguagesEditor.timestampNotDetected',
{
defaultMessage: '@timestamp not detected',
}
)}
</p>
</EuiText>
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
{errors && errors.length > 0 && (
<EuiFlexItem grow={false}>
<EuiFlexGroup gutterSize="xs" responsive={false} alignItems="center">
@ -185,6 +149,42 @@ export const EditorFooter = memo(function EditorFooter({
</EuiFlexGroup>
</EuiFlexItem>
)}
<EuiFlexItem grow={false} style={{ marginRight: '8px' }}>
<EuiText size="xs" color="subdued" data-test-subj="TextBasedLangEditor-footer-lines">
<p>
{i18n.translate('textBasedEditor.query.textBasedLanguagesEditor.lineCount', {
defaultMessage: '{count} {count, plural, one {line} other {lines}}',
values: { count: lines },
})}
</p>
</EuiText>
</EuiFlexItem>
<EuiFlexItem grow={false} style={{ marginRight: '16px' }}>
<EuiFlexGroup gutterSize="xs" responsive={false} alignItems="center">
<EuiFlexItem grow={false}>
<EuiIcon type="calendar" color="subdued" size="s" />
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText size="xs" color="subdued" data-test-subj="TextBasedLangEditor-date-info">
<p>
{detectTimestamp
? i18n.translate(
'textBasedEditor.query.textBasedLanguagesEditor.timestampDetected',
{
defaultMessage: '@timestamp detected',
}
)
: i18n.translate(
'textBasedEditor.query.textBasedLanguagesEditor.timestampNotDetected',
{
defaultMessage: '@timestamp not detected',
}
)}
</p>
</EuiText>
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
<EuiFlexItem grow={false}>