From 293eb679faf54179f96d7f6139b6888c5997b9fa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C4=8Carodej?= <peterpapp@makingcg.com>
Date: Fri, 25 Feb 2022 08:35:21 +0100
Subject: [PATCH] - added file request into the spotlight - after enter stop
 editing item name

---
 .../js/components/FilesView/ItemGrid.vue      |   7 +-
 .../js/components/FilesView/ItemList.vue      |   7 +-
 .../Others/CreateUploadRequestPopup.vue       | 232 ++++++++++--------
 .../js/components/Others/MoveItemPopup.vue    |  20 +-
 .../js/components/Spotlight/Spotlight.vue     |  16 ++
 resources/js/helpers/itemHelpers.js           |   4 +-
 resources/js/views/FileView/Files.vue         |   4 +-
 .../js/views/FileView/UploadRequestFiles.vue  |  10 +-
 resources/js/views/Teams/Invitation.vue       |   2 +-
 .../MoveItemInUploadRequestController.php     |   2 +-
 .../UploadRequestNotification.php             |  11 +-
 11 files changed, 179 insertions(+), 136 deletions(-)

diff --git a/resources/js/components/FilesView/ItemGrid.vue b/resources/js/components/FilesView/ItemGrid.vue
index 6d05abfc..eac4a1be 100644
--- a/resources/js/components/FilesView/ItemGrid.vue
+++ b/resources/js/components/FilesView/ItemGrid.vue
@@ -74,17 +74,18 @@
             <!--Item Info-->
             <div class="text-center">
                 <!--Item Title-->
-                <b
-                    class="inline-block w-full overflow-hidden text-ellipsis whitespace-nowrap text-sm leading-3 tracking-tight md:px-6"
+                <span
+                    class="inline-block w-full overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold leading-3 tracking-tight md:px-6"
                     :class="{ 'hover:underline': canEditName }"
                     ref="name"
                     @input="renameItem"
                     @keydown.delete.stop
                     @click.stop
+					@keydown.enter="$refs.name.blur()"
                     :contenteditable="canEditName"
                 >
                     {{ itemName }}
-                </b>
+                </span>
 
                 <!--Item sub line-->
                 <div class="flex items-center justify-center">
diff --git a/resources/js/components/FilesView/ItemList.vue b/resources/js/components/FilesView/ItemList.vue
index 51609f95..5af4640f 100644
--- a/resources/js/components/FilesView/ItemList.vue
+++ b/resources/js/components/FilesView/ItemList.vue
@@ -52,18 +52,19 @@
         <!--Item Info-->
         <div class="pl-2">
             <!--Item Title-->
-            <b
-                class="mb-0.5 block overflow-hidden text-ellipsis whitespace-nowrap text-sm"
+            <span
+                class="mb-0.5 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold"
                 :class="{ 'hover:underline': canEditName }"
                 style="max-width: 240px"
                 ref="name"
                 @input="renameItem"
                 @keydown.delete.stop
                 @click.stop
+				@keydown.enter="$refs.name.blur()"
                 :contenteditable="canEditName"
             >
                 {{ itemName }}
-            </b>
+            </span>
 
             <!--Item sub line-->
             <div class="flex items-center">
diff --git a/resources/js/components/Others/CreateUploadRequestPopup.vue b/resources/js/components/Others/CreateUploadRequestPopup.vue
index 195641f9..93820dd0 100644
--- a/resources/js/components/Others/CreateUploadRequestPopup.vue
+++ b/resources/js/components/Others/CreateUploadRequestPopup.vue
@@ -1,94 +1,94 @@
 <template>
-    <PopupWrapper name="create-upload-request">
+    <PopupWrapper name="create-file-request">
         <!--Title-->
-        <PopupHeader :title="$t('Create Upload Request')" icon="upload" />
+        <PopupHeader :title="$t('Create File Request')" icon="upload" />
 
-        <!--Content-->
+		<!--Content-->
         <PopupContent>
             <!--Item Thumbnail-->
-            <ThumbnailItem class="mb-5" :item="pickedItem" />
+            <ThumbnailItem v-if="pickedItem" class="mb-5" :item="pickedItem" />
 
-            <!--Form to set upload request-->
+			<!--Form to set upload request-->
             <ValidationObserver
