New: (UI) Add clone indexer in info modal

frontend/src/Indexer/Info/IndexerInfoModal.tsx

@@ -7,16 +7,18 @@ interface IndexerInfoModalProps {
   isOpen: boolean;
   indexerId: number;
   onModalClose(): void;
+  onCloneIndexerPress(id: number): void;
 }
 
 function IndexerInfoModal(props: IndexerInfoModalProps) {
-  const { isOpen, onModalClose, indexerId } = props;
+  const { isOpen, indexerId, onModalClose, onCloneIndexerPress } = props;
 
   return (
     <Modal size={sizes.MEDIUM} isOpen={isOpen} onModalClose={onModalClose}>
       <IndexerInfoModalContent
         indexerId={indexerId}
         onModalClose={onModalClose}
+        onCloneIndexerPress={onCloneIndexerPress}
       />
     </Modal>
   );

frontend/src/Indexer/Info/IndexerInfoModalContent.tsx

@@ -41,12 +41,13 @@ function createIndexerInfoItemSelector(indexerId: number) {
 interface IndexerInfoModalContentProps {
   indexerId: number;
   onModalClose(): void;
+  onCloneIndexerPress(id: number): void;
 }
 
 function IndexerInfoModalContent(props: IndexerInfoModalContentProps) {
-  const { indexer } = useSelector(
-    createIndexerInfoItemSelector(props.indexerId)
-  );
+  const { indexerId, onCloneIndexerPress } = props;
+
+  const { indexer } = useSelector(createIndexerInfoItemSelector(indexerId));
 
   const {
     id,
@@ -92,6 +93,11 @@ function IndexerInfoModalContent(props: IndexerInfoModalContentProps) {
     onModalClose();
   }, [setIsDeleteIndexerModalOpen, onModalClose]);
 
+  const onCloneIndexerPressWrapper = useCallback(() => {
+    onCloneIndexerPress(id);
+    onModalClose();
+  }, [id, onCloneIndexerPress, onModalClose]);
+
   return (
     <ModalContent onModalClose={onModalClose}>
       <ModalHeader>{`${name}`}</ModalHeader>
@@ -304,6 +310,9 @@ function IndexerInfoModalContent(props: IndexerInfoModalContentProps) {
         >
           {translate('Delete')}
         </Button>
+        <Button onPress={onCloneIndexerPressWrapper}>
+          {translate('Clone')}
+        </Button>
         <Button onPress={onEditIndexerPress}>{translate('Edit')}</Button>
         <Button onPress={onModalClose}>{translate('Close')}</Button>
       </ModalFooter>