Skip to content

Commit 53b65bc

Browse files
nielslyngsoenielslyngsoe
committed
fix static files value
1 parent 741270c commit 53b65bc

File tree

16 files changed

+173
-53
lines changed

16 files changed

+173
-53
lines changed

‎src/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,9 @@
1-
import { UmbBlockGridEntriesContext } from '../../context/block-grid-entries.context.js';
2-
import type { UmbBlockGridEntryElement } from '../block-grid-entry/index.js';
31
import {
42
getAccumulatedValueOfIndex,
53
getInterpolatedIndexOfPositionInWeightMap,
64
isWithinRect,
75
} from '@umbraco-cms/backoffice/utils';
86
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
9-
import type { UmbBlockGridLayoutModel } from '@umbraco-cms/backoffice/block-grid';
107
import { html, customElement, state, repeat, css, property, nothing } from '@umbraco-cms/backoffice/external/lit';
118
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
129
import '../block-grid-entry/index.js';
@@ -17,6 +14,9 @@ import {
1714
type UmbFormControlValidatorConfig,
1815
} from '@umbraco-cms/backoffice/validation';
1916
import type { UmbNumberRangeValueType } from '@umbraco-cms/backoffice/models';
17+
import { UmbBlockGridEntriesContext } from '../../context/block-grid-entries.context.js';
18+
import type { UmbBlockGridEntryElement } from '../block-grid-entry/index.js';
19+
import type { UmbBlockGridLayoutModel } from '@umbraco-cms/backoffice/block-grid';
2020

