diff --git a/public/components/CustomLabel/CustomLabel.tsx b/public/components/CustomLabel/CustomLabel.tsx index 61f52bd24..64bd235b3 100644 --- a/public/components/CustomLabel/CustomLabel.tsx +++ b/public/components/CustomLabel/CustomLabel.tsx @@ -7,28 +7,30 @@ import { EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from "@elastic/eui"; import React from "react"; interface CustomLabelProps { - title: string; + title: string | JSX.Element; isOptional?: boolean; helpText?: string | JSX.Element; } const CustomLabel = ({ title, isOptional = false, helpText }: CustomLabelProps) => ( <> - - - -

{title}

-
-
- - {isOptional ? ( - - - – optional - + {title && typeof title == "string" ? ( + + + {

{title}

}
- ) : null} -
+ + {isOptional ? ( + + + x – optional + + + ) : null} +
+ ) : ( + title + )} {helpText && typeof helpText === "string" ? {helpText} : helpText} diff --git a/public/pages/CreateSnapshotPolicy/components/SnapshotAdvancedSettings/SnapshotAdvancedSettings.tsx b/public/pages/CreateSnapshotPolicy/components/SnapshotAdvancedSettings/SnapshotAdvancedSettings.tsx index a67bf9683..eebd7696b 100644 --- a/public/pages/CreateSnapshotPolicy/components/SnapshotAdvancedSettings/SnapshotAdvancedSettings.tsx +++ b/public/pages/CreateSnapshotPolicy/components/SnapshotAdvancedSettings/SnapshotAdvancedSettings.tsx @@ -3,9 +3,10 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { EuiCompressedCheckbox, EuiSpacer } from "@elastic/eui"; +import { EuiCompressedCheckbox, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from "@elastic/eui"; import CustomLabel from "../../../../components/CustomLabel"; import React, { ChangeEvent } from "react"; +import { CheckBoxLabel } from "../../../Snapshots/helper"; interface SnapshotAdvancedSettingsProps { includeGlobalState: boolean; @@ -17,6 +18,18 @@ interface SnapshotAdvancedSettingsProps { width?: string; } +const lableTitle = (titleText: string) => { + return ( + + + +

{titleText}

+
+
+
+ ); +}; + const SnapshotAdvancedSettings = ({ includeGlobalState, onIncludeGlobalStateToggle, @@ -26,10 +39,10 @@ const SnapshotAdvancedSettings = ({ onPartialToggle, width, }: SnapshotAdvancedSettingsProps) => ( -
+
} + label={} checked={includeGlobalState} onChange={onIncludeGlobalStateToggle} /> @@ -39,7 +52,7 @@ const SnapshotAdvancedSettings = ({ @@ -52,7 +65,7 @@ const SnapshotAdvancedSettings = ({ } + label={} checked={partial} onChange={onPartialToggle} /> diff --git a/public/pages/CreateSnapshotPolicy/containers/CreateSnapshotPolicy/CreateSnapshotPolicy.tsx b/public/pages/CreateSnapshotPolicy/containers/CreateSnapshotPolicy/CreateSnapshotPolicy.tsx index 7b4a9e6cb..6c2bed828 100644 --- a/public/pages/CreateSnapshotPolicy/containers/CreateSnapshotPolicy/CreateSnapshotPolicy.tsx +++ b/public/pages/CreateSnapshotPolicy/containers/CreateSnapshotPolicy/CreateSnapshotPolicy.tsx @@ -57,6 +57,7 @@ import MDSEnabledComponent from "../../../../components/MDSEnabledComponent"; import { useUpdateUrlWithDataSourceProperties } from "../../../../components/MDSEnabledComponent"; import { getApplication, getNavigationUI, getUISettings } from "../../../../services/Services"; import { ExternalLink } from "../../../utils/display-utils"; +import { TopNavControlDescriptionData, TopNavControlLinkData } from "src/plugins/navigation/public"; interface CreateSMPolicyProps extends RouteComponentProps, DataSourceMenuProperties { snapshotManagementService: SnapshotManagementService; @@ -559,13 +560,17 @@ export class CreateSnapshotPolicy extends MDSEnabledComponent - Snapshot policies allow you to define an automated snapshot schedule and retention period.{" "} - - - ), - }, + description: "Snapshot policies allow you to define an automated snapshot schedule and retention period.", + links: { + label: "Learn more", + href: SNAPSHOT_MANAGEMENT_DOCUMENTATION_URL, + iconType: "popout", + iconSide: "right", + controlType: "link", + target: "_blank", + flush: "both", + } as TopNavControlLinkData, + } as TopNavControlDescriptionData, ]; const padding_style = this.state.useNewUX ? { padding: "0px 0px" } : { padding: "5px 50px" }; return ( @@ -574,15 +579,21 @@ export class CreateSnapshotPolicy extends MDSEnabledComponent ) : ( <> - +

{isEdit ? "Edit" : "Create"} policy

-
+ {subTitleText} )} - + + + +

Policy settings

+
+
+ -
+ - + + + +

Source and destination

+
+
+ -
+ - + + + +

Snapshot schedule

+
+
+ -
+ - + + + +

Retention period

+
+
+ ) : null} -
+ - -
- Notify on snapshot activities - - - ) => { - this.setState({ policy: this.setPolicyHelper("notification.conditions.creation", e.target.checked) }); - }} - /> + + + +

Notifications

+
+
+ + +

Notify on snapshot activities

+
- + + ) => { + this.setState({ policy: this.setPolicyHelper("notification.conditions.creation", e.target.checked) }); + }} + /> - ) => { - this.setState({ policy: this.setPolicyHelper("notification.conditions.deletion", e.target.checked) }); - }} - /> + - + ) => { + this.setState({ policy: this.setPolicyHelper("notification.conditions.deletion", e.target.checked) }); + }} + /> - ) => { - this.setState({ policy: this.setPolicyHelper("notification.conditions.failure", e.target.checked) }); - }} - /> -
+ + + ) => { + this.setState({ policy: this.setPolicyHelper("notification.conditions.failure", e.target.checked) }); + }} + /> {showNotificationChannel ? ( - + <> + + + ) : null} -
+ {/* Advanced settings */} - - + + - -

