@bjsdistribution/dms-client-return 0.1.21-prod → 0.1.22-dev

package/src/components/order-daily-overview/return-order-table/return-orders-filters/ReturnFilter.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import {
   StyledFIlterELements,
   StyledFiter,
@@ -6,14 +6,32 @@ import {
   Text,
 } from '../../filters/FilterStyle';
 import RightFilters from './RightFilters';
-import { useClientPortal, useCustomerData } from '../../../store';
+import {
+  useAtom,
+  useClientPortal,
+  useCustomerData,
+  useSearchAfterText,
+  useSearchText,
+  useStatsCPCount,
+} from '../../../store';
 import { useParams } from 'react-router-dom';
 import ReturnRTFilters from '../../../client-portal/ReturnRTFilters';
+import { returnCountType } from '../../../client-portal/ReturnStatus';
+import { useAxios } from '@bjsdistribution/dms-component-library';
+import { dateFilterCPReducer } from '../../../client-portal/DateFilterStore';
 
 const ReturnFilter = () => {
   const [customers] = useCustomerData();
   const [clientPortal] = useClientPortal();
   const { status } = useParams();
+  const [count, setCount] = useStatsCPCount();
+  const [debouncedSearchAfterText] = useSearchAfterText();
+  const [debouncedSearchText] = useSearchText();
+
+  const [state] = useAtom(dateFilterCPReducer);
+  const { 'x-filters': filters } = state;
+
+  const cleanedFilters = filters.filter(f => f.field !== 'order_status');
 
   const queryParams = new URLSearchParams(location.search);
   const customerId = queryParams.get('customerId');
@@ -32,7 +50,8 @@ const ReturnFilter = () => {
       case 'scheduled_for_return':
         return 'All Scheduled Orders';
       case 'return_completed':
-        return 'View Return Order';
+        // return 'View Return Order';
+        return 'Completed Return';
       default:
         return status
           .replace(/_/g, ' ')
@@ -40,6 +59,31 @@ const ReturnFilter = () => {
     }
   };
 
+  const { data: statsData, loading: statsApiLoading, fetchData } = useAxios<{
+    data: returnCountType[];
+  }>({
+    endpoint: `v1/portal/return/stats/`,
+    method: 'GET',
+    pagination: { is_pagination: false },
+    filters: cleanedFilters,
+  });
+
+  useEffect(() => {
+    if (
+      clientPortal &&
+      debouncedSearchAfterText === '' &&
+      status == 'return_completed'
+    ) {
+      fetchData();
+    }
+  }, [debouncedSearchAfterText, debouncedSearchText, JSON.stringify(filters)]);
+
+  useEffect(() => {
+    if (statsData?.data && typeof statsData?.data === 'object') {
+      setCount(statsData?.data);
+    }
+  }, [statsApiLoading]);
+
   return (
     <>
       <StyledFiter>
@@ -53,7 +97,12 @@ const ReturnFilter = () => {
           </>
         ) : (
           <>
-            <Text>{status ? getStatusLabel(status) : ''}</Text>
+            <Text>
+              {status
+                ? `${getStatusLabel(status)} (${count?.completed_count})`
+                : ''}
+            </Text>
+
             <ReturnRTFilters />
           </>
         )}

package/src/components/order-view/details-filters/left-side-filters/dropdowns/DropDowns.tsx

@@ -1,32 +1,68 @@
-import React from 'react';
+import React, { useState } from 'react';
 import styled from 'styled-components';
 import OptionsDropDown from './OptionsDropDown';
 import Print from '../../../general-information/dropdowns/Print';
 import BjsMenuDropDown from './MenuDropDown';
-import { useCurrentAction, useOrderDetails } from '../../../store';
+import {
+  errorAtom,
+  useAtom,
+  useCurrentAction,
+  useOrderDetails,
+} from '../../../store';
 // components
 
 function DropDowns() {
   const [orderDetails] = useOrderDetails();
   const [, setCurrentAction] = useCurrentAction();
+  const [errors] = useAtom(errorAtom);
+  const [hasNotifiedMobile, setHasNotifiedMobile] = useState(false);
+  const [hasNotifiedEmail, setHasNotifiedEmail] = useState(false);
 
   const isEmailId = orderDetails?.order_recipient?.contact_email;
-  const isContactNum = orderDetails?.order_recipient?.contact_home;
+  // const isContactNum = orderDetails?.order_recipient?.contact_home;
+  const VALID_UK_MOBILE_REGEX = /^(07\d{8,12}|447\d{7,11})$/;
+  const VALID_IRISH_MOBILE_REGEX = /^(08[35679]\d{7}|3538[35679]\d{7}|\+3538[35679]\d{7})$/;
+
+  const isValidUKMobile = (number: string | null | undefined): boolean =>
+    typeof number === 'string' && VALID_UK_MOBILE_REGEX.test(number);
+  const isValidIrishMobile = (number: string | null | undefined): boolean =>
+    typeof number === 'string' && VALID_IRISH_MOBILE_REGEX.test(number);
+  const isValidMobile = (number: string | null | undefined): boolean =>
+    isValidUKMobile(number) || isValidIrishMobile(number);
+
+  const contactMobile = orderDetails?.order_recipient?.contact_mobile;
+  const contactHome = orderDetails?.order_recipient?.contact_home;
+  const contactWork = orderDetails?.order_recipient?.contact_work;
+
+  const allContacts = [contactMobile, contactHome, contactWork];
+  const hasValidMobile = allContacts.some(isValidMobile);
 
   const actions = [];
 
-  if (isContactNum) {
-    actions?.push({
-      label: 'Send SMS',
-      onClick: () => setCurrentAction('send-sms'),
-    });
+  if (hasValidMobile) {
+    if (errors?.mobileError) {
+      if (!hasNotifiedMobile) {
+        setHasNotifiedMobile(true);
+      }
+    } else {
+      actions.push({
+        label: 'Send SMS',
+        onClick: () => setCurrentAction('send-sms'),
+      });
+    }
   }
 
   if (isEmailId) {
-    actions?.push({
-      label: 'Send Email',
-      onClick: () => setCurrentAction('send-email'),
-    });
+    if (errors?.emailError) {
+      if (!hasNotifiedEmail) {
+        setHasNotifiedEmail(true);
+      }
+    } else {
+      actions.push({
+        label: 'Send Email',
+        onClick: () => setCurrentAction('send-email'),
+      });
+    }
   }
 
   return (

package/src/components/order-view/general-information/dropdowns/Print.tsx

@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import styled from 'styled-components';
 import { PrintMenu } from '../../fakedata';
-import { useOrderDetails, useOrderStaticData } from '../../store';
+import { useOrderDetails } from '../../store';
 import { Dropdown, Space } from 'antd';
 import ArrowDownIcon from '../../../../assets/icons/ArrowDownIcon';
 import { getBaseEndpoint } from '@bjsdistribution/dms-component-library';
@@ -13,11 +13,6 @@ function Print() {
   const orderId = useMemo(() => {
     return orderDetails?.id;
   }, [orderDetails]);
-  //new
-  const [orderStaticData] = useOrderStaticData();
-  const orderTypeID = useMemo(() => {
-    return orderDetails?.order_type_id;
-  }, [orderDetails]);
 
   const getEnvironment = ():
     | 'development'
@@ -100,17 +95,18 @@ function Print() {
     }
   };
 
-  const isOptionDisabled = (optionValue: any) => {
-    const orderType = orderStaticData?.order_type?.find(
-      (type: any) => type?.id === orderTypeID
-    );
-    if (optionValue === 'ordercovernote') {
-      if (orderType?.type === 'return') {
-        return false;
-      }
-      return true;
-    }
-    return false;
+  const optionToLabelKey: Record<string, keyof typeof orderDetails.labels> = {
+    proofofdelivery: 'deliver',
+    returnlabels: 'return',
+    returncovernote: 'collect',
+  };
+
+  const isOptionDisabled = (optionValue: string) => {
+    const labels = orderDetails?.labels || {};
+    const labelKey = optionToLabelKey[optionValue];
+
+    if (!labelKey) return false;
+    return !labels[labelKey];
   };
 
   const filteredOptions = PrintMenu?.map((option: any) => ({

package/src/components/order-view/modalsPopup/ModalManager.tsx

@@ -103,12 +103,20 @@ const ModalManager = () => {
       setShouldPerformAction(false);
       setSelectAll(false);
       setError(null);
+      //@ts-ignore
+      const orderId = response?.data?.[0]?.order_id;
+
+      if (orderId) {
+        navigate(`/orders/view/return/?order=${orderId}`);
+      } else {
+        navigate('/orders/view/return/overview');
+      }
 
       // for local
       // navigate('/overview');
 
       // for dev
-      navigate('/orders/view/return/overview');
+      //navigate('/orders/view/return/overview');
     }
   }, [postLoading]);
 

package/src/components/order-view/notes/logs/index.tsx

@@ -11,7 +11,9 @@ function AuditLogs() {
 }
 
 const Container = styled.div`
-  height: 550px; /* Set height to limit container size */
+  height: 500px;
+  min-height: 200px;
+  max-height: 500px;
   overflow: auto; /* Enable scrolling */
   scrollbar-width: thin;
 `;

package/src/components/order-view/order-actions/actions/add-resources/DocFileUpload.tsx

@@ -7,8 +7,8 @@ import { notification } from 'antd';
 // Store uploaded files
 export const uploadedFilesAtom = atom<File[]>([]);
 
-// Allowed photo MIME types
-const allowedFileTypes = ['image/jpeg', 'image/png'];
+// Allowed file MIME types
+const allowedFileTypes = ['image/jpeg', 'image/png', 'application/pdf'];
 
 function DocFileUpload() {
   const [uploadedFiles, setUploadedFiles] = useAtom(uploadedFilesAtom);
@@ -53,7 +53,7 @@ function DocFileUpload() {
     if (rejectedFiles?.length > 0) {
       notification.error({
         message: 'Some files were not added',
-        description: 'Either they were duplicates or not JPEG/PNG format.',
+        description: 'Either they were duplicates or not JPEG/PNG/PDF format.',
       });
     }
   };
@@ -112,7 +112,7 @@ function DocFileUpload() {
           </IconContainer>
           <TextContainer>
             <Text1>or drag and drop your files</Text1>
-            <Text2>Photos (JPEG, PNG) Only</Text2>
+            <Text2>Photos (JPEG, PNG) or PDF documents</Text2>
           </TextContainer>
         </Container>
       </DraggerContainer>

package/src/components/order-view/order-actions/actions/charge-log/index.tsx

@@ -3,6 +3,7 @@ import { useAxios } from '@bjsdistribution/dms-component-library';
 import {
   useCurrentAction,
   useCustomerInfo,
+  usegetClientData,
   useOrderDetails,
 } from '../../../store';
 import { ApiResponse } from '../../../types';
@@ -10,12 +11,16 @@ import OrderActionModal from '../../../../../common/modals/order-action-modal/Or
 import { Empty, Skeleton } from 'antd';
 
 import styled from 'styled-components';
+import { ClientType } from '../../../../order-daily-overview/common/interface';
+import { getBaseUrlSymbol } from '../../../utils';
 
 function ChargeLog() {
   const [, setCurrentAction] = useCurrentAction();
   const [customerInfo] = useCustomerInfo();
   const infoText = `${customerInfo?.recipient_name}, ${customerInfo?.postcode}`;
   const [orderDetails] = useOrderDetails();
+  const baseUrlSymbol = getBaseUrlSymbol();
+  const [clientData] = usegetClientData();
 
   const closeModal = () => {
     setCurrentAction(undefined);
@@ -71,11 +76,31 @@ function ChargeLog() {
               fetchedData?.data?.map((order: any) => {
                 const label = order?.status?.split(':')[0];
                 const val = order?.status?.split(':')[1];
+                const baseUrl = clientData?.filter(
+                  (client: ClientType) => client?.client_id === order?.client_id
+                )[0]?.url;
+
+                const redirectionLink =
+                  baseUrl + `/finance/order/${order?.debrief_id}`;
                 return (
                   <tr>
                     <td>{order?.date}</td>
                     <td>{order?.description}</td>
-                    <td>{order?.amount}</td>
+                    <td>
+                      <a
+                        style={{
+                          color: '#09F',
+                          cursor: 'pointer',
+                          textDecoration: 'none',
+                        }}
+                        href={`https://${redirectionLink}`}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                      >
+                        {baseUrlSymbol}
+                        {order?.amount}
+                      </a>
+                    </td>
                     <td>
                       <div
                         style={{

package/src/components/order-view/order-actions/actions/confirm-order/customer-info/DeliveryDate.tsx

@@ -55,9 +55,7 @@ function DeliveryDate() {
             : null
         }
         style={{ borderRadius: '15px', minWidth: '60px' }}
-        disabledDate={current =>
-          current && current.isBefore(dayjs().startOf('day'))
-        }
+        disabledDate={() => false}
         allowClear={false}
       />
     </Container>

package/src/components/order-view/order-actions/actions/create-task-reminder/CreateReminderModal.tsx

@@ -228,10 +228,13 @@ function CreateReminderModal() {
     }
   }, [fetchData]);
 
-  const userOptions = filteredUsers?.map((user: any) => ({
-    label: `${user.fName} ${user.lName}`,
-    value: user.id,
-  }));
+  const userOptions =
+    selectedDeptId?.length > 0
+      ? filteredUsers?.map((user: any) => ({
+          label: `${user.fName} ${user.lName}`,
+          value: user.id,
+        }))
+      : [];
 
   const handleAssignToMe = () => {
     const storedUserJSON = localStorage.getItem('user_type');

package/src/components/order-view/order-actions/actions/force-debrief/ForceDebriefModal.tsx

@@ -267,7 +267,15 @@ function ForceDebriefModal(props: IProps) {
       orderDetails
     );
 
-    const serviceKeys = [
+    type ServiceKey =
+      | 'assemble'
+      | 'disassemble'
+      | 'unpack_items'
+      | 'collect_disposal'
+      | 'take_packaging_away'
+      | 'assembly_type';
+
+    const serviceKeys: ServiceKey[] = [
       'assemble',
       'disassemble',
       'unpack_items',
@@ -276,28 +284,21 @@ function ForceDebriefModal(props: IProps) {
       'assembly_type',
     ];
 
-    let orderServicesPayload: Record<string, any> = {};
-
-    const includesKey = serviceKeys.some(key => key in ordersApiPayload);
-
-    if (includesKey) {
-      for (const key of serviceKeys) {
-        orderServicesPayload[key as keyof typeof ordersApiPayload] =
-          key in ordersApiPayload
-            ? ordersApiPayload[key as keyof typeof ordersApiPayload]
-            : orderDetails[key as keyof OrdersType];
-        delete ordersApiPayload[key as keyof typeof ordersApiPayload];
-        if (
-          orderServicesPayload?.assemble === false &&
-          orderServicesPayload?.disassemble === false
-        ) {
-          orderServicesPayload.assembly_type = null;
-        }
+    for (const key of serviceKeys) {
+      if (key in ordersApiPayload) {
+        (ordersApiPayload as Record<ServiceKey, any>)[key] =
+          ordersApiPayload[key as keyof typeof ordersApiPayload];
+      } else if (key in orderDetails) {
+        (ordersApiPayload as Record<ServiceKey, any>)[key] =
+          orderDetails[key as keyof OrdersType];
       }
     }
 
-    if (Object.keys(orderServicesPayload).length > 0) {
-      ordersApiPayload.order_services = [orderServicesPayload];
+    if (
+      ordersApiPayload?.assemble === false &&
+      ordersApiPayload?.disassemble === false
+    ) {
+      ordersApiPayload.assembly_type = null;
     }
 
     try {

package/src/components/order-view/order-actions/actions/send-sms/SendSmsModal.tsx

@@ -1,31 +1,27 @@
 import React, { useState } from 'react';
 import { useCurrentAction, useOrderDetails, useOrderId } from '../../../store';
 import OrderActionModal from '../../../../../common/modals/order-action-modal/OrderActionModal';
-import { ContentContainer, Label, StyledInput } from '../modalstyle';
-import { TextArea, useAxios } from '@bjsdistribution/dms-component-library';
+import { Label, StyledInput } from '../modalstyle';
+import { useAxios } from '@bjsdistribution/dms-component-library';
 import { ApiResponse } from '../../../types';
 import styled from 'styled-components';
-
-const CustomTextArea = styled(TextArea)`
-  width: 700px;
-  height: 140px;
-  resize: none;
-`;
-
-const ErrorText = styled.div`
-  color: red;
-  font-size: 12px;
-  margin-top: 4px;
-`;
+import { notification } from 'antd';
+import TextArea from 'antd/es/input/TextArea';
 
 function SendSmsModal() {
   const [, setCurrentAction] = useCurrentAction();
   const [orderDetails] = useOrderDetails();
   const [orderId] = useOrderId();
-  const initialTo = orderDetails?.order_recipient?.contact_home || '';
+  const VALID_UK_MOBILE_REGEX = /^(07\d{8,12}|447\d{7,11})$/;
   const [toError, setToError] = useState('');
   const [formData, setFormData] = useState({
-    to: initialTo,
+    to: [
+      orderDetails?.order_recipient?.contact_mobile,
+      orderDetails?.order_recipient?.contact_home,
+      orderDetails?.order_recipient?.contact_work,
+    ]
+      .filter(Boolean)
+      .join(', '),
     body: '',
   });
 
@@ -42,54 +38,83 @@ function SendSmsModal() {
     const { name, value } = e.target;
 
     if (name === 'to') {
-      const digitsOnly = value.replace(/\D/g, '');
-      let error = '';
-
-      if (digitsOnly.length < 10) {
-        error = 'Phone number must be exactly 10 digits';
-      } else if (digitsOnly.length > 10) {
-        error = 'Phone number cannot exceed 10 digits';
+      const rawValue = value;
+      const numbers = rawValue.split(',').map(num => num.trim());
+      const invalids = numbers.filter(num => !VALID_UK_MOBILE_REGEX.test(num));
+
+      if (invalids.length === numbers.length) {
+        setToError('Enter at least one valid UK mobile number.');
+      } else {
+        setToError('');
       }
-
-      setToError(error);
-
-      setFormData(prev => ({
-        ...prev,
-        to: digitsOnly.slice(0, 10),
-      }));
+      setFormData(prev => ({ ...prev, to: rawValue }));
     } else {
-      setFormData(prev => ({
-        ...prev,
-        [name]: value,
-      }));
+      setFormData(prev => ({ ...prev, [name]: value }));
     }
   };
 
   const handleSubmit = async () => {
-    const trimmedTo = formData?.to?.trim();
     const trimmedBody = formData?.body?.trim();
+    if (!trimmedBody) return;
 
-    if (trimmedTo.length !== 10) {
-      setToError('Phone number must be exactly 10 digits');
-      return;
-    }
+    const rawContacts = formData.to.split(',').map(num => num.trim());
 
-    const payload = {
-      order_id: +orderId,
-      receiver: trimmedTo,
-      message: trimmedBody,
-      notification_type: 'Send SMS',
-    };
+    const validContacts = rawContacts.filter(num =>
+      VALID_UK_MOBILE_REGEX.test(num)
+    );
 
-    if (!trimmedTo || !trimmedBody) {
+    if (validContacts.length === 0) {
+      notification.warning({
+        message: 'No Valid UK Mobile Numbers',
+        description:
+          'Please provide at least one valid UK mobile number (e.g., 07123...).',
+      });
       return;
     }
 
     try {
-      await callSendSms({ payload: payload });
+      for (const number of validContacts) {
+        const payload = {
+          order_id: +orderId,
+          receiver: number,
+          message: trimmedBody,
+          notification_type: 'Send SMS',
+        };
+
+        const response = (await callSendSms({ payload })) as {
+          code: number | null;
+          error?: string | null;
+          message?: string;
+          [key: string]: any;
+        };
+
+        if (response.code === 200) {
+          notification.success({
+            message: 'SMS Sent',
+            description: `Message sent to ${number}`,
+          });
+        } else {
+          notification.error({
+            message: 'SMS Failed',
+            description: `Failed to send to ${number}: ${response?.error ||
+              'Unknown error'}`,
+          });
+        }
+      }
+
       closeModal();
     } catch (error) {
-      console.error('Error sending SMS:', error);
+      const err = error as any;
+      const errMsg =
+        err?.response?.data?.error ||
+        err?.response?.data?.message ||
+        err?.message ||
+        'An unexpected error occurred.';
+
+      notification.error({
+        message: 'Request Failed',
+        description: errMsg,
+      });
     }
   };
 
@@ -98,7 +123,7 @@ function SendSmsModal() {
   };
 
   const isFormValid =
-    formData?.to.trim()?.length === 10 &&
+    formData?.to.trim()?.length > 0 &&
     !toError &&
     formData?.body.trim().length > 0;
 
@@ -119,21 +144,49 @@ function SendSmsModal() {
           onChange={handleInputChange}
           required
           placeholder="Enter the number"
-          maxLength={10}
         />
         {toError && <ErrorText>{toError}</ErrorText>}
 
         <Label>Body</Label>
-        <CustomTextArea
+        <TextArea
+          style={{ width: '700px', height: '140px', resize: 'none' }}
           name="body"
           value={formData.body}
           onChange={handleInputChange}
           required
           placeholder="Write here..."
+          maxLength={500}
+          count={{
+            show: true,
+            max: 500,
+          }}
         />
       </ContentContainer>
     </OrderActionModal>
   );
 }
 
+export const ContentContainer = styled.div`
+  display: flex;
+  padding: 20px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  gap: 15px;
+  flex: 1 0 0;
+  border-radius: 15px;
+`;
+
+// const CustomTextArea = styled(TextArea)`
+//   width: 700px;
+//   height: 140px;
+//   resize: none;
+// `;
+
+const ErrorText = styled.div`
+  color: red;
+  font-size: 12px;
+  margin-top: 4px;
+`;
+
 export default SendSmsModal;