mdi-folder
- {{ wrapped.item.label }}
+ {{ wrapped.item.properties.label || String(wrapped.item.identifier ?? '') }}
—
-
{{ formatDate(wrapped.item.modifiedOn) }}
+
{{ formatDate(wrapped.item.modified) }}
- {{ getFileIcon(wrapped.item as FileEntityObject) }}
- {{ wrapped.item.label }}
+ {{ getFileIcon(wrapped.item as EntityObject) }}
+ {{ wrapped.item.properties.label || String(wrapped.item.identifier ?? '') }}
- {{ formatSize((wrapped.item as FileEntityObject).size) }}
- {{ formatDate(wrapped.item.modifiedOn) }}
+ {{ formatSize(wrapped.item.properties.size) }}
+ {{ formatDate(wrapped.item.modified) }}
-import { FileCollectionObject } from '@FilesManager/models/collection'
-import { FileEntityObject } from '@FilesManager/models/entity'
+import { CollectionObject } from '@DocumentsManager/models/collection'
+import { EntityObject } from '@DocumentsManager/models/entity'
import { getFileIcon, formatSize } from '@/utils/fileHelpers'
import { FileActionsMenu } from '@/components'
defineProps<{
- collections: FileCollectionObject[]
- entities: FileEntityObject[]
+ collections: CollectionObject[]
+ entities: EntityObject[]
selectedIds: Set
}>()
const emit = defineEmits<{
- 'item-click': [item: FileCollectionObject | FileEntityObject, event: MouseEvent | KeyboardEvent]
- 'rename': [item: FileCollectionObject | FileEntityObject]
- 'delete': [item: FileCollectionObject | FileEntityObject]
- 'download': [item: FileCollectionObject | FileEntityObject]
- 'show-details': [item: FileCollectionObject | FileEntityObject]
+ 'item-click': [item: CollectionObject | EntityObject, event: MouseEvent | KeyboardEvent]
+ 'open': [item: CollectionObject | EntityObject]
+ 'rename': [item: CollectionObject | EntityObject]
+ 'delete': [item: CollectionObject | EntityObject]
+ 'download': [item: CollectionObject | EntityObject]
+ 'show-details': [item: CollectionObject | EntityObject]
}>()
@@ -24,9 +25,9 @@ const emit = defineEmits<{
@@ -34,6 +35,7 @@ const emit = defineEmits<{
:item="folder"
size="x-small"
button-class="action-btn"
+ @open="emit('open', $event)"
@rename="emit('rename', $event)"
@delete="emit('delete', $event)"
@download="emit('download', $event)"
@@ -41,22 +43,24 @@ const emit = defineEmits<{
/>
mdi-folder
-
{{ folder.label }}
+
{{ folder.properties.label || String(folder.identifier ?? '') }}
{{ getFileIcon(entity) }}
-
{{ entity.label }}
-
{{ formatSize(entity.size) }}
+
{{ entity.properties.label || String(entity.identifier ?? '') }}
+
{{ formatSize(entity.properties.size) }}
diff --git a/src/components/views/FilesListView.vue b/src/components/views/FilesListView.vue
index f06caa0..0512fb8 100644
--- a/src/components/views/FilesListView.vue
+++ b/src/components/views/FilesListView.vue
@@ -1,27 +1,28 @@
@@ -45,16 +46,17 @@ function isCollection(wrapped: ItemWithType): wrapped is { item: FileCollectionO
mdi-folder
- {{ wrapped.item.label }}
+ {{ wrapped.item.properties.label || String(wrapped.item.identifier ?? '') }}
- {{ getFileIcon(wrapped.item as FileEntityObject) }}
+ {{ getFileIcon(wrapped.item as EntityObject) }}
- {{ wrapped.item.label }}
- {{ formatSize((wrapped.item as FileEntityObject).size) }}
+ {{ wrapped.item.properties.label || String(wrapped.item.identifier ?? '') }}
+ {{ formatSize(wrapped.item.properties.size) }}
= ref(ROOT_ID)
// Loading/error state
- const isLoading = computed(() => nodesStore.loading)
+ const isLoading = computed(() => nodesStore.transceiving)
const error = computed(() => nodesStore.error)
// Provider and service
- const provider = computed(() => providersStore.getProvider(providerId))
- const service = computed(() => servicesStore.getService(providerId, serviceId))
- const rootId = computed(() => servicesStore.getRootId(providerId, serviceId) || ROOT_ID)
+ const provider = computed(() => providersStore.provider(providerId))
+ const service = computed(() => servicesStore.service(providerId, serviceId))
+ const rootId = computed(() => ROOT_ID)
// Current children
const currentChildren = computed(() =>
nodesStore.getChildren(providerId, serviceId, currentLocation.value)
)
- const currentCollections: ComputedRef = computed(() =>
+ const currentCollections: ComputedRef = computed(() =>
nodesStore.getChildCollections(providerId, serviceId, currentLocation.value)
)
- const currentEntities: ComputedRef = computed(() =>
+ const currentEntities: ComputedRef = computed(() =>
nodesStore.getChildEntities(providerId, serviceId, currentLocation.value)
)
@@ -77,7 +78,7 @@ export function useFileManager(options: UseFileManagerOptions) {
}
const currentNode = nodesStore.getNode(providerId, serviceId, currentLocation.value)
if (currentNode) {
- await navigateTo(currentNode.in || ROOT_ID)
+ await navigateTo(currentNode.collection ? String(currentNode.collection) : ROOT_ID)
}
}
@@ -88,15 +89,14 @@ export function useFileManager(options: UseFileManagerOptions) {
// Refresh current location
const refresh = async (
- filter?: FilterCondition[] | null,
- sort?: SortCondition[] | null,
- range?: RangeCondition | null
+ filter?: ListFilter,
+ sort?: ListSort,
+ range?: ListRange
) => {
await nodesStore.fetchNodes(
providerId,
serviceId,
- currentLocation.value === ROOT_ID ? null : currentLocation.value,
- false,
+ currentLocation.value === ROOT_ID ? ROOT_ID : currentLocation.value,
filter,
sort,
range
@@ -104,12 +104,12 @@ export function useFileManager(options: UseFileManagerOptions) {
}
// Create a new folder
- const createFolder = async (label: string): Promise => {
+ const createFolder = async (label: string): Promise => {
return await nodesStore.createCollection(
providerId,
serviceId,
currentLocation.value === ROOT_ID ? ROOT_ID : currentLocation.value,
- { label }
+ { label, owner: '' }
)
}
@@ -117,12 +117,22 @@ export function useFileManager(options: UseFileManagerOptions) {
const createFile = async (
label: string,
mime: string = 'application/octet-stream'
- ): Promise => {
+ ): Promise => {
+ const properties: DocumentInterface = {
+ '@type': 'documents.properties',
+ urid: null,
+ size: 0,
+ label,
+ mime,
+ format: null,
+ encoding: null,
+ }
+
return await nodesStore.createEntity(
providerId,
serviceId,
currentLocation.value === ROOT_ID ? ROOT_ID : currentLocation.value,
- { label, mime }
+ properties
)
}
@@ -133,10 +143,22 @@ export function useFileManager(options: UseFileManagerOptions) {
throw new Error('Node not found')
}
- if (node['@type'] === 'files.collection') {
- return await nodesStore.modifyCollection(providerId, serviceId, nodeId, { label: newLabel })
+ if (node instanceof CollectionObject) {
+ return await nodesStore.updateCollection(providerId, serviceId, nodeId, {
+ label: newLabel,
+ owner: node.properties.owner,
+ })
} else {
- return await nodesStore.modifyEntity(providerId, serviceId, node.in, nodeId, { label: newLabel })
+ const properties: DocumentInterface = {
+ '@type': 'documents.properties',
+ urid: node.properties.urid,
+ size: node.properties.size,
+ label: newLabel,
+ mime: node.properties.mime,
+ format: node.properties.format,
+ encoding: node.properties.encoding,
+ }
+ return await nodesStore.updateEntity(providerId, serviceId, node.collection, nodeId, properties)
}
}
@@ -147,61 +169,35 @@ export function useFileManager(options: UseFileManagerOptions) {
throw new Error('Node not found')
}
- if (node['@type'] === 'files.collection') {
- return await nodesStore.destroyCollection(providerId, serviceId, nodeId)
+ if (node instanceof CollectionObject) {
+ return await nodesStore.deleteCollection(providerId, serviceId, nodeId)
} else {
- return await nodesStore.destroyEntity(providerId, serviceId, node.in, nodeId)
- }
- }
-
- // Copy a node
- const copyNode = async (nodeId: string, destinationId?: string | null) => {
- const node = nodesStore.getNode(providerId, serviceId, nodeId)
- if (!node) {
- throw new Error('Node not found')
- }
-
- const destination = destinationId ?? currentLocation.value
-
- if (node['@type'] === 'files.collection') {
- return await nodesStore.copyCollection(providerId, serviceId, nodeId, destination)
- } else {
- return await nodesStore.copyEntity(providerId, serviceId, node.in, nodeId, destination)
- }
- }
-
- // Move a node
- const moveNode = async (nodeId: string, destinationId?: string | null) => {
- const node = nodesStore.getNode(providerId, serviceId, nodeId)
- if (!node) {
- throw new Error('Node not found')
- }
-
- const destination = destinationId ?? currentLocation.value
-
- if (node['@type'] === 'files.collection') {
- return await nodesStore.moveCollection(providerId, serviceId, nodeId, destination)
- } else {
- return await nodesStore.moveEntity(providerId, serviceId, node.in, nodeId, destination)
+ return await nodesStore.deleteEntity(providerId, serviceId, node.collection, nodeId)
}
}
// Read file content
const readFile = async (entityId: string): Promise => {
const node = nodesStore.getNode(providerId, serviceId, entityId)
- if (!node || node['@type'] !== 'files.entity') {
+ if (!node || !(node instanceof EntityObject)) {
throw new Error('Entity not found')
}
- return await nodesStore.readEntity(providerId, serviceId, node.in || ROOT_ID, entityId)
+ return await nodesStore.readEntity(providerId, serviceId, node.collection || ROOT_ID, entityId)
}
// Write file content
const writeFile = async (entityId: string, content: string): Promise => {
const node = nodesStore.getNode(providerId, serviceId, entityId)
- if (!node || node['@type'] !== 'files.entity') {
+ if (!node || !(node instanceof EntityObject)) {
throw new Error('Entity not found')
}
- return await nodesStore.writeEntity(providerId, serviceId, node.in, entityId, content)
+ return await nodesStore.writeEntity(providerId, serviceId, node.collection, entityId, content)
+ }
+
+ // Get a URL suitable for inline viewing (img src / video src)
+ const getEntityUrl = (entityId: string, collectionId?: string | null): string => {
+ const collection = collectionId ?? currentLocation.value
+ return `${TRANSFER_BASE_URL}/download/entity/${encodeURIComponent(providerId)}/${encodeURIComponent(serviceId)}/${encodeURIComponent(collection)}/${encodeURIComponent(entityId)}`
}
// Download a single file
@@ -214,7 +210,6 @@ export function useFileManager(options: UseFileManagerOptions) {
window.open(url, '_blank')
}
- // Download a collection (folder) as ZIP
const downloadCollection = (collectionId: string): void => {
// Use path parameters: /download/collection/{provider}/{service}/{identifier}
const url = `${TRANSFER_BASE_URL}/download/collection/${encodeURIComponent(providerId)}/${encodeURIComponent(serviceId)}/${encodeURIComponent(collectionId)}`
@@ -222,7 +217,6 @@ export function useFileManager(options: UseFileManagerOptions) {
window.open(url, '_blank')
}
- // Download multiple items as ZIP archive
const downloadArchive = (ids: string[], name: string = 'download', collectionId?: string | null): void => {
const collection = collectionId ?? currentLocation.value
const params = new URLSearchParams({
@@ -244,12 +238,8 @@ export function useFileManager(options: UseFileManagerOptions) {
// Initialize - fetch providers, services, and initial nodes if autoFetch
const initialize = async () => {
- if (!providersStore.initialized) {
- await providersStore.fetchProviders()
- }
- if (!servicesStore.initialized) {
- await servicesStore.fetchServices()
- }
+ await providersStore.list()
+ await servicesStore.list({ [providerId]: true })
if (autoFetch) {
await refresh()
}
@@ -284,10 +274,9 @@ export function useFileManager(options: UseFileManagerOptions) {
createFile,
renameNode,
deleteNode,
- copyNode,
- moveNode,
readFile,
writeFile,
+ getEntityUrl,
downloadEntity,
downloadCollection,
downloadArchive,
diff --git a/src/composables/useFileSelection.ts b/src/composables/useFileSelection.ts
index 259b0d0..8e6a149 100644
--- a/src/composables/useFileSelection.ts
+++ b/src/composables/useFileSelection.ts
@@ -5,10 +5,10 @@
import { ref, computed } from 'vue'
import type { Ref, ComputedRef } from 'vue'
-import { FileCollectionObject } from '@FilesManager/models/collection'
-import { FileEntityObject } from '@FilesManager/models/entity'
+import { CollectionObject } from '@DocumentsManager/models/collection'
+import { EntityObject } from '@DocumentsManager/models/entity'
-type NodeRecord = FileCollectionObject | FileEntityObject
+type NodeRecord = CollectionObject | EntityObject
export interface UseFileSelectionOptions {
multiple?: boolean
@@ -17,148 +17,110 @@ export interface UseFileSelectionOptions {
}
export function useFileSelection(options: UseFileSelectionOptions = {}) {
- const {
- multiple = true,
- allowFolders = true,
- allowFiles = true
+ const {
+ multiple = true,
+ allowFolders = true,
+ allowFiles = true,
} = options
const selectedIds: Ref> = ref(new Set())
const selectedNodes: Ref> = ref(new Map())
- // Get selected count
const count: ComputedRef = computed(() => selectedIds.value.size)
-
- // Check if any selected
const hasSelection: ComputedRef = computed(() => selectedIds.value.size > 0)
- // Get selected IDs as array
- const selectedIdArray: ComputedRef = computed(() =>
- Array.from(selectedIds.value)
+ const selectedIdArray: ComputedRef = computed(() => Array.from(selectedIds.value))
+ const selectedNodeArray: ComputedRef = computed(() => Array.from(selectedNodes.value.values()))
+
+ const selectedCollections: ComputedRef = computed(() =>
+ selectedNodeArray.value.filter((node): node is CollectionObject => node instanceof CollectionObject),
)
- // Get selected nodes as array
- const selectedNodeArray: ComputedRef = computed(() =>
- Array.from(selectedNodes.value.values())
+ const selectedEntities: ComputedRef = computed(() =>
+ selectedNodeArray.value.filter((node): node is EntityObject => node instanceof EntityObject),
)
- // Get selected collections only
- const selectedCollections: ComputedRef = computed(() =>
- selectedNodeArray.value.filter(
- (node): node is FileCollectionObject => node['@type'] === 'files.collection'
- )
- )
+ const isSelected = (nodeId: string): boolean => selectedIds.value.has(nodeId)
- // Get selected entities only
- const selectedEntities: ComputedRef = computed(() =>
- selectedNodeArray.value.filter(
- (node): node is FileEntityObject => node['@type'] === 'files.entity'
- )
- )
-
- // Check if a node is selected
- const isSelected = (nodeId: string): boolean => {
- return selectedIds.value.has(nodeId)
- }
-
- // Check if node type is allowed
const isTypeAllowed = (node: NodeRecord): boolean => {
- if (node['@type'] === 'files.collection' && !allowFolders) {
- return false
- }
- if (node['@type'] === 'files.entity' && !allowFiles) {
- return false
- }
+ if (node instanceof CollectionObject && !allowFolders) return false
+ if (node instanceof EntityObject && !allowFiles) return false
return true
}
- // Select a node
const select = (node: NodeRecord) => {
- if (!isTypeAllowed(node)) {
- return
- }
+ if (!isTypeAllowed(node)) return
if (!multiple) {
- // Clear previous selection for single select
selectedIds.value.clear()
selectedNodes.value.clear()
}
- selectedIds.value.add(node.id)
- selectedNodes.value.set(node.id, node)
+ const nodeId = String(node.identifier)
+ selectedIds.value.add(nodeId)
+ selectedNodes.value.set(nodeId, node)
}
- // Deselect a node
const deselect = (nodeId: string) => {
selectedIds.value.delete(nodeId)
selectedNodes.value.delete(nodeId)
}
- // Toggle selection
const toggle = (node: NodeRecord) => {
- if (isSelected(node.id)) {
- deselect(node.id)
- } else {
- select(node)
+ const nodeId = String(node.identifier)
+ if (isSelected(nodeId)) {
+ deselect(nodeId)
+ return
}
+ select(node)
}
- // Select multiple nodes
const selectMultiple = (nodes: NodeRecord[]) => {
if (!multiple) {
- // For single select, only select the last one
const lastNode = nodes[nodes.length - 1]
if (lastNode && isTypeAllowed(lastNode)) {
selectedIds.value.clear()
selectedNodes.value.clear()
- selectedIds.value.add(lastNode.id)
- selectedNodes.value.set(lastNode.id, lastNode)
+ const nodeId = String(lastNode.identifier)
+ selectedIds.value.add(nodeId)
+ selectedNodes.value.set(nodeId, lastNode)
}
return
}
for (const node of nodes) {
if (isTypeAllowed(node)) {
- selectedIds.value.add(node.id)
- selectedNodes.value.set(node.id, node)
+ const nodeId = String(node.identifier)
+ selectedIds.value.add(nodeId)
+ selectedNodes.value.set(nodeId, node)
}
}
}
- // Select all from a list
const selectAll = (nodes: NodeRecord[]) => {
- if (!multiple) {
- return
- }
+ if (!multiple) return
selectMultiple(nodes)
}
- // Clear selection
const clear = () => {
selectedIds.value.clear()
selectedNodes.value.clear()
}
- // Set selection (replace current)
const setSelection = (nodes: NodeRecord[]) => {
clear()
selectMultiple(nodes)
}
return {
- // State
selectedIds,
selectedNodes,
-
- // Computed
count,
hasSelection,
selectedIdArray,
selectedNodeArray,
selectedCollections,
selectedEntities,
-
- // Methods
isSelected,
select,
deselect,
diff --git a/src/composables/useFileUpload.ts b/src/composables/useFileUpload.ts
index f76f890..06c36db 100644
--- a/src/composables/useFileUpload.ts
+++ b/src/composables/useFileUpload.ts
@@ -6,15 +6,16 @@
import { ref, computed } from 'vue'
import type { Ref, ComputedRef } from 'vue'
-import { useNodesStore, ROOT_ID } from '@FilesManager/stores/nodesStore'
-import { FileEntityObject } from '@FilesManager/models/entity'
+import { useNodesStore, ROOT_ID } from '@DocumentsManager/stores/nodesStore'
+import { EntityObject } from '@DocumentsManager/models/entity'
+import type { DocumentInterface } from '@DocumentsManager/types/document'
export interface FileUploadProgress {
file: File
progress: number
status: 'pending' | 'uploading' | 'completed' | 'error'
error?: string
- entity?: FileEntityObject
+ entity?: EntityObject
/** Relative path within folder upload (e.g., "folder/subfolder/file.txt") */
relativePath?: string
}
@@ -230,9 +231,9 @@ export function useFileUpload(options: UseFileUploadOptions) {
providerId,
serviceId,
parentId,
- { label: folderName }
+ { label: folderName, owner: '' }
)
- folderIdMap.set(folderPath, collection.id)
+ folderIdMap.set(folderPath, String(collection.identifier))
} catch (e) {
console.error(`Failed to create folder: ${folderPath}`, e)
// Try to continue with other folders
@@ -246,7 +247,7 @@ export function useFileUpload(options: UseFileUploadOptions) {
const uploadFile = async (
uploadId: string,
folderIdMap?: Map
- ): Promise => {
+ ): Promise => {
const upload = uploads.value.get(uploadId)
if (!upload || upload.status !== 'pending') {
return null
@@ -278,12 +279,16 @@ export function useFileUpload(options: UseFileUploadOptions) {
const entity = await nodesStore.createEntity(
providerId,
serviceId,
- targetCollection,
+ targetCollection || ROOT_ID,
{
+ '@type': 'documents.properties',
+ urid: null,
+ format: null,
+ encoding: null,
label: upload.file.name,
mime: upload.file.type || 'application/octet-stream',
size: upload.file.size,
- }
+ } as DocumentInterface
)
upload.progress = 75
@@ -292,8 +297,8 @@ export function useFileUpload(options: UseFileUploadOptions) {
await nodesStore.writeEntity(
providerId,
serviceId,
- targetCollection,
- entity.id,
+ targetCollection || ROOT_ID,
+ String(entity.identifier),
content
)
@@ -325,9 +330,9 @@ export function useFileUpload(options: UseFileUploadOptions) {
}
// Upload all pending files
- const uploadAll = async (): Promise => {
+ const uploadAll = async (): Promise => {
isUploading.value = true
- const entities: FileEntityObject[] = []
+ const entities: EntityObject[] = []
try {
// Check if any uploads have relative paths (folder upload)
@@ -377,7 +382,7 @@ export function useFileUpload(options: UseFileUploadOptions) {
}
// Retry a failed upload
- const retryUpload = async (uploadId: string): Promise => {
+ const retryUpload = async (uploadId: string): Promise => {
const upload = uploads.value.get(uploadId)
if (!upload || upload.status !== 'error') {
return null
diff --git a/src/composables/useFileViewer.ts b/src/composables/useFileViewer.ts
new file mode 100644
index 0000000..12c3f17
--- /dev/null
+++ b/src/composables/useFileViewer.ts
@@ -0,0 +1,81 @@
+/**
+ * useFileViewer — resolves which registered viewer can handle a given MIME type.
+ *
+ * Other modules register viewers at the `documents_file_viewer` integration
+ * point by including an entry in their `integrations.ts`:
+ *
+ * ```ts
+ * documents_file_viewer: [{
+ * id: 'my_viewer',
+ * meta: { mimeTypes: ['application/pdf'] },
+ * component: () => import('./components/MyViewer.vue'),
+ * }]
+ * ```
+ *
+ * Viewer components receive the props: `url: string`, `entity: EntityObject`, `mime: string`.
+ */
+
+import { useIntegrationStore } from '@KTXC'
+import type { EntityObject } from '@DocumentsManager/models/entity'
+
+const INTEGRATION_POINT = 'documents_file_viewer'
+
+function mimeMatchesPattern(mime: string, pattern: string): boolean {
+ if (pattern.endsWith('/*')) {
+ // e.g. 'image/*' matches 'image/png', 'image/jpeg', …
+ return mime.startsWith(pattern.slice(0, -1))
+ }
+ return mime === pattern
+}
+
+function viewerMatchesMime(
+ mime: string,
+ mimeTypes?: string[],
+ mimePatterns?: string[],
+): boolean {
+ if (mimeTypes?.includes(mime)) return true
+ if (mimePatterns) {
+ for (const pattern of mimePatterns) {
+ if (mimeMatchesPattern(mime, pattern)) return true
+ }
+ }
+ return false
+}
+
+export function useFileViewer() {
+ const integrationStore = useIntegrationStore()
+
+ /**
+ * Returns the highest-priority registered viewer that can handle `mime`,
+ * or `null` if none is found.
+ */
+ function findViewer(mime: string) {
+ // getItems() already returns items sorted by priority (ascending)
+ const viewers = integrationStore.getItems(INTEGRATION_POINT)
+ for (const viewer of viewers) {
+ if (
+ viewerMatchesMime(
+ mime,
+ viewer.meta?.mimeTypes as string[] | undefined,
+ viewer.meta?.mimePatterns as string[] | undefined,
+ )
+ ) {
+ return viewer
+ }
+ }
+ return null
+ }
+
+ /**
+ * Convenience: returns true if any registered viewer can open this entity.
+ */
+ function canOpen(entity: EntityObject): boolean {
+ const mime = entity.properties.mime
+ if (!mime) return false
+ return findViewer(mime) !== null
+ }
+
+ return { findViewer, canOpen }
+}
+
+export type UseFileViewerReturn = ReturnType
diff --git a/src/integrations.ts b/src/integrations.ts
index 490d6da..6254a91 100644
--- a/src/integrations.ts
+++ b/src/integrations.ts
@@ -3,9 +3,9 @@ import type { ModuleIntegrations } from "@KTXC/types/moduleTypes";
const integrations: ModuleIntegrations = {
app_menu: [
{
- id: 'files',
- label: 'Files',
- path: '/files',
+ id: 'documents',
+ label: 'Documents',
+ path: '/',
icon: 'mdi-folder-outline',
priority: 30,
},
diff --git a/src/pages/FilesPage.vue b/src/pages/FilesPage.vue
index eac53b2..df841ce 100644
--- a/src/pages/FilesPage.vue
+++ b/src/pages/FilesPage.vue
@@ -3,8 +3,8 @@ import { ref, computed, onMounted, watch } from 'vue'
import { useModuleStore } from '@KTXC'
import { useFileManager, useFileSelection, useFileUpload } from '@/composables'
import type { ViewMode, SortField, SortOrder, BreadcrumbItem } from '@/types'
-import { FileCollectionObject } from '@FilesManager/models/collection'
-import { FileEntityObject } from '@FilesManager/models/entity'
+import { CollectionObject } from '@DocumentsManager/models/collection'
+import { EntityObject } from '@DocumentsManager/models/entity'
// Components
import {
@@ -17,6 +17,7 @@ import {
FilesGridView,
FilesListView,
FilesDetailsView,
+ FileViewerDialog,
NewFolderDialog,
RenameDialog,
DeleteConfirmDialog,
@@ -26,7 +27,7 @@ import {
// Check if file manager is available
const moduleStore = useModuleStore()
const isFileManagerAvailable = computed(() => {
- return moduleStore.has('file_manager') || moduleStore.has('FileManager')
+ return moduleStore.has('documents_manager') || moduleStore.has('DocumentsManager')
})
// Active provider/service (will be selectable later)
@@ -65,16 +66,54 @@ const showNewFolderDialog = ref(false)
const showRenameDialog = ref(false)
const showDeleteDialog = ref(false)
const showUploadDialog = ref(false)
-const nodeToRename = ref(null)
-const nodesToDelete = ref<(FileCollectionObject | FileEntityObject)[]>([])
+const nodeToRename = ref(null)
+const nodesToDelete = ref<(CollectionObject | EntityObject)[]>([])
// Drag and drop state
const isDragOver = ref(false)
+// Viewer state
+const viewerEntity = ref(null)
+const showViewer = ref(false)
+
+function handleOpenItem(item: CollectionObject | EntityObject) {
+ if (item instanceof EntityObject) {
+ viewerEntity.value = item
+ showViewer.value = true
+ } else {
+ // Folders: navigate into them when opened via double-click / action
+ selection.clear()
+ handleFolderOpen(item as CollectionObject)
+ }
+}
+
+function handleViewerNavigate(entity: EntityObject) {
+ viewerEntity.value = entity
+}
+
// Hidden file inputs
const fileInputRef = ref(null)
const folderInputRef = ref(null)
+function nodeId(node: CollectionObject | EntityObject): string {
+ return String(node.identifier ?? '')
+}
+
+function nodeLabel(node: CollectionObject | EntityObject): string {
+ if (node instanceof EntityObject) {
+ return node.properties.label || nodeId(node)
+ }
+ return node.properties.label || nodeId(node)
+}
+
+function renameCurrentName(node: CollectionObject | EntityObject | null): string {
+ if (!node) return ''
+ if (node instanceof EntityObject) {
+ return node.properties.label || nodeId(node)
+ }
+ return node.properties.label || nodeId(node)
+}
+
// Computed
const breadcrumbs = computed(() => {
const items: BreadcrumbItem[] = [
@@ -83,8 +122,8 @@ const breadcrumbs = computed(() => {
for (const node of fileManager.breadcrumbs.value) {
items.push({
- id: node.id,
- label: node.label,
+ id: nodeId(node),
+ label: nodeLabel(node),
isRoot: false,
})
}
@@ -98,24 +137,59 @@ const sortedItems = computed(() => {
// Sort collections
collections.sort((a, b) => {
- const aVal = a[sortField.value as keyof FileCollectionObject] ?? ''
- const bVal = b[sortField.value as keyof FileCollectionObject] ?? ''
+ const aVal = sortField.value === 'label'
+ ? (a.properties.label || nodeId(a))
+ : sortField.value === 'modifiedOn'
+ ? (a.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (a.created?.getTime() ?? 0)
+ : ''
+ const bVal = sortField.value === 'label'
+ ? (b.properties.label || nodeId(b))
+ : sortField.value === 'modifiedOn'
+ ? (b.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (b.created?.getTime() ?? 0)
+ : ''
const cmp = String(aVal).localeCompare(String(bVal))
return sortOrder.value === 'asc' ? cmp : -cmp
})
// Sort entities
entities.sort((a, b) => {
- const aVal = a[sortField.value as keyof FileEntityObject] ?? ''
- const bVal = b[sortField.value as keyof FileEntityObject] ?? ''
+ const aVal = sortField.value === 'label'
+ ? (a.properties.label || nodeId(a))
+ : sortField.value === 'mime'
+ ? (a.properties.mime || '')
+ : sortField.value === 'size'
+ ? a.properties.size
+ : sortField.value === 'modifiedOn'
+ ? (a.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (a.created?.getTime() ?? 0)
+ : ''
+ const bVal = sortField.value === 'label'
+ ? (b.properties.label || nodeId(b))
+ : sortField.value === 'mime'
+ ? (b.properties.mime || '')
+ : sortField.value === 'size'
+ ? b.properties.size
+ : sortField.value === 'modifiedOn'
+ ? (b.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (b.created?.getTime() ?? 0)
+ : ''
const cmp = String(aVal).localeCompare(String(bVal))
return sortOrder.value === 'asc' ? cmp : -cmp
})
// Filter by search
- const filterFn = (item: FileCollectionObject | FileEntityObject) => {
+ const filterFn = (item: CollectionObject | EntityObject) => {
if (!searchQuery.value) return true
- return item.label.toLowerCase().includes(searchQuery.value.toLowerCase())
+ const label = item instanceof EntityObject
+ ? (item.properties.label || nodeId(item))
+ : (item.properties.label || nodeId(item))
+ return label.toLowerCase().includes(searchQuery.value.toLowerCase())
}
return {
@@ -136,13 +210,13 @@ async function handleBreadcrumbNavigate(item: BreadcrumbItem) {
await fileManager.navigateTo(item.isRoot ? null : item.id)
}
-async function handleFolderOpen(folder: FileCollectionObject) {
+async function handleFolderOpen(folder: CollectionObject) {
selection.clear()
- await fileManager.navigateTo(folder.id)
+ await fileManager.navigateTo(nodeId(folder))
}
// Item interaction methods
-function handleItemClick(item: FileCollectionObject | FileEntityObject, event: MouseEvent | KeyboardEvent) {
+function handleItemClick(item: CollectionObject | EntityObject, event: MouseEvent | KeyboardEvent) {
const hasCtrl = event.ctrlKey || event.metaKey
const hasShift = event.shiftKey
@@ -154,10 +228,10 @@ function handleItemClick(item: FileCollectionObject | FileEntityObject, event: M
selection.select(item)
} else {
// Single click behavior depends on item type
- if (item['@type'] === 'files.collection') {
+ if (item instanceof CollectionObject) {
// Folders: navigate into them
selection.clear()
- handleFolderOpen(item as FileCollectionObject)
+ handleFolderOpen(item as CollectionObject)
} else {
// Files: show info panel
selection.clear()
@@ -167,7 +241,7 @@ function handleItemClick(item: FileCollectionObject | FileEntityObject, event: M
}
// Show details panel for an item
-function handleShowDetails(item: FileCollectionObject | FileEntityObject) {
+function handleShowDetails(item: CollectionObject | EntityObject) {
selection.clear()
selection.select(item)
}
@@ -183,7 +257,7 @@ async function handleCreateFolder(name: string) {
}
// Rename operations - for specific item
-function handleRenameItem(item: FileCollectionObject | FileEntityObject) {
+function handleRenameItem(item: CollectionObject | EntityObject) {
nodeToRename.value = item
showRenameDialog.value = true
}
@@ -192,7 +266,7 @@ async function handleRename(newName: string) {
if (!nodeToRename.value) return
try {
- await fileManager.renameNode(nodeToRename.value.id, newName)
+ await fileManager.renameNode(nodeId(nodeToRename.value), newName)
showRenameDialog.value = false
nodeToRename.value = null
} catch (error) {
@@ -201,7 +275,7 @@ async function handleRename(newName: string) {
}
// Delete operations - for specific item
-function handleDeleteItem(item: FileCollectionObject | FileEntityObject) {
+function handleDeleteItem(item: CollectionObject | EntityObject) {
nodesToDelete.value = [item]
showDeleteDialog.value = true
}
@@ -209,7 +283,7 @@ function handleDeleteItem(item: FileCollectionObject | FileEntityObject) {
async function handleDelete() {
try {
for (const node of nodesToDelete.value) {
- await fileManager.deleteNode(node.id)
+ await fileManager.deleteNode(nodeId(node))
}
selection.clear()
showDeleteDialog.value = false
@@ -220,13 +294,13 @@ async function handleDelete() {
}
// Download operation
-function handleDownloadItem(item: FileCollectionObject | FileEntityObject) {
- if (item['@type'] === 'files.entity') {
+function handleDownloadItem(item: CollectionObject | EntityObject) {
+ if (item instanceof EntityObject) {
// Download single file
- fileManager.downloadEntity(item.id, item.in)
- } else if (item['@type'] === 'files.collection') {
+ fileManager.downloadEntity(nodeId(item), String(item.collection ?? fileManager.ROOT_ID))
+ } else if (item instanceof CollectionObject) {
// Download folder as ZIP
- fileManager.downloadCollection(item.id)
+ fileManager.downloadCollection(nodeId(item))
}
}
@@ -448,6 +522,7 @@ onMounted(async () => {
:entities="sortedItems.entities"
:selected-ids="selectedIds"
@item-click="handleItemClick"
+ @open="handleOpenItem"
@rename="handleRenameItem"
@delete="handleDeleteItem"
@download="handleDownloadItem"
@@ -461,6 +536,7 @@ onMounted(async () => {
:entities="sortedItems.entities"
:selected-ids="selectedIds"
@item-click="handleItemClick"
+ @open="handleOpenItem"
@rename="handleRenameItem"
@delete="handleDeleteItem"
@download="handleDownloadItem"
@@ -474,6 +550,7 @@ onMounted(async () => {
:entities="sortedItems.entities"
:selected-ids="selectedIds"
@item-click="handleItemClick"
+ @open="handleOpenItem"
@rename="handleRenameItem"
@delete="handleDeleteItem"
@download="handleDownloadItem"
@@ -506,7 +583,7 @@ onMounted(async () => {
@@ -535,6 +612,16 @@ onMounted(async () => {
:selected-items="selection.selectedNodeArray.value"
@close="selection.clear()"
/>
+
+
+
diff --git a/src/routes.ts b/src/routes.ts
index 426f25e..3692806 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -2,8 +2,8 @@ import type { RouteRecordRaw } from 'vue-router'
const routes: RouteRecordRaw[] = [
{
- name: 'files',
- path: '/files',
+ name: 'documents',
+ path: '/',
component: () => import('@/pages/FilesPage.vue')
},
]
diff --git a/src/stores/documentsStore.ts b/src/stores/documentsStore.ts
new file mode 100644
index 0000000..b18fddd
--- /dev/null
+++ b/src/stores/documentsStore.ts
@@ -0,0 +1,222 @@
+import { computed, ref } from 'vue'
+import { defineStore } from 'pinia'
+import { useProvidersStore, useServicesStore, useNodesStore, ROOT_ID } from '@DocumentsManager/stores'
+import { CollectionObject } from '@DocumentsManager/models/collection'
+import { EntityObject } from '@DocumentsManager/models/entity'
+import type { SortField, SortOrder, ViewMode, BreadcrumbItem } from '@/types'
+
+type NodeRecord = CollectionObject | EntityObject
+
+export const useDocumentsStore = defineStore('documentsStore', () => {
+ const providersStore = useProvidersStore()
+ const servicesStore = useServicesStore()
+ const nodesStore = useNodesStore()
+
+ const activeProviderId = ref('default')
+ const activeServiceId = ref
('personal')
+ const currentLocation = ref(ROOT_ID)
+
+ const viewMode = ref('grid')
+ const sortField = ref('label')
+ const sortOrder = ref('asc')
+ const searchQuery = ref('')
+ const sidebarVisible = ref(true)
+
+ const transceiving = computed(() =>
+ providersStore.transceiving || servicesStore.transceiving || nodesStore.transceiving,
+ )
+
+ const provider = computed(() => providersStore.provider(activeProviderId.value))
+ const service = computed(() => servicesStore.service(activeProviderId.value, activeServiceId.value))
+
+ const currentCollections = computed(() =>
+ nodesStore.getChildCollections(activeProviderId.value, activeServiceId.value, currentLocation.value),
+ )
+
+ const currentEntities = computed(() =>
+ nodesStore.getChildEntities(activeProviderId.value, activeServiceId.value, currentLocation.value),
+ )
+
+ const breadcrumbs = computed(() => {
+ const nodes = nodesStore.getPath(activeProviderId.value, activeServiceId.value, currentLocation.value)
+ return [
+ { id: ROOT_ID, label: 'Home', isRoot: true },
+ ...nodes.map((node) => ({
+ id: String(node.identifier),
+ label: node.properties.label,
+ isRoot: false,
+ })),
+ ]
+ })
+
+ function sortCollections(items: CollectionObject[]): CollectionObject[] {
+ return [...items].sort((a, b) => {
+ const aVal = sortField.value === 'label'
+ ? a.properties.label
+ : sortField.value === 'modifiedOn'
+ ? (a.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (a.created?.getTime() ?? 0)
+ : ''
+ const bVal = sortField.value === 'label'
+ ? b.properties.label
+ : sortField.value === 'modifiedOn'
+ ? (b.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (b.created?.getTime() ?? 0)
+ : ''
+
+ const cmp = String(aVal).localeCompare(String(bVal))
+ return sortOrder.value === 'asc' ? cmp : -cmp
+ })
+ }
+
+ function sortEntities(items: EntityObject[]): EntityObject[] {
+ return [...items].sort((a, b) => {
+ const aVal = sortField.value === 'label'
+ ? a.properties.label
+ : sortField.value === 'mime'
+ ? (a.properties.mime ?? '')
+ : sortField.value === 'size'
+ ? a.properties.size
+ : sortField.value === 'modifiedOn'
+ ? (a.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (a.created?.getTime() ?? 0)
+ : ''
+ const bVal = sortField.value === 'label'
+ ? b.properties.label
+ : sortField.value === 'mime'
+ ? (b.properties.mime ?? '')
+ : sortField.value === 'size'
+ ? b.properties.size
+ : sortField.value === 'modifiedOn'
+ ? (b.modified?.getTime() ?? 0)
+ : sortField.value === 'createdOn'
+ ? (b.created?.getTime() ?? 0)
+ : ''
+
+ const cmp = String(aVal).localeCompare(String(bVal))
+ return sortOrder.value === 'asc' ? cmp : -cmp
+ })
+ }
+
+ function filterNode(node: NodeRecord): boolean {
+ if (!searchQuery.value) return true
+ return node.properties.label.toLowerCase().includes(searchQuery.value.toLowerCase())
+ }
+
+ const sortedItems = computed(() => ({
+ collections: sortCollections(currentCollections.value).filter(filterNode),
+ entities: sortEntities(currentEntities.value).filter(filterNode),
+ }))
+
+ const hasItems = computed(() =>
+ sortedItems.value.collections.length > 0 || sortedItems.value.entities.length > 0,
+ )
+
+ const isAtRoot = computed(() => currentLocation.value === ROOT_ID)
+
+ async function initialize() {
+ await providersStore.list()
+ await servicesStore.list({ [activeProviderId.value]: true })
+ await refresh()
+ }
+
+ async function refresh() {
+ await nodesStore.fetchNodes(activeProviderId.value, activeServiceId.value, currentLocation.value)
+ }
+
+ async function navigateTo(collectionId: string | null) {
+ currentLocation.value = collectionId || ROOT_ID
+ await refresh()
+ }
+
+ async function navigateToRoot() {
+ await navigateTo(ROOT_ID)
+ }
+
+ async function navigateUp() {
+ if (currentLocation.value === ROOT_ID) return
+ const currentNode = nodesStore.getNode(activeProviderId.value, activeServiceId.value, currentLocation.value)
+ if (!currentNode) return
+ const parentId = currentNode.collection ? String(currentNode.collection) : ROOT_ID
+ await navigateTo(parentId)
+ }
+
+ async function createFolder(label: string) {
+ await nodesStore.createCollection(
+ activeProviderId.value,
+ activeServiceId.value,
+ currentLocation.value,
+ { label, owner: '' },
+ )
+ await refresh()
+ }
+
+ async function renameNode(node: NodeRecord, label: string) {
+ if (node instanceof CollectionObject) {
+ await nodesStore.updateCollection(
+ activeProviderId.value,
+ activeServiceId.value,
+ node.identifier,
+ { label, owner: node.properties.owner },
+ )
+ } else {
+ await nodesStore.updateEntity(
+ activeProviderId.value,
+ activeServiceId.value,
+ node.collection,
+ node.identifier,
+ {
+ '@type': 'documents.properties',
+ urid: node.properties.urid,
+ size: node.properties.size,
+ label,
+ mime: node.properties.mime,
+ format: node.properties.format,
+ encoding: node.properties.encoding,
+ },
+ )
+ }
+ await refresh()
+ }
+
+ async function deleteNode(node: NodeRecord) {
+ if (node instanceof CollectionObject) {
+ await nodesStore.deleteCollection(activeProviderId.value, activeServiceId.value, node.identifier)
+ } else {
+ await nodesStore.deleteEntity(activeProviderId.value, activeServiceId.value, node.collection, node.identifier)
+ }
+ await refresh()
+ }
+
+ return {
+ activeProviderId,
+ activeServiceId,
+ currentLocation,
+ viewMode,
+ sortField,
+ sortOrder,
+ searchQuery,
+ sidebarVisible,
+ transceiving,
+ provider,
+ service,
+ currentCollections,
+ currentEntities,
+ sortedItems,
+ hasItems,
+ breadcrumbs,
+ isAtRoot,
+ initialize,
+ refresh,
+ navigateTo,
+ navigateToRoot,
+ navigateUp,
+ createFolder,
+ renameNode,
+ deleteNode,
+ ROOT_ID,
+ }
+})
diff --git a/src/stores/index.ts b/src/stores/index.ts
new file mode 100644
index 0000000..ba32d18
--- /dev/null
+++ b/src/stores/index.ts
@@ -0,0 +1 @@
+export { useDocumentsStore } from './documentsStore'
diff --git a/src/types/index.ts b/src/types/index.ts
index 627d1e0..92f6228 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -28,3 +28,23 @@ export interface ContextMenuAction {
disabled?: boolean
divider?: boolean
}
+
+/**
+ * Shape of an item registered at the `documents_file_viewer` integration point.
+ * Stored under `meta` so it fits inside a standard `ModuleIntegrationItem`.
+ */
+export interface DocumentViewerMeta {
+ /** Exact MIME type matches, e.g. ['application/pdf'] */
+ mimeTypes?: string[]
+ /** Glob-style patterns, e.g. ['image/*', 'video/*'] */
+ mimePatterns?: string[]
+}
+
+export interface DocumentViewerItem {
+ id: string
+ label?: string
+ priority?: number
+ meta: DocumentViewerMeta
+ /** Async factory returning the Vue viewer component */
+ component: () => Promise
+}
diff --git a/src/utils/fileHelpers.ts b/src/utils/fileHelpers.ts
index 84ea19b..c59c538 100644
--- a/src/utils/fileHelpers.ts
+++ b/src/utils/fileHelpers.ts
@@ -1,10 +1,10 @@
-import { FileEntityObject } from '@FilesManager/models/entity'
+import { EntityObject } from '@DocumentsManager/models/entity'
/**
* Get the appropriate icon for a file based on its MIME type
*/
-export function getFileIcon(entity: FileEntityObject): string {
- const mime = entity.mime || ''
+export function getFileIcon(entity: EntityObject): string {
+ const mime = entity.properties.mime || ''
if (!mime) return 'mdi-file'
if (mime.startsWith('image/')) return 'mdi-file-image'
if (mime.startsWith('video/')) return 'mdi-file-video'
@@ -22,19 +22,22 @@ export function getFileIcon(entity: FileEntityObject): string {
* Format file size in human readable format
*/
export function formatSize(bytes: number): string {
- if (bytes === 0) return '0 B'
+ const safeBytes = Number.isFinite(bytes) ? bytes : 0
+ if (safeBytes === 0) return '0 B'
const k = 1024
const sizes = ['B', 'KB', 'MB', 'GB', 'TB']
- const i = Math.floor(Math.log(bytes) / Math.log(k))
- return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
+ const i = Math.floor(Math.log(safeBytes) / Math.log(k))
+ return parseFloat((safeBytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
}
/**
* Format date string to localized format
*/
-export function formatDate(dateStr: string): string {
- if (!dateStr) return '—'
- return new Date(dateStr).toLocaleDateString('en-US', {
+export function formatDate(value: Date | string | null | undefined): string {
+ if (!value) return '—'
+ const date = value instanceof Date ? value : new Date(value)
+ if (Number.isNaN(date.getTime())) return '—'
+ return date.toLocaleDateString('en-US', {
year: 'numeric',
month: 'short',
day: 'numeric',
diff --git a/tsconfig.app.json b/tsconfig.app.json
index da2be85..22087b9 100644
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -7,14 +7,14 @@
"paths": {
"@/*": ["./src/*"],
"@KTXC/*": ["../../core/src/*"],
- "@FilesManager/*": ["../file_manager/src/*"]
+ "@DocumentsManager/*": ["../documents_manager/src/*"]
}
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
- "../file_manager/src/**/*.ts",
+ "../documents_manager/src/**/*.ts",
"../../core/src/**/*.ts"
]
}
diff --git a/vite.config.ts b/vite.config.ts
index ada6914..cc29852 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -27,7 +27,7 @@ export default defineConfig({
alias: {
'@': path.resolve(__dirname, './src'),
'@KTXC': path.resolve(__dirname, '../../core/src'),
- '@filesManager': path.resolve(__dirname, '../files_manager/src'),
+ '@DocumentsManager': path.resolve(__dirname, '../documents_manager/src'),
},
},
build: {
@@ -45,19 +45,19 @@ export default defineConfig({
'vue-router',
'pinia',
'@KTXC',
- /^@FilesManager\//,
+ /^@DocumentsManager\//,
],
output: {
paths: (id) => {
if (id === '@KTXC') return '/js/ktxc.mjs'
- if (id.startsWith('@FilesManager/')) {
- return '/modules/file_manager/static/module.mjs'
+ if (id.startsWith('@DocumentsManager/')) {
+ return '/modules/documents_manager/static/module.mjs'
}
return id
},
assetFileNames: (assetInfo) => {
if (assetInfo.name?.endsWith('.css')) {
- return 'files-[hash].css'
+ return 'documents-[hash].css'
}
return '[name]-[hash][extname]'
}