+ +

Advanced settings – optional -

- +

+
@@ -890,7 +928,7 @@ export class CreateSnapshotPolicy extends MDSEnabledComponent - + Cancel diff --git a/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap b/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap index 5ff8cf96a..65b709610 100644 --- a/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap +++ b/public/pages/Reindex/components/CreateIndexFlyout/__snapshots__/CreateIndexFlyout.test.tsx.snap @@ -821,7 +821,7 @@ Object { class="euiFlyoutFooter" >
- + +

Advanced settings

+ + } + > @@ -233,8 +240,8 @@ export class CreateRepositoryFlyout extends MDSEnabledComponent

- To use a custom repository, such as Amazon S3, Azure Blob Storage or similar, install and configure the respective repository - plugin on OpenSearch and then define the repository configuration below.{" "} + To use a custom repository, such as Amazon S3, Azure Blob Storage or similar, install and configure the respective + repository plugin on OpenSearch and then define the repository configuration below.{" "} Learn more @@ -274,9 +281,11 @@ export class CreateRepositoryFlyout extends MDSEnabledComponent - -

{!!editRepo ? "Edit" : "Create"} repository

- + + +

{!!editRepo ? "Edit" : "Create"} repository

+
+
diff --git a/public/pages/Repositories/components/DeleteModal/DeleteModal.tsx b/public/pages/Repositories/components/DeleteModal/DeleteModal.tsx index c848665da..2a4ca9a69 100644 --- a/public/pages/Repositories/components/DeleteModal/DeleteModal.tsx +++ b/public/pages/Repositories/components/DeleteModal/DeleteModal.tsx @@ -4,7 +4,7 @@ */ import React, { ChangeEvent, Component } from "react"; -import { EuiConfirmModal, EuiCompressedFieldText, EuiForm, EuiCompressedFormRow, EuiOverlayMask, EuiSpacer } from "@elastic/eui"; +import { EuiConfirmModal, EuiCompressedFieldText, EuiForm, EuiCompressedFormRow, EuiOverlayMask, EuiSpacer, EuiText } from "@elastic/eui"; interface DeleteModalProps { closeDeleteModal: (event?: any) => void; @@ -41,7 +41,11 @@ export default class DeleteModal extends Component +

Delete {type}

+
+ } onCancel={closeDeleteModal} onConfirm={() => { onClickDelete(); diff --git a/public/pages/Repositories/containers/Repositories/Repositories.tsx b/public/pages/Repositories/containers/Repositories/Repositories.tsx index c7142b4b4..d2de95122 100644 --- a/public/pages/Repositories/containers/Repositories/Repositories.tsx +++ b/public/pages/Repositories/containers/Repositories/Repositories.tsx @@ -12,6 +12,7 @@ import { EuiText, EuiTextColor, EuiButtonIcon, + EuiPanel, } from "@elastic/eui"; import { getErrorMessage } from "../../../../utils/helpers"; import React, { Component, useContext } from "react"; @@ -29,6 +30,7 @@ import { DataSourceMenuContext, DataSourceMenuProperties } from "../../../../ser import MDSEnabledComponent from "../../../../components/MDSEnabledComponent"; import { useUpdateUrlWithDataSourceProperties } from "../../../../components/MDSEnabledComponent"; import { getApplication, getNavigationUI, getUISettings } from "../../../../services/Services"; +import { TopNavControlDescriptionData } from "src/plugins/navigation/public"; interface RepositoriesProps extends RouteComponentProps, DataSourceMenuProperties { snapshotManagementService: SnapshotManagementService; @@ -289,7 +291,7 @@ export class Repositories extends MDSEnabledComponent - Repositories are remote storage locations used to store snapshots. -
- ), - }, + description: "Repositories are remote storage locations used to store snapshots.", + } as TopNavControlDescriptionData, ]; const controlControlsData = [ @@ -339,15 +337,43 @@ export class Repositories extends MDSEnabledComponent { + return !useNewUX ? ( + + this.setState({ selectedItems }) }} + search={search} + loading={loading} + /> + + ) : ( + + this.setState({ selectedItems }) }} + search={search} + loading={loading} + /> + + ); + }; + const { HeaderControl } = getNavigationUI(); const { setAppRightControls, setAppDescriptionControls } = getApplication(); - const useTitle = useNewUX - ? undefined - : ( - -

Repositories

-
- ); + const useTitle = useNewUX ? undefined : ( + +

Repositories

+
+ ); const useActions = useNewUX ? undefined : actions; const useSubTitleText = useNewUX ? undefined : subTitleText; @@ -359,18 +385,7 @@ export class Repositories extends MDSEnabledComponent ) : null} - - this.setState({ selectedItems }) }} - search={search} - loading={loading} - /> - + {repositoriesTable()} {showFlyout && ( - Define an automated snapshot schedule and retention period with a snapshot policy.{" "} - - - ), - }, + description: "Define an automated snapshot schedule and retention period with a snapshot policy.", + links: { + label: "Learn more", + href: SNAPSHOT_MANAGEMENT_DOCUMENTATION_URL, + iconType: "popout", + iconSide: "right", + controlType: "link", + target: "_blank", + flush: "both", + } as TopNavControlLinkData, + } as TopNavControlDescriptionData, ]; const controlControlsData = [ @@ -538,11 +545,9 @@ export class SnapshotPolicies extends MDSEnabledComponent { return ( -

Snapshot policies

- } - actions={actions} + } + actions={actions} subTitleText={subTitleText} > - + {CommonTable()}
{CommonModal()} @@ -593,8 +592,8 @@ export class SnapshotPolicies extends MDSEnabledComponent - - + + + {CommonTable()} - + {CommonModal()} ); diff --git a/public/pages/SnapshotPolicyDetails/containers/SnapshotPolicyDetails/SnapshotPolicyDetails.tsx b/public/pages/SnapshotPolicyDetails/containers/SnapshotPolicyDetails/SnapshotPolicyDetails.tsx index d5031c7d0..eedef193d 100644 --- a/public/pages/SnapshotPolicyDetails/containers/SnapshotPolicyDetails/SnapshotPolicyDetails.tsx +++ b/public/pages/SnapshotPolicyDetails/containers/SnapshotPolicyDetails/SnapshotPolicyDetails.tsx @@ -21,6 +21,8 @@ import { EuiText, EuiTitle, EuiHealth, + EuiHorizontalRule, + EuiPanel, } from "@elastic/eui"; import { NotificationService, SnapshotManagementService } from "../../../../services"; import { SMMetadata, SMPolicy } from "../../../../../models/interfaces"; @@ -424,9 +426,9 @@ export class SnapshotPolicyDetails extends MDSEnabledComponent - - {_.truncate(policyId)} - + +