2121
/**
2222
* Notice this utility method is not really shareable with others as it also takes areas into account. [NL]
@@ -210,6 +210,7 @@ export class UmbBlockGridEntriesElement extends UmbFormControlMixin(UmbLitElemen
210210
this.observe(
211211
manager.layoutStylesheet,
212212
(stylesheet) => {
213+
if (!stylesheet) return;
213214
if (this._styleElement && this._styleElement.href === stylesheet) return;
214215
this._styleElement = document.createElement('link');
215216
this._styleElement.setAttribute('rel', 'stylesheet');

‎src/packages/block/block-grid/context/block-grid-manager.context.ts

Lines changed: 33 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
1+
import { UmbArrayState, appendToFrozenArray, pushAtToUniqueArray } from '@umbraco-cms/backoffice/observable-api';
2+
import { removeInitialSlashFromPath, transformServerPathToClientPath } from '@umbraco-cms/backoffice/utils';
3+
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
4+
import { UMB_APP_CONTEXT } from '@umbraco-cms/backoffice/app';
5+
import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';
16
import type { UmbBlockGridLayoutModel, UmbBlockGridTypeModel } from '../types.js';
27
import type { UmbBlockGridWorkspaceData } from '../index.js';
3-
import { UmbArrayState, appendToFrozenArray, pushAtToUniqueArray } from '@umbraco-cms/backoffice/observable-api';
48
import { type UmbBlockDataType, UmbBlockManagerContext } from '@umbraco-cms/backoffice/block';
59
import type { UmbBlockTypeGroup } from '@umbraco-cms/backoffice/block-type';
610

@@ -13,24 +17,49 @@ export class UmbBlockGridManagerContext<
1317
BlockLayoutType extends UmbBlockGridLayoutModel = UmbBlockGridLayoutModel,
1418
> extends UmbBlockManagerContext<UmbBlockGridTypeModel, UmbBlockGridLayoutModel> {
1519
//
20+
#initAppUrl: Promise<void>;
21+
#appUrl?: string;
1622
#blockGroups = new UmbArrayState(<Array<UmbBlockTypeGroup>>[], (x) => x.key);
1723
public readonly blockGroups = this.#blockGroups.asObservable();
1824

19-
layoutStylesheet = this._editorConfiguration.asObservablePart(
20-
(x) => (x?.getValueByAlias('layoutStylesheet') as string) ?? UMB_BLOCK_GRID_DEFAULT_LAYOUT_STYLESHEET,
21-
);
25+
layoutStylesheet = this._editorConfiguration.asObservablePart((x) => {
26+
if (!x) return undefined;
27+
const layoutStylesheet = x.getValueByAlias<string>('layoutStylesheet');
28+
if (!layoutStylesheet) return UMB_BLOCK_GRID_DEFAULT_LAYOUT_STYLESHEET;
29+
30+
if (layoutStylesheet) {
31+
// Cause we await initAppUrl in setting the _editorConfiguration, we can trust the appUrl begin here.
32+
return this.#appUrl! + removeInitialSlashFromPath(transformServerPathToClientPath(layoutStylesheet));
33+
}
34+
return undefined;
35+
});
2236
gridColumns = this._editorConfiguration.asObservablePart((x) => {
2337
const value = x?.getValueByAlias('gridColumns') as string | undefined;
2438
return parseInt(value && value !== '' ? value : '12');
2539
});
2640

41+
override setEditorConfiguration(configs: UmbPropertyEditorConfigCollection) {
42+
this.#initAppUrl.then(() => {
43+
// we await initAppUrl, So the appUrl begin here is available when retrieving the layoutStylesheet.
44+
this._editorConfiguration.setValue(configs);
45+
});
46+
}
47+
2748
setBlockGroups(blockGroups: Array<UmbBlockTypeGroup>) {
2849
this.#blockGroups.setValue(blockGroups);
2950
}
3051
getBlockGroups() {
3152
return this.#blockGroups.value;
3253
}
3354

55+
constructor(host: UmbControllerHost) {
56+
super(host);
57+
58+
this.#initAppUrl = this.getContext(UMB_APP_CONTEXT).then((appContext) => {
59+
this.#appUrl = appContext.getServerUrl() + appContext.getBackofficePath();
60+
});
61+
}
62+
3463
create(
3564
contentElementTypeKey: string,
3665
partialLayoutEntry?: Omit<BlockLayoutType, 'contentUdi'>,

‎src/packages/block/block-grid/manifests.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
12
import { manifests as componentManifests } from './components/manifests.js';
23
import { manifests as propertyEditorManifests } from './property-editors/manifests.js';
34
import { manifests as workspaceManifests } from './workspace/manifests.js';
4-
import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
55

66
export const manifests: Array<ManifestTypes> = [
77
...workspaceManifests,

‎src/packages/block/block-grid/property-editors/block-grid-editor/manifests.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { manifest as blockGridSchemaManifest } from './Umbraco.BlockGrid.js';
21
import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
2+
import { manifest as blockGridSchemaManifest } from './Umbraco.BlockGrid.js';
33

44
export const UMB_BLOCK_GRID_PROPERTY_EDITOR_ALIAS = 'Umbraco.BlockGrid';
55

@@ -55,6 +55,12 @@ export const manifests: Array<ManifestTypes> = [
5555
label: 'Layout Stylesheet',
5656
description: 'Override default stylesheet for backoffice layout.',
5757
propertyEditorUiAlias: 'Umb.PropertyEditorUi.BlockGridLayoutStylesheet',
58+
config: [
59+
{
60+
alias: 'singleItemMode',
61+
value: true,
62+
},
63+
],
5864
},
5965
],
6066
},

‎src/packages/block/block-grid/property-editors/block-grid-editor/property-editor-ui-block-grid.element.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
1-
import { UmbBlockGridManagerContext } from '../../context/block-grid-manager.context.js';
2-
import { UMB_BLOCK_GRID_PROPERTY_EDITOR_ALIAS } from './manifests.js';
31
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
42
import { html, customElement, property, state, css, type PropertyValueMap } from '@umbraco-cms/backoffice/external/lit';
53
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
64
import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry';
75
import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';
8-
import type { UmbBlockTypeGroup } from '@umbraco-cms/backoffice/block-type';
9-
import type { UmbBlockGridTypeModel, UmbBlockGridValueModel } from '@umbraco-cms/backoffice/block-grid';
106
import '../../components/block-grid-entries/index.js';
117
import { observeMultiple } from '@umbraco-cms/backoffice/observable-api';
128
import { UMB_PROPERTY_CONTEXT } from '@umbraco-cms/backoffice/property';
139
import { UmbFormControlMixin } from '@umbraco-cms/backoffice/validation';
10+
import { UmbBlockGridManagerContext } from '../../context/block-grid-manager.context.js';
11+
import { UMB_BLOCK_GRID_PROPERTY_EDITOR_ALIAS } from './manifests.js';
12+
import type { UmbBlockTypeGroup } from '@umbraco-cms/backoffice/block-type';
13+
import type { UmbBlockGridTypeModel, UmbBlockGridValueModel } from '@umbraco-cms/backoffice/block-grid';
1414

1515
/**
1616
* @element umb-property-editor-ui-block-grid

‎src/packages/block/block-grid/property-editors/block-grid-layout-stylesheet/property-editor-ui-block-grid-layout-stylesheet.element.ts

Lines changed: 47 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,37 +3,69 @@
33
import type { UmbInputStaticFileElement } from '@umbraco-cms/backoffice/static-file';
44
// eslint-disable-next-line import/no-duplicates
55
import '@umbraco-cms/backoffice/static-file';
6-
import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
6+
import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
77
import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry';
88
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
99
import {
1010
UmbPropertyValueChangeEvent,
1111
type UmbPropertyEditorConfigCollection,
1212
} from '@umbraco-cms/backoffice/property-editor';
1313
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
14+
import { UmbServerFilePathUniqueSerializer } from '@umbraco-cms/backoffice/server-file-system';
15+
import type { UmbNumberRangeValueType } from '@umbraco-cms/backoffice/models';
1416

1517
@customElement('umb-property-editor-ui-block-grid-layout-stylesheet')
1618
export class UmbPropertyEditorUIBlockGridLayoutStylesheetElement
1719
extends UmbLitElement
1820
implements UmbPropertyEditorUiElement
1921
{
20-
private _value: Array<string> = [];
22+
#pickableFilter = (item: any) => item.unique.endsWith('css');
23+
#singleItemMode = false;
24+
// TODO: get rid of UmbServerFilePathUniqueSerializer in v.15 [NL]
25+
#serverFilePathUniqueSerializer = new UmbServerFilePathUniqueSerializer();
2126

22-
@property({ type: Array })
23-
public set value(value: Array<string>) {
24-
this._value = value || [];
27+
@state()
28+
private _value?: string | Array<string>;
29+
30+
@property({ attribute: false })
31+
public set value(value: string | Array<string> | undefined) {
32+
if (Array.isArray(value)) {
33+
this._value = value.map((unique) => this.#serverFilePathUniqueSerializer.toUnique(unique));
34+
} else if (value) {
35+
this._value = this.#serverFilePathUniqueSerializer.toUnique(value);
36+
} else {
37+
this._value = undefined;
38+
}
2539
}
26-
public get value(): Array<string> {
27-
return this._value;
40+
public get value(): string | Array<string> | undefined {
41+
if (Array.isArray(this._value)) {
42+
return this._value.map((unique) => this.#serverFilePathUniqueSerializer.toServerPath(unique) ?? '');
43+
} else if (this._value) {
44+
return this.#serverFilePathUniqueSerializer.toServerPath(this._value) ?? '';
45+
} else {
46+
return undefined;
47+
}
2848
}
2949

30-
private _pickableFilter = (item: any) => item.unique.endsWith('css');
50+
public set config(config: UmbPropertyEditorConfigCollection | undefined) {
51+
this.#singleItemMode = config?.getValueByAlias<boolean>('singleItemMode') ?? false;
52+
const validationLimit = config?.getValueByAlias<UmbNumberRangeValueType>('validationLimit');
3153

32-
@property({ attribute: false })
33-
public config?: UmbPropertyEditorConfigCollection;
54+
this._limitMin = validationLimit?.min ?? 0;
55+
this._limitMax = this.#singleItemMode ? 1 : validationLimit?.max ?? Infinity;
56+
}
57+
58+
@state()
59+
private _limitMin: number = 0;
60+
@state()
61+
private _limitMax: number = Infinity;
3462

3563
private _onChange(event: CustomEvent) {
36-
this.value = (event.target as UmbInputStaticFileElement).selection;
64+
if (this.#singleItemMode) {
65+
this._value = (event.target as UmbInputStaticFileElement).selection[0];
66+
} else {
67+
this._value = (event.target as UmbInputStaticFileElement).selection;
68+
}
3769
this.dispatchEvent(new UmbPropertyValueChangeEvent());
3870
}
3971

@@ -42,10 +74,10 @@ export class UmbPropertyEditorUIBlockGridLayoutStylesheetElement
4274
return html`
4375
<umb-input-static-file
4476
@change=${this._onChange}
45-
.pickableFilter=${this._pickableFilter}
46-
.selection=${this._value}
47-
.min=${0}
48-
.max=${1}></umb-input-static-file>
77+
.pickableFilter=${this.#pickableFilter}
78+
.selection=${this._value ? (Array.isArray(this._value) ? this._value : [this._value]) : []}
79+
.min=${this._limitMin}
80+
.max=${this._limitMax}></umb-input-static-file>
4981
<br />
5082
<a href="/umbraco/backoffice/assets/css/umbraco-blockgridlayout.css">Link to default layout stylesheet</a>
5183
`;

‎src/packages/block/block-grid/property-editors/manifests.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1+
import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
12
import { manifest as blockGridAreaTypePermission } from './block-grid-area-type-permission/manifests.js';
23
import { manifest as blockGridAreasConfigEditor } from './block-grid-areas-config/manifests.js';
34
import { manifest as blockGridColumnSpan } from './block-grid-column-span/manifests.js';
45
import { manifests as blockGridEditorManifests } from './block-grid-editor/manifests.js';
56
import { manifest as blockGridGroupConfiguration } from './block-grid-group-configuration/manifests.js';
67
import { manifest as blockGridLayoutStylesheet } from './block-grid-layout-stylesheet/manifests.js';
78
import { manifest as blockGridTypeConfiguration } from './block-grid-type-configuration/manifests.js';
8-
import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
99

1010
export const manifests: Array<ManifestTypes> = [
1111
blockGridAreaTypePermission,

‎src/packages/block/block-type/components/block-type-card/block-type-card.element.ts

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,15 @@ import {
55
import { html, customElement, property, state, ifDefined } from '@umbraco-cms/backoffice/external/lit';
66
import { UmbRepositoryItemsManager } from '@umbraco-cms/backoffice/repository';
77
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
8+
import { UMB_APP_CONTEXT } from '@umbraco-cms/backoffice/app';
9+
import { removeInitialSlashFromPath, transformServerPathToClientPath } from '@umbraco-cms/backoffice/utils';
810

911
@customElement('umb-block-type-card')
1012
export class UmbBlockTypeCardElement extends UmbLitElement {
1113
//
14+
#init: Promise<void>;
15+
#appUrl?: string;
16+
1217
#itemManager = new UmbRepositoryItemsManager<UmbDocumentTypeItemModel>(
1318
this,
1419
UMB_DOCUMENT_TYPE_ITEM_REPOSITORY_ALIAS,
@@ -19,7 +24,18 @@ export class UmbBlockTypeCardElement extends UmbLitElement {
1924
href?: string;
2025

2126
@property({ type: String, attribute: false })
22-
iconFile?: string;
27+
public set iconFile(value: string | undefined) {
28+
value = transformServerPathToClientPath(value);
29+
if (value) {
30+
this.#init.then(() => {
31+
this._iconFile = this.#appUrl! + removeInitialSlashFromPath(value);
32+
});
33+
} else {
34+
this._iconFile = undefined;
35+
}
36+
}
37+
@state()
38+
private _iconFile?: string | undefined;
2339

2440
@property({ type: String, attribute: false })
2541
iconColor?: string;
@@ -55,6 +71,10 @@ export class UmbBlockTypeCardElement extends UmbLitElement {
5571
constructor() {
5672
super();
5773

74+
this.#init = this.getContext(UMB_APP_CONTEXT).then((appContext) => {
75+
this.#appUrl = appContext.getServerUrl() + appContext.getBackofficePath();
76+
});
77+
5878
this.observe(this.#itemManager.items, (items) => {
5979
const item = items[0];
6080
if (item) {
@@ -73,8 +93,8 @@ export class UmbBlockTypeCardElement extends UmbLitElement {
7393
.name=${this._name ?? 'Unknown'}
7494
.description=${this._description}
7595
.background=${this.backgroundColor}>
76-
${this.iconFile
77-
? html`<img src=${this.iconFile} alt="" />`
96+
${this._iconFile
97+
? html`<img src=${this._iconFile} alt="" />`
7898
: html`<umb-icon name=${this._fallbackIcon ?? ''} style="color:${this.iconColor}"></umb-icon>`}
7999
<slot name="actions" slot="actions"> </slot>
80100
</uui-card-block-type>

‎src/packages/core/tree/tree-item/tree-item-base/tree-item-context-base.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
1+
import { map } from '@umbraco-cms/backoffice/external/rxjs';
2+
import { UmbArrayState, UmbBooleanState, UmbObjectState, UmbStringState } from '@umbraco-cms/backoffice/observable-api';
3+
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
4+
import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
5+
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
16
import type { UmbTreeItemContext } from '../tree-item-context.interface.js';
27
import { UMB_TREE_CONTEXT, type UmbDefaultTreeContext } from '../../default/index.js';
38
import type { UmbTreeItemModel, UmbTreeRootModel } from '../../types.js';
49
import { UmbRequestReloadTreeItemChildrenEvent } from '../../entity-actions/reload-tree-item-children/index.js';
5-
import { map } from '@umbraco-cms/backoffice/external/rxjs';
610
import { UMB_SECTION_CONTEXT, UMB_SECTION_SIDEBAR_CONTEXT } from '@umbraco-cms/backoffice/section';
711
import type { UmbSectionContext, UmbSectionSidebarContext } from '@umbraco-cms/backoffice/section';
812
import type { ManifestTreeItem } from '@umbraco-cms/backoffice/extension-registry';
913
import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
10-
import { UmbArrayState, UmbBooleanState, UmbObjectState, UmbStringState } from '@umbraco-cms/backoffice/observable-api';
11-
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
12-
import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
13-
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
1414
import { UMB_ACTION_EVENT_CONTEXT, type UmbActionEventContext } from '@umbraco-cms/backoffice/action';
1515
import {
1616
UmbRequestReloadChildrenOfEntityEvent,
@@ -407,6 +407,7 @@ export abstract class UmbTreeItemContextBase<
407407

408408
// TODO: use router context
409409
constructPath(pathname: string, entityType: string, unique: string | null) {
410+
// TODO: Encode uniques [NL]
410411
return `section/${pathname}/workspace/${entityType}/edit/${unique}`;
411412
}
412413

‎src/packages/core/utils/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,9 @@ export * from './path/has-own-opener.function.js';
1111
export * from './path/path-decode.function.js';
1212
export * from './path/path-encode.function.js';
1313
export * from './path/path-folder-name.function.js';
14+
export * from './path/remove-initial-slash-from-path.function.js';
1415
export * from './path/stored-path.function.js';
16+
export * from './path/transform-server-path-to-client-path.function.js';
1517
export * from './path/umbraco-path.function.js';
1618
export * from './path/url-pattern-to-string.function.js';
1719
export * from './selection-manager/selection.manager.js';

0 commit comments

Comments
 (0)