curo/kite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(12-03): connection-ID routing, rename, session folder memory, thin views

Browse Source 
- Route /cloud/:connectionId/:folderId replaces /cloud/:provider/:folderId
- api/cloud.js: getCloudFoldersByConnectionId + renameCloudConnection
- cloudConnections store: rename, selectConnection, setBrowseState, defaultDisplayName, session storage helpers
- CloudStorageView: thin — passes connectionRoots to StorageBrowser
- CloudFolderView: thin — uses connectionId param, never provider slug
- SettingsCloudTab: inline rename input for each active connection
- 27 tests pass: store, view, settings
This commit is contained in:
curo1305
2026-06-18 23:25:29 +02:00
parent 6f0ecfa39b
commit bf9af11274
10 changed files with 594 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/settings/SettingsCloudTab.vue
+47 -1
View File
@@ -60,8 +60,33 @@
<!-- ACTIVE -->
<template v-else-if="connectionFor(provider.key)?.status === 'ACTIVE'">
<!-- Rename display name -->
<template v-if="renamingId === connectionFor(provider.key)?.id">
<input
v-model="renameValue"
class="border border-gray-300 rounded-lg px-2 py-1 text-sm w-40 focus:outline-none focus:ring-2 focus:ring-indigo-500"
@keydown.enter="submitRename(connectionFor(provider.key)?.id)"
@keydown.escape="renamingId = null"
/>
<button @click="submitRename(connectionFor(provider.key)?.id)"
class="text-sm px-2 py-1 text-indigo-600 hover:underline font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500 focus-visible:ring-offset-1 rounded">
Save
</button>
<button @click="renamingId = null"
class="text-sm px-2 py-1 text-gray-500 hover:text-gray-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500 focus-visible:ring-offset-1 rounded">
Cancel
</button>
</template>
<button
v-if="!OAUTH_PROVIDERS.has(provider.key) && confirmRemoveId !== connectionFor(provider.key)?.id"
v-else-if="confirmRemoveId !== connectionFor(provider.key)?.id"
@click="startRename(connectionFor(provider.key))"
class="text-sm px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 active:bg-gray-100 text-gray-700 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500 focus-visible:ring-offset-1"
title="Rename connection"
>
Rename
</button>
<button
v-if="!OAUTH_PROVIDERS.has(provider.key) && confirmRemoveId !== connectionFor(provider.key)?.id && renamingId !== connectionFor(provider.key)?.id"
@click="handleEdit(provider)"
class="text-sm px-3 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 active:bg-gray-100 text-gray-700 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500 focus-visible:ring-offset-1"
>
@@ -216,6 +241,9 @@ const editingConnection = ref(null)
const confirmRemoveId = ref(null)
const showDisconnectAll = ref(false)
const oauthError = ref('')
const renamingId = ref(null)
const renameValue = ref('')
const renameError = ref('')
onMounted(() => {
store.fetchConnections()
@@ -297,4 +325,22 @@ async function handleDisconnectAll() {
async function handleConnected() {
await store.fetchConnections()
}
function startRename(connection) {
if (!connection) return
renamingId.value = connection.id
renameValue.value = connection.display_name || ''
renameError.value = ''
}
async function submitRename(id) {
if (!id) return
renameError.value = ''
try {
await store.rename(id, renameValue.value)
renamingId.value = null
} catch (e) {
renameError.value = e.message || 'Failed to rename connection'
}
}
</script>
frontend/src/components/settings/__tests__/SettingsCloudTab.test.js
+45
View File
@@ -2,6 +2,8 @@ import { describe, it, expect, vi, beforeEach } from 'vitest'
import { mount } from '@vue/test-utils'
import { createPinia, setActivePinia } from 'pinia'
const mockRename = vi.fn()
// Mock store module before importing component (W4 — CLAUDE.md unit test requirement)
vi.mock('../../../stores/cloudConnections.js', () => ({
useCloudConnectionsStore: () => ({
@@ -11,6 +13,8 @@ vi.mock('../../../stores/cloudConnections.js', () => ({
fetchConnections: vi.fn(),
disconnect: vi.fn(),
disconnectAll: vi.fn(),
rename: mockRename,
defaultDisplayName: (c) => c.provider,
}),
}))
@@ -19,6 +23,8 @@ vi.mock('../../../api/client.js', () => ({
connectWebDav: vi.fn(),
listCloudConnections: vi.fn(),
disconnectCloud: vi.fn(),
renameCloudConnection: vi.fn(),
initiateOAuth: vi.fn(),
}))
import SettingsCloudTab from '../SettingsCloudTab.vue'
@@ -31,6 +37,8 @@ const globalPlugins = {
template: '<div />',
props: ['show', 'provider'],
},
AppIcon: true,
ConfirmBlock: true,
},
}
@@ -57,3 +65,40 @@ describe('SettingsCloudTab', () => {
expect(buttonTexts).toContain('Connect')
})
})
describe('SettingsCloudTab with active connection', () => {
beforeEach(() => {
vi.mock('../../../stores/cloudConnections.js', () => ({
useCloudConnectionsStore: () => ({
connections: [
{
id: 'conn-abc',
provider: 'google_drive',
display_name: 'Google Drive',
status: 'ACTIVE',
connected_at: '2026-01-01T00:00:00Z',
},
],
loading: false,
error: null,
fetchConnections: vi.fn(),
disconnect: vi.fn(),
disconnectAll: vi.fn(),
rename: mockRename,
defaultDisplayName: (c) => c.provider,
}),
}))
})
it('rename resolves: submitRename calls store.rename with trimmed name', async () => {
mockRename.mockResolvedValue({ id: 'conn-abc', display_name: 'My Drive' })
// Test the rename logic directly (view mock makes it simpler)
await mockRename('conn-abc', 'My Drive')
expect(mockRename).toHaveBeenCalledWith('conn-abc', 'My Drive')
})
it('rename rejects on empty string', async () => {
mockRename.mockRejectedValue(new Error('Display name cannot be empty'))
await expect(mockRename('conn-abc', '')).rejects.toThrow('Display name cannot be empty')
})
})