feat: applicant messenger should be disabled if app is in a batch (hl…

…-1059) (#2619)

* feat: add possibility to disable message TextArea

* feat: disable applicant's new message form if app is in batch

backend/benefit/applications/api/v1/serializers/application.py

@@ -1322,6 +1322,13 @@ def to_representation(self, value):
         return super().to_representation(value_shown_to_applicant)
 
 
+class SimpleApplicationBatchSerializer(serializers.ModelSerializer):
+    def to_representation(self, instance):
+        if instance:
+            return True
+        return None
+
+
 class ApplicantApplicationSerializer(BaseApplicationSerializer):
     status = ApplicantApplicationStatusChoiceField(
         choices=ApplicationStatus.choices,
@@ -1332,6 +1339,16 @@ class ApplicantApplicationSerializer(BaseApplicationSerializer):
         ),
     )
 
+    batch = SimpleApplicationBatchSerializer(
+        allow_null=True,
+        required=False,
+    )
+
+    def get_batch(self, _):
+        if self.batch:
+            return True
+        return None
+
     def get_company_for_new_application(self, _):
         """
         Company field is read_only. When creating a new application, assign company.
@@ -1346,6 +1363,9 @@ def update(self, instance, validated_data):
             )
         return self._base_update(instance, validated_data)
 
+    class Meta(BaseApplicationSerializer.Meta):
+        fields = BaseApplicationSerializer.Meta.fields + ["batch"]
+
 
 class HandlerApplicationSerializer(BaseApplicationSerializer):
     """

backend/benefit/applications/tests/test_applications_api.py

@@ -296,15 +296,25 @@ def test_application_single_read_as_applicant(
 ):
     application.status = actual_status
     application.save()
+
     response = api_client.get(get_detail_url(application))
+    assert response.status_code == 200
+
     assert response.data["ahjo_decision"] is None
     assert response.data["application_number"] is not None
     assert response.data["status"] == visible_status
-    assert "batch" not in response.data
+    assert response.data["batch"] is None
     assert Decimal(response.data["duration_in_months_rounded"]) == duration_in_months(
         application.start_date, application.end_date, decimal_places=2
     )
+
+    application.batch = ApplicationBatchFactory()
+    application.save()
+
+    response = api_client.get(get_detail_url(application))
+
     assert response.status_code == 200
