diff --git a/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx b/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx
index 626a2a8..f90f6cb 100644
--- a/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx
+++ b/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx
@@ -205,6 +205,10 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
             color="blue.400"
             rounded={"sm"}
             size={"xs"}
+            onClick={()=>{
+              setActionId(item?.id)
+              onOpen()
+            }}
           >
             <EditIcon />
           </Button>
@@ -333,7 +337,7 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
     <Box>
       <Box display={"flex"} justifyContent={"space-between"} mb={4}>
         <Box fontSize={"sm"} fontWeight={500}>
-          Manage iO images
+          Manage IO Images
         </Box>
         <HStack>
           <SetDisplayOrder data={IObyID?.data?.artifactsImage} />
@@ -349,9 +353,16 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
           </Button>
         </HStack>
         <IOArtifactsAdd
+        actionId={actionId}
           isOpen={isOpen}
           onClose={onClose}
           firstField={firstField}
+
+
+          setActionId={setActionId}
+
+
+          data={IObyID?.data?.artifactsImage}
         />
       </Box>
       <DataTable
diff --git a/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx b/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx
index 36f24c1..277722c 100644
--- a/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx
+++ b/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx
@@ -62,10 +62,9 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
         toast({
           render: () => <ToastBox message={res?.data?.message} />,
         }); 
-      reset()
       setAlert(false);
       setIsLoading(false)
-      onClose();
+      handleClose();
       }
 
       
@@ -73,7 +72,6 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
       console.log(error);
       
     }
-    reset()
     
   };
 
@@ -104,7 +102,7 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
         <DrawerOverlay />
         <DrawerContent>
           <DrawerCloseButton />
-          <DrawerHeader fontSize={"sm"}>IO Artifacts Image</DrawerHeader>
+          <DrawerHeader fontSize={"sm"}>IO Artifacts Video</DrawerHeader>
 
           <DrawerBody>
             <Stack spacing={4}>
@@ -161,6 +159,8 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
           </DrawerFooter>
         </DrawerContent>
       </Drawer>
+
+      
       <CustomAlertDialog
         isOpen={alert}
         onClose={() => setAlert(false)}
diff --git a/src/Pages/IO_Management/CreateIO/KeyMerits.jsx b/src/Pages/IO_Management/CreateIO/KeyMerits.jsx
index ea5be98..7180cde 100644
--- a/src/Pages/IO_Management/CreateIO/KeyMerits.jsx
+++ b/src/Pages/IO_Management/CreateIO/KeyMerits.jsx
@@ -49,6 +49,8 @@ const KeyMerits = ({ enableNextTab, index, data:prepopData }) => {
 
   const { keyMerits, setKeyMerits, slideFromRight } =
     useContext(GlobalStateContext);
+
+
   const firstField = useRef();
   const [searchTerm, setSearchTerm] = useState("");
   const [deleteAlert, setDeleteAlert] = useState(false);
@@ -88,6 +90,9 @@ const KeyMerits = ({ enableNextTab, index, data:prepopData }) => {
     return nameMatches;
   });
 
