From 21282ddc536d6458a3eeeb005a77a8c04d7950c6 Mon Sep 17 00:00:00 2001
From: elizavetaRa <svillyfly@mail.ru>
Date: Fri, 8 Oct 2021 11:16:20 +0200
Subject: [PATCH] add creating file function for available mimetypes

---
 .../src/components/AppBar/AppBar.vue          | 86 +++++++++++++++++--
 1 file changed, 77 insertions(+), 9 deletions(-)

diff --git a/packages/web-app-files/src/components/AppBar/AppBar.vue b/packages/web-app-files/src/components/AppBar/AppBar.vue
index d41aeda4ec4..d908e2b8dfc 100644
--- a/packages/web-app-files/src/components/AppBar/AppBar.vue
+++ b/packages/web-app-files/src/components/AppBar/AppBar.vue
@@ -75,7 +75,7 @@
                       @click="showCreateResourceModal"
                     >
                       <oc-icon name="create_new_folder" />
-                      <translate>New folder…</translate>
+                      <translate>New folder</translate>
                     </oc-button>
                   </div>
                 </li>
@@ -94,6 +94,23 @@
                     </oc-button>
                   </div>
                 </li>
+                <li
+                  v-for="(mimetype, key) in getMimeTypes()"
+                  v-if="mimetype.allow_creation === true"
+                  :key="key"
+                >
+                  <div>
+                    <oc-button
+                      appearance="raw"
+                      justify-content="left"
+                      :class="['uk-width-1-1']"
+                      @click="showCreateResourceModal(false, mimetype.ext, false, true)"
+                    >
+                      <oc-icon :name="mimetype.icon || 'file'" />
+                      <span>{{ 'New ' + mimetype.name }}</span>
+                    </oc-button>
+                  </div>
+                </li>
               </ul>
             </oc-drop>
           </template>
@@ -135,6 +152,7 @@ export default {
     SizeInfo,
     ViewOptions
   },
+
   mixins: [Mixins, MixinFileActions, MixinRoutes, MixinScrollToResource],
   data: () => ({
     newFileAction: null,
@@ -152,7 +170,6 @@ export default {
     ]),
     ...mapState(['route']),
     ...mapState('Files', ['areHiddenFilesShown']),
-
     newButtonTooltip() {
       if (!this.canUpload) {
         return this.$gettext('You have no permission to upload!')
@@ -177,6 +194,7 @@ export default {
       }
       return path + '/'
     },
+
     currentPathSegments() {
       // remove potential leading and trailing slash from current path (so that the resulting array doesn't start with an empty string)
       const s = this.currentPath.replace(/^\/+/, '').replace(/\/+$/, '')
@@ -196,12 +214,14 @@ export default {
         Authorization: 'Bearer ' + this.getToken
       }
     },
+
     canUpload() {
       if (this.currentFolder === null) {
         return false
       }
       return this.currentFolder.canUpload()
     },
+
     showActions() {
       return this.$route.meta.hideFilelistActions !== true
     },
@@ -209,6 +229,7 @@ export default {
     showBreadcrumb() {
       return this.isPublicFilesRoute || this.isPersonalRoute
     },
+
     pageTitle() {
       const title = this.$route.meta.title
       return this.$gettext(title)
@@ -297,13 +318,12 @@ export default {
     // Storage returns a string so we need to convert it into a boolean
     const areHiddenFilesShown = window.localStorage.getItem('oc_hiddenFilesShown') || 'true'
     const areHiddenFilesShownBoolean = areHiddenFilesShown === 'true'
-
     if (areHiddenFilesShownBoolean !== this.areHiddenFilesShown) {
       this.SET_HIDDEN_FILES_VISIBILITY(areHiddenFilesShownBoolean)
     }
   },
-
   methods: {
+    ...mapGetters('External', ['getMimeTypes']),
     ...mapActions('Files', [
       'updateFileProgress',
       'removeFilesFromTrashbin',
@@ -314,7 +334,12 @@ export default {
     ...mapMutations('Files', ['UPSERT_RESOURCE', 'SET_HIDDEN_FILES_VISIBILITY']),
     ...mapMutations(['SET_QUOTA']),
 
-    showCreateResourceModal(isFolder = true, ext = 'txt', openAction = null) {
+    showCreateResourceModal(
+      isFolder = true,
+      ext = 'txt',
+      openAction = null,
+      createNewFile = false
+    ) {
       const defaultName = isFolder
         ? this.$gettext('New folder')
         : this.$gettext('New file') + '.' + ext
@@ -341,10 +366,13 @@ export default {
           ? this.checkNewFolderName(defaultName)
           : this.checkNewFileName(defaultName),
         onCancel: this.hideModal,
-        onConfirm: isFolder ? this.addNewFolder : this.addNewFile,
+        onConfirm: isFolder
+          ? this.addNewFolder
+          : createNewFile
+          ? this.createNewFile
+          : this.addNewFile,
         onInput: checkInputValue
       }
-
       this.createModal(modal)
     },
 
@@ -458,7 +486,6 @@ export default {
 
           return
         }
-
         resource = buildResource(resource)
 
         this.UPSERT_RESOURCE(resource)
@@ -486,6 +513,47 @@ export default {
       this.fileFolderCreationLoading = false
     },
 
+    async createNewFile(fileName) {
+      try {
+        const path = pathUtil.join(this.currentPath, fileName)
+        const url = '/app/new?filename=' + path
+        console.log(encodeURI(url), path)
+        const headers = new Headers()
+        headers.append('Authorization', 'Bearer ' + this.getToken)
+        headers.append('X-Requested-With', 'XMLHttpRequest')
+        const response = await fetch(encodeURI(url), {
+          method: 'POST',
+          headers
+        })
+        const file = await response.json()
+        let resource
+        if (this.isPersonalRoute) {
+          await this.$client.files.putFileContents(path, '')
+          resource = await this.$client.files.fileInfo(path, DavProperties.Default)
+        }
+        resource = buildResource(resource)
+        this.UPSERT_RESOURCE(resource)
+        this.$_fileActions_triggerDefaultAction(resource)
+        this.hideModal()
+        if (this.isPersonalRoute) {
+          this.loadIndicators({
+            client: this.$client,
+            currentFolder: this.currentFolder.path
+          })
+        }
+        setTimeout(() => {
+          this.setFileSelection([resource])
+          this.scrollToResource(resource)
+        })
+      } catch (error) {
+        this.showMessage({
+          title: this.$gettext('Creating file failed…'),
+          desc: error,
+          status: 'danger'
+        })
+      }
+    },
+
     checkNewFileName(fileName) {
       if (fileName === '') {
         return this.$gettext('File name cannot be empty')
@@ -506,7 +574,6 @@ export default {
       if (/\s+$/.test(fileName)) {
         return this.$gettext('File name cannot end with whitespace')
       }
-
       const exists = this.files.find(file => file.name === fileName)
 
       if (exists) {
@@ -516,6 +583,7 @@ export default {
 
       return null
     },
+
     async onFileSuccess(event, file) {
       try {
         if (file.name) {