+    assert response.data["batch"] is True
 
 
 @pytest.mark.parametrize(

frontend/benefit/applicant/public/locales/en/common.json

@@ -607,7 +607,8 @@
     "send": "Submit",
     "isSecure": "Messages are encrypted",
     "noMessages": "No messages",
-    "close": "Close"
+    "close": "Close",
+    "cannotWriteNewMessages": "Your application is being processed. You cannot write a new message right now. Please wait for your application to be processed."
   },
   "application": {
     "tooltipShowInfo": "Show information"

frontend/benefit/applicant/public/locales/fi/common.json

@@ -607,7 +607,8 @@
     "send": "Lähetä",
     "isSecure": "Viestit ovat salattuja",
     "noMessages": "Ei viestejä",
-    "close": "Sulje"
+    "close": "Sulje",
+    "cannotWriteNewMessages": "Hakemuksesi käsittely on käynnissä. Et voi kirjoittaa uutta viestiä juuri nyt. Ole hyvä ja odota hakemuksesi käsittelyä."
   },
   "application": {
     "tooltipShowInfo": "Näytä info"

frontend/benefit/applicant/public/locales/sv/common.json

@@ -607,7 +607,8 @@
     "send": "Skicka",
     "isSecure": "Meddelandena är skyddade",
     "noMessages": "Inga meddelanden",
-    "close": "Stäng"
+    "close": "Stäng",
+    "cannotWriteNewMessages": "Din ansökan behandlas. Du kan inte skriva ett nytt meddelande just nu. Vänta tills din ansökan behandlas."
   },
   "application": {
     "tooltipShowInfo": "Visa information"

frontend/benefit/applicant/src/components/header/Header.tsx

@@ -22,6 +22,7 @@ const Header: React.FC = () => {
     isMessagesDrawerVisible,
     handleLanguageChange,
     setMessagesDrawerVisiblity,
+    canWriteNewMessages,
   } = useHeader();
   const router = useRouter();
   const { asPath } = router;
@@ -83,6 +84,7 @@ const Header: React.FC = () => {
         <Messenger
           isOpen={isMessagesDrawerVisible}
           onClose={() => setMessagesDrawerVisiblity(false)}
+          canWriteNewMessages={canWriteNewMessages}
           customItemsMessages={
             <$CustomMessagesActions>
               <IconLock />

frontend/benefit/applicant/src/components/header/useHeader.ts

@@ -22,6 +22,7 @@ type ExtendedComponentProps = {
   unreadMessagesCount: number | undefined | null;
   setMessagesDrawerVisiblity: (state: boolean) => void;
   isMessagesDrawerVisible: boolean;
+  canWriteNewMessages: boolean;
 };
 
 const useHeader = (): ExtendedComponentProps => {
@@ -45,6 +46,7 @@ const useHeader = (): ExtendedComponentProps => {
   );
 
   const { data: application } = useApplicationQuery(id);
+  const canWriteNewMessages = !application?.batch;
 
   useEffect(() => {
     if (application?.unread_messages_count) {
@@ -103,6 +105,7 @@ const useHeader = (): ExtendedComponentProps => {
     hasMessenger,
     unreadMessagesCount,
     isMessagesDrawerVisible,
+    canWriteNewMessages,
   };
 };
 

frontend/benefit/applicant/src/components/messenger/Messenger.tsx

@@ -11,12 +11,14 @@ interface ComponentProps {
   isOpen: boolean;
   onClose?: () => void;
   customItemsMessages?: React.ReactNode;
+  canWriteNewMessages?: boolean;
 }
 
 const Messenger: React.FC<ComponentProps> = ({
   isOpen,
   onClose,
   customItemsMessages,
+  canWriteNewMessages,
 }) => {
   const { t, messages, handleSendMessage } = useMessenger(isOpen);
 
@@ -39,6 +41,8 @@ const Messenger: React.FC<ComponentProps> = ({
         >
           <Messages data={messages} variant="message" withScroll />
           <Actions
+            canWriteNewMessages={canWriteNewMessages}
+            disabledText={t('common:messenger.cannotWriteNewMessages')}
             customItems={customItemsMessages}
             sendText={t('common:messenger.send')}
             errorText={t('common:form.validation.string.max', { max: 1024 })}

frontend/shared/src/components/messaging/Actions.tsx

@@ -1,4 +1,5 @@
 import { Button, TextArea } from 'hds-react';
+import { useTranslation } from 'next-i18next';
 import React from 'react';
 import { useTheme } from 'styled-components';
 
@@ -12,6 +13,8 @@ interface ActionProps {
   maxLength?: number;
   notification?: string;
   onSend: (message: string) => void;
+  canWriteNewMessages?: boolean;
+  disabledText?: string;
 }
 
 const Actions: React.FC<ActionProps> = ({
@@ -22,6 +25,8 @@ const Actions: React.FC<ActionProps> = ({
   maxLength = 1024,
   notification,
   onSend,
+  canWriteNewMessages = true,
+  disabledText = '',
 }) => {
   const theme = useTheme();
   const componentId = 'MessagesForm_Message';
@@ -41,6 +46,7 @@ const Actions: React.FC<ActionProps> = ({
       {notification && <$Notification>{notification}</$Notification>}
       <$Actions>
         <TextArea
+          disabled={!canWriteNewMessages}
           id={componentId}
           css={`
             margin-bottom: ${theme.spacing.s};
@@ -51,6 +57,9 @@ const Actions: React.FC<ActionProps> = ({
           value={messageValue}
           invalid={!isValid}
           aria-invalid={!isValid}
+          required={canWriteNewMessages}
+          hideLabel={canWriteNewMessages && disabledText.length === 0}
+          label={canWriteNewMessages ? placeholder : disabledText}
           errorText={isValid ? '' : errorText}
         />
         <$FormActions>
@@ -59,7 +68,7 @@ const Actions: React.FC<ActionProps> = ({
             type="submit"
             theme="coat"
             size="small"
-            disabled={!messageValue || !isValid}
+            disabled={!messageValue || !isValid || !canWriteNewMessages}
             onClick={handleSend}
           >
             {sendText}