-                v-if="!generatedUploadRequest"
-                @submit.prevent="createUploadRequest"
-                ref="createForm"
-                v-slot="{ invalid }"
-                tag="form"
-            >
+				v-if="!generatedUploadRequest"
+				@submit.prevent="createUploadRequest"
+				ref="createForm"
+				v-slot="{ invalid }"
+				tag="form"
+			>
                 <AppInputSwitch
-                    :title="$t('Send Request by Email')"
-                    :description="$t('Send your file request on recipients email')"
-                >
+					:title="$t('Send Request by Email')"
+					:description="$t('Send your file request on recipients email')"
+				>
                     <SwitchInput v-model="shareViaEmail" :state="shareViaEmail" class="switch" />
                 </AppInputSwitch>
 
-                <!--Set email-->
+				<!--Set email-->
                 <ValidationProvider
-                    v-if="shareViaEmail"
-                    tag="div"
-                    mode="passive"
-                    name="Email"
-                    rules="required"
-                    v-slot="{ errors }"
-                >
-                    <AppInputText :error="errors[0]">
+					v-if="shareViaEmail"
+					tag="div"
+					mode="passive"
+					name="Email"
+					rules="required"
+					v-slot="{ errors }"
+				>
+                    <AppInputText :error="errors[0]" class="-mt-2">
                         <input
-                            v-model="form.email"
-                            :class="{ 'border-red': errors[0] }"
-                            type="text"
-                            ref="input"
-                            class="focus-border-theme input-dark"
-                            :placeholder="$t('Type email...')"
-                        />
+							v-model="form.email"
+							:class="{ 'border-red': errors[0] }"
+							type="text"
+							ref="input"
+							class="focus-border-theme input-dark"
+							:placeholder="$t('Type email...')"
+						/>
                     </AppInputText>
                 </ValidationProvider>
 
-                <!--Set note-->
+				<!--Set note-->
                 <ValidationProvider tag="div" mode="passive" name="Note" v-slot="{ errors }">
-                    <AppInputText :title="$t('Message (optional)')" :error="errors[0]" :is-last="true">
+                    <AppInputText :title="$t('Message (optional)')" :description="$t('This message will be showed for your email recipient or in the upload page.')" :error="errors[0]" :is-last="true">
                         <textarea
-                            v-model="form.notes"
-                            rows="2"
-                            :class="{ 'border-red': errors[0] }"
-                            type="text"
-                            ref="input"
-                            class="focus-border-theme input-dark"
-                            :placeholder="$t('Type message for recipient...')"
-                        ></textarea>
+							v-model="form.notes"
+							rows="2"
+							:class="{ 'border-red': errors[0] }"
+							type="text"
+							ref="input"
+							class="focus-border-theme input-dark"
+							:placeholder="$t('Type message for recipient...')"
+						></textarea>
                     </AppInputText>
                 </ValidationProvider>
             </ValidationObserver>
 
-            <!--Copy generated link-->
+			<!--Copy generated link-->
             <AppInputText v-if="generatedUploadRequest" :title="$t('Copy your upload request link')" :is-last="true">
                 <CopyInput :str="generatedUploadRequest.data.attributes.url" />
             </AppInputText>
         </PopupContent>
 
-        <!--Actions-->
+		<!--Actions-->
         <PopupActions v-if="!generatedUploadRequest">
             <ButtonBase class="w-full" @click.native="$closePopup()" button-style="secondary"
-                >{{ $t('popup_move_item.cancel') }}
+			>{{ $t('popup_move_item.cancel') }}
             </ButtonBase>
             <ButtonBase class="w-full" @click.native="createUploadRequest" :loading="isLoading" button-style="theme"
-                >{{ $t('Create Request') }}
+			>{{ $t('Create Request') }}
             </ButtonBase>
         </PopupActions>
 
-        <!--Actions-->
+		<!--Actions-->
         <PopupActions v-if="generatedUploadRequest">
             <ButtonBase class="w-full" @click.native="$closePopup()" button-style="theme"
-                >{{ $t('shared_form.button_done') }}
+			>{{ $t('shared_form.button_done') }}
             </ButtonBase>
         </PopupActions>
     </PopupWrapper>
 </template>
 
 <script>
