update
This commit is contained in:
@@ -11,10 +11,11 @@ import {
|
||||
CreatedResult,
|
||||
ModelsBuilder,
|
||||
ModelsBuilderResource,
|
||||
ModelsMode,
|
||||
ProblemDetails,
|
||||
} from '@umbraco-cms/backend-api';
|
||||
|
||||
import 'src/core/utils/errorbox';
|
||||
import 'src/core/utils/code-block';
|
||||
|
||||
@customElement('umb-dashboard-models-builder')
|
||||
export class UmbDashboardModelsBuilderElement extends UmbContextConsumerMixin(LitElement) {
|
||||
@@ -24,17 +25,7 @@ export class UmbDashboardModelsBuilderElement extends UmbContextConsumerMixin(Li
|
||||
.headline {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-block-start: 0;
|
||||
margin-block-end: var(--uui-size-space-4);
|
||||
}
|
||||
|
||||
.models-description p {
|
||||
padding-bottom: var(--uui-size-space-1);
|
||||
margin-bottom: var(--uui-size-space-1);
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.models-description ul {
|
||||
@@ -43,11 +34,19 @@ export class UmbDashboardModelsBuilderElement extends UmbContextConsumerMixin(Li
|
||||
padding-left: var(--uui-size-layout-1);
|
||||
}
|
||||
|
||||
span.out-of-date {
|
||||
display: block;
|
||||
padding-block-end: var(--uui-size-space-4);
|
||||
}
|
||||
|
||||
.error {
|
||||
padding-top: var(--uui-size-space-5);
|
||||
font-weight: bold;
|
||||
color: var(--uui-color-danger);
|
||||
}
|
||||
|
||||
p.models-actions {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
`,
|
||||
];
|
||||
|
||||
@@ -92,6 +91,7 @@ export class UmbDashboardModelsBuilderElement extends UmbContextConsumerMixin(Li
|
||||
try {
|
||||
const createdResult = await ModelsBuilderResource.postModelsBuilderBuild();
|
||||
this._createdResult = createdResult;
|
||||
this._getDashboardData();
|
||||
return true;
|
||||
} catch (e) {
|
||||
if (e instanceof ApiError) {
|
||||
@@ -122,37 +122,67 @@ export class UmbDashboardModelsBuilderElement extends UmbContextConsumerMixin(Li
|
||||
render() {
|
||||
return html`
|
||||
<uui-box>
|
||||
<div class="headline" slot="headline">
|
||||
<strong>Models Builder</strong>
|
||||
<div class="headline">
|
||||
<h1>Models Builder</h1>
|
||||
<uui-button .state="${this._buttonStateReload}" look="secondary" @click="${this._onDashboardReload}">
|
||||
Reload
|
||||
</uui-button>
|
||||
</div>
|
||||
<p>Version: ${this._modelsBuilder?.version}</p>
|
||||
|
||||
<div class="models-description">
|
||||
<p>${unsafeHTML(this._modelsBuilder?.modelsNamespace)}</p>
|
||||
<p>ModelsBuilder is enabled with the following configuration:</p>
|
||||
<ul>
|
||||
${this._modelsBuilder?.mode
|
||||
? html`<li>
|
||||
The <strong>ModelsMode</strong> is '${this._modelsBuilder.mode}'. ${this.renderModelsMode()}
|
||||
</li> `
|
||||
: nothing}
|
||||
${this._modelsBuilder?.modelsNamespace
|
||||
? html`<li>The <strong>models namespace</strong> is ${this._modelsBuilder.modelsNamespace}.</li>`
|
||||
: nothing}
|
||||
${this._modelsBuilder?.trackingOutOfDateModels === true
|
||||
? html`<li>Tracking of <strong>out-of-date models</strong> is enabled.</li>`
|
||||
: this._modelsBuilder?.trackingOutOfDateModels === false
|
||||
? html`<li>Tracking of <strong>out-of-date models</strong> is not enabled.</li>`
|
||||
: nothing}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
${this._modelsBuilder?.outOfDateModels === true
|
||||
? html`<p>Models are <strong>out of date</strong></p>`
|
||||
: nothing}
|
||||
${this._modelsBuilder?.canGenerate === true
|
||||
? html` <uui-button
|
||||
.state="${this._buttonStateBuild}"
|
||||
look="primary"
|
||||
label="Generate models"
|
||||
@click="${this._onGenerateModels}">
|
||||
Generate models
|
||||
</uui-button>`
|
||||
: nothing}
|
||||
<p class="models-actions">
|
||||
${this._modelsBuilder?.outOfDateModels === true
|
||||
? html`<span class="out-of-date">Models are <strong>out-of-date</strong></span>`
|
||||
: nothing}
|
||||
${this._modelsBuilder?.canGenerate === true
|
||||
? html` <uui-button
|
||||
.state="${this._buttonStateBuild}"
|
||||
look="primary"
|
||||
label="Generate models"
|
||||
@click="${this._onGenerateModels}">
|
||||
Generate models
|
||||
</uui-button>`
|
||||
: nothing}
|
||||
</p>
|
||||
${this._modelsBuilder?.lastError
|
||||
? html`<p class="error">Last generation failed with the following error:</p>
|
||||
<uui-error-box>${this._modelsBuilder.lastError}</uui-error-box>`
|
||||
<uui-code-block>${this._modelsBuilder.lastError}</uui-code-block>`
|
||||
: nothing}
|
||||
</uui-box>
|
||||
`;
|
||||
}
|
||||
|
||||
renderModelsMode() {
|
||||
switch (this._modelsBuilder?.mode) {
|
||||
case ModelsMode.IN_MEMORY_AUTO:
|
||||
return 'Strongly typed models are re-generated on startup and anytime schema changes (i.e. Content Type) are made. No recompilation necessary but the generated models are not available to code outside of Razor.';
|
||||
case ModelsMode.SOURCE_CODE_MANUAL:
|
||||
return 'Strongly typed models are generated on demand. Recompilation is necessary and models are available to all CSharp code.';
|
||||
case ModelsMode.SOURCE_CODE_AUTO:
|
||||
return 'Strong typed models are generated on demand and anytime schema changes (i.e. Content Type) are made. Recompilation is necessary and models are available to all CSharp code.';
|
||||
case ModelsMode.NOTHING:
|
||||
return 'Strongly typed models are not generated. All content and cache will operate from instance of IPublishedContent only.';
|
||||
default:
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
import { rest } from 'msw';
|
||||
|
||||
import { umbracoPath } from '@umbraco-cms/utils';
|
||||
import { CreatedResult, ModelsBuilder, OutOfDateStatus } from '@umbraco-cms/backend-api';
|
||||
import { CreatedResult, ModelsBuilder, ModelsMode, OutOfDateStatus } from '@umbraco-cms/backend-api';
|
||||
|
||||
export const handlers = [
|
||||
rest.post(umbracoPath('/models-builder/build'), async (_req, res, ctx) => {
|
||||
await new Promise((resolve) => setTimeout(resolve, (Math.random() + 1) * 1000)); // simulate a delay of 1-2 seconds
|
||||
model = modelAfterBuild;
|
||||
return res(
|
||||
// Respond with a 200 status code
|
||||
ctx.status(200),
|
||||
@@ -14,30 +15,7 @@ export const handlers = [
|
||||
}),
|
||||
|
||||
rest.get(umbracoPath('/models-builder/dashboard'), async (_req, res, ctx) => {
|
||||
return res(
|
||||
ctx.status(200),
|
||||
ctx.json<ModelsBuilder>({
|
||||
mode: undefined,
|
||||
canGenerate: true,
|
||||
outOfDateModels: true,
|
||||
lastError: `[plugin:vite:import-analysis] Missing "./directives/unsafe-htl.js" export in "lit" package
|
||||
C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/src/backoffice/dashboards/models-builder/dashboard-models-builder.element.ts
|
||||
at bail (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:32675:8)
|
||||
at resolve (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:32752:10)
|
||||
at resolveExports (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:34128:12)
|
||||
at resolveDeepImport (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:34146:31)
|
||||
at tryNodeResolve (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:33838:20)
|
||||
at Context.resolveId (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:33598:28)
|
||||
at async Object.resolveId (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:40156:32)
|
||||
at async TransformContext.resolve (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:39921:23)
|
||||
at async normalizeUrl (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:36831:34)
|
||||
at async TransformContext.transform (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vit`,
|
||||
version: '13.0.0',
|
||||
modelsNamespace:
|
||||
"<p>ModelsBuilder is enabled, with the following configuration:</p><ul><li>The <strong>models mode</strong> is 'InMemoryAuto'. Strongly typed models are re-generated on startup and anytime schema changes (i.e. Content Type) are made. No recompilation necessary but the generated models are not available to code outside of Razor.</li><li>Models namespace is Umbraco.Cms.Web.Common.PublishedModels.</li><li>Tracking of <strong>out-of-date models</strong> is not enabled.</li></ul>",
|
||||
trackingOutOfDateModels: true,
|
||||
})
|
||||
);
|
||||
return res(ctx.status(200), ctx.json<ModelsBuilder>(model));
|
||||
}),
|
||||
|
||||
rest.get(umbracoPath('/models-builder/status'), async (_req, res, ctx) => {
|
||||
@@ -48,3 +26,37 @@ at async TransformContext.transform (file:///C:/Users/Umbraco/Documents/Umbraco.
|
||||
);
|
||||
}),
|
||||
];
|
||||
|
||||
// Mock Data for now
|
||||
const modelBeforeBuild: ModelsBuilder = {
|
||||
mode: ModelsMode.IN_MEMORY_AUTO,
|
||||
canGenerate: true,
|
||||
outOfDateModels: true,
|
||||
lastError: `[plugin:vite:import-analysis] Missing "./directives/unsafe-html.js" export in "lit" package
|
||||
C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/src/backoffice/dashboards/models-builder/dashboard-models-builder.element.ts
|
||||
at bail (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:32675:8)
|
||||
at resolve (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:32752:10)
|
||||
at resolveExports (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:34128:12)
|
||||
at resolveDeepImport (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:34146:31)
|
||||
at tryNodeResolve (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:33838:20)
|
||||
at Context.resolveId (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:33598:28)
|
||||
at async Object.resolveId (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:40156:32)
|
||||
at async TransformContext.resolve (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:39921:23)
|
||||
at async normalizeUrl (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite/dist/node/chunks/dep-67e7f8ab.js:36831:34)
|
||||
at async TransformContext.transform (file:///C:/Users/Umbraco/Documents/Umbraco.CMS.Backoffice/node_modules/vite`,
|
||||
version: '13.0.0',
|
||||
modelsNamespace: 'Umbraco.Cms.Web.Common.PublishedModels',
|
||||
trackingOutOfDateModels: true,
|
||||
};
|
||||
|
||||
const modelAfterBuild: ModelsBuilder = {
|
||||
mode: ModelsMode.IN_MEMORY_AUTO,
|
||||
canGenerate: true,
|
||||
outOfDateModels: false,
|
||||
lastError: '',
|
||||
version: '13.0.0',
|
||||
modelsNamespace: 'Umbraco.Cms.Web.Common.PublishedModels',
|
||||
trackingOutOfDateModels: true,
|
||||
};
|
||||
|
||||
let model = modelBeforeBuild;
|
||||
|
||||
@@ -4,13 +4,11 @@ import { customElement } from 'lit/decorators.js';
|
||||
|
||||
/**
|
||||
* A simple styled box for showing code-based error messages.
|
||||
* max-height is 500px
|
||||
*
|
||||
* @slot the message
|
||||
* @slot the full message
|
||||
*
|
||||
*/
|
||||
@customElement('uui-error-box')
|
||||
export class UUIErrorBox extends LitElement {
|
||||
@customElement('uui-code-block')
|
||||
export class UUICodeBlock extends LitElement {
|
||||
static styles = [
|
||||
UUITextStyles,
|
||||
css`
|
||||
@@ -20,7 +18,7 @@ export class UUIErrorBox extends LitElement {
|
||||
}
|
||||
|
||||
#container {
|
||||
border: 2px solid var(--uui-color-divider-emphasis);
|
||||
border: 1px solid var(--uui-color-divider-emphasis);
|
||||
color: var(--uui-color-text-alt);
|
||||
background-color: var(--uui-color-divider-standalone);
|
||||
padding: var(--uui-size-space-2);
|
||||
@@ -29,17 +27,8 @@ export class UUIErrorBox extends LitElement {
|
||||
}
|
||||
:host uui-scroll-container {
|
||||
max-height: 500px;
|
||||
}
|
||||
|
||||
pre {
|
||||
display: inline-block;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
line-break: strict;
|
||||
hyphens: none;
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
overflow-y: auto;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
`,
|
||||
];
|
||||
@@ -47,7 +36,7 @@ export class UUIErrorBox extends LitElement {
|
||||
render() {
|
||||
return html`<div id="container">
|
||||
<uui-scroll-container>
|
||||
<pre><slot></slot></pre>
|
||||
<slot></slot>
|
||||
</uui-scroll-container>
|
||||
</div> `;
|
||||
}
|
||||
@@ -55,6 +44,6 @@ export class UUIErrorBox extends LitElement {
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'uui-error-box': UUIErrorBox;
|
||||
'uui-code-block': UUICodeBlock;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user