Uci diksha demo

src/api/api-util-functions.ts

@@ -9,6 +9,7 @@ import { history } from "../utils/history";
 import { updateBot } from "./updateBot";
 import { mapToSegment } from "./segment-mapping";
 
+
 export const onBotCreate = () => {
   const store: any = useStore.getState();
   store.startLoading();
@@ -49,25 +50,27 @@ export const onBotCreate = () => {
         text: store?.state?.startingMessage,
         botId: res.data.result.id,
       });
-      onMappingBotToSegment({
-        queryParams: {
-          text: reqObj.startingMessage,
-          botId: res.data.result.id,
-        }
-      }).then((res) => {
-          if(store?.isBroadcastBot){
-            onSegmentCreate()
-          }
-          else {
-            store?.stopLoading();
-            store.onReset();
-            history.navigate("/success");
-          }
+      if (store?.isBroadcastBot) {
+        onMappingBotToSegment({
+          queryParams: {
+            text: reqObj.startingMessage,
+            botId: res.data.result.id,
+          },
         })
-        .catch((err) => {
-          toast.error(err?.message);
-          store.stopLoading();
-        });
+          .then((res) => {
+            if (store?.isBroadcastBot) {
+              onSegmentCreate();
+            } else {
+              store?.stopLoading();
+              store.onReset();
+              history.navigate("/success");
+            }
+          })
+          .catch((err) => {
+            toast.error(err?.message);
+            store.stopLoading();
+          });
+      }
     })
     .catch((err) => {
       store?.stopLoading();
@@ -115,13 +118,6 @@ export const onSegmentCreate = () => {
     });
 };
 
-export const afterBroadcastBotLogic = () => {
-  const store: any = useStore.getState();
-  if (store?.conversationLogic.length <= store?.broadcastBotLogics.length) {
-    store?.setConversationLogic(store?.broadcastBotLogics);
-    onBotCreate();
-  }
-};
 
 export const onStartConversation = (bot) => {
   const store: any = useStore.getState();
@@ -192,7 +188,7 @@ export const onCreateBroadcastBotLogic = () => {
   console.log({ store });
   console.log({state:store.state})
   for (const botLogic of store?.conversationLogic) {
-    console.log({ botLogic });
+
     const newBotLogic = {
       ...botLogic,
       adapter: process.env.REACT_APP_broadcastAdapterId,
@@ -222,11 +218,8 @@ export const onCreateBroadcastBotLogic = () => {
             ],
             templateType: "JS_TEMPLATE_LITERALS",
           },
-
         },
       ],
-
-
     };
     // eslint-disable-next-line no-loop-func
     addLogic({ data: newBotLogic })
@@ -305,35 +298,38 @@ export const onBroadcastBotCreate=()=>{
 }
 
 
+
+
 export const onBotUpdate = () => {
   const store: any = useStore.getState();
   store?.startLoading();
 
   const reqObj = {
-    ...store?.state,
-    isBroadcastBotEnabled: store?.isBroadcastBot,
-    users: [],
-    logic: [],
+    ...store?.editState,
+    id: store.state.id,
   };
-  store?.userSegments.forEach((userSegment) => {
-    reqObj.users.push(userSegment.id);
-  });
-  store?.conversationLogic.forEach((logic) => {
-    reqObj.logic.push(logic.id);
-  });
+
+
   if (reqObj.startDate) {
     reqObj.startDate = moment(reqObj.startDate).format("YYYY-MM-DD");
   }
   if (reqObj.endDate) {
     reqObj.endDate = moment(reqObj.endDate).format("YYYY-MM-DD");
   }
-
+  // const newData = omitBy(reqObj, isNull);
+  // console.log("bot update:", { reqObj, newData });
   store?.startLoading();
   updateBot(reqObj)
     .then((res) => {
+      console.log("bot update:", { res });
       store?.stopLoading();
+      toast.success("Bot Updated");
+      store.stopLoading();
+      store.onReset();
+      history.navigate("/success");
     })
     .catch((err) => {
+      console.log("bot update:", { err });
       store?.stopLoading();
       console.log({ err });
     });

src/api/getBots.ts

@@ -1,7 +1,7 @@
 import axios from "axios";
 import { searchBot } from "./urls";
 import { getDefaultHeaders } from "./utils";
-import {omitBy,isNull} from 'lodash';
+import { omitBy, isNull } from "lodash";
 
 export const getBots = (data: any) => {
   const url = searchBot;
@@ -10,10 +10,17 @@ export const getBots = (data: any) => {
       ...getDefaultHeaders(),
       asset: "bot",
     },
-    params: omitBy({ perPage: data.perPage, page: data.page ,name: data.name },isNull) ,
+    params: omitBy(
+      {
+        perPage: data.perPage,
+        page: data.page,
+        name: data.name,
+        sortBy: data.sortBy,
+        orderBy: data.orderBy,
+      },
+      isNull
+    ),
   };
 
   return axios.get(url, config);
 };
