From 13c256f943a90192ba9c15f3c908fa82a00ad118 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bart=20Ksi=C4=85=C5=BCek?= <bartlomiej.ksiazek@icloud.com>
Date: Mon, 9 Dec 2024 10:23:39 +0100
Subject: [PATCH] fix(portal): push activity log UI issues (#285)

* fix(portal): Push activity log UI issues

* fix(portal): remove unused import
---
 .../components/PushHistoryModal/index.tsx     | 20 ++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/kraken-app/kraken-app-portal/src/pages/EnvironmentActivityLog/components/PushHistoryModal/index.tsx b/kraken-app/kraken-app-portal/src/pages/EnvironmentActivityLog/components/PushHistoryModal/index.tsx
index fbf85f2f..bbd5446f 100644
--- a/kraken-app/kraken-app-portal/src/pages/EnvironmentActivityLog/components/PushHistoryModal/index.tsx
+++ b/kraken-app/kraken-app-portal/src/pages/EnvironmentActivityLog/components/PushHistoryModal/index.tsx
@@ -1,6 +1,6 @@
 import { DatePicker, Flex, Form, Modal, Radio, Spin } from "antd";
 import styles from "./index.module.scss";
-import { useCallback } from "react";
+import { useCallback, useMemo } from "react";
 import { capitalize } from 'lodash';
 import dayjs from 'dayjs';
 import { useGetProductEnvActivitiesMutation } from '@/hooks/product';
@@ -30,7 +30,7 @@ const PushHistoryModal = ({
   const [form] = Form.useForm();
   const { currentProduct } = useAppStore();
 
-  const { data: responseData, mutateAsync: getProductEnvActivities, isPending, isSuccess } = useGetProductEnvActivitiesMutation();
+  const { data: responseData, mutateAsync: getProductEnvActivities, isPending } = useGetProductEnvActivitiesMutation();
   const { mutateAsync: createPushActivityLog } = usePostPushActivityLog();
 
   const handleOK = () => {
@@ -76,6 +76,11 @@ const PushHistoryModal = ({
     []
   );
 
+  const isFormValid = useMemo(() => {
+    const { envId, requestTime } = form.getFieldsValue();
+    return !!(responseData && responseData.data.total > 0 && envId && requestTime)      
+  }, [responseData, form])
+
   return (
     <Modal
       open={isOpen}
@@ -83,7 +88,10 @@ const PushHistoryModal = ({
       onOk={handleOK}
       title="Push log"
       className={styles.modal}
-      okButtonProps={{ disabled: !isSuccess, "data-testid": "pushLog-btn" }}
+      okButtonProps={{
+        disabled: !isFormValid,
+        "data-testid": "pushLog-btn"
+      }}
     >
       <Form
         form={form}
@@ -108,12 +116,12 @@ const PushHistoryModal = ({
           required
           className={styles.rangePicker}
         >
-          <RangePicker placeholder={["Select time", "Select time"]} disabledDate={disabled7DaysDate} />
+          <RangePicker placeholder={["Select time", "Select time"]} disabledDate={disabled7DaysDate} maxDate={dayjs().endOf('day')} />
         </Form.Item>
 
         <Flex justify={isPending ?  "center" : "start"}>
           <Spin spinning={isPending}>
-            {responseData?.data?.total && <Flex vertical className={styles.numberContainer} gap={5}>
+            {responseData?.data && <Flex vertical className={styles.numberContainer} gap={5}>
               <div>
                 Number of activity logs filtered
               </div>
@@ -124,8 +132,6 @@ const PushHistoryModal = ({
             }
           </Spin>
         </Flex>
-
-
       </Form>
     </Modal>
   );