Add 'Refresh All App Repositories' button

dashboard/src/actions/repos.test.tsx

@@ -112,21 +112,6 @@ describe("deleteRepo", () => {
 });
 
 describe("resyncRepo", () => {
-  it("dispatches requestRepos and receiveRepos if no error", async () => {
-    const expectedActions = [
-      {
-        type: getType(repoActions.requestRepos),
-      },
-      {
-        type: getType(repoActions.receiveRepos),
-        payload: { foo: "bar" },
-      },
-    ];
-
-    await store.dispatch(repoActions.resyncRepo("foo"));
-    expect(store.getActions()).toEqual(expectedActions);
-  });
-
   it("dispatches errorRepos if error on #get", async () => {
     AppRepository.get = jest.fn().mockImplementationOnce(() => {
       throw new Error("Boom!");
@@ -158,25 +143,6 @@ describe("resyncRepo", () => {
     await store.dispatch(repoActions.resyncRepo("foo"));
     expect(store.getActions()).toEqual(expectedActions);
   });
-
-  it("dispatches requestRepos and errorRepos if error on #list", async () => {
-    AppRepository.list = jest.fn().mockImplementationOnce(() => {
-      throw new Error("Boom!");
-    });
-
-    const expectedActions = [
-      {
-        type: getType(repoActions.requestRepos),
-      },
-      {
-        type: getType(repoActions.errorRepos),
-        payload: { err: new Error("Boom!"), op: "update" },
-      },
-    ];
-
-    await store.dispatch(repoActions.resyncRepo("foo"));
-    expect(store.getActions()).toEqual(expectedActions);
-  });
 });
 
 describe("fetchRepos", () => {

dashboard/src/actions/repos.ts

@@ -92,15 +92,22 @@ export const resyncRepo = (
       repo.spec.resyncRequests++;
       await AppRepository.update(name, namespace, repo);
       // TODO: Do something to show progress
-      dispatch(requestRepos());
-      const repos = await AppRepository.list(namespace);
-      dispatch(receiveRepos(repos.items));
     } catch (e) {
       dispatch(errorRepos(e, "update"));
     }
   };
 };
 
+export const resyncAllRepos = (
+  repoNames: string[],
+): ThunkAction<Promise<void>, IStoreState, null, AppReposAction> => {
+  return async (dispatch, getState) => {
+    repoNames.forEach(name => {
+      dispatch(resyncRepo(name));
+    });
+  };
+};
+
 export const fetchRepos = (): ThunkAction<Promise<void>, IStoreState, null, AppReposAction> => {
   return async (dispatch, getState) => {
     dispatch(requestRepos());

dashboard/src/components/Config/AppRepoList/AppRepoButton.tsx

@@ -43,7 +43,7 @@ export class AppRepoAddButton extends React.Component<
   public render() {
     const { redirectTo } = this.props;
     return (
-      <div className="AppRepoAddButton">
+      <React.Fragment>
         <button className="button button-primary" onClick={this.openModal}>
           Add App Repository
         </button>
@@ -64,7 +64,7 @@ export class AppRepoAddButton extends React.Component<
           <AppRepoForm install={this.install} onAfterInstall={this.closeModal} />
         </Modal>
         {redirectTo && <Redirect to={redirectTo} />}
-      </div>
+      </React.Fragment>
     );
   }
 

dashboard/src/components/Config/AppRepoList/AppRepoList.tsx

@@ -4,6 +4,7 @@ import { IAppRepository, IRBACRole } from "../../../shared/types";
 import ErrorSelector from "../../ErrorAlert/ErrorSelector";
 import { AppRepoAddButton } from "./AppRepoButton";
 import { AppRepoListItem } from "./AppRepoListItem";
+import { AppRepoRefreshAllButton } from "./AppRepoRefreshAllButton";
 
 export interface IAppRepoListProps {
   errors: {
@@ -16,6 +17,7 @@ export interface IAppRepoListProps {
   fetchRepos: () => void;
   deleteRepo: (name: string) => Promise<boolean>;
   resyncRepo: (name: string) => void;
+  resyncAllRepos: (names: string[]) => void;
   install: (name: string, url: string, authHeader: string, customCA: string) => Promise<boolean>;
   kubeappsNamespace: string;
 }
@@ -61,7 +63,15 @@ class AppRepoList extends React.Component<IAppRepoListProps> {
   }
 
   public render() {
-    const { errors, repos, install, deleteRepo, resyncRepo, kubeappsNamespace } = this.props;
+    const {
+      errors,
+      repos,
+      install,
+      deleteRepo,
+      resyncRepo,
+      resyncAllRepos,
+      kubeappsNamespace,
+    } = this.props;
     return (
       <div className="app-repo-list">
         <h1>App Repositories</h1>
@@ -92,6 +102,11 @@ class AppRepoList extends React.Component<IAppRepoListProps> {
           install={install}
           kubeappsNamespace={kubeappsNamespace}
         />
+        <AppRepoRefreshAllButton
+          resyncAllRepos={resyncAllRepos}
+          repos={repos}
+          kubeappsNamespace={kubeappsNamespace}
+        />
       </div>
     );
   }

dashboard/src/components/Config/AppRepoList/AppRepoRefreshAllButton.tsx

@@ -0,0 +1,33 @@
+import * as React from "react";
+
+import { IAppRepository } from "shared/types";
+import "./AppRepo.css";
+
+interface IAppRepoRefreshAllButtonProps {
+  resyncAllRepos: (names: string[]) => void;
+  repos: IAppRepository[];
+  kubeappsNamespace: string;
+}
+
+export class AppRepoRefreshAllButton extends React.Component<IAppRepoRefreshAllButtonProps> {
+  public render() {
+    return (
+      <button
+        className="button button-primary margin-l-big"
+        onClick={this.handleResyncAllClick}
+        title="Refresh All App Repositories"
+      >
+        Refresh All
+      </button>
+    );
+  }
+
+  private handleResyncAllClick = async () => {
+    if (this.props.repos) {
+      const repoNames = this.props.repos.map(repo => {
+        return repo.metadata.name;
+      });
+      this.props.resyncAllRepos(repoNames);
+    }
+  };
+}