-import { ValidationProvider, ValidationObserver } from 'vee-validate/dist/vee-validate.full'
+import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
 import AppInputSwitch from '../Admin/AppInputSwitch'
-import { required } from 'vee-validate/dist/rules'
+import {required} from 'vee-validate/dist/rules'
 import ButtonBase from '../FilesView/ButtonBase'
 import AppInputText from '../Admin/AppInputText'
 import PopupWrapper from './Popup/PopupWrapper'
@@ -98,70 +98,88 @@ import PopupHeader from './Popup/PopupHeader'
 import SwitchInput from './Forms/SwitchInput'
 import ThumbnailItem from './ThumbnailItem'
 import CopyInput from './Forms/CopyInput'
-import { events } from '../../bus'
+import {events} from '../../bus'
 import axios from 'axios'
 
 export default {
-    name: 'CreateUploadRequestPopup',
-    components: {
-        ValidationProvider,
-        ValidationObserver,
-        AppInputSwitch,
-        ThumbnailItem,
-        AppInputText,
-        PopupWrapper,
-        PopupActions,
-        PopupContent,
-        SwitchInput,
-        PopupHeader,
-        ButtonBase,
-        CopyInput,
-        required,
-    },
-    data() {
-        return {
-            form: {
-                email: undefined,
-                notes: undefined,
-                folder_id: undefined,
-            },
-            generatedUploadRequest: undefined,
-            shareViaEmail: false,
-            pickedItem: false,
-            isLoading: false,
-        }
-    },
-    methods: {
-        async createUploadRequest() {
-            // Validate fields
-            const isValid = await this.$refs.createForm.validate()
+	name: 'CreateUploadRequestPopup',
+	components: {
+		ValidationProvider,
+		ValidationObserver,
+		AppInputSwitch,
+		ThumbnailItem,
+		AppInputText,
+		PopupWrapper,
+		PopupActions,
+		PopupContent,
+		SwitchInput,
+		PopupHeader,
+		ButtonBase,
+		CopyInput,
+		required,
+	},
+	data() {
+		return {
+			form: {
+				email: undefined,
+				notes: undefined,
+				folder_id: undefined,
+			},
+			generatedUploadRequest: undefined,
+			shareViaEmail: false,
+			pickedItem: undefined,
+			isLoading: false,
+		}
+	},
+	methods: {
+		async createUploadRequest() {
+			// Validate fields
+			const isValid = await this.$refs.createForm.validate()
 
-            if (!isValid) return
+			if (!isValid) return
 
-            this.isLoading = true
+			this.isLoading = true
 
-            // Send request to get share link
-            axios
-                .post(`/api/upload-request`, this.form)
-                .then((response) => {
-                    this.generatedUploadRequest = response.data
-                })
-                .catch(() => {
-                    events.$emit('alert:open', {
-                        title: this.$t('popup_error.title'),
-                        message: this.$t('popup_error.message'),
-                    })
-                })
-                .finally(() => {
-                    this.isLoading = false
-                })
-        },
-    },
-    created() {
-        events.$on('popup:open', (args) => {
-            if (args.name === 'create-upload-request') this.pickedItem = args.item
-            this.form.folder_id = args.item.data.id
-        })
-    },
+			// Send request to get share link
+			axios
+				.post(`/api/upload-request`, this.form)
+				.then((response) => {
+					this.generatedUploadRequest = response.data
+				})
+				.catch(() => {
+					events.$emit('alert:open', {
+						title: this.$t('popup_error.title'),
+						message: this.$t('popup_error.message'),
+					})
+				})
+				.finally(() => {
+					this.isLoading = false
+				})
+		},
+	},
+	created() {
+		events.$on('popup:open', (args) => {
+			if (args.name === 'create-file-request') this.pickedItem = args.item
+			this.form.folder_id = args.item.data.id
+		})
+
+		// Close popup
+		events.$on('popup:close', () => {
+
+			// Restore data
+			setTimeout(() => {
+				this.generatedUploadRequest = undefined
+				this.pickedItem = undefined
+
+				this.shareViaEmail = false
+
+				this.form = {
+					email: undefined,
+					notes: undefined,
+					folder_id: undefined,
+				}
+			}, 150)
+		})
+	},
 }
 </script>