{_.truncate(policyId)}

+
@@ -446,7 +448,13 @@ export class SnapshotPolicyDetails extends MDSEnabledComponent )} - + + + +

Policy settings

+
+
+ {policySettingItems.map((item) => ( @@ -473,11 +481,17 @@ export class SnapshotPolicyDetails extends MDSEnabledComponent
- + - + + + +

Snapshot schedule

+
+
+ {snapshotScheduleItems.map((item) => ( @@ -488,11 +502,17 @@ export class SnapshotPolicyDetails extends MDSEnabledComponent ))} -
+ - + + + +

Snapshot retention period

+
+
+ {retentionItems.map((item) => ( @@ -516,11 +536,17 @@ export class SnapshotPolicyDetails extends MDSEnabledComponent )} -
+ - + + + +

Notifications

+
+
+ {notificationItems.map((item) => ( @@ -531,21 +557,26 @@ export class SnapshotPolicyDetails extends MDSEnabledComponent ))} -
+ - this.getPolicy(policyId)} data-test-subj="refreshButton"> - Refresh - - } - > + + + + +

Last creation/deletion

+
+
+ + this.getPolicy(policyId)} data-test-subj="refreshButton"> + Refresh + + +
+ -
+ {isDeleteModalVisible && ( diff --git a/public/pages/Snapshots/components/AddPrefixInput/__snapshots__/AddPrefixInput.test.tsx.snap b/public/pages/Snapshots/components/AddPrefixInput/__snapshots__/AddPrefixInput.test.tsx.snap index 651c664a3..1cd699546 100644 --- a/public/pages/Snapshots/components/AddPrefixInput/__snapshots__/AddPrefixInput.test.tsx.snap +++ b/public/pages/Snapshots/components/AddPrefixInput/__snapshots__/AddPrefixInput.test.tsx.snap @@ -6,17 +6,17 @@ exports[`AddPrefixInput component renders without error 1`] = ` class="euiSpacer euiSpacer--l" />
-

+

Specify prefix for restored index names -

+
diff --git a/public/pages/Snapshots/components/CreateSnapshotFlyout/CreateSnapshotFlyout.tsx b/public/pages/Snapshots/components/CreateSnapshotFlyout/CreateSnapshotFlyout.tsx index 63b2b6545..78e46619d 100644 --- a/public/pages/Snapshots/components/CreateSnapshotFlyout/CreateSnapshotFlyout.tsx +++ b/public/pages/Snapshots/components/CreateSnapshotFlyout/CreateSnapshotFlyout.tsx @@ -213,15 +213,16 @@ export class CreateSnapshotFlyout extends MDSEnabledComponent ({ value: r.id, text: r.id })); + const invalidChar = ["\\", "/", "*", "?", '"', "<", ">", "|", " ", ",", " ", "#"]; return ( - - + +

Create snapshot

-
-
+ +
@@ -236,7 +237,11 @@ export class CreateSnapshotFlyout extends MDSEnabledComponent - A valid snapshot name can not contain upper case characters. + + {" "} + A valid snapshot name must not start with _ and must be lowercase. It must not contain any of the following characters:{" "} + {invalidChar.map((char) => `[${char}]`).join(" ")}{" "} + @@ -254,7 +259,14 @@ export class CreateSnapshotFlyout extends MDSEnabledComponent - + +

Advanced options

+ + } + > - +

Rename Pattern

@@ -44,7 +44,7 @@ const RenameInput = ({ getRenamePattern, getRenameReplacement, showPatternError, const renameLabel = ( <> - +

Rename Replacement

diff --git a/public/pages/Snapshots/components/RenameInput/__snapshots__/RenameInput.test.tsx.snap b/public/pages/Snapshots/components/RenameInput/__snapshots__/RenameInput.test.tsx.snap index 7c8a2da7e..be4eafba8 100644 --- a/public/pages/Snapshots/components/RenameInput/__snapshots__/RenameInput.test.tsx.snap +++ b/public/pages/Snapshots/components/RenameInput/__snapshots__/RenameInput.test.tsx.snap @@ -17,7 +17,7 @@ exports[`RenameInput component renders without error 1`] = ` for="rename_pattern" >

Rename Pattern @@ -84,7 +84,7 @@ exports[`RenameInput component renders without error 1`] = ` for="rename_replacement" >

Rename Replacement diff --git a/public/pages/Snapshots/components/RestoreActivitiesPanel/RestoreActivitiesPanel.tsx b/public/pages/Snapshots/components/RestoreActivitiesPanel/RestoreActivitiesPanel.tsx index 596203268..007b62962 100644 --- a/public/pages/Snapshots/components/RestoreActivitiesPanel/RestoreActivitiesPanel.tsx +++ b/public/pages/Snapshots/components/RestoreActivitiesPanel/RestoreActivitiesPanel.tsx @@ -3,7 +3,21 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { EuiInMemoryTable, EuiSpacer, EuiLink, EuiFlyout, EuiSmallButton, EuiButtonIcon, EuiEmptyPrompt, EuiHealth } from "@elastic/eui"; +import { + EuiInMemoryTable, + EuiSpacer, + EuiLink, + EuiFlyout, + EuiSmallButton, + EuiButtonIcon, + EuiEmptyPrompt, + EuiHealth, + EuiPanel, + EuiFlexGroup, + EuiText, + EuiFlexItem, + EuiHorizontalRule, +} from "@elastic/eui"; import _ from "lodash"; import React, { useEffect, useContext, useState, useMemo } from "react"; import { SnapshotManagementService } from "../../../../services"; @@ -252,6 +266,39 @@ export const RestoreActivitiesPanel = ({ incremental: true, compressed: true, }, + compressed: true, + }; + + const restoreActivityTable = () => { + return !useNewUX ? ( + + + + ) : ( + + + + +

{title}

+
+
+ {useActions} +
+ +
+ ); }; const oldMessage = There are no restore activities.

} titleSize="s">
; @@ -283,23 +330,7 @@ export const RestoreActivitiesPanel = ({ /> )} - - - {useNewUX ? null : ( - <> - - - - - - )} - + {restoreActivityTable()} ); }; diff --git a/public/pages/Snapshots/components/RestoreSnapshotFlyout/RestoreSnapshotFlyout.tsx b/public/pages/Snapshots/components/RestoreSnapshotFlyout/RestoreSnapshotFlyout.tsx index 89ef017f2..b29ae9cf1 100644 --- a/public/pages/Snapshots/components/RestoreSnapshotFlyout/RestoreSnapshotFlyout.tsx +++ b/public/pages/Snapshots/components/RestoreSnapshotFlyout/RestoreSnapshotFlyout.tsx @@ -386,9 +386,11 @@ export class RestoreSnapshotFlyout extends MDSEnabledComponent - -

Restore snapshot

-
+ + +

Restore snapshot

+
+
@@ -396,20 +398,26 @@ export class RestoreSnapshotFlyout extends MDSEnabledComponent -

{snapshot?.snapshot}

+ +

{snapshot?.snapshot}

+
{" "} - {status} + +

{status}

+
- - {snapshot?.indices.length} + + +

{snapshot?.indices.length}

+
@@ -462,7 +470,14 @@ export class RestoreSnapshotFlyout extends MDSEnabledComponent - + +

Advanced options

+ + } + > +
Error details
@@ -116,16 +116,18 @@ export class SnapshotFlyout extends MDSEnabledComponent - -

{snapshot?.snapshot}

-
+ + +

{snapshot?.snapshot}

+
+
{items1.map((item) => ( - +
{item.term}
{item.value}
@@ -140,7 +142,7 @@ export class SnapshotFlyout extends MDSEnabledComponent {items2.map((item) => ( - +
{item.term}
{item.value}
@@ -150,7 +152,7 @@ export class SnapshotFlyout extends MDSEnabledComponent - +
Indices
{snapshot?.indices.join(", ")}
diff --git a/public/pages/Snapshots/components/SnapshotRenameOptions/SnapshotRenameOptions.tsx b/public/pages/Snapshots/components/SnapshotRenameOptions/SnapshotRenameOptions.tsx index 5d850272f..ea3b53ff1 100644 --- a/public/pages/Snapshots/components/SnapshotRenameOptions/SnapshotRenameOptions.tsx +++ b/public/pages/Snapshots/components/SnapshotRenameOptions/SnapshotRenameOptions.tsx @@ -29,11 +29,8 @@ const SnapshotRenameOptions = ({ const { do_not_rename, add_prefix, rename_indices } = RESTORE_OPTIONS; return ( -
-
Rename restored indices
- - - +
+
-
- Rename restored indices -
+
+
+

+ Rename restored indices +

+
+
+
+
-
Custom index settings
+ +
Custom index settings
+

By default, index settings are restored from indices in snapshots. You can choose to diff --git a/public/pages/Snapshots/components/SnapshotRestoreOption/SnapshotRestoreOption.tsx b/public/pages/Snapshots/components/SnapshotRestoreOption/SnapshotRestoreOption.tsx index d8b4390f2..8248cc25a 100644 --- a/public/pages/Snapshots/components/SnapshotRestoreOption/SnapshotRestoreOption.tsx +++ b/public/pages/Snapshots/components/SnapshotRestoreOption/SnapshotRestoreOption.tsx @@ -7,6 +7,7 @@ import React, { ChangeEvent } from "react"; import { EuiCompressedRadio, EuiSpacer } from "@elastic/eui"; import CustomLabel from "../../../../components/CustomLabel"; import { RESTORE_OPTIONS } from "../../../../models/interfaces"; +import { EuiText } from "@opensearch-project/oui"; interface SnapshotRestoreOptionProps { restoreAllIndices: boolean; @@ -26,11 +27,8 @@ const SnapshotRestoreOption = ({ const { restore_all_indices, restore_specific_indices } = RESTORE_OPTIONS; return ( -

-
Specify restore option
- - - +
+
-
- Specify restore option -
+
+
+

+ Specify restore option +

+
+
+
+
{ + onRestore = (success: boolean, response: object = {}) => { const { selectedItems } = this.state; let errorMessage: string | undefined; if (!success) { let optionalMessage = ""; + const errorString = response.error || JSON.stringify(response); - if (error.reason.indexOf("open index with same name") >= 0) { + if (errorString.indexOf("open index with same name") >= 0) { optionalMessage = "You have an index with the same name. Try a different prefix."; } - errorMessage = `${optionalMessage}`; + errorMessage = `${optionalMessage} ${errorString}`; } const toasts = success - ? getToasts("success_restore_toast", errorMessage, selectedItems[0].id, this.onClickTab) + ? getToasts("success_restore_toast", undefined, selectedItems[0].id, this.onClickTab) : getToasts("error_restore_toast", errorMessage, selectedItems[0].id, this.onOpenError); - this.setState({ toasts, error: error }); + this.setState({ toasts, error: response.error }); }; onOpenError = () => { @@ -495,7 +497,7 @@ export class Snapshots extends MDSEnabledComponent Restore , - + Take snapshot , ]; @@ -554,6 +556,7 @@ export class Snapshots extends MDSEnabledComponent - Index snapshots are taken automatically from snapshot policies, or you can initiate manual snapshots to save to a repository.{" "} -

- You can restore indices by selecting a snapshot. - - ), - }, + description: + "Index snapshots are taken automatically from snapshot policies, or you can initiate manual snapshots to save to a repository. You can restore indices by selecting a snapshot.", + } as TopNavControlDescriptionData, ]; + const snapshotTable = () => { + return !useNewUX ? ( + + `${item.repository}:${item.id}`} + columns={this.columns} + pagination={true} + sorting={{ + sort: { + field: "end_epoch", + direction: "desc", + }, + }} + isSelectable={true} + selection={{ onSelectionChange: this.onSelectionChange }} + search={search} + loading={loadingSnapshots} + /> + + ) : ( + + `${item.repository}:${item.id}`} + columns={this.columns} + pagination={true} + sorting={{ + sort: { + field: "end_epoch", + direction: "desc", + }, + }} + isSelectable={true} + selection={{ onSelectionChange: this.onSelectionChange }} + search={search} + loading={loadingSnapshots} + /> + + ); + }; + const { HeaderControl } = getNavigationUI(); const { setAppRightControls, setAppDescriptionControls } = getApplication(); - const showTitle = useNewUX - ? undefined - : ( - -

Snapshots

-
- ); + const showTitle = useNewUX ? undefined : ( + +

Snapshots

+
+ ); const SnapshotTabName = useNewUX ? "Index snapshots" : "Snapshots"; const useActions = useNewUX ? undefined : actions; const useSubTitle = useNewUX ? undefined : subTitleText; @@ -614,26 +652,7 @@ export class Snapshots extends MDSEnabledComponent )} - {snapshotPanel && ( - - `${item.repository}:${item.id}`} - columns={this.columns} - pagination={true} - sorting={{ - sort: { - field: "end_epoch", - direction: "desc", - }, - }} - isSelectable={true} - selection={{ onSelectionChange: this.onSelectionChange }} - search={search} - loading={loadingSnapshots} - /> - - )} + {snapshotPanel && snapshotTable()} {showFlyout && ( ( <> {title} - - {helpText} - + {helpText ? ( + + {helpText} + + ) : null} ); diff --git a/public/pages/VisualCreatePolicy/components/FlyoutFooter/FlyoutFooter.tsx b/public/pages/VisualCreatePolicy/components/FlyoutFooter/FlyoutFooter.tsx index 868a38688..8b0de80a1 100644 --- a/public/pages/VisualCreatePolicy/components/FlyoutFooter/FlyoutFooter.tsx +++ b/public/pages/VisualCreatePolicy/components/FlyoutFooter/FlyoutFooter.tsx @@ -15,28 +15,23 @@ interface FlyoutFooterProps { save?: boolean; restore?: boolean; text?: string; - useNewUx?: boolean; } -const FlyoutFooter = ({ - edit, - action, - disabledAction = false, - onClickCancel, - onClickAction, - save, - restore, - text, - useNewUx, -}: FlyoutFooterProps) => ( - +const FlyoutFooter = ({ edit, action, disabledAction = false, onClickCancel, onClickAction, save, restore, text }: FlyoutFooterProps) => ( + Cancel - + {text ? text : restore ? "Restore snapshot" : !save ? `${edit ? "Edit" : "Add"} ${action}` : save ? "Save" : "Create"} diff --git a/public/pages/VisualCreatePolicy/components/FlyoutFooter/__snapshots__/FlyoutFooter.test.tsx.snap b/public/pages/VisualCreatePolicy/components/FlyoutFooter/__snapshots__/FlyoutFooter.test.tsx.snap index 4e160c81a..c227dabf4 100644 --- a/public/pages/VisualCreatePolicy/components/FlyoutFooter/__snapshots__/FlyoutFooter.test.tsx.snap +++ b/public/pages/VisualCreatePolicy/components/FlyoutFooter/__snapshots__/FlyoutFooter.test.tsx.snap @@ -2,7 +2,7 @@ exports[` spec renders the component 1`] = `