Implemented deleteImage API, state and tests

Author: Gabriel Tira

packages/common/src/state/actions/deletedOneImage.ts

@@ -0,0 +1,54 @@
+import { MonkState } from '../state';
+import { MonkAction, MonkActionType } from './monkAction';
+
+export interface MonkDeletedOneImagePayload {
+  /**
+   * The ID of the inspection to which the image was deleted.
+   */
+  inspectionId: string;
+  /**
+   * The image ID deleted.
+   */
+  imageId: string;
+}
+
+/**
+ * Action dispatched when an image have been deleted.
+ */
+export interface MonkDeletedOneImageAction extends MonkAction {
+  /**
+   * The type of the action : `MonkActionType.DELETED_ONE_IMAGE`.
+   */
+  type: MonkActionType.DELETED_ONE_IMAGE;
+  /**
+   * The payload of the action containing the fetched entities.
+   */
+  payload: MonkDeletedOneImagePayload;
+}
+
+/**
+ * Matcher function that matches a DeletedOneImage while also inferring its type using TypeScript's type predicate
+ * feature.
+ */
+export function isDeletedOneImageAction(action: MonkAction): action is MonkDeletedOneImageAction {
+  return action.type === MonkActionType.DELETED_ONE_IMAGE;
+}
+
+/**
+ * Reducer function for a deletedOneImage action.
+ */
+export function deletedOneImage(state: MonkState, action: MonkDeletedOneImageAction): MonkState {
+  const { images, inspections } = state;
+  const { payload } = action;
+
+  const inspection = inspections.find((value) => value.id === payload.inspectionId);
+  if (inspection) {
+    inspection.images = inspection.images?.filter((imageId) => imageId !== payload.imageId);
+  }
+  const newImages = images.filter((image) => image.id !== payload.imageId);
+  return {
+    ...state,
+    images: [...newImages],
+    inspections: [...inspections],
+  };
+}

packages/common/src/state/actions/index.ts

@@ -2,6 +2,7 @@ export * from './monkAction';
 export * from './resetState';
 export * from './gotOneInspection';
 export * from './createdOneImage';
+export * from './deletedOneImage';
 export * from './updatedManyTasks';
 export * from './updatedVehicle';
 export * from './createdOnePricing';

packages/common/src/state/actions/monkAction.ts

