[SR] Add SnapshotTable and SnapshotDetails.

x-pack/plugins/snapshot_restore/common/types/snapshot.ts

@@ -4,36 +4,14 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export interface Snapshot {
-  id: string;
-  summary: SnapshotSummary;
-  repositories: string[];
-}
-
-export interface SnapshotSummary {
-  status: string;
-  /** This and other numerical values are typed as strings. e.g. '1554501400'. */
-  startEpoch: string;
-  /** e.g. '21:56:40' */
-  startTime: string;
-  endEpoch: string;
-  /** e.g. '21:56:45' */
-  endTime: string;
-  /** Includes unit, e.g. '4.7s' */
-  duration: string;
-  indices: string;
-  successfulShards: string;
-  failedShards: string;
-  totalShards: string;
-}
-
 export interface SnapshotDetails {
+  repository: string;
   snapshot: string;
   uuid: string;
   versionId: number;
   version: string;
   indices: string[];
-  includeGlobalState: boolean;
+  includeGlobalState: number;
   state: string;
   /** e.g. '2019-04-05T21:56:40.438Z' */
   startTime: string;

x-pack/plugins/snapshot_restore/public/app/app.tsx

@@ -17,7 +17,11 @@ export const App = () => {
         <Redirect exact from={`${BASE_PATH}`} to={`${BASE_PATH}/repositories`} />
         <Route exact path={`${BASE_PATH}/add_repository`} component={RepositoryAdd} />
         <Route exact path={`${BASE_PATH}/edit_repository/:name*`} component={RepositoryEdit} />
-        <Route exact path={`${BASE_PATH}/:section/:name*`} component={SnapshotRestoreHome} />
+        <Route
+          exact
+          path={`${BASE_PATH}/:section/:repositoryName?/:snapshotId*`}
+          component={SnapshotRestoreHome}
+        />
       </Switch>
     </div>
   );

x-pack/plugins/snapshot_restore/public/app/components/repository_form/repository_form.tsx

@@ -61,16 +61,8 @@ export const RepositoryForm: React.FunctionComponent<Props> = ({
     error: repositoryTypesError,
     loading: repositoryTypesLoading,
     data: repositoryTypes,
-    setIsMounted,
   } = loadRepositoryTypes();
 
-  // Set mounted to false when unmounting to avoid in-flight request setting state on unmounted component
-  useEffect(() => {
-    return () => {
-      setIsMounted(false);
-    };
-  }, []);
-
   // Repository state
   const [repository, setRepository] = useState<Repository>({
     ...originalRepository,

x-pack/plugins/snapshot_restore/public/app/index.tsx

@@ -3,6 +3,7 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
+
 import React, { createContext, useContext, useReducer } from 'react';
 import { render } from 'react-dom';
 import { HashRouter } from 'react-router-dom';

x-pack/plugins/snapshot_restore/public/app/sections/home/home.tsx

@@ -99,8 +99,20 @@ export const SnapshotRestoreHome: React.FunctionComponent<Props> = ({
         <EuiSpacer size="m" />
 
         <Switch>
-          <Route exact path={`${BASE_PATH}/repositories/:name*`} component={RepositoryList} />
-          <Route exact path={`${BASE_PATH}/snapshots/:name*`} component={SnapshotList} />
+          <Route
+            exact
+            path={`${BASE_PATH}/repositories/:repositoryName*`}
+            component={RepositoryList}
+          />
+          {/* We have two separate SnapshotList routes because repository names could have slashes in
+           *  them. This would break a route with a path like snapshots/:repositoryName?/:snapshotId*
+           */}
+          <Route exact path={`${BASE_PATH}/snapshots`} component={SnapshotList} />
+          <Route
+            exact
+            path={`${BASE_PATH}/snapshots/:repositoryName*/:snapshotId`}
+            component={SnapshotList}
+          />
         </Switch>
       </EuiPageContent>
     </EuiPageBody>

x-pack/plugins/snapshot_restore/public/app/sections/home/repository_list/repository_details/repository_details.tsx

@@ -6,22 +6,6 @@
 import React, { Fragment } from 'react';
 import { RouteComponentProps, withRouter } from 'react-router-dom';
 
-import { useAppDependencies } from '../../../../index';
-import { documentationLinksService } from '../../../../services/documentation';
-import { loadRepository } from '../../../../services/http';
-import { textService } from '../../../../services/text';
-
-import { REPOSITORY_TYPES } from '../../../../../../common/constants';
-import { Repository } from '../../../../../../common/types';
-import {
-  RepositoryDeleteProvider,
-  RepositoryVerificationBadge,
-  SectionError,
-  SectionLoading,
-} from '../../../../components';
-import { BASE_PATH } from '../../../../constants';
-import { TypeDetails } from './type_details';
-
 import {
   EuiButton,
   EuiButtonEmpty,
@@ -39,6 +23,22 @@ import {
 
 import 'brace/theme/textmate';
 
+import { useAppDependencies } from '../../../../index';
+import { documentationLinksService } from '../../../../services/documentation';
+import { loadRepository } from '../../../../services/http';
+import { textService } from '../../../../services/text';
+
+import { REPOSITORY_TYPES } from '../../../../../../common/constants';
+import { Repository } from '../../../../../../common/types';
+import {
+  RepositoryDeleteProvider,
+  RepositoryVerificationBadge,
+  SectionError,
+  SectionLoading,
+} from '../../../../components';
+import { BASE_PATH } from '../../../../constants';
+import { TypeDetails } from './type_details';
+
 interface Props extends RouteComponentProps {
   repositoryName: Repository['name'];
   onClose: () => void;
@@ -77,7 +77,7 @@ const RepositoryDetailsUi: React.FunctionComponent<Props> = ({
       <SectionLoading>
         <FormattedMessage
           id="xpack.snapshotRestore.repositoryDetails.loadingRepository"
-          defaultMessage="Loading repository..."
+          defaultMessage="Loading repository…"
         />
       </SectionLoading>
     );

x-pack/plugins/snapshot_restore/public/app/sections/home/repository_list/repository_list.tsx

@@ -19,13 +19,13 @@ import { RepositoryTable } from './repository_table';
 import { EuiButton, EuiEmptyPrompt } from '@elastic/eui';
 
 interface MatchParams {
-  name?: Repository['name'];
+  repositoryName?: Repository['name'];
 }
 interface Props extends RouteComponentProps<MatchParams> {}
 
 export const RepositoryList: React.FunctionComponent<Props> = ({
   match: {
-    params: { name },
+    params: { repositoryName: name },
   },
   history,
 }) => {
@@ -64,7 +64,7 @@ export const RepositoryList: React.FunctionComponent<Props> = ({
       <SectionLoading>
         <FormattedMessage
           id="xpack.snapshotRestore.repositoryList.loadingRepositories"
-          defaultMessage="Loading repositories..."
+          defaultMessage="Loading repositories…"
         />
       </SectionLoading>
     );

x-pack/plugins/snapshot_restore/public/app/sections/home/snapshot_list/snapshot_details/index.ts

@@ -0,0 +1,7 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export { SnapshotDetails } from './snapshot_details';