diff --git a/models/drive/src/index.ts b/models/drive/src/index.ts index 97d74fc32f..b39fc5771e 100644 --- a/models/drive/src/index.ts +++ b/models/drive/src/index.ts @@ -16,6 +16,7 @@ import core, { type Blob, type Domain, + type FindOptions, type Role, type RolesAssignment, type Type, @@ -84,6 +85,11 @@ export class TResource extends TDoc implements Resource { @ReadOnly() file?: Ref + @Prop(TypeRef(core.class.Blob), drive.string.Preview) + @ReadOnly() + @Hidden() + preview?: Ref + @Prop(TypeRef(drive.class.Resource), drive.string.Parent) @Index(IndexKind.Indexed) @ReadOnly() @@ -107,6 +113,7 @@ export class TFolder extends TResource implements Folder { declare path: Ref[] declare file: undefined + declare preview: undefined } @Model(drive.class.File, drive.class.Resource, DOMAIN_DRIVE) @@ -274,33 +281,86 @@ function defineResource (builder: Builder): void { }, 'createdBy' ], + /* eslint-disable @typescript-eslint/consistent-type-assertions */ options: { + lookup: { + file: core.class.Blob, + preview: core.class.Blob + }, sort: { _class: SortingOrder.Descending } - }, + } as FindOptions, configOptions: { - hiddenKeys: ['name', 'file', 'parent', 'path'], + hiddenKeys: ['name', 'file', 'parent', 'path', 'type'], sortable: true } }, drive.viewlet.FileTable ) - // builder.createDoc( - // view.class.Viewlet, - // core.space.Model, - // { - // attachTo: drive.class.Resource, - // descriptor: drive.viewlet.Grid, - // config: ['', 'type', 'size', 'lastModified', 'createdBy'], - // configOptions: { - // hiddenKeys: ['name', 'file', 'parent', 'path'], - // sortable: true - // } - // }, - // drive.viewlet.FileGrid - // ) + builder.createDoc( + view.class.ViewletDescriptor, + core.space.Model, + { + label: drive.string.Grid, + icon: drive.icon.Grid, + component: drive.component.GridView + }, + drive.viewlet.Grid + ) + + builder.createDoc( + view.class.Viewlet, + core.space.Model, + { + attachTo: drive.class.Resource, + descriptor: drive.viewlet.Grid, + viewOptions: { + groupBy: [], + orderBy: [ + ['name', SortingOrder.Ascending], + ['$lookup.file.size', SortingOrder.Ascending], + ['$lookup.file.modifiedOn', SortingOrder.Descending] + ], + other: [] + }, + config: [ + { + key: '', + presenter: drive.component.ResourcePresenter, + label: drive.string.Name, + sortingKey: 'name' + }, + { + key: '$lookup.file.size', + presenter: drive.component.FileSizePresenter, + label: drive.string.Size, + sortingKey: '$lookup.file.size' + }, + { + key: '$lookup.file.modifiedOn', + label: core.string.ModifiedDate + }, + 'createdBy' + ], + configOptions: { + hiddenKeys: ['name', 'file', 'parent', 'path'], + sortable: true + }, + /* eslint-disable @typescript-eslint/consistent-type-assertions */ + options: { + lookup: { + file: core.class.Blob, + preview: core.class.Blob + }, + sort: { + _class: SortingOrder.Descending + } + } as FindOptions + }, + drive.viewlet.FileGrid + ) } function defineFolder (builder: Builder): void { diff --git a/models/drive/src/plugin.ts b/models/drive/src/plugin.ts index a2787ce011..c04ba11197 100644 --- a/models/drive/src/plugin.ts +++ b/models/drive/src/plugin.ts @@ -75,6 +75,7 @@ export default mergeIds(driveId, drive, { RenameFolder: '' as ViewAction }, string: { + Grid: '' as IntlString, Name: '' as IntlString, Description: '' as IntlString, Size: '' as IntlString, @@ -84,6 +85,7 @@ export default mergeIds(driveId, drive, { Parent: '' as IntlString, Path: '' as IntlString, Drives: '' as IntlString, - Download: '' as IntlString + Download: '' as IntlString, + Preview: '' as IntlString } }) diff --git a/packages/core/lang/en.json b/packages/core/lang/en.json index f3b58827ab..c93f48a44c 100644 --- a/packages/core/lang/en.json +++ b/packages/core/lang/en.json @@ -60,6 +60,7 @@ "UpdateSpaceDescription": "Grants users ability to update the space", "ArchiveSpaceDescription": "Grants users ability to archive the space", "AutoJoin": "Auto join", - "AutoJoinDescr": "Automatically join new employees to this space" + "AutoJoinDescr": "Automatically join new employees to this space", + "BlobSize": "Size" } } diff --git a/packages/core/lang/es.json b/packages/core/lang/es.json index 9cde595554..0c41762df2 100644 --- a/packages/core/lang/es.json +++ b/packages/core/lang/es.json @@ -53,6 +53,7 @@ "UpdateSpaceDescription": "Concede a los usuarios la capacidad de actualizar el espacio", "ArchiveSpaceDescription": "Concede a los usuarios la capacidad de archivar el espacio", "AutoJoin": "Auto unirse", - "AutoJoinDescr": "Unirse automáticamente a los nuevos empleados a este espacio" + "AutoJoinDescr": "Unirse automáticamente a los nuevos empleados a este espacio", + "BlobSize": "Tamaño" } } diff --git a/packages/core/lang/pt.json b/packages/core/lang/pt.json index 87ecf87e08..58f701053d 100644 --- a/packages/core/lang/pt.json +++ b/packages/core/lang/pt.json @@ -53,6 +53,7 @@ "UpdateSpaceDescription": "Concede aos usuários a capacidade de atualizar o espaço", "ArchiveSpaceDescription": "Concede aos usuários a capacidade de arquivar o espaço", "AutoJoin": "Auto adesão", - "AutoJoinDescr": "Adesão automática de novos funcionários a este espaço" + "AutoJoinDescr": "Adesão automática de novos funcionários a este espaço", + "BlobSize": "Tamanho" } } diff --git a/packages/core/lang/ru.json b/packages/core/lang/ru.json index 79b3555b02..0f02c89730 100644 --- a/packages/core/lang/ru.json +++ b/packages/core/lang/ru.json @@ -60,6 +60,7 @@ "UpdateSpaceDescription": "Дает пользователям разрешение обновлять пространство", "ArchiveSpaceDescription": "Дает пользователям разрешение архивировать пространство", "AutoJoin": "Автоприсоединение", - "AutoJoinDescr": "Автоматически присоединять новых сотрудников к этому пространству" + "AutoJoinDescr": "Автоматически присоединять новых сотрудников к этому пространству", + "BlobSize": "Размер" } } diff --git a/plugins/contact-resources/src/components/PersonAccountPresenter.svelte b/plugins/contact-resources/src/components/PersonAccountPresenter.svelte index c10756f03b..fc20e6838d 100644 --- a/plugins/contact-resources/src/components/PersonAccountPresenter.svelte +++ b/plugins/contact-resources/src/components/PersonAccountPresenter.svelte @@ -25,9 +25,12 @@ export let value: Account export let avatarSize: IconSize = 'x-small' + export let shouldShowAvatar: boolean = true + export let shouldShowName: boolean = true export let disabled: boolean = false export let inline: boolean = false export let accent: boolean = false + export let noUnderline: boolean = false export let compact = false $: employee = $employeeByIdStore.get((value as PersonAccount)?.person as Ref) @@ -39,9 +42,31 @@ {#if value} {#if employee} - + {:else if person} - + {:else}
diff --git a/plugins/contact-resources/src/components/PersonAccountRefPresenter.svelte b/plugins/contact-resources/src/components/PersonAccountRefPresenter.svelte index 59fb55a10c..a42e9ecd1f 100644 --- a/plugins/contact-resources/src/components/PersonAccountRefPresenter.svelte +++ b/plugins/contact-resources/src/components/PersonAccountRefPresenter.svelte @@ -22,14 +22,28 @@ export let value: Ref export let avatarSize: IconSize = 'x-small' + export let shouldShowAvatar: boolean = true + export let shouldShowName: boolean = true export let disabled: boolean = false export let inline: boolean = false export let accent: boolean = false + export let noUnderline: boolean = false export let compact = false $: account = $personAccountByIdStore.get(value) {#if account} - + {/if} diff --git a/plugins/drive-assets/assets/icons.svg b/plugins/drive-assets/assets/icons.svg index 42d65c2a11..176c6d9f57 100644 --- a/plugins/drive-assets/assets/icons.svg +++ b/plugins/drive-assets/assets/icons.svg @@ -2,6 +2,10 @@ + + + diff --git a/plugins/drive-assets/lang/en.json b/plugins/drive-assets/lang/en.json index d6bcb8bb25..eb97bf257c 100644 --- a/plugins/drive-assets/lang/en.json +++ b/plugins/drive-assets/lang/en.json @@ -2,6 +2,7 @@ "string": { "Drive": "Drive", "Drives": "Drives", + "Grid": "Grid", "File": "File", "Folder": "Folder", "Resource": "Resource", diff --git a/plugins/drive-assets/lang/es.json b/plugins/drive-assets/lang/es.json index 29085457e5..791b67e2f7 100644 --- a/plugins/drive-assets/lang/es.json +++ b/plugins/drive-assets/lang/es.json @@ -2,6 +2,7 @@ "string": { "Drive": "Unidad", "Drives": "Unidades", + "Grid": "Red", "File": "Archivo", "Folder": "Carpeta", "Resource": "Recurso", diff --git a/plugins/drive-assets/lang/pt.json b/plugins/drive-assets/lang/pt.json index 417519c18f..d636d91f42 100644 --- a/plugins/drive-assets/lang/pt.json +++ b/plugins/drive-assets/lang/pt.json @@ -2,6 +2,7 @@ "string": { "Drive": "Unidade", "Drives": "Unidades", + "Grid": "Grade", "File": "Ficheiro", "Folder": "Pasta", "Resource": "Recurso", diff --git a/plugins/drive-assets/lang/ru.json b/plugins/drive-assets/lang/ru.json index c20489d2af..9b2e760e65 100644 --- a/plugins/drive-assets/lang/ru.json +++ b/plugins/drive-assets/lang/ru.json @@ -2,6 +2,7 @@ "string": { "Drive": "Диск", "Drives": "Диски", + "Grid": "Сетка", "File": "Файл", "Folder": "Папка", "Resource": "Ресурс", diff --git a/plugins/drive-assets/src/index.ts b/plugins/drive-assets/src/index.ts index 18a19691c2..3c9e2ce8fe 100644 --- a/plugins/drive-assets/src/index.ts +++ b/plugins/drive-assets/src/index.ts @@ -19,6 +19,7 @@ import drive from '@hcengineering/drive' const icons = require('../assets/icons.svg') as string // eslint-disable-line loadMetadata(drive.icon, { Drive: `${icons}#drive`, + Grid: `${icons}#grid`, File: `${icons}#file`, Folder: `${icons}#folder`, FolderOpen: `${icons}#folder-open`, diff --git a/plugins/drive-resources/src/components/GridItem.svelte b/plugins/drive-resources/src/components/GridItem.svelte new file mode 100644 index 0000000000..1b03a4ead2 --- /dev/null +++ b/plugins/drive-resources/src/components/GridItem.svelte @@ -0,0 +1,149 @@ + + + + +
dispatch('obj-focus', object)} + on:mouseenter={() => dispatch('obj-focus', object)} + on:focus={() => {}} + on:contextmenu={(evt) => { + showMenu(evt, { object }) + }} +> + + +
{ + void openDoc(hierarchy, object) + }} + > +
+ +
+ +
+
+
+ +
+
+
+
+ +
+
+ + + + + +
+
+ +
+
+
+
+
+ + diff --git a/plugins/drive-resources/src/components/GridView.svelte b/plugins/drive-resources/src/components/GridView.svelte index 15b055d8e9..39090c5335 100644 --- a/plugins/drive-resources/src/components/GridView.svelte +++ b/plugins/drive-resources/src/components/GridView.svelte @@ -13,6 +13,85 @@ // limitations under the License. --> -
Here will be grid view
+ + +
+ {#each objects as object, i} + {@const selected = selection === i} +
+ { + listProvider.updateFocus(evt.detail) + }} + /> +
+ {/each} +
+ + diff --git a/plugins/drive-resources/src/components/Thumbnail.svelte b/plugins/drive-resources/src/components/Thumbnail.svelte new file mode 100644 index 0000000000..a2de341c81 --- /dev/null +++ b/plugins/drive-resources/src/components/Thumbnail.svelte @@ -0,0 +1,82 @@ + + + +{#if isFolder} + +{:else if previewBlob != null && previewRef != null && isImage && !isError} + {#await getBlobRef(previewBlob, previewRef, object.name, sizeToWidth(size)) then blobSrc} + {object.name} { + isError = true + }} + /> + {/await} +{:else} +
+ {extensionIconLabel(object.name)} +
+{/if} + + diff --git a/plugins/drive-resources/src/components/icons/FolderThumbnail.svelte b/plugins/drive-resources/src/components/icons/FolderThumbnail.svelte new file mode 100644 index 0000000000..fdea2f2f06 --- /dev/null +++ b/plugins/drive-resources/src/components/icons/FolderThumbnail.svelte @@ -0,0 +1,25 @@ + + + + + + + diff --git a/plugins/drive/src/plugin.ts b/plugins/drive/src/plugin.ts index f82c1b87f7..9bedc6436e 100644 --- a/plugins/drive/src/plugin.ts +++ b/plugins/drive/src/plugin.ts @@ -39,6 +39,7 @@ export const drivePlugin = plugin(driveId, { }, icon: { Drive: '' as Asset, + Grid: '' as Asset, File: '' as Asset, Folder: '' as Asset, FolderOpen: '' as Asset, diff --git a/plugins/drive/src/types.ts b/plugins/drive/src/types.ts index ca2e93e3a1..054acf1c05 100644 --- a/plugins/drive/src/types.ts +++ b/plugins/drive/src/types.ts @@ -25,6 +25,7 @@ export interface Drive extends TypedSpace {} export interface Resource extends Doc { name: string file?: Ref + preview?: Ref parent: Ref path: Ref[]