+  // console.log(filteredData);
+  const sortedData = filteredData?.sort((a, b) => a.displayOder - b.displayOder);
+
   const handleDelete = async () => {
     setIsBtnLoading(true);
     try {
@@ -102,7 +107,7 @@ const KeyMerits = ({ enableNextTab, index, data:prepopData }) => {
     } catch (error) {}
   };
 
-  const extractedArray = filteredData?.map((item, index) => ({
+  const extractedArray = sortedData?.map((item, index) => ({
     id: item.id,
     "Sr.no": (
       <Text
diff --git a/src/Pages/IO_Management/CreateIO/SetDisplayOrder.jsx b/src/Pages/IO_Management/CreateIO/SetDisplayOrder.jsx
index eba232d..3bbcde6 100644
--- a/src/Pages/IO_Management/CreateIO/SetDisplayOrder.jsx
+++ b/src/Pages/IO_Management/CreateIO/SetDisplayOrder.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import {
   Modal,
   ModalOverlay,
@@ -13,60 +13,101 @@ import {
   Text,
   Image,
   HStack,
+  useToast,
 } from "@chakra-ui/react";
 
 import { AddIcon, DragHandleIcon } from "@chakra-ui/icons";
 import DataTable from "../../../Components/DataTable/DataTable";
+import { useSetDisplayOrderMutation } from "../../../Services/io.service";
+import ToastBox from "../../../Components/ToastBox";
 
-const SetDisplayOrder = ({data,}) => {
+const SetDisplayOrder = ({ data }) => {
+  const toast = useToast()
   const { isOpen, onOpen, onClose } = useDisclosure();
-  
-  const tableHeadRow = ["", "Title", "Icon", ];
+  const [ isLoading, setIsLoading ] = useState(false)
+
+  const tableHeadRow = ["", "Title", "Icon"];
+
+  const [extractedArray, setExtractedArray] = useState([]);
+  const [ displayOrder, setDisplayOrder ] = useState(null)
+  const [ resetDisplayOrder ] = useSetDisplayOrderMutation()
+
+  // Update state when `data` prop changes
+  useEffect(() => {
+    if (data) {
+      const formattedData = data.map((item, index) => ({
+        id: item?.id,
+        displayOrder: index + 1, // Add displayOrder property
+        "": (
+          <Box w={"20px"} isTruncated={true}>
+            <DragHandleIcon />
+          </Box>
+        ),
+        Title: (
+          <Box w={"300px"} isTruncated={true}>
+            <Text
+              justifyContent={"left"}
+              as={"span"}
+              color={"teal.900"}
+              fontWeight={"500"}
+              className="d-flex align-items-center web-text-small"
+            >
+              {item?.meritsHeader}
+            </Text>
+          </Box>
+        ),
+        Icon: item?.icon?.iconFilePath && (
+          <Image
+            rounded={"md"}
+            display={"flex"}
+            p={1}
+            justifyContent={"center"}
+            alignItems={"center"}
+            src={"https://admin.tanami.betadelivery.com/" + item?.icon?.iconFilePath}
+            w={8}
+            h={8}
+          />
+        ),
+      }));
+      setExtractedArray(formattedData);
+    }
+  }, [data]);
+
+  // Log the updated order in the desired format whenever `extractedArray` changes
+  useEffect(() => {
+    const displayOrderArray = extractedArray.map((item, index) => ({
+      id: item.id,
+      displayOrder: index + 1,
+    }));
+    setDisplayOrder(displayOrderArray)
+  }, [extractedArray]);
 
 
-  const [ extractedArray, setExtractedArray] = useState(data?.map((item, index) => ({
-    id:item?.id,
-    "": (
-        <Box w={"20px"} isTruncated={true}>
-        <DragHandleIcon />
-        </Box>
-    ),
-    Title: (
-        <Box w={"300px"} isTruncated={true}>
-      <Text
-        justifyContent={"left"}
-        as={"span"}
-        color={"teal.900"}
-        fontWeight={"500"}
-        className="d-flex align-items-center web-text-small"
-      >
-        {item?.meritsHeader}
-      </Text></Box>
-    ),
-    Icon: (
-      item?.icon?.iconFilePath && <Image
-      rounded={'md'}
-      // bg={"#003B14"}
-      display={'flex'}
-      p={1}
-      justifyContent={'center'}
-      alignItems={'center'}
-      src={" https://admin.tanami.betadelivery.com/" + item?.icon?.iconFilePath}
-        w={8}
-        h={8}
-      />
+
+  const handleSetOrder = async () => {
+    setIsLoading(true)
+    const data = {
+      displayOrder:displayOrder
+    }
+
+    try {
+      const res = await resetDisplayOrder({data})
+      console.log(res?.data?.statusCode);
+      if (res?.data?.statusCode === 200) {
+        toast({
+          render: () => <ToastBox message={res?.data?.message} />,
+        }); 
+        onClose()
+
+      }
       
-
-   
-      // https://admin.tanami.betadelivery.com/public/icons/linkedin.png
-    ),
-  })))
-
-
-
-
-
-
+    setIsLoading(false)
+      
+    } catch (error) {
+      console.log(res);
+      setIsLoading(false)
+    }
+  }
 
 
 
@@ -84,37 +125,19 @@ const SetDisplayOrder = ({data,}) => {
         Set Display Order
       </Button>
 
-      <Modal isCentered size={'xl'} isOpen={isOpen} onClose={onClose}>
+      <Modal isCentered size={"xl"} isOpen={isOpen} onClose={onClose}>
         <ModalOverlay />
-        <ModalContent >
+        <ModalContent>
           <ModalHeader fontSize={"lg"}>Set Display Order</ModalHeader>
           <ModalCloseButton />
           <ModalBody>
-
-
-            
-      <DataTable
-        emptyMessage={`We don't have any Sponers `}
-        tableHeadRow={tableHeadRow}
-        data={extractedArray}
-        setData={setExtractedArray}
-        isDraggable={true}
-        // isLoading={false}
-        // viewActionId={actionId}
-        // setViewActionId={setActionId}
-        // totalPages={10}
-
-        // setMouseEnteredId={setMouseEnteredId}
-        // setMouseEntered={setMouseEntered}
-      />
-            
-
-
-
-
-
-
-
+            <DataTable
+              emptyMessage={`We don't have any Sponsors`}
+              tableHeadRow={tableHeadRow}
+              data={extractedArray}
+              setData={setExtractedArray}
+              isDraggable={true}
+            />
           </ModalBody>
 
           <ModalFooter>
@@ -135,6 +158,8 @@ const SetDisplayOrder = ({data,}) => {
               rounded={"sm"}
               colorScheme="forestGreen"
               variant="solid"
+              onClick={handleSetOrder}
+              isLoading={isLoading}
             >
               Set order
             </Button>
diff --git a/src/Pages/IO_Management/IOArtifactsAdd.jsx b/src/Pages/IO_Management/IOArtifactsAdd.jsx
index c421edc..e104311 100644
--- a/src/Pages/IO_Management/IOArtifactsAdd.jsx
+++ b/src/Pages/IO_Management/IOArtifactsAdd.jsx
@@ -17,11 +17,11 @@ import {
   useToast,
 } from "@chakra-ui/react";
 import * as yup from "yup";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useForm, Controller } from "react-hook-form";
 import { yupResolver } from "@hookform/resolvers/yup";
 import CustomAlertDialog from "../../Components/CustomAlertDialog";
-import { useCreateImageArtifactsMutation } from "../../Services/io.service";
+import { useCreateImageArtifactsMutation, useUpdateImageArtifactsMutation } from "../../Services/io.service";
 import { useParams } from "react-router-dom";
 import ToastBox from "../../Components/ToastBox";
 
@@ -30,70 +30,137 @@ const investmentImageSchema = yup.object().shape({
   artifactPathName: yup.mixed().required("Artifact image is required"),
 });
 
-const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
-  const params = useParams()
-  const id = params?.id
+const IOArtifactsAdd = ({
+  isOpen,
+  onClose,
+  firstField,
+  actionId,
+  setActionId,
+  data,
+}) => {
+  console.log(actionId);
+  console.log(data);
+  const params = useParams();
+  const id = params?.id;
   const [file, setFile] = useState(null);
   const [preview, setPreview] = useState(null);
   const [alert, setAlert] = useState(false);
   const [loading, setIsLoading] = useState(false);
   const toast = useToast();
 
-  const [ createImageArtifacts ] = useCreateImageArtifactsMutation()
+  const [createImageArtifacts] = useCreateImageArtifactsMutation();
+  const [ updateImageArtifacts ] = useUpdateImageArtifactsMutation()
+
+  const found = data?.find((item) => item?.id === actionId);
+  console.log(found);
 
   const {
     control,
     handleSubmit,
     reset,
     setValue,
+    watch,
     formState: { errors },
   } = useForm({
     resolver: yupResolver(investmentImageSchema),
   });
 
-  console.log(errors);
+  // useEffect to reset the form when `found` changes
+  useEffect(() => {
+    if (found) {
+      reset({
+        artifactName: found?.artifactName,
+        artifactPathName: found?.artifactPathName,
+      });
+    }
+  }, [found, reset]);
+
+  console.log(watch());
+
+
+
 
   const onSubmit = async (data) => {
-    setIsLoading(true)
+    setIsLoading(true);
     const formData = new FormData();
-    formData.append('artifactName', data.artifactName);
-    formData.append('artifactPathName', file); // Assuming artifactPathName is an array of files
-  
-    console.log('FormData:', formData);
+    formData.append("artifactName", data.artifactName);
+    formData.append("artifactPathName", file); // Assuming artifactPathName is an array of files
+
+    console.log("FormData:", formData);
     for (let [key, value] of formData.entries()) {
       console.log(`${key}:`, value);
     }
 
     try {
-      const res = await createImageArtifacts({data: formData, id})
-      if (res?.data?.statusCode === 200) {
-        toast({
-          render: () => <ToastBox message={res?.data?.message} />,
-        }); 
-      reset()
-      setFile(null)
-      setIsLoading(false)
-      setAlert(false);
-      setPreview(null)
-      onClose();
+
+
+      if(found){
+        
+        const res = await updateImageArtifacts({ data: formData, id: found?.id });
+        console.log(res?.error);
+        if (res?.data?.statusCode === 200) {
+          toast({
+            render: () => <ToastBox message={res?.data?.message} />,
+          });
+          reset();
+          setFile(null);
+          setIsLoading(false);
+          setAlert(false);
+          setPreview(null);
+          onClose();
+        }
+
+        if(res?.error){
+          toast({
+            render: () => <ToastBox message={res?.error?.data?.message} status={'error'} />,
+          });
+          reset();
+          setIsLoading(false);
+
+        }
+
+
+
+
+
+
+
+      }else{
+        const res = await createImageArtifacts({ data: formData, id });
+        if (res?.data?.statusCode === 200) {
+          toast({
+            render: () => <ToastBox message={res?.data?.message} />,
+          });
+          reset();
+          setFile(null);
+          setIsLoading(false);
+          setAlert(false);
+          setPreview(null);
+          onClose();
+        }
+
       }
-      
+
+
+
+    
+
+
+
+
+
     } catch (error) {
       console.log(error);
     }
 
-
-
-  
     // Close the form/modal
     // onClose();
   };
-  
 
   const handleFileChange = (e) => {
     const file = e.target.files[0];
     setFile(file);
-    setValue("artifactPathName", file)
+    setValue("artifactPathName", file);
     const reader = new FileReader();
     reader.onloadend = () => {
       setPreview(reader.result);
@@ -106,17 +173,21 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
   };
 
   const handleClose = () => {
-    setFile(null)
-    setPreview(null)
-    reset()
-    onClose()
-
-  }
+    setFile(null);
+    setPreview(null);
+    reset({
+      artifactName: "",
+      artifactPathName: "",
+    });
+  
+    onClose();
+    setActionId(false);
+  };
 
   return (
     <>
-      <Drawer 
-      size={"md"}
+      <Drawer
+        size={"md"}
         isOpen={isOpen}
         placement="right"
         initialFocusRef={firstField}
@@ -143,7 +214,13 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
                 </FormErrorMessage>
               </FormControl>
 
-              <FormControl isInvalid={!preview && errors.artifactPathName?.message && errors.artifactPathName}>
+              <FormControl
+                isInvalid={
+                  !preview &&
+                  errors.artifactPathName?.message &&
+                  errors.artifactPathName
+                }
+              >
                 <FormLabel fontSize={"sm"}>Artifact Image</FormLabel>
                 <Input
                   type="file"
@@ -154,9 +231,12 @@ const IOArtifactsAdd = ({  isOpen, onClose, firstField }) => {
                   className="form-control"
                 />
                 <FormErrorMessage fontSize={"xs"} fontWeight={500}>
-                  {!preview && errors.artifactPathName?.message && errors.artifactPathName?.message}
+                  {!preview &&
+                    errors.artifactPathName?.message &&
+                    errors.artifactPathName?.message}
                 </FormErrorMessage>
-                {preview && <Image src={preview} alt="Image Preview" mt={2} />}
+                {preview && <Image rounded={'md'} src={preview} alt="Image Preview" mt={2} />}
+                {found && !preview && <Image rounded={'md'} src={"https://admin.tanami.betadelivery.com/"+watch()?.artifactPathName} alt="Image Preview" mt={2} />}
               </FormControl>
             </Stack>
           </DrawerBody>
diff --git a/src/Pages/Master/Sponser/AddSponser.jsx b/src/Pages/Master/Sponser/AddSponser.jsx
index 158a9f7..814983c 100644
--- a/src/Pages/Master/Sponser/AddSponser.jsx
+++ b/src/Pages/Master/Sponser/AddSponser.jsx
@@ -133,7 +133,7 @@ const AddSponser = () => {
         };
         await createSponser(formData).then((response) => {
           console.log(response);
-          if (response?.data?.statusCode) {
+          if (response?.data?.statusCode === 201 ) {
             toast({
               render: () => <ToastBox message={response?.data?.message} />,
             });
diff --git a/src/Services/io.service.js b/src/Services/io.service.js
index 30d44a4..3b1de9b 100644
--- a/src/Services/io.service.js
+++ b/src/Services/io.service.js
@@ -135,6 +135,18 @@ export const ioService = createApi({
     
           invalidatesTags: ["getIOById"],
         }),
+
+
+
+        
+    updateImageArtifacts: builder.mutation({
+      query: ({ data, id }) => ({
+        url: `/io/artifact/image/${id}`,
+        method: "PATCH",
+        body: data,
+      }),
+      invalidatesTags: ["getIOById"],
+    }),
     
 
 
@@ -167,6 +179,15 @@ export const ioService = createApi({
       invalidatesTags: ["getIOById"],
     }),
 
+    setDisplayOrder: builder.mutation({
+      query: ({ data }) => ({
+        url: `/io/artifact/artifactImage/resetDisplayOrder/`,
+        method: "PATCH",
+        body: data,
+      }),
+      invalidatesTags: ["getIOById"],
+    }),
+
 
 
 
@@ -214,11 +235,13 @@ export const {
   useUpdateInvestmentDocumentsMutation,
 
   useCreateImageArtifactsMutation,
+  useUpdateImageArtifactsMutation,
 
   useGetArtifactsVideoQuery,
   useCreateVideoArtifactsMutation,
   useDeleteVideoArtifactsMutation,
   useDeleteImageArtifactsMutation,
+  useSetDisplayOrderMutation,