diff --git a/src/renderer/components/sidebar/SidebarListItem.vue b/src/renderer/components/sidebar/SidebarListItem.vue
index b0729a3..e77ea64 100644
--- a/src/renderer/components/sidebar/SidebarListItem.vue
+++ b/src/renderer/components/sidebar/SidebarListItem.vue
@@ -9,6 +9,7 @@
}"
v-on="$listeners"
@click="onClick"
+ @dblclick="onDblClick"
@contextmenu="onContext"
>
@@ -21,6 +22,7 @@
+ {{ folderName }}
@@ -128,6 +134,10 @@ export default {
},
isEditable () {
return this.editableId === this.id
+ },
+ isSystem () {
+ const libraryItems = ['inBox', 'favorites', 'allSnippets', 'trash']
+ return libraryItems.includes(this.id)
}
},
@@ -145,16 +155,16 @@ export default {
this.$store.commit('tags/SET_SELECTED_ID', this.id)
}
},
+ onDblClick () {
+ if (!this.isSystem) this.setEditable()
+ },
onContext () {
if (!this.tag) {
- const libraryItems = ['inBox', 'favorites', 'allSnippets', 'trash']
- const isLibrary = libraryItems.includes(this.id)
-
if (this.id === 'trash') {
- this.trashContext()
+ return this.trashContext()
}
- if (isLibrary) return
+ if (this.isSystem) return
this.folderContext()
} else {
@@ -291,6 +301,11 @@ export default {
color: var(--color-contrast-higher);
}
}
+ .folder-name {
+ display: flex;
+ height: 20px;
+ align-items: center;
+ }
svg {
width: 16px;
height: 16px;
diff --git a/src/renderer/components/snippets/SnippetTabsItem.vue b/src/renderer/components/snippets/SnippetTabsItem.vue
index 771fb5b..f7fa1eb 100644
--- a/src/renderer/components/snippets/SnippetTabsItem.vue
+++ b/src/renderer/components/snippets/SnippetTabsItem.vue
@@ -6,9 +6,11 @@
active: isActive
}"
v-on="$listeners"
+ @dblclick="onDblClick"
@contextmenu="onTabContext"
>
+ {{ computedLabel }}
@@ -61,17 +67,21 @@ export default {
},
methods: {
+ setEditable () {
+ this.editable = true
+ this.$nextTick(() => {
+ this.$refs.input.focus()
+ this.$refs.input.select()
+ })
+ },
+ onDblClick () {
+ this.setEditable()
+ },
onTabContext () {
menu.popup([
{
label: `Rename "${this.label}"`,
- click: () => {
- this.editable = true
- this.$nextTick(() => {
- this.$refs.input.focus()
- this.$refs.input.select()
- })
- }
+ click: () => this.setEditable()
},
{
type: 'separator'
@@ -107,10 +117,11 @@ export default {
align-items: center;
justify-content: center;
height: 100%;
+ width: 100%;
padding: 0 var(--spacing-xs);
color: var(--color-contrast-medium);
font-size: var(--text-sm);
- -webkit-user-select: none;
+ user-select: none;
input {
width: 100%;
color: var(--color-contrast-medium);
@@ -120,7 +131,6 @@ export default {
outline: none;
&[disabled] {
color: var(--color-contrast-medium);
- -webkit-user-select: none;
}
&.is-editable {
border: 1px solid var(--color-primary);