diff --git a/resources/js/components/Others/MoveItemPopup.vue b/resources/js/components/Others/MoveItemPopup.vue
index 58221e94..9481be1c 100644
--- a/resources/js/components/Others/MoveItemPopup.vue
+++ b/resources/js/components/Others/MoveItemPopup.vue
@@ -94,25 +94,17 @@ export default {
                 return
 
             // Move item
-            if (!this.isSelectedItem) {
-                this.$store.dispatch('moveItem', {
-                    to_item: this.selectedFolder,
-                    isSelectedItem: null,
-                })
-            }
-
-            if (this.isSelectedItem) {
-                this.$store.dispatch('moveItem', {
-                    to_item: this.selectedFolder,
-                    isSelectedItem: this.pickedItem,
-                })
-            }
+			this.$store.dispatch('moveItem', {
+				to_item: this.selectedFolder,
+				noSelectedItem: this.isSelectedItem ? this.pickedItem : null,
+			})
 
             // Close popup
             events.$emit('popup:close')
 
             // If is mobile, close the selecting mod after done the move action
-            if (this.$isMobile()) this.$store.commit('DISABLE_MULTISELECT_MODE')
+            if (this.$isMobile())
+				this.$store.commit('DISABLE_MULTISELECT_MODE')
         },
     },
     mounted() {
diff --git a/resources/js/components/Spotlight/Spotlight.vue b/resources/js/components/Spotlight/Spotlight.vue
index 10449c2e..47d870b1 100644
--- a/resources/js/components/Spotlight/Spotlight.vue
+++ b/resources/js/components/Spotlight/Spotlight.vue
@@ -213,6 +213,11 @@
                                 size="18"
                                 class="vue-feather text-theme"
                             />
+                            <upload-cloud-icon
+                                v-if="result.action.value === 'create-file-request'"
+                                size="18"
+                                class="vue-feather text-theme"
+                            />
 
                             <b class="ml-3.5 text-sm font-bold">
                                 {{ result.title }}
@@ -534,6 +539,13 @@ export default {
                         value: 'create-team-folder',
                     },
                 },
+                {
+                    title: this.$t('Create File Request'),
+                    action: {
+                        type: 'function',
+                        value: 'create-file-request',
+                    },
+                },
             ]
 
             let functionList = [
@@ -745,6 +757,10 @@ export default {
                 if (arg.action.value === 'create-team-folder') {
                     this.$createTeamFolder()
                 }
+
+                if (arg.action.value === 'create-file-request') {
+                    this.$createFileRequest()
+                }
             }
 
             this.exitSpotlight()
diff --git a/resources/js/helpers/itemHelpers.js b/resources/js/helpers/itemHelpers.js
index 20a07b50..20649802 100644
--- a/resources/js/helpers/itemHelpers.js
+++ b/resources/js/helpers/itemHelpers.js
@@ -113,9 +113,9 @@ const itemHelpers = {
             })
         }
 