@@ -14,6 +14,10 @@ export enum MonkActionType {
    * An image has been uploaded to the API.
    */
   CREATED_ONE_IMAGE = 'created_one_image',
+  /**
+   * An image has been deleted.
+   */
+  DELETED_ONE_IMAGE = 'deleted_one_image',
   /**
    * One or more tasks have been updated.
    */

packages/common/src/state/reducer.ts

@@ -24,6 +24,8 @@ import {
   isDeletedOneDamageAction,
   isGotOneInspectionPdfAction,
   gotOneInspectionPdf,
+  deletedOneImage,
+  isDeletedOneImageAction,
 } from './actions';
 import { MonkState } from './state';
 
@@ -43,6 +45,9 @@ export function monkReducer(state: MonkState, action: MonkAction): MonkState {
   if (isCreatedOneImageAction(action)) {
     return createdOneImage(state, action);
   }
+  if (isDeletedOneImageAction(action)) {
+    return deletedOneImage(state, action);
+  }
   if (isUpdatedManyTasksAction(action)) {
     return updatedManyTasks(state, action);
   }

packages/common/test/state/actions/deletedOneImage.test.ts

@@ -0,0 +1,56 @@
+import { Image, Inspection } from '@monkvision/types';
+import {
+  createEmptyMonkState,
+  deletedOneImage,
+  isDeletedOneImageAction,
+  MonkActionType,
+  MonkDeletedOneImageAction,
+} from '../../../src';
+
+const action: MonkDeletedOneImageAction = {
+  type: MonkActionType.DELETED_ONE_IMAGE,
+  payload: {
+    inspectionId: 'inspections-test',
+    imageId: 'image-id-test',
+  },
+};
+
+describe('DeletedOneImage action handlers', () => {
+  describe('Action matcher', () => {
+    it('should return true if the action has the proper type', () => {
+      expect(isDeletedOneImageAction({ type: MonkActionType.DELETED_ONE_IMAGE })).toBe(true);
+    });
+
+    it('should return false if the action does not have the proper type', () => {
+      expect(isDeletedOneImageAction({ type: MonkActionType.RESET_STATE })).toBe(false);
+    });
+  });
+
+  describe('Action handler', () => {
+    it('should return a new state', () => {
+      const state = createEmptyMonkState();
+      expect(Object.is(deletedOneImage(state, action), state)).toBe(false);
+    });
+
+    it('should delete image in the state', () => {
+      const state = createEmptyMonkState();
+      state.inspections.push({
+        id: action.payload.inspectionId,
+        images: [action.payload.imageId] as string[],
+      } as Inspection);
+      state.images.push({
+        id: action.payload.imageId,
+        inspectionId: action.payload.inspectionId,
+      } as Image);
+      const newState = deletedOneImage(state, action);
+      const inspectionImages = newState.inspections.find(
+        (ins) => ins.id === action.payload.inspectionId,
+      )?.images;
+
+      expect(inspectionImages?.length).toBe(0);
+      expect(inspectionImages).not.toContainEqual(action.payload.imageId);
+      expect(newState.images.length).toBe(0);
+      expect(newState.images.find((image) => image.id === action.payload.imageId)).toBeUndefined();
+    });
+  });
+});

packages/common/test/state/reducer.test.ts

@@ -1,5 +1,6 @@
 jest.mock('../../src/state/actions', () => ({
   isCreatedOneImageAction: jest.fn(() => false),
+  isDeletedOneImageAction: jest.fn(() => false),
   isGotOneInspectionAction: jest.fn(() => false),
   isResetStateAction: jest.fn(() => false),
   isUpdatedManyTasksAction: jest.fn(() => false),
@@ -12,6 +13,7 @@ jest.mock('../../src/state/actions', () => ({
   isUpdatedVehicleAction: jest.fn(() => false),
   isGotOneInspectionPdfAction: jest.fn(() => false),
   createdOneImage: jest.fn(() => null),
+  deletedOneImage: jest.fn(() => null),
   gotOneInspection: jest.fn(() => null),
   resetState: jest.fn(() => null),
   updatedManyTasks: jest.fn(() => null),
@@ -27,6 +29,7 @@ jest.mock('../../src/state/actions', () => ({
 
 import {
   createdOneImage,
+  deletedOneImage,
   gotOneInspection,
   createdOnePricing,
   deletedOnePricing,
@@ -37,6 +40,7 @@ import {
   updatedVehicle,
   gotOneInspectionPdf,
   isCreatedOneImageAction,
+  isDeletedOneImageAction,
   isGotOneInspectionAction,
   isResetStateAction,
   isUpdatedManyTasksAction,
@@ -59,6 +63,7 @@ const actions = [
   { matcher: isResetStateAction, handler: resetState, noParams: true },
   { matcher: isGotOneInspectionAction, handler: gotOneInspection },
   { matcher: isCreatedOneImageAction, handler: createdOneImage },
+  { matcher: isDeletedOneImageAction, handler: deletedOneImage },
   { matcher: isUpdatedManyTasksAction, handler: updatedManyTasks },
   { matcher: isCreatedOnePricingAction, handler: createdOnePricing },
   { matcher: isDeletedOnePricingAction, handler: deletedOnePricing },

packages/network/src/api/image/requests.ts

@@ -5,6 +5,7 @@ import {
   MonkActionType,
   MonkCreatedOneImageAction,
   vehiclePartLabels,
+  MonkDeletedOneImageAction,
 } from '@monkvision/common';
 import {
   ComplianceOptions,
@@ -22,7 +23,13 @@ import {
 import { v4 } from 'uuid';
 import { labels, sights } from '@monkvision/sights';
 import { getDefaultOptions, MonkApiConfig } from '../config';
-import { ApiCenterOnElement, ApiImage, ApiImagePost, ApiImagePostTask } from '../models';
+import {
+  ApiCenterOnElement,
+  ApiIdColumn,
+  ApiImage,
+  ApiImagePost,
+  ApiImagePostTask,
+} from '../models';
 import { MonkApiResponse } from '../types';
 import { mapApiImage } from './mappers';
 
@@ -593,3 +600,44 @@ export async function addImage(
     throw err;
   }
 }
+
+interface DeleteImageOptions {
+  /**
+   * The ID of the inspection to update via the API.
+   */
+  id: string;
+  /**
+   * Image ID that will be deleted.
+   */
+  imageId: string;
+}
+
+export async function deleteImage(
+  options: DeleteImageOptions,
+  config: MonkApiConfig,
+  dispatch?: Dispatch<MonkDeletedOneImageAction>,
+): Promise<MonkApiResponse> {
+  const kyOptions = getDefaultOptions(config);
+  try {
+    const response = await ky.delete(
+      `inspections/${options.id}/images/${options.imageId}`,
+      kyOptions,
+    );
+    const body = await response.json<ApiIdColumn>();
+    dispatch?.({
+      type: MonkActionType.DELETED_ONE_IMAGE,
+      payload: {
+        inspectionId: options.id,
+        imageId: options.imageId,
+      },
+    });
+    return {
+      id: body.id,
+      response,
+      body,
+    };
+  } catch (err) {
+    console.error(`Failed to delete image: ${(err as Error).message}`);
+    throw err;
+  }
+}