feat: collection rename

Signed-off-by: Sebastian <krupinski01@gmail.com>

src/components/FolderTreeView.vue

@@ -25,6 +25,7 @@ const props = defineProps<Props>()
 const emit = defineEmits<{
   select: [folder: CollectionObject]
   createFolder: [service: ServiceInterface, parentFolder: CollectionObject | null]
+  editFolder: [service: ServiceInterface, folder: CollectionObject]
 }>()
 </script>
 
@@ -36,6 +37,7 @@ const emit = defineEmits<{
         <template v-slot:activator="{ props: activatorProps }">
           <v-list-item
             v-bind="activatorProps"
+            class="account-header-item"
             :title="group.service.label || 'Mail Account'"
             :subtitle="group.service.primaryAddress || undefined"
           >
@@ -66,6 +68,7 @@ const emit = defineEmits<{
           :selected-folder="selectedFolder"
           @select="emit('select', $event)"
           @create-subfolder="(service, parentFolder) => emit('createFolder', service, parentFolder)"
+          @edit-folder="(service, folder) => emit('editFolder', service, folder)"
         />
       </v-list-group>
 
@@ -93,6 +96,7 @@ const emit = defineEmits<{
           :selected-folder="selectedFolder"
           @select="emit('select', $event)"
           @create-subfolder="(service, parentFolder) => emit('createFolder', service, parentFolder)"
+          @edit-folder="(service, folder) => emit('editFolder', service, folder)"
         />
       </template>
     </template>
@@ -103,4 +107,15 @@ const emit = defineEmits<{
 .v-list-item--active {
   background-color: rgba(var(--v-theme-primary), 0.12);
 }
+
+.account-header-item {
+  --v-list-item-prepend-size: 22px;
+  background-color: rgba(var(--v-theme-primary), 0.1);
+  border-radius: 6px;
+}
+
+.account-header-item :deep(.v-list-item__prepend) {
+  padding-inline-start: 4px;
+  margin-inline-end: 2px;
+}
 </style>