-
-

src/api/updateBot.ts

@@ -1,6 +1,7 @@
 import axios from "axios";
 import { getUpdateBotUrl } from "./urls";
 import { getDefaultHeaders } from "./utils";
+import {omit} from 'lodash'
 
 export const updateBot = (data: any) => {
   const url = getUpdateBotUrl(data?.id);
@@ -11,5 +12,5 @@ export const updateBot = (data: any) => {
     },
   };
 
-  return axios.patch(url, data, config);
+  return axios.patch(url,  omit (data,['id','segmentId']), config);
 };

src/components/addLogicModal/index.tsx

@@ -14,13 +14,17 @@ import {
   MDBContainer,
   MDBCol,
   MDBSpinner,
+  MDBIcon,
 } from "mdb-react-ui-kit";
 import { toast } from "react-hot-toast";
 import { uploadForm } from "../../api/uploadForm";
 import { addLogic } from "../../api/addLogic";
 import { omitBy, isNull } from "lodash";
 import { getUploadErrorMsg } from "../../utils";
 import { useStore } from "../../store";
+import "./style.css";
+import FileModal from "../fileModal";
+
 const AddLogicModal: FC<any> = ({
   open,
   activeLogic = {},
@@ -31,6 +35,7 @@ const AddLogicModal: FC<any> = ({
   const [logics, setLogics] = useState<any>([]);
   const [form, setForm] = useState(null);
   const [media, setMedia] = useState(null);
+  const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
   const [cadencePerPage, setCadencePerPage] = useState(100);
   const [formId, setFormId] = useState("");
   const [modalState, setModalState] = useState<any>({ ...activeLogic });
@@ -81,6 +86,7 @@ const AddLogicModal: FC<any> = ({
       adapter: process.env.REACT_APP_adapterId,
     };
 
+
     addLogic({ data })
       .then((res) => {
         const newLogic = [...logics, { ...res.data.result }];
@@ -103,10 +109,11 @@ const AddLogicModal: FC<any> = ({
   }, []);
 
   const onMediaChange = useCallback((event: any) => {
-    if (!event.target.files.length) {
+    const files = Array.from(event.target.files);
+    if (!files.length) {
       toast.error("No File Selected");
     }
-    setMedia(event.target.files);
+    setMedia(files);
   }, []);
 
   const onFormUpload = useCallback(
@@ -149,7 +156,36 @@ const AddLogicModal: FC<any> = ({
       ),
     [form, formId, modalState]
   );
-  console.log("perpage_comp:",store?.cadencePerPage)
+
+  // Handle file selection
+  const handleFileChange = (e) => {
+    if (!e.target.files.length) {
+      toast.error("No File Selected");
+    }
+    const files = Array.from(e.target.files);
+    setMedia(files);
+  };
+
+  // Handle file removal
+  const handleFileRemove = (fileName) => {
+    //setIsDeleteModalOpen(true)
+    setMedia((prevSelectedFiles) =>
+      prevSelectedFiles.filter((file) => file.name !== fileName)
+    );
+  };
+
+  const confirmDelete = (ev, fileName) => {
+    const shouldDelete = window.confirm(
+      "Are you sure you want to delete this media?"
+    );
+    if (shouldDelete) {
+      handleFileRemove(fileName);
+    } else {
+      ev.preventDefault();
+    }
+  };
+
+  console.log({ media });
 
   if (!open) return null;
   return (
@@ -180,7 +216,7 @@ const AddLogicModal: FC<any> = ({
                     <MDBRow className="mb-3">
                       <MDBInput
                         label="Description"
-                        name="description"
+                        name="description" 
                         value={modalState.description}
                         onChange={onChangeHandler}
                       />
@@ -196,8 +232,6 @@ const AddLogicModal: FC<any> = ({
                       >
                         <option value="100">100</option>
                         <option value="1000">1000</option>
-                        {/* <option value="2000">2000</option>
-                      <option value="5000">5000</option> */}
                       </select>
                     </MDBRow>
                     <MDBRow className="mb-3">
@@ -210,16 +244,57 @@ const AddLogicModal: FC<any> = ({
                         onChange={onOdkFormChange}
                       />
                     </MDBRow>
+
                     <MDBRow className="mb-3">
                       <MDBFile
                         label="Upload Media"
-                        // accept="image/png, image/jpeg"
                         size="sm"
                         id="formFileSm"
                         multiple
-                        onChange={onMediaChange}
+                        onChange={handleFileChange}
+
                       />
                     </MDBRow>
+
+                    <MDBRow className="p-0">
+                      {/* {renderSelectedFiles()}  */}
+                      <div className="file-picker mb-2">
+                        <div className="selected-files">
+                          {media?.length > 0 ? (
+                            media.map((file) => (
+                              <div
+                                key={file.name}
+                                className="d-flex justify-content-between mb-2 border p-1 align-items-center"
+                              >
+                                <span>
+
+                                  <MDBIcon far icon="file" /> {file.name}
+                                </span>
+
+                                {/* <button
+                                  className="remove-btn"
+                                  onClick={(ev) => confirmDelete(ev,file.name)}
+                                >
+                                  <MDBIcon fas icon="times" />
+                                </button> */}
+
+                                <MDBBtn
+                                  tag="a"
+                                  color="none"
+                                  className="m-1"
+                                  style={{ color: "#ff4444" }}
+                                  onClick={(ev) => confirmDelete(ev,file.name)}
+                                >
+                                  <MDBIcon fas icon="trash-alt" />
+                                </MDBBtn>
+                              </div>
+                            ))
+                          ) : (
+                            <p>No files selected.</p>
+                          )}
+                        </div>
+                      </div>
+                    </MDBRow>
                     <MDBRow>
                       <MDBCol></MDBCol>
                       <MDBCol className="d-flex justify-content-end">
@@ -260,6 +335,10 @@ const AddLogicModal: FC<any> = ({
           </MDBContainer>
         </MDBModalDialog>
       </MDBModal>
+      <FileModal
+        open={isDeleteModalOpen}
+        onClose={() => setIsDeleteModalOpen(false)}
+      />
     </>
   );
 };

src/components/addLogicModal/style.css

@@ -0,0 +1,36 @@
+/* FilePicker.css */
+
+.file-picker {
+    /* width: 300px; */
+    margin: auto;
+
+  }
+
+  .selected-files {
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    padding: 10px;
+  }
+
+
+  .file-name {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    max-width: 70%;
+  }
+
+  .remove-btn {
+    background-color: #ff4444;
+    color: white;
+    border: none;
+    border-radius: 5px;
+    padding: 5px 10px;
+    cursor: pointer;
+  }
+
+  .remove-btn:hover {
+    background-color: #ff0000;
+  }
+