diff --git a/frontend/src/components/dialog/create-repo-dialog.js b/frontend/src/components/dialog/create-repo-dialog.js
index 485084a811..b6e6f07441 100644
--- a/frontend/src/components/dialog/create-repo-dialog.js
+++ b/frontend/src/components/dialog/create-repo-dialog.js
@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import Select from 'react-select';
 import { Button, Modal, ModalHeader, Input, ModalBody, ModalFooter, Form, FormGroup, Label, Alert } from 'reactstrap';
-import { gettext, enableEncryptedLibrary, repoPasswordMinLength, storages } from '../../utils/constants';
+import { gettext, enableEncryptedLibrary, repoPasswordMinLength, storages, libraryTemplates } from '../../utils/constants';
 
 const propTypes = {
   libraryType: PropTypes.string.isRequired,
@@ -22,6 +22,7 @@ class CreateRepoDialog extends React.Component {
       errMessage: '',
       permission: 'rw',
       storage_id: storages.length ? storages[0].id : '',
+      library_template: libraryTemplates.length ? libraryTemplates[0] : '',
       isSubmitBtnActive: false,
     };
     this.newInput = React.createRef();
@@ -121,6 +122,10 @@ class CreateRepoDialog extends React.Component {
     this.setState({storage_id: selectedItem.value});
   }
 
+  handlelibraryTemplatesInputChange = (selectedItem) => {
+    this.setState({library_template: selectedItem.value});
+  }
+
   onEncrypted = (e) => {
     let isChecked = e.target.checked;
     this.setState({
@@ -162,6 +167,11 @@ class CreateRepoDialog extends React.Component {
       repo.storage_id = storage_id;
     }
 
+    const library_template = this.state.library_template;
+    if (library_template) {
+      repo.library_template = library_template;
+    }
+
     return repo;
   }
 
@@ -192,6 +202,19 @@ class CreateRepoDialog extends React.Component {
                 /> 
               </FormGroup>
             )}
+
+            {libraryTemplates.length > 0 && (
+              <FormGroup>
+                <Label for="library-templates">{gettext('Library Templates')}</Label>
+                <Select
+                  id="library-templates"
+                  defaultValue={{value: libraryTemplates[0], label: libraryTemplates[0]}}
+                  options={libraryTemplates.map((item, index) => { return {value: item, label: item}; })}
+                  onChange={this.handlelibraryTemplatesInputChange}
+                /> 
+              </FormGroup>
+            )}
+
             {this.props.libraryType === 'group' && (
               <FormGroup>
                 <Label for="exampleSelect">{gettext('Permission')}</Label>
diff --git a/frontend/src/utils/constants.js b/frontend/src/utils/constants.js
index 28803b77b7..47c9514aa4 100644
--- a/frontend/src/utils/constants.js
+++ b/frontend/src/utils/constants.js
@@ -42,6 +42,7 @@ export const enableUploadFolder = window.app.pageOptions.enableUploadFolder ===
 export const enableResumableFileUpload = window.app.pageOptions.enableResumableFileUpload === 'True';
 export const resumableUploadFileBlockSize = window.app.pageOptions.resumableUploadFileBlockSize;
 export const storages = window.app.pageOptions.storages; // storage backends
+export const libraryTemplates = window.app.pageOptions.libraryTemplates; // library templates
 export const enableRepoSnapshotLabel = window.app.pageOptions.enableRepoSnapshotLabel;
 export const shareLinkPasswordMinLength = window.app.pageOptions.shareLinkPasswordMinLength;
 export const shareLinkExpireDaysMin = window.app.pageOptions.shareLinkExpireDaysMin;
diff --git a/seahub/handlers.py b/seahub/handlers.py
index 67ed19c8af..1d7c9b994b 100644
--- a/seahub/handlers.py
+++ b/seahub/handlers.py
@@ -50,14 +50,10 @@ try:
         library_template = kwargs['library_template']
 
         if LIBRARY_TEMPLATES and library_template:
-            if isinstance(library_template, str):
-                library_template = library_template.encode('utf-8')
-
             try:
                 dir_path_list = LIBRARY_TEMPLATES[library_template]
                 for dir_path in dir_path_list:
-                    seafile_api.mkdir_with_parents(repo_id, '/',
-                            dir_path.strip('/'), related_users)
+                    seafile_api.mkdir_with_parents(repo_id, '/', dir_path.strip('/'), creator)
             except Exception as e:
                 logger.error(e)
 
diff --git a/seahub/templates/base_for_react.html b/seahub/templates/base_for_react.html
index c428fb8db8..99e50371ae 100644
--- a/seahub/templates/base_for_react.html
+++ b/seahub/templates/base_for_react.html
@@ -81,6 +81,14 @@
               {% endfor %}
               return storages;
             })(),
+            // library template
+            libraryTemplates: (function () {
+              var libraryTemplates = [];
+              {% for template in library_templates %}
+	      libraryTemplates.push("{{template}}");
+              {% endfor %}
+              return libraryTemplates;
+            })(),
             enableRepoSnapshotLabel: {% if enable_repo_snapshot_label %} true {% else %} false {% endif %},
             shareLinkPasswordMinLength: {{ share_link_password_min_length }},
             sideNavFooterCustomHtml: "{{ side_nav_footer_custom_html|safe|escapejs }}",
diff --git a/seahub/views/__init__.py b/seahub/views/__init__.py
index 7dbac2e875..3d2a137b00 100644
--- a/seahub/views/__init__.py
+++ b/seahub/views/__init__.py
@@ -1185,6 +1185,7 @@ def react_fake_view(request, **kwargs):
         'max_upload_file_size': max_upload_file_size,
         'seafile_collab_server': SEAFILE_COLLAB_SERVER,
         'storages': get_library_storages(request),
+        'library_templates': list(LIBRARY_TEMPLATES.keys()),
         'enable_repo_snapshot_label': settings.ENABLE_REPO_SNAPSHOT_LABEL,
         'resumable_upload_file_block_size': settings.RESUMABLE_UPLOAD_FILE_BLOCK_SIZE,
         'max_number_of_files_for_fileupload': settings.MAX_NUMBER_OF_FILES_FOR_FILEUPLOAD,