feat: https://github.com/vastsa/FileCodeBox/issues/450

src/components/common/PageFooter.vue

@@ -8,7 +8,7 @@
         {{ linkText }}
       </router-link>
     </div>
-    
+
     <div
       class="px-8 py-4 bg-opacity-50 flex justify-between items-center"
       :class="[isDarkMode ? 'bg-gray-800' : 'bg-gray-100']"
@@ -20,21 +20,34 @@
         <ShieldCheckIcon class="w-4 h-4 mr-1 text-green-400" />
         {{ t('send.secureEncryption') }}
       </span>
-      <button
-        @click="$emit('toggle-drawer')"
-        class="text-sm hover:text-indigo-300 transition duration-300 flex items-center"
-        :class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
-      >
-        {{ drawerText }}
-        <ClipboardListIcon class="w-4 h-4 ml-1" />
-      </button>
+      <div class="flex items-center space-x-4">
+        <router-link
+          to="/login"
+          class="text-sm hover:text-indigo-300 transition duration-300 flex items-center"
+          :class="[
+            isDarkMode
+              ? 'text-gray-400 hover:text-indigo-400'
+              : 'text-gray-500 hover:text-indigo-600'
+          ]"
+        >
+          <UserIcon class="w-4 h-4" />
+        </router-link>
+        <button
+          @click="$emit('toggle-drawer')"
+          class="text-sm hover:text-indigo-300 transition duration-300 flex items-center"
+          :class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
+        >
+          {{ drawerText }}
+          <ClipboardListIcon class="w-4 h-4 ml-1" />
+        </button>
+      </div>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
 import { inject } from 'vue'
-import { ShieldCheckIcon, ClipboardListIcon } from 'lucide-vue-next'
+import { ShieldCheckIcon, ClipboardListIcon, UserIcon } from 'lucide-vue-next'
 import { useI18n } from 'vue-i18n'
 
 const { t } = useI18n()
@@ -53,4 +66,4 @@ defineProps<Props>()
 defineEmits<Emits>()
 
 const isDarkMode = inject('isDarkMode')
-</script>
+</script>