feat: rename file from tab item

addons/editor/src/renderer/CodeEditorPane.vue

@@ -1,8 +1,10 @@
 <script lang="ts" setup>
+import { ipcRenderer } from '@commas/electron-ipc'
 import type { TerminalTab } from '@commas/types/terminal'
 import * as commas from 'commas:api/renderer'
 import { watchEffect } from 'vue'
 import CodeEditor from './CodeEditor.vue'
+import { setCodeEditorTabFile } from './compositions'
 
 const { tab } = defineProps<{
   tab: TerminalTab,
@@ -33,10 +35,18 @@ function save() {
   editor!.save()
 }
 
+async function rename(name: string) {
+  const newPath = await ipcRenderer.invoke('rename-file', file, name)
+  setCodeEditorTabFile(tab, newPath)
+}
+
 watchEffect((onInvalidate) => {
   if (tab.pane) {
     // eslint-disable-next-line vue/no-mutating-props
-    tab.pane.instance = { save }
+    tab.pane.instance = {
+      save,
+      rename,
+    }
     onInvalidate(() => {
       if (tab.pane) {
         // eslint-disable-next-line vue/no-mutating-props

addons/editor/src/renderer/compositions.ts

@@ -1,3 +1,5 @@
+import * as path from 'node:path'
+import type { TerminalTab } from '@commas/types/terminal'
 import * as commas from 'commas:api/renderer'
 import { readonly } from 'vue'
 import type { EditorTheme } from '../types/theme'
@@ -14,3 +16,9 @@ export function openCodeEditorTab(file: string) {
     shell: file,
   })
 }
+
+export function setCodeEditorTabFile(tab: TerminalTab, file: string) {
+  tab.shell = file
+  tab.process = file
+  tab.cwd = path.dirname(file)
+}

addons/paint/src/renderer/PaintPane.vue

@@ -1,8 +1,10 @@
 <script lang="ts" setup>
+import { ipcRenderer } from '@commas/electron-ipc'
 import type { TerminalTab } from '@commas/types/terminal'
 import * as commas from 'commas:api/renderer'
 import { watchEffect } from 'vue'
 import ExcalidrawBoard from './ExcalidrawBoard.vue'
+import { setPaintTabFile } from './compositions'
 
 const { tab } = defineProps<{
   tab: TerminalTab,
@@ -34,10 +36,18 @@ async function save() {
   await board.save()
 }
 
+async function rename(name: string) {
+  const newPath = await ipcRenderer.invoke('rename-file', file, name)
+  setPaintTabFile(tab, newPath)
+}
+
 watchEffect((onInvalidate) => {
   if (tab.pane) {
     // eslint-disable-next-line vue/no-mutating-props
-    tab.pane.instance = { save }
+    tab.pane.instance = {
+      save,
+      rename,
+    }
     onInvalidate(() => {
       if (tab.pane) {
         // eslint-disable-next-line vue/no-mutating-props

addons/paint/src/renderer/compositions.ts

@@ -1,7 +1,15 @@
+import * as path from 'node:path'
+import type { TerminalTab } from '@commas/types/terminal'
 import * as commas from 'commas:api/renderer'
 
 export function openPaintTab(file: string) {
   return commas.workspace.openPaneTab('paint', {
     shell: file,
   })
 }
+
+export function setPaintTabFile(tab: TerminalTab, file: string) {
+  tab.shell = file
+  tab.process = file
+  tab.cwd = path.dirname(file)
+}

src/main/lib/message.ts

@@ -35,6 +35,7 @@ declare module '@commas/electron-ipc' {
     'open-url': (uri: string) => void,
     'save-file-path': (name: string) => Promise<string>,
     'save-file': (name: string, content: Buffer | string) => Promise<string>,
+    'rename-file': (file: string, name: string) => Promise<string>,
   }
   export interface Events {
     'get-path': (name?: Parameters<typeof app['getPath']>[0]) => string,
@@ -244,6 +245,11 @@ function handleMessages() {
     await fs.promises.writeFile(file, content)
     return file
   })
+  ipcMain.handle('rename-file', async (event, file, name) => {
+    const newPath = path.join(path.dirname(file), name)
+    await fs.promises.rename(file, newPath)
+    return newPath
+  })
   let watcherCollections = new WeakMap<WebContents, Map<string, any>>()
   ipcMain.handle('get-ref:file', (event, file: string) => {
     let watchers = watcherCollections.get(event.sender)

src/renderer/components/TabItem.vue

@@ -85,8 +85,12 @@ watchEffect(() => {
   customTitle = title
 })
 
+const isCustomizable = $computed(() => {
+  return customizable || Boolean(pane?.instance?.rename)
+})
+
 async function startCustomization() {
-  if (customizable && isActive) {
+  if (isCustomizable && isActive) {
     isCustomizing = true
     await nextTick()
     if (customTitleElement) {
@@ -96,8 +100,13 @@ async function startCustomization() {
 }
 
 function customize() {
+  if (!isCustomizing) return
   if (customTitle !== title) {
-    emit('customize', customTitle)
+    if (pane?.instance?.rename) {
+      pane.instance.rename(customTitle)
+    } else {
+      emit('customize', customTitle)
+    }
   }
   isCustomizing = false
 }

src/types/terminal.ts

@@ -25,6 +25,7 @@ export interface TerminalTabPane {
   component: Component<{ tab: TerminalTab }>,
   instance?: {
     save?: () => void,
+    rename?: (name: string) => void,
   },
   volatile?: boolean,
   factory?: (