feat: deleteall

client/src/app/api/eventsApi.js

@@ -37,3 +37,8 @@ export const requestDelete = async (eventId) => {
   const res = await axios.delete(eventsURL + '/' + eventId);
   return res;
 };
+
+export const requestDeleteAll = async () => {
+  const res = await axios.delete(eventsURL + '/all');
+  return res;
+};

client/src/features/editors/list/EventListWrapper.jsx

@@ -6,6 +6,7 @@ import {
   requestPost,
   requestPut,
   requestDelete,
+  requestDeleteAll,
   requestReorder,
   requestApplyDelay,
 } from 'app/api/eventsApi.js';
@@ -160,6 +161,35 @@ export default function EventListWrapper() {
     },
   });
 
+  const deleteAllEvents = useMutation(requestDeleteAll, {
+    // we optimistically update here
+    onMutate: async () => {
+      // cancel ongoing queries
+      queryClient.cancelQueries(EVENTS_TABLE, { exact: true });
+
+      // Snapshot the previous value
+      const previousEvents = queryClient.getQueryData(EVENTS_TABLE);
+
+      let clear = [];
+
+      // optimistically update object
+      queryClient.setQueryData(EVENTS_TABLE, clear);
+
+      // Return a context with the previous and new todo
+      return { previousEvents };
+    },
+
+    // Mutation fails, rollback undos optimist update
+    onError: (error, eventId, context) => {
+      queryClient.setQueryData(EVENTS_TABLE, context.previousEvents);
+    },
+    // Mutation finished, failed or successful
+    // Fetch anyway, just to be sure
+    onSettled: () => {
+      queryClient.invalidateQueries(EVENTS_TABLE);
+    },
+  });
+
   const applyDelay = useMutation(requestApplyDelay, {
     // Mutation finished, failed or successful
     onSettled: () => {
@@ -298,6 +328,15 @@ export default function EventListWrapper() {
           setCollapsed({ clear: true, items: data, isCollapsed: false });
           break;
 
+        case 'deleteall':
+          try {
+            let t = Date.now();
+            await deleteAllEvents.mutateAsync();
+            console.log('debug m deleteall', Date.now() - t);
+          } catch (error) {
+            showErrorToast('Error deleting events', error.message);
+          }
+          break;
         default:
           showErrorToast('Unrecognised request', action);
           break;

client/src/features/menu/EventListMenu.jsx

@@ -30,6 +30,9 @@ const EventListMenu = ({ eventsHandler }) => {
         }
         SetOption({ cursor: newSet });
         break;
+      case 'deleteall':
+        eventsHandler('deleteall');
+        break;
       default:
         break;
     }

client/src/features/menu/MenuActionButtons.jsx

@@ -1,6 +1,13 @@
 import { Menu, MenuButton, MenuItem, MenuList } from '@chakra-ui/menu';
 import { IconButton } from '@chakra-ui/button';
-import { FiZap, FiPlus, FiClock, FiMinusCircle } from 'react-icons/fi';
+import {
+  FiTrash2,
+  FiZap,
+  FiPlus,
+  FiClock,
+  FiMinusCircle,
+} from 'react-icons/fi';
+import { Divider } from '@chakra-ui/layout';
 
 export default function MenuActionButtons(props) {
   const { actionHandler } = props;
@@ -22,9 +29,6 @@ export default function MenuActionButtons(props) {
         color={'orange.500'}
       />
       <MenuList style={menuStyle}>
-        {/* <MenuItem icon={<FiTrash2 />} onClick={props.deleteAllHandler}>
-          Delete All
-        </MenuItem> */}
         <MenuItem icon={<FiPlus />} onClick={() => actionHandler('event')}>
           Event first
         </MenuItem>
@@ -37,6 +41,14 @@ export default function MenuActionButtons(props) {
         >
           Block first
         </MenuItem>
+        <Divider />
+        <MenuItem
+          icon={<FiTrash2 />}
+          onClick={() => actionHandler('deleteall')}
+          color='red.500'
+        >
+          Delete All
+        </MenuItem>
       </MenuList>
     </Menu>
   );