diff --git a/src/packages/media/media/manifests.ts b/src/packages/media/media/manifests.ts index 93efcc6c58..b40f380c0d 100644 --- a/src/packages/media/media/manifests.ts +++ b/src/packages/media/media/manifests.ts @@ -5,6 +5,7 @@ import { manifests as entityBulkActionsManifests } from './entity-bulk-actions/m import { manifests as menuItemManifests } from './menu-item/manifests.js'; import { manifests as propertyEditorsManifests } from './property-editors/manifests.js'; import { manifests as repositoryManifests } from './repository/manifests.js'; +import { manifests as sectionViewManifests } from './section-view/manifests.js'; import { manifests as treeManifests } from './tree/manifests.js'; import { manifests as userPermissionManifests } from './user-permissions/manifests.js'; import { manifests as workspaceManifests } from './workspace/manifests.js'; @@ -17,6 +18,7 @@ export const manifests = [ ...menuItemManifests, ...propertyEditorsManifests, ...repositoryManifests, + ...sectionViewManifests, ...treeManifests, ...userPermissionManifests, ...workspaceManifests, diff --git a/src/packages/media/media/section-view/manifests.ts b/src/packages/media/media/section-view/manifests.ts new file mode 100644 index 0000000000..a6f7acda64 --- /dev/null +++ b/src/packages/media/media/section-view/manifests.ts @@ -0,0 +1,24 @@ +import type { ManifestSectionView } from '@umbraco-cms/backoffice/extension-registry'; + +const sectionsViews: Array = [ + { + type: 'sectionView', + alias: 'Umb.SectionView.Media', + name: 'Media Section View', + element: () => import('./media-section-view.element.js'), + weight: 200, + meta: { + label: 'Media', + pathname: 'media', + icon: 'icon-user', + }, + conditions: [ + { + alias: 'Umb.Condition.SectionAlias', + match: 'Umb.Section.Media', + }, + ], + }, +]; + +export const manifests = [...sectionsViews]; diff --git a/src/packages/media/media/section-view/media-section-view.element.ts b/src/packages/media/media/section-view/media-section-view.element.ts new file mode 100644 index 0000000000..32fa33d6b7 --- /dev/null +++ b/src/packages/media/media/section-view/media-section-view.element.ts @@ -0,0 +1,67 @@ +import { UMB_MEDIA_COLLECTION_ALIAS } from '../collection/index.js'; +import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit'; +import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; +import { UmbCollectionElement } from '@umbraco-cms/backoffice/collection'; +import type { UmbRoute } from '@umbraco-cms/backoffice/router'; + +@customElement('umb-media-section-view') +export class UmbMediaSectionViewElement extends UmbLitElement { + #routes: UmbRoute[] = [ + { + path: 'collection', + component: () => { + + // TODO: [LK] Work-in-progress. Need to get the data-type configuration for the Media Collection. + const config = { + unique: '', + dataTypeId: 'dt-collectionView', + allowedEntityBulkActions: { + allowBulkCopy: true, + allowBulkDelete: true, + allowBulkMove: true, + allowBulkPublish: false, + allowBulkUnpublish: false, + }, + orderBy: 'entityName', + orderDirection: 'asc', + pageSize: 50, + useInfiniteEditor: false, + userDefinedProperties: undefined, + }; + + const element = new UmbCollectionElement(); + element.alias = UMB_MEDIA_COLLECTION_ALIAS; + element.config = config; + return element; + }, + }, + { + path: '', + redirectTo: 'collection', + }, + ]; + + render() { + return html``; + } + + static styles = [ + css` + :host { + height: 100%; + } + + #router-slot { + height: calc(100% - var(--umb-header-layout-height)); + } + `, + ]; +} + +export default UmbMediaSectionViewElement; + +declare global { + interface HTMLElementTagNameMap { + 'umb-media-section-view': UmbMediaSectionViewElement; + } +} diff --git a/src/packages/media/section.manifests.ts b/src/packages/media/section.manifests.ts index 0baeeb6770..d5ae52de68 100644 --- a/src/packages/media/section.manifests.ts +++ b/src/packages/media/section.manifests.ts @@ -1,6 +1,4 @@ -import { UMB_MEDIA_DETAIL_REPOSITORY_ALIAS } from './media/repository/index.js'; import type { - ManifestDashboardCollection, ManifestSection, ManifestTypes, } from '@umbraco-cms/backoffice/extension-registry'; @@ -14,29 +12,11 @@ const section: ManifestSection = { weight: 500, meta: { label: 'Media', - pathname: 'media', + pathname: 'media-management', }, conditions: [], }; -const dashboards: Array = [ - { - type: 'dashboardCollection', - alias: 'Umb.Dashboard.MediaCollection', - name: 'Media Dashboard', - weight: 10, - meta: { - label: 'Media', - pathname: 'media-management', - repositoryAlias: UMB_MEDIA_DETAIL_REPOSITORY_ALIAS, - }, - conditions: { - sections: [sectionAlias], - entityType: 'media', - }, - }, -]; - const menuSectionSidebarApp: ManifestTypes = { type: 'sectionSidebarApp', kind: 'menu', @@ -55,4 +35,4 @@ const menuSectionSidebarApp: ManifestTypes = { ], }; -export const manifests = [section, menuSectionSidebarApp, ...dashboards]; +export const manifests = [section, menuSectionSidebarApp];