Skip to content

Commit

Permalink
Add MDS support to snapshot pages
Browse files Browse the repository at this point in the history 
Signed-off-by: Sandeep Kumawat <skumwt@amazon.com>
  • Loading branch information
Sandeep Kumawat committed Jul 11, 2024
1 parent 2070768 commit 071a0f0
Show file tree
Hide file tree
Showing 13 changed files with 435 additions and 177 deletions.
60 changes: 56 additions & 4 deletions public/pages/CreateSnapshotPolicy/containers/CreateSnapshotPolicy/CreateSnapshotPolicy.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ import {
EuiButtonIcon,
EuiLink,
} from "@elastic/eui";
import React, { ChangeEvent, Component } from "react";
import React, { ChangeEvent, Component, useContext } from "react";
import { RouteComponentProps } from "react-router-dom";
import { CoreServicesContext } from "../../../../components/core_services";
import { CatRepository, CreateRepositoryBody, CreateRepositorySettings, FeatureChannelList } from "../../../../../server/models/interfaces";
Expand All @@ -52,15 +52,17 @@ import SnapshotIndicesRepoInput from "../../components/SnapshotIndicesRepoInput"
import CronSchedule from "../../components/CronSchedule";
import SnapshotAdvancedSettings from "../../components/SnapshotAdvancedSettings";
import Notification from "../../components/Notification";
import { DataSourceMenuContext, DataSourceMenuProperties } from "../../../../services/DataSourceMenuContext";
import MDSEnabledComponent from "../../../../components/MDSEnabledComponent";