-        Vue.prototype.$createUploadRequest = function (entry) {
+        Vue.prototype.$createFileRequest = function (entry = undefined) {
             events.$emit('popup:open', {
-                name: 'create-upload-request',
+                name: 'create-file-request',
                 item: entry,
             })
         }
diff --git a/resources/js/views/FileView/Files.vue b/resources/js/views/FileView/Files.vue
index 8fa4a67f..32cba1ee 100644
--- a/resources/js/views/FileView/Files.vue
+++ b/resources/js/views/FileView/Files.vue
@@ -136,9 +136,9 @@
                         icon="user-plus"
                     />
                     <Option
-                        @click.native="$createUploadRequest(item)"
+                        @click.native="$createFileRequest(item)"
                         v-if="isFolder"
-                        :title="$t('Create Upload Request')"
+                        :title="$t('File Request')"
                         icon="upload-cloud"
                     />
                 </OptionGroup>
diff --git a/resources/js/views/FileView/UploadRequestFiles.vue b/resources/js/views/FileView/UploadRequestFiles.vue
index ef90e091..7e812400 100644
--- a/resources/js/views/FileView/UploadRequestFiles.vue
+++ b/resources/js/views/FileView/UploadRequestFiles.vue
@@ -89,7 +89,7 @@
 					:size="26"
 				/>
 				<b class="text-theme ml-2 text-sm">
-					{{ $t('Tell Jane you are done!') }}
+					{{ $t('Tell {name} you are done!', {name: userName}) }}
 				</b>
 			</button>
 
@@ -137,10 +137,16 @@
 				<h1 class="title">
 					{{ emptyPageTitle }}
 				</h1>
+
 				<p class="description max-w-[420px] mx-auto">
 					{{ emptyPageDescription }}
 				</p>
 
+				<InfoBox class="max-w-[420px] mx-auto">
+					<b>{{ $t('{name} leave you a message', {name: userName}) }}: </b>
+					<p>{{ uploadRequest.data.attributes.notes }}</p>
+				</InfoBox>
+
 				<ButtonUpload v-if="uploadRequest.data.attributes.status === 'active'" button-style="theme">
 					{{ $t('empty_page.call_to_action') }}
 				</ButtonUpload>
@@ -169,10 +175,12 @@ import OptionGroup from '../../components/FilesView/OptionGroup'
 import Option from '../../components/FilesView/Option'
 import {events} from '../../bus'
 import {mapGetters} from 'vuex'
+import InfoBox from "../../components/Others/Forms/InfoBox";
 
 export default {
 	name: 'Files',
 	components: {
+		InfoBox,
 		MobileMultiSelectToolbar,
 		MobileActionButton,
 		FileActionsMobile,
diff --git a/resources/js/views/Teams/Invitation.vue b/resources/js/views/Teams/Invitation.vue
index 9cd0f3a1..2bb04d3f 100644
--- a/resources/js/views/Teams/Invitation.vue
+++ b/resources/js/views/Teams/Invitation.vue
@@ -6,7 +6,7 @@
                 v-if="invitation"
                 :title="$t('Invitation To Join Team Folder')"
                 :description="
-                    $t('Jane invite you to join with his team into shared team folder', {
+                    $t('{name} invite you to join with his team into shared team folder', {
                         name: invitation.data.relationships.inviter.data.attributes.name,
                     })
                 "
diff --git a/src/Domain/UploadRequest/Controllers/MoveItemInUploadRequestController.php b/src/Domain/UploadRequest/Controllers/MoveItemInUploadRequestController.php
index 537591fc..b7224353 100644
--- a/src/Domain/UploadRequest/Controllers/MoveItemInUploadRequestController.php
+++ b/src/Domain/UploadRequest/Controllers/MoveItemInUploadRequestController.php
@@ -19,7 +19,7 @@ class MoveItemInUploadRequestController extends Controller
                 return response('Access Denied', 403);
             }
 
-            $item->update(['parent_id' => $request->input('to_id')]);
+            $item->update(['parent_id' => $request->input('to_id') ?? $uploadRequest->id]);
         }
 
         return response('Done.', 204);
diff --git a/src/Domain/UploadRequest/Notifications/UploadRequestNotification.php b/src/Domain/UploadRequest/Notifications/UploadRequestNotification.php
index eecd2a4e..246e4450 100644
--- a/src/Domain/UploadRequest/Notifications/UploadRequestNotification.php
+++ b/src/Domain/UploadRequest/Notifications/UploadRequestNotification.php
@@ -40,12 +40,19 @@ class UploadRequestNotification extends Notification implements ShouldQueue
      */
     public function toMail($notifiable)
     {
+        // Format optional message
+        // TODO: add to language strings
+        $message = $this->uploadRequest->notes
+            ? "PS: {$this->uploadRequest->user->settings->first_name} left you a message: {$this->uploadRequest->notes}"
+            : null;
+
         // TODO: add to language strings
         return (new MailMessage)
             ->subject("{$this->uploadRequest->user->settings->first_name} Request You for File Upload")
             ->greeting('Hello')
-            ->line("We are emailing you because {$this->uploadRequest->user->settings->first_name} needs files from you. Please click on the link below and upload your files for {$this->uploadRequest->user->settings->first_name}.")
-            ->action('Upload Files', url("/request/{$this->uploadRequest->id}/upload"))
+            ->line("We are emailing you because {$this->uploadRequest->user->settings->first_name} requested files from you. Please click on the link below and upload your files for {$this->uploadRequest->user->settings->first_name}.")
+            ->line($message)
+            ->action('Upload your Files', url("/request/{$this->uploadRequest->id}/upload"))
             ->line('Thank you for using our application!');
     }