All files / components/Chat ChatMessageCreate.jsx

100% Statements 54/54
100% Branches 5/5
100% Functions 3/3
100% Lines 54/54

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 721x 1x 1x   1x   1x 96x 96x   96x 1x 1x 1x 1x 1x   96x 96x 96x 96x 96x 96x 96x       96x 96x 87x 1x 1x 1x 1x 1x 1x   96x 96x 96x 96x 96x 96x   96x 96x 96x 96x 96x 96x 96x 96x 96x   96x 96x 96x 96x 96x   96x 96x   96x         96x   1x  
import React from "react";
import { Button, Form } from "react-bootstrap";
import { useForm } from "react-hook-form";
 
import { useBackendMutation } from "main/utils/useBackend";
 
const ChatMessageCreate = ({ commonsId, submitAction }) => {
  const testid = "ChatMessageCreate";
  const initialMessagePageSize = 10;
 
  const objectToAxiosParams = (newMessage) => ({
    // Stryker disable next-line all : axiosMock post test works when mutated
    url: `/api/chat/post?commonsId=${newMessage.commonsId}&content=${newMessage.content}`,
    method: "POST",
    data: newMessage,
  });
 
  const mutation = useBackendMutation(
    objectToAxiosParams,
    {},
    // Stryker disable all : hard to set up test for caching
    [
      `/api/chat/get?page=0&size=${initialMessagePageSize}&commonsId=${commonsId}`,
    ],
    // Stryker restore all
  );
 
  submitAction =
    submitAction ||
    (async (data) => {
      const escapedContent = encodeURIComponent(data.message);
      const escapedCommonsId = encodeURIComponent(Number(commonsId));
      const params = { content: escapedContent, commonsId: escapedCommonsId };
      mutation.mutate(params);
      reset();
    });
 
  const {
    register,
    formState: { errors },
    handleSubmit,
    reset,
  } = useForm();
 
  return (
    <Form
      data-testid={testid}
      onSubmit={handleSubmit(submitAction)}
      style={{
        display: "flex",
        justifyContent: "space-between",
        alignItems: "center",
      }}
    >
      <Form.Control
        data-testid={`${testid}-Message`}
        id="message"
        type="text"
        {...register("message", { required: "Message cannot be empty" })}
      />
      <Form.Control.Feedback type="invalid">
        {errors.message?.message}
      </Form.Control.Feedback>
      <Button type="submit" data-testid={`${testid}-Send`}>
        Send
      </Button>
    </Form>
  );
};
 
export default ChatMessageCreate;