interface CreateSMPolicyProps extends RouteComponentProps {
interface CreateSMPolicyProps extends RouteComponentProps, DataSourceMenuProperties {
snapshotManagementService: SnapshotManagementService;
isEdit: boolean;
notificationService: NotificationService;
indexService: IndexService;
}

interface CreateSMPolicyState {
interface CreateSMPolicyState extends DataSourceMenuProperties {
policy: SMPolicy;
policyId: string;
policySeqNo: number | undefined;
Expand Down Expand Up @@ -96,13 +98,14 @@ interface CreateSMPolicyState {
timezoneError: string;
}

export default class CreateSnapshotPolicy extends Component<CreateSMPolicyProps, CreateSMPolicyState> {
export class CreateSnapshotPolicy extends MDSEnabledComponent<CreateSMPolicyProps, CreateSMPolicyState> {
static contextType = CoreServicesContext;

constructor(props: CreateSMPolicyProps) {
super(props);

this.state = {
...this.state,
policy: getDefaultSMPolicy(),
policyId: "",
policySeqNo: undefined,
Expand Down Expand Up @@ -160,11 +163,55 @@ export default class CreateSnapshotPolicy extends Component<CreateSMPolicyProps,
BREADCRUMBS.CREATE_SNAPSHOT_POLICY,
]);
}
this.updateOptions();
}

async updateOptions() {
await this.getIndexOptions("");
await this.getRepos();
await this.getChannels();
}

async componentDidUpdate(prevProps: CreateSMPolicyProps, prevState: CreateSMPolicyState) {
if (prevState.dataSourceId != this.state.dataSourceId) {
this.setState({
policy: getDefaultSMPolicy(),
policyId: "",
policySeqNo: undefined,
policyPrimaryTerm: undefined,

isSubmitting: false,

channels: [],
loadingChannels: false,

indexOptions: DEFAULT_INDEX_OPTIONS,
selectedIndexOptions: [],

repositories: [],
selectedRepoValue: "",

maxAgeNum: 1,
maxAgeUnit: "d",

creationScheduleFrequencyType: "daily",
deletionScheduleFrequencyType: "daily",

deleteConditionEnabled: false,
deletionScheduleEnabled: false,

advancedSettingsOpen: false,
showCreateRepoFlyout: false,

policyIdError: "",
repoError: "",
minCountError: "",
timezoneError: "",
});
this.updateOptions();
}
}

getPolicy = async (policyId: string): Promise<void> => {
try {
const { snapshotManagementService } = this.props;
Expand Down Expand Up @@ -877,3 +924,8 @@ export default class CreateSnapshotPolicy extends Component<CreateSMPolicyProps,
return _.set(this.state.policy, path, newValue);
};
}

export default function (props: Omit<CreateSMPolicyProps, keyof DataSourceMenuProperties>) {
const dataSourceMenuProps = useContext(DataSourceMenuContext);
return <CreateSnapshotPolicy {...props} {...dataSourceMenuProps} />;
}
13 changes: 13 additions & 0 deletions public/pages/Main/Main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -174,6 +174,16 @@ const dataSourceEnabledPaths: string[] = [
ROUTES.CREATE_TRANSFORM,
ROUTES.EDIT_TRANSFORM,
ROUTES.TRANSFORM_DETAILS,
ROUTES.SNAPSHOT_POLICIES,
ROUTES.SNAPSHOT_POLICY_DETAILS,
ROUTES.CREATE_SNAPSHOT_POLICY,
ROUTES.EDIT_SNAPSHOT_POLICY,
ROUTES.SNAPSHOTS,
ROUTES.CREATE_SNAPSHOT,
ROUTES.EDIT_SNAPSHOT,
ROUTES.REPOSITORIES,
ROUTES.CREATE_REPOSITORY,
ROUTES.EDIT_REPOSITORY,
];

export default class Main extends Component<MainProps, MainState> {
Expand Down Expand Up @@ -238,6 +248,7 @@ export default class Main extends Component<MainProps, MainState> {
services.notificationService = new NotificationService(http, this.state.dataSourceId, this.props.multiDataSourceEnabled);
services.rollupService = new RollupService(http, this.state.dataSourceId, this.props.multiDataSourceEnabled);
services.transformService = new TransformService(http, this.state.dataSourceId, this.props.multiDataSourceEnabled);
services.snapshotManagementService = new SnapshotManagementService(http, this.state.dataSourceId, this.props.multiDataSourceEnabled);
}
return services;
}
Expand Down Expand Up @@ -433,6 +444,8 @@ export default class Main extends Component<MainProps, MainState> {
ROUTES.ROLLUP_DETAILS,
ROUTES.TRANSFORM_DETAILS,
ROUTES.EDIT_TRANSFORM,
ROUTES.EDIT_SNAPSHOT_POLICY,
ROUTES.SNAPSHOT_POLICY_DETAILS,
]}
render={() => (
<DataSourceViewer
Expand Down
36 changes: 32 additions & 4 deletions public/pages/Repositories/components/CreateRepositoryFlyout/CreateRepositoryFlyout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ import {
} from "@elastic/eui";
import _ from "lodash";
import { CreateRepositorySettings } from "../../../../../server/models/interfaces";
import React, { Component } from "react";
import React, { Component, useContext } from "react";
import FlyoutFooter from "../../../VisualCreatePolicy/components/FlyoutFooter";
import { CoreServicesContext } from "../../../../components/core_services";
import { SnapshotManagementService } from "../../../../services";
Expand All @@ -36,15 +36,17 @@ import {
S3_REPOSITORY_DOCUMENTATION_URL,
SNAPSHOT_MANAGEMENT_DOCUMENTATION_URL,
} from "../../../../utils/constants";
import { DataSourceMenuContext, DataSourceMenuProperties } from "../../../../services/DataSourceMenuContext";
import MDSEnabledComponent from "../../../../components/MDSEnabledComponent";

interface CreateRepositoryProps {
interface CreateRepositoryProps extends DataSourceMenuProperties {
service: SnapshotManagementService;
editRepo: string | null;
onCloseFlyout: () => void;
createRepo: (repoName: string, repoType: string, settings: CreateRepositorySettings) => void;
}

interface CreateRepositoryState {
interface CreateRepositoryState extends DataSourceMenuProperties {
repoName: string;
location: string;
// repoTypeOptions: EuiComboBoxOptionOption<string>[];
Expand All @@ -59,13 +61,14 @@ interface CreateRepositoryState {
locationError: string;
}

export default class CreateRepositoryFlyout extends Component<CreateRepositoryProps, CreateRepositoryState> {
export class CreateRepositoryFlyout extends MDSEnabledComponent<CreateRepositoryProps, CreateRepositoryState> {
static contextType = CoreServicesContext;

constructor(props: CreateRepositoryProps) {
super(props);

this.state = {
...this.state,
repoName: "",
location: "",
// repoTypeOptions: [],
Expand All @@ -85,6 +88,26 @@ export default class CreateRepositoryFlyout extends Component<CreateRepositoryPr
}
}

async componentDidUpdate(prevProps: CreateRepositoryProps, prevState: CreateRepositoryState) {
if (prevState.dataSourceId != this.state.dataSourceId) {
const { editRepo } = this.props;
this.setState({
repoName: "",
location: "",
// repoTypeOptions: [],
selectedRepoTypeOption: REPO_SELECT_OPTIONS[0].value as string,
fsSettingsJsonString: JSON.stringify(FS_ADVANCED_SETTINGS, null, 4),
customSettingsJsonString: JSON.stringify(CUSTOM_CONFIGURATION, null, 4),
repoNameError: "",
repoTypeError: "",
locationError: "",
});
if (!!editRepo) {
await this.getRepo(editRepo);
}
}
}

getRepo = async (repoName: string) => {
const { service } = this.props;
try {
Expand Down Expand Up @@ -291,3 +314,8 @@ export default class CreateRepositoryFlyout extends Component<CreateRepositoryPr
);
}
}

export default function (props: Omit<CreateRepositoryProps, keyof DataSourceMenuProperties>) {
const dataSourceMenuProps = useContext(DataSourceMenuContext);
return <CreateRepositoryFlyout {...props} {...dataSourceMenuProps} />;
}
23 changes: 18 additions & 5 deletions public/pages/Repositories/containers/Repositories/Repositories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {
EuiTextColor,
} from "@elastic/eui";
import { getErrorMessage } from "../../../../utils/helpers";
import React, { Component } from "react";
import React, { Component, useContext } from "react";
import { RouteComponentProps } from "react-router-dom";
import { CatRepository, CreateRepositoryBody, CreateRepositorySettings } from "../../../../../server/models/interfaces";
import { CoreServicesContext } from "../../../../components/core_services";
Expand All @@ -24,12 +24,14 @@ import { FieldValueSelectionFilterConfigType } from "@elastic/eui/src/components
import { BREADCRUMBS } from "../../../../utils/constants";
import DeleteModal from "../../components/DeleteModal";
import { truncateSpan } from "../../../Snapshots/helper";
import { DataSourceMenuContext, DataSourceMenuProperties } from "../../../../services/DataSourceMenuContext";
import MDSEnabledComponent from "../../../../components/MDSEnabledComponent";

interface RepositoriesProps extends RouteComponentProps {
interface RepositoriesProps extends RouteComponentProps, DataSourceMenuProperties {
snapshotManagementService: SnapshotManagementService;
}

interface RepositoriesState {
interface RepositoriesState extends DataSourceMenuProperties {
repositories: CatRepository[];
loading: boolean;
selectedItems: CatRepository[];
Expand All @@ -43,14 +45,15 @@ interface RepositoriesState {
isDeleteModalVisible: boolean;
}

export default class Repositories extends Component<RepositoriesProps, RepositoriesState> {
export class Repositories extends MDSEnabledComponent<RepositoriesProps, RepositoriesState> {
static contextType = CoreServicesContext;
columns: EuiTableFieldDataColumnType<CatRepository>[];

constructor(props: RepositoriesProps) {
super(props);

this.state = {
...this.state,
repositories: [],
loading: false,
selectedItems: [],
Expand Down Expand Up @@ -93,6 +96,12 @@ export default class Repositories extends Component<RepositoriesProps, Repositor
await this.getRepos();
}

async componentDidUpdate(prevProps: RepositoriesProps, prevState: RepositoriesState) {
if (prevState.dataSourceId != this.state.dataSourceId) {
await this.getRepos();
}
}

getRepos = async () => {
this.setState({ loading: true });

Expand Down Expand Up @@ -177,7 +186,6 @@ export default class Repositories extends Component<RepositoriesProps, Repositor

render() {
const { repositories, loading, selectedItems, showFlyout, isPopoverOpen, editRepo, isDeleteModalVisible } = this.state;

const popoverActionItems = [
<EuiContextMenuItem
key="Edit"
Expand Down Expand Up @@ -319,3 +327,8 @@ export default class Repositories extends Component<RepositoriesProps, Repositor
.join(", ");
};
}

export default function (props: Omit<RepositoriesProps, keyof DataSourceMenuProperties>) {
const dataSourceMenuProps = useContext(DataSourceMenuContext);
return <Repositories {...props} {...dataSourceMenuProps} />;
}
22 changes: 15 additions & 7 deletions public/pages/SnapshotPolicies/containers/SnapshotPolicies/SnapshotPolicies.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* SPDX-License-Identifier: Apache-2.0
*/

import React, { Component } from "react";
import React, { Component, useContext } from "react";
import _ from "lodash";
import queryString from "query-string";
import { RouteComponentProps } from "react-router-dom";
Expand Down Expand Up @@ -39,12 +39,15 @@ import DeleteModal from "../../../PolicyDetails/components/DeleteModal";
import { OnSearchChangeArgs } from "../../../../models/interfaces";
import { humanCronExpression, parseCronExpression } from "../../../CreateSnapshotPolicy/components/CronSchedule/helper";
import { truncateSpan } from "../../../Snapshots/helper";
import { DataSourceMenuContext, DataSourceMenuProperties } from "../../../../services/DataSourceMenuContext";
import MDSEnabledComponent from "../../../../components/MDSEnabledComponent";
import { useUpdateUrlWithDataSourceProperties } from "../../../../components/MDSEnabledComponent";

interface SnapshotPoliciesProps extends RouteComponentProps {
interface SnapshotPoliciesProps extends RouteComponentProps, DataSourceMenuProperties {
snapshotManagementService: SnapshotManagementService;
}

interface SnapshotPoliciesState {
interface SnapshotPoliciesState extends DataSourceMenuProperties {
policies: SMPolicy[];
totalPolicies: number;
loadingPolicies: boolean;
Expand All @@ -66,7 +69,7 @@ interface SnapshotPoliciesState {
isDeleteModalVisible: boolean;
}

export default class SnapshotPolicies extends Component<SnapshotPoliciesProps, SnapshotPoliciesState> {
export class SnapshotPolicies extends MDSEnabledComponent<SnapshotPoliciesProps, SnapshotPoliciesState> {
static contextType = CoreServicesContext;
columns: EuiTableFieldDataColumnType<SMPolicy>[];

Expand All @@ -75,6 +78,7 @@ export default class SnapshotPolicies extends Component<SnapshotPoliciesProps, S

const { from, size, sortField, sortOrder } = getSMPoliciesQueryParamsFromURL(this.props.location);
this.state = {
...this.state,
policies: [],
totalPolicies: 0,
loadingPolicies: false,
Expand Down Expand Up @@ -168,9 +172,7 @@ export default class SnapshotPolicies extends Component<SnapshotPoliciesProps, S
}

async componentDidUpdate(prevProps: SnapshotPoliciesProps, prevState: SnapshotPoliciesState) {
const prevQuery = SnapshotPolicies.getQueryObjectFromState(prevState);
const currQuery = SnapshotPolicies.getQueryObjectFromState(this.state);
if (!_.isEqual(prevQuery, currQuery)) {
if (prevState.dataSourceId != this.state.dataSourceId) {
await this.getPolicies();
}
}
Expand Down Expand Up @@ -472,3 +474,9 @@ export default class SnapshotPolicies extends Component<SnapshotPoliciesProps, S
);
}
}

export default function (props: Omit<SnapshotPoliciesProps, keyof DataSourceMenuProperties>) {
const dataSourceMenuProps = useContext(DataSourceMenuContext);
useUpdateUrlWithDataSourceProperties();
return <SnapshotPolicies {...props} {...dataSourceMenuProps} />;
}
Loading

0 comments on commit 071a0f0

Please sign in to comment.