) {
const classes = useStyles();
const [open, setOpen] = useState(true);
const toggleDrawer = () => {
@@ -142,6 +171,31 @@ function App() {
}}
open={open}
>
+
+
+
+
+ }
+ />
+
@@ -191,4 +245,4 @@ function App() {
);
}
-export default App;
+export default connector(App);
diff --git a/ui/src/actions/snackbarActions.ts b/ui/src/actions/snackbarActions.ts
new file mode 100644
index 0000000..460533e
--- /dev/null
+++ b/ui/src/actions/snackbarActions.ts
@@ -0,0 +1,12 @@
+export const CLOSE_SNACKBAR = "CLOSE_SNACKBAR";
+
+interface CloseSnakbarAction {
+ type: typeof CLOSE_SNACKBAR;
+}
+
+// Union of all snackbar related action types
+export type SnackbarActionTypes = CloseSnakbarAction;
+
+export function closeSnackbar() {
+ return { type: CLOSE_SNACKBAR };
+}
diff --git a/ui/src/reducers/snackbarReducer.ts b/ui/src/reducers/snackbarReducer.ts
new file mode 100644
index 0000000..f8285b8
--- /dev/null
+++ b/ui/src/reducers/snackbarReducer.ts
@@ -0,0 +1,61 @@
+import {
+ CLOSE_SNACKBAR,
+ SnackbarActionTypes,
+} from "../actions/snackbarActions";
+import {
+ DELETE_DEAD_TASK_SUCCESS,
+ DELETE_RETRY_TASK_SUCCESS,
+ DELETE_SCHEDULED_TASK_SUCCESS,
+ TasksActionTypes,
+} from "../actions/tasksActions";
+
+interface SnackbarState {
+ isOpen: boolean;
+ message: string;
+}
+
+const initialState: SnackbarState = {
+ isOpen: false,
+ message: "",
+};
+
+function snackbarReducer(
+ state = initialState,
+ action: TasksActionTypes | SnackbarActionTypes
+): SnackbarState {
+ switch (action.type) {
+ case CLOSE_SNACKBAR:
+ return {
+ // Note: We keep the message state unchanged for
+ // smoother transition animation.
+ ...state,
+ isOpen: false,
+ };
+
+ case DELETE_SCHEDULED_TASK_SUCCESS:
+ return {
+ isOpen: true,
+ // TODO: show only task id
+ message: `Scheduled task ${action.taskKey} deleted`,
+ };
+
+ case DELETE_RETRY_TASK_SUCCESS:
+ return {
+ isOpen: true,
+ // TODO: show only task id
+ message: `Retry task ${action.taskKey} deleted`,
+ };
+
+ case DELETE_DEAD_TASK_SUCCESS:
+ return {
+ isOpen: true,
+ // TODO: show only task id
+ message: `Dead task ${action.taskKey} deleted`,
+ };
+
+ default:
+ return state;
+ }
+}
+
+export default snackbarReducer;
diff --git a/ui/src/store.ts b/ui/src/store.ts
index 3587b8e..975b32e 100644
--- a/ui/src/store.ts
+++ b/ui/src/store.ts
@@ -3,12 +3,14 @@ import settingsReducer from "./reducers/settingsReducer";
import queuesReducer from "./reducers/queuesReducer";
import tasksReducer from "./reducers/tasksReducer";
import schedulerEntriesReducer from "./reducers/schedulerEntriesReducer";
+import snackbarReducer from "./reducers/snackbarReducer";
const rootReducer = combineReducers({
settings: settingsReducer,
queues: queuesReducer,
tasks: tasksReducer,
schedulerEntries: schedulerEntriesReducer,
+ snackbar: snackbarReducer,
});
// AppState is the top-level application state maintained by redux store.