Snapshot management UI

models/interfaces.ts

@@ -5,6 +5,7 @@
 
 // TODO: Backend has PR out to change this model, this needs to be updated once that goes through
 
+import { long } from "@opensearch-project/opensearch/api/types";
 import { ActionType } from "../public/pages/VisualCreatePolicy/utils/constants";
 
 export interface ManagedIndexMetaData {
@@ -78,16 +79,113 @@ export interface Policy {
   schema_version?: number;
 }
 
+export interface DocumentSMPolicy {
+  id: string;
+  seqNo: number;
+  primaryTerm: number;
+  policy: SMPolicy;
+}
+
+export interface DocumentSMPolicyWithMetadata {
+  id: string;
+  seqNo: number;
+  primaryTerm: number;
+  policy: SMPolicy;
+  metadata: SMMetadata;
+}
+
+export interface SMMetadata {
+  name: string;
+  creation?: SMWorkflowMetadata;
+  deletion?: SMWorkflowMetadata;
+  policy_seq_no?: number;
+  policy_primary_term?: number;
+  enabled: boolean;
+}
+
+export interface SMWorkflowMetadata {
+  trigger: {
+    time: number;
+  };
+  started: string[];
+  latest_execution: {
+    status: string;
+    start_time: long;
+    end_time?: long;
+    info?: {
+      message?: string;
+      cause?: string;
+    };
+  };
+}
+
+export interface SMPolicy {
+  name: string;
+  description: string;
+  creation: SMCreation;
+  deletion?: SMDeletion;
+  snapshot_config: SMSnapshotConfig;
+  enabled: boolean;
+  last_updated_time?: number;
+  notification?: Notification;
+}
+
+export interface Snapshot {
+  indices: string;
+  ignore_unavailable: boolean;
+  include_global_state: boolean;
+  partial: boolean;
+  metadata?: object;
+}
+
+export interface SMSnapshotConfig {
+  repository: string;
+  indices?: string;
+  ignore_unavailable?: boolean;
+  include_global_state?: boolean;
+  partial?: boolean;
+  date_expression?: string;
+}
+
+export interface SMCreation {
+  schedule: Cron;
+  time_limit?: string;
+}
+
+export interface SMDeletion {
+  schedule?: Cron;
+  condition?: SMDeleteCondition;
+  time_limit?: string;
+}
+
+export interface SMDeleteCondition {
+  max_count?: number;
+  max_age?: string;
+  min_count?: number;
+}
+
 export interface ErrorNotification {
   destination?: Destination;
   channel?: Channel;
   message_template: MessageTemplate;
 }
 
+export interface Notification {
+  channel: Channel;
+  conditions?: SMNotificationCondition;
+}
+
 export interface Channel {
   id: string;
 }
 
+export interface SMNotificationCondition {
+  creation?: boolean;
+  deletion?: boolean;
+  failure?: boolean;
+  time_limit_exceeded?: boolean;
+}
+
 export interface Destination {
   chime?: {
     url: string;

public/components/CustomLabel/CustomLabel.tsx

@@ -0,0 +1,39 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from "@elastic/eui";
+import React from "react";
+
+interface CustomLabelProps {
+  title: string;
+  isOptional?: boolean;
+  helpText?: string | JSX.Element;
+}
+
+const CustomLabel = ({ title, isOptional = false, helpText }: CustomLabelProps) => (
+  <>
+    <EuiFlexGroup gutterSize="xs">
+      <EuiFlexItem grow={false}>
+        <EuiText size="xs">
+          <h4>{title}</h4>
+        </EuiText>
+      </EuiFlexItem>
+
+      {isOptional ? (
+        <EuiFlexItem>
+          <EuiText size="xs" color="subdued">
+            <i> - optional</i>
+          </EuiText>
+        </EuiFlexItem>
+      ) : null}
+    </EuiFlexGroup>
+
+    {helpText && typeof helpText === "string" ? <span style={{ fontWeight: 200, fontSize: "12px" }}>{helpText}</span> : helpText}
+
+    <EuiSpacer size="s" />
+  </>
+);
+
+export default CustomLabel;

public/components/CustomLabel/index.ts

@@ -0,0 +1,8 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import CustomLabel from "./CustomLabel";
+
+export default CustomLabel;

public/index_management_app.tsx

@@ -15,6 +15,7 @@ import {
   TransformService,
   NotificationService,
   ServicesContext,
+  SnapshotManagementService,
 } from "./services";
 import { DarkModeContext } from "./components/DarkMode";
 import Main from "./pages/Main";
@@ -30,7 +31,16 @@ export function renderApp(coreStart: CoreStart, params: AppMountParameters) {
   const rollupService = new RollupService(http);
   const transformService = new TransformService(http);
   const notificationService = new NotificationService(http);
-  const services = { indexService, managedIndexService, policyService, rollupService, transformService, notificationService };
+  const snapshotManagementService = new SnapshotManagementService(http);
+  const services = {
+    indexService,
+    managedIndexService,
+    policyService,
+    rollupService,
+    transformService,
+    notificationService,
+    snapshotManagementService,
+  };
 
   const isDarkMode = coreStart.uiSettings.get("theme:darkMode") || false;
 

public/models/interfaces.ts

@@ -3,7 +3,17 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { IndexService, ManagedIndexService, PolicyService, RollupService, TransformService, NotificationService } from "../services";
+import { Direction, Query } from "@elastic/eui";
+import { SMPolicy } from "../../models/interfaces";
+import {
+  IndexService,
+  ManagedIndexService,
+  PolicyService,
+  RollupService,
+  TransformService,
+  NotificationService,
+  SnapshotManagementService,
+} from "../services";
 
 export interface BrowserServices {
   indexService: IndexService;
@@ -12,4 +22,36 @@ export interface BrowserServices {
   rollupService: RollupService;
   transformService: TransformService;
   notificationService: NotificationService;
+  snapshotManagementService: SnapshotManagementService;
+}
+
+export interface SMPoliciesQueryParams {
+  from: number;
+  size: number;
+  sortField: keyof SMPolicy;
+  sortOrder: Direction;
+}
+
+interface ArgsWithQuery {
+  query: Query;
+  queryText: string;
+  error: null;
+}
+interface ArgsWithError {
+  query: null;
+  queryText: string;
+  error: Error;
+}
+export type OnSearchChangeArgs = ArgsWithQuery | ArgsWithError;
+
+export interface LatestActivities {
+  activityType: "Creation" | "Deletion";
+  status?: string;
+  snapshot?: string;
+  start_time?: number;
+  end_time?: number;
+  info?: {
+    message?: string;
+    cause?: string;
+  };
 }