FB

src/client/js/components/PageDuplicateModal.jsx

@@ -30,11 +30,11 @@ const PageDuplicateModal = (props) => {
    * change pageNameInput
    * @param {string} value
    */
-  function onChangePageNameInputHandler(value) {
+  function ppacInputChangeHandler(value) {
     setPageNameInput(value);
   }
 
-  async function clickDuplicateButtonHandler() {
+  async function duplicate() {
     try {
       setErrorCode(null);
       setErrorMessage(null);
@@ -48,6 +48,10 @@ const PageDuplicateModal = (props) => {
     }
   }
 
+  function ppacSubmitHandler() {
+    duplicate();
+  }
+
   return (
     <Modal isOpen={pageContainer.state.isPageDuplicateModalShown} toggle={pageContainer.closePageDuplicateModal} className="grw-duplicate-page">
       <ModalHeader tag="h4" toggle={pageContainer.closePageDuplicateModal} className="bg-primary text-light">
@@ -71,8 +75,8 @@ const PageDuplicateModal = (props) => {
                   crowi={appContainer}
                   initializedPath={path}
                   addTrailingSlash
-                  onClickSubmit={clickDuplicateButtonHandler}
-                  onInputChange={onChangePageNameInputHandler}
+                  onSubmit={ppacSubmitHandler}
+                  onInputChange={ppacInputChangeHandler}
                 />
               )
               : (
@@ -80,7 +84,7 @@ const PageDuplicateModal = (props) => {
                   type="text"
                   value={pageNameInput}
                   className="form-control"
-                  onChange={e => onChangePageNameInputHandler(e.target.value)}
+                  onChange={e => ppacInputChangeHandler(e.target.value)}
                   required
                 />
               )}
@@ -90,7 +94,7 @@ const PageDuplicateModal = (props) => {
       </ModalBody>
       <ModalFooter>
         <ApiErrorMessage errorCode={errorCode} errorMessage={errorMessage} linkPath={path} />
-        <button type="button" className="btn btn-primary" onClick={clickDuplicateButtonHandler}>Duplicate page</button>
+        <button type="button" className="btn btn-primary" onClick={duplicate}>Duplicate page</button>
       </ModalFooter>
     </Modal>
 

src/client/js/components/PagePathAutoComplete.jsx

@@ -8,10 +8,13 @@ import SearchTypeahead from './SearchTypeahead';
 const PagePathAutoComplete = (props) => {
 
   const {
-    addTrailingSlash, onClickSubmit, onInputChange, initializedPath,
+    addTrailingSlash, onSubmit, onInputChange, initializedPath,
   } = props;
 
-  function onChange(pages) {
+  function inputChangeHandler(pages) {
+    if (onInputChange == null) {
+      return;
+    }
     const page = pages[0]; // should be single page selected
 
     if (page != null) {
@@ -19,6 +22,13 @@ const PagePathAutoComplete = (props) => {
     }
   }
 
+  function submitHandler() {
+    if (onSubmit == null) {
+      return;
+    }
+    onSubmit();
+  }
+
   function getKeywordOnInit(path) {
     return addTrailingSlash
       ? pathUtils.addTrailingSlash(path)
@@ -28,8 +38,8 @@ const PagePathAutoComplete = (props) => {
   return (
     <SearchTypeahead
       crowi={props.crowi}
-      onSubmit={onClickSubmit}
-      onChange={onChange}
+      onSubmit={submitHandler}
+      onChange={inputChangeHandler}
       onInputChange={onInputChange}
       inputName="new_path"
       emptyLabelExceptError={null}
@@ -45,8 +55,8 @@ PagePathAutoComplete.propTypes = {
   initializedPath:  PropTypes.string,
   addTrailingSlash: PropTypes.bool,
 
-  onClickSubmit:    PropTypes.func.isRequired,
-  onInputChange:    PropTypes.func.isRequired,
+  onSubmit:         PropTypes.func,
+  onInputChange:    PropTypes.func,
 };
 
 PagePathAutoComplete.defaultProps = {