@umbraco-cms/backoffice 14.0.0--preview004-53edbae7 → 14.0.0--preview004-a571bca2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,6 @@
1
1
  const { rest } = window.MockServiceWorker;
2
2
  import { umbDictionaryData } from '../data/dictionary.data.js';
3
+ import { umbracoPath } from '../../shared/utils/index.js';
3
4
  const uploadResponse = {
4
5
  temporaryFileId: 'c:/path/to/tempfilename.udt',
5
6
  parentId: 'b7e7d0ab-53ba-485d-dddd-12537f9925aa',
@@ -38,14 +39,14 @@ const overviewData = [
38
39
  ];
39
40
  // TODO: add schema
40
41
  export const handlers = [
41
- rest.get('/umbraco/management/api/v1/dictionary/:id', (req, res, ctx) => {
42
+ rest.get(umbracoPath('/dictionary/:id'), (req, res, ctx) => {
42
43
  const id = req.params.id;
43
44
  if (!id)
44
45
  return;
45
46
  const dictionary = umbDictionaryData.getById(id);
46
47
  return res(ctx.status(200), ctx.json(dictionary));
47
48
  }),
48
- rest.get('/umbraco/management/api/v1/dictionary', (req, res, ctx) => {
49
+ rest.get(umbracoPath('/dictionary'), (req, res, ctx) => {
49
50
  const skip = req.url.searchParams.get('skip');
50
51
  const take = req.url.searchParams.get('take');
51
52
  if (!skip || !take)
@@ -60,31 +61,21 @@ export const handlers = [
60
61
  };
61
62
  return res(ctx.status(200), ctx.json(response));
62
63
  }),
63
- rest.post('/umbraco/management/api/v1/dictionary', async (req, res, ctx) => {
64
+ rest.post(umbracoPath('/dictionary'), async (req, res, ctx) => {
64
65
  const data = await req.json();
65
66
  if (!data)
66
67
  return;
67
68
  data.icon = 'umb:book-alt';
68
69
  data.hasChildren = false;
69
70
  data.type = 'dictionary-item';
70
- data.translations = [
71
- {
72
- isoCode: 'en-US',
73
- translation: '',
74
- },
75
- {
76
- isoCode: 'fr',
77
- translation: '',
78
- },
79
- ];
80
- const value = umbDictionaryData.save(data.id, data);
71
+ const value = umbDictionaryData.insert(data);
81
72
  const createdResult = {
82
73
  value,
83
74
  statusCode: 200,
84
75
  };
85
76
  return res(ctx.status(200), ctx.json(createdResult));
86
77
  }),
87
- rest.patch('/umbraco/management/api/v1/dictionary/:id', async (req, res, ctx) => {
78
+ rest.patch(umbracoPath('/dictionary/:id'), async (req, res, ctx) => {
88
79
  const data = await req.json();
89
80
  if (!data)
90
81
  return;
@@ -95,7 +86,17 @@ export const handlers = [
95
86
  const saved = umbDictionaryData.save(dataToSave.id, dataToSave);
96
87
  return res(ctx.status(200), ctx.json(saved));
97
88
  }),
98
- rest.get('/umbraco/management/api/v1/tree/dictionary/root', (req, res, ctx) => {
89
+ rest.put(umbracoPath('/dictionary/:id'), async (req, res, ctx) => {
90
+ const data = await req.json();
91
+ if (!data)
92
+ return;
93
+ const id = req.params.id;
94
+ if (!id)
95
+ return;
96
+ const saved = umbDictionaryData.save(id, data);
97
+ return res(ctx.status(200), ctx.json(saved));
98
+ }),
99
+ rest.get(umbracoPath('/tree/dictionary/root'), (req, res, ctx) => {
99
100
  const items = umbDictionaryData.getTreeRoot();
100
101
  const response = {
101
102
  total: items.length,
@@ -103,7 +104,7 @@ export const handlers = [
103
104
  };
104
105
  return res(ctx.status(200), ctx.json(response));
105
106
  }),
106
- rest.get('/umbraco/management/api/v1/tree/dictionary/children', (req, res, ctx) => {
107
+ rest.get(umbracoPath('/tree/dictionary/children'), (req, res, ctx) => {
107
108
  const parentId = req.url.searchParams.get('parentId');
108
109
  if (!parentId)
109
110
  return;
@@ -114,14 +115,14 @@ export const handlers = [
114
115
  };
115
116
  return res(ctx.status(200), ctx.json(response));
116
117
  }),
117
- rest.get('/umbraco/management/api/v1/tree/dictionary/item', (req, res, ctx) => {
118
+ rest.get(umbracoPath('/tree/dictionary/item'), (req, res, ctx) => {
118
119
  const ids = req.url.searchParams.getAll('id');
119
120
  if (!ids)
120
121
  return;
121
122
  const items = umbDictionaryData.getTreeItem(ids);
122
123
  return res(ctx.status(200), ctx.json(items));
123
124
  }),
124
- rest.delete('/umbraco/management/api/v1/dictionary/:id', (req, res, ctx) => {
125
+ rest.delete(umbracoPath('/dictionary/:id'), (req, res, ctx) => {
125
126
  const id = req.params.id;
126
127
  if (!id)
127
128
  return;
@@ -129,7 +130,7 @@ export const handlers = [
129
130
  return res(ctx.status(200));
130
131
  }),
131
132
  // TODO => handle properly, querystring breaks handler
132
- rest.get('/umbraco/management/api/v1/dictionary/:id/export', (req, res, ctx) => {
133
+ rest.get(umbracoPath('/dictionary/:id/export'), (req, res, ctx) => {
133
134
  const id = req.params.id;
134
135
  if (!id)
135
136
  return;
@@ -138,12 +139,12 @@ export const handlers = [
138
139
  alert(`Downloads file for dictionary "${item?.name}", ${includeChildren === 'true' ? 'with' : 'without'} children.`);
139
140
  return res(ctx.status(200));
140
141
  }),
141
- rest.post('/umbraco/management/api/v1/dictionary/upload', async (req, res, ctx) => {
142
+ rest.post(umbracoPath('/dictionary/upload'), async (req, res, ctx) => {
142
143
  if (!req.arrayBuffer())
143
144
  return;
144
145
  return res(ctx.status(200), ctx.json(uploadResponse));
145
146
  }),
146
- rest.post('/umbraco/management/api/v1/dictionary/import', async (req, res, ctx) => {
147
+ rest.post(umbracoPath('/dictionary/import'), async (req, res, ctx) => {
147
148
  const file = req.url.searchParams.get('file');
148
149
  if (!file || !importResponse.id)
149
150
  return;
@@ -5,15 +5,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
7
  import { UmbDictionaryRepository } from '../../dictionary/repository/dictionary.repository.js';
8
- import { UmbTextStyles } from "../../../../shared/style/index.js";
8
+ import { UmbTextStyles } from '../../../../shared/style/index.js';
9
9
  import { css, html, customElement, state, when } from '../../../../external/lit/index.js';
10
10
  import { UmbLitElement } from '../../../../shared/lit-element/index.js';
11
- import { UMB_MODAL_MANAGER_CONTEXT_TOKEN, UMB_CREATE_DICTIONARY_MODAL, } from '../../../core/modal/index.js';
12
- import { UmbContextConsumerController } from '../../../../libs/context-api/index.js';
13
11
  export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslationDictionaryElement extends UmbLitElement {
14
12
  #dictionaryItems;
15
13
  #repo;
16
- #modalContext;
17
14
  #tableItems;
18
15
  #tableColumns;
19
16
  #languages;
@@ -27,9 +24,6 @@ export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslat
27
24
  this.#tableItems = [];
28
25
  this.#tableColumns = [];
29
26
  this.#languages = [];
30
- new UmbContextConsumerController(this, UMB_MODAL_MANAGER_CONTEXT_TOKEN, (instance) => {
31
- this.#modalContext = instance;
32
- });
33
27
  }
34
28
  async connectedCallback() {
35
29
  super.connectedCallback();
@@ -53,7 +47,7 @@ export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslat
53
47
  #setTableColumns() {
54
48
  this.#tableColumns = [
55
49
  {
56
- name: 'Name',
50
+ name: this.localize.term('general_name'),
57
51
  alias: 'name',
58
52
  },
59
53
  ];
@@ -77,7 +71,7 @@ export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslat
77
71
  columnAlias: 'name',
78
72
  value: html `<a
79
73
  style="font-weight:bold"
80
- href="/section/dictionary/workspace/dictionary-item/edit/${dictionary.id}">
74
+ href="section/dictionary/workspace/dictionary-item/edit/${dictionary.id}">
81
75
  ${dictionary.name}</a
82
76
  > `,
83
77
  },
@@ -91,11 +85,11 @@ export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslat
91
85
  value: dictionary.translatedIsoCodes?.includes(l.isoCode)
92
86
  ? html `<uui-icon
93
87
  name="check"
94
- title="Translation exists for ${l.name}"
88
+ title="${this.localize.term('visuallyHiddenTexts_hasTranslation')} (${l.name})"
95
89
  style="color:var(--uui-color-positive-standalone);display:inline-block"></uui-icon>`
96
90
  : html `<uui-icon
97
91
  name="alert"
98
- title="Translation does not exist for ${l.name}"
92
+ title="${this.localize.term('visuallyHiddenTexts_noTranslation')} (${l.name})"
99
93
  style="color:var(--uui-color-danger-standalone);display:inline-block"></uui-icon>`,
100
94
  });
101
95
  });
@@ -104,38 +98,26 @@ export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslat
104
98
  this._tableItemsFiltered = this.#tableItems;
105
99
  }
106
100
  #filter(e) {
107
- this._tableItemsFiltered = e.target.value
108
- ? this.#tableItems.filter((t) => t.id.includes(e.target.value))
101
+ const searchValue = e.target.value.toLocaleLowerCase();
102
+ this._tableItemsFiltered = searchValue
103
+ ? this.#tableItems.filter((t) => t.id.toLocaleLowerCase().includes(searchValue))
109
104
  : this.#tableItems;
110
105
  }
111
- async #create() {
112
- // TODO: what to do if modal service is not available?
113
- if (!this.#modalContext)
114
- return;
115
- if (!this.#repo)
116
- return;
117
- const modalContext = this.#modalContext?.open(UMB_CREATE_DICTIONARY_MODAL, { parentId: null });
118
- const { name, parentId } = await modalContext.onSubmit();
119
- if (!name || parentId === undefined)
120
- return;
121
- const { data: url } = await this.#repo.create({ name, parentId });
122
- if (!url)
123
- return;
124
- //TODO: Why do we need to extract the id like this?
125
- const id = url.substring(url.lastIndexOf('/') + 1);
126
- history.pushState({}, '', `/section/dictionary/workspace/dictionary-item/edit/${id}`);
127
- }
128
106
  render() {
129
107
  return html `
130
108
  <umb-body-layout header-transparent>
131
109
  <div id="header" slot="header">
132
- <uui-button type="button" look="outline" label="Create dictionary item" @click=${this.#create}
133
- >Create dictionary item</uui-button
134
- >
110
+ <uui-button
111
+ type="button"
112
+ look="outline"
113
+ label=${this.localize.term('dictionary_createNew')}
114
+ href="section/dictionary/workspace/dictionary-item/create/null">
115
+ ${this.localize.term('dictionary_createNew')}
116
+ </uui-button>
135
117
  <uui-input
136
118
  @keyup="${this.#filter}"
137
- placeholder="Type to filter..."
138
- label="Type to filter dictionary"
119
+ placeholder=${this.localize.term('placeholders_filter')}
120
+ label=${this.localize.term('placeholders_filter')}
139
121
  id="searchbar">
140
122
  <div slot="prepend">
141
123
  <uui-icon name="search" id="searchbar_icon"></uui-icon>
@@ -143,9 +125,9 @@ export let UmbDashboardTranslationDictionaryElement = class UmbDashboardTranslat
143
125
  </uui-input>
144
126
  </div>
145
127
  ${when(this._tableItemsFiltered.length, () => html ` <umb-table
146
- .config=${this._tableConfig}
147
- .columns=${this.#tableColumns}
148
- .items=${this._tableItemsFiltered}></umb-table>`, () => html `<umb-empty-state>There were no dictionary items found.</umb-empty-state>`)}
128
+ .config=${this._tableConfig}
129
+ .columns=${this.#tableColumns}
130
+ .items=${this._tableItemsFiltered}></umb-table>`, () => html `<umb-empty-state>${this.localize.term('emptyStates_emptyDictionaryTree')}</umb-empty-state>`)}
149
131
  </umb-body-layout>
150
132
  `;
151
133
  }
@@ -36,10 +36,13 @@ export let UmbDictionaryWorkspaceEditorElement = class UmbDictionaryWorkspaceEdi
36
36
  return html `
37
37
  <umb-workspace-editor alias="Umb.Workspace.Dictionary">
38
38
  <div id="header" slot="header">
39
- <uui-button href="/section/dictionary/dashboard" label="Back to list" compact>
39
+ <uui-button href="section/dictionary/dashboard" label=${this.localize.term('general_backToOverview')} compact>
40
40
  <uui-icon name="umb:arrow-left"></uui-icon>
41
41
  </uui-button>
42
- <uui-input .value=${this._name} @input="${this.#handleInput}" label="Dictionary name"></uui-input>
42
+ <uui-input
43
+ .value=${this._name ?? ''}
44
+ @input="${this.#handleInput}"
45
+ label="${this.localize.term('general_dictionary')} ${this.localize.term('general_name')}"></uui-input>
43
46
  </div>
44
47
  </umb-workspace-editor>
45
48
  `;
@@ -61,8 +61,16 @@ export class UmbDictionaryWorkspaceContext extends UmbWorkspaceContext {
61
61
  return;
62
62
  if (!this.#data.value.id)
63
63
  return;
64
- await this.repository.save(this.#data.value.id, this.#data.value);
65
- this.setIsNew(false);
64
+ if (this.getIsNew()) {
65
+ await this.repository.create(this.#data.value);
66
+ this.setIsNew(false);
67
+ }
68
+ else {
69
+ await this.repository.save(this.#data.value.id, this.#data.value);
70
+ }
71
+ const data = this.getData();
72
+ if (data)
73
+ this.saveComplete(data);
66
74
  }
67
75
  destroy() {
68
76
  this.#data.complete();
@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { UmbDictionaryWorkspaceContext } from './dictionary-workspace.context.js';
8
8
  import { UmbDictionaryWorkspaceEditorElement } from './dictionary-workspace-editor.element.js';
9
- import { UmbTextStyles } from "../../../../shared/style/index.js";
9
+ import { UmbTextStyles } from '../../../../shared/style/index.js';
10
10
  import { html, customElement, state } from '../../../../external/lit/index.js';
11
11
  import { UmbLitElement } from '../../../../shared/lit-element/index.js';
12
12
  export let UmbWorkspaceDictionaryElement = class UmbWorkspaceDictionaryElement extends UmbLitElement {
@@ -23,6 +23,14 @@ export let UmbWorkspaceDictionaryElement = class UmbWorkspaceDictionaryElement e
23
23
  this.#workspaceContext.load(id);
24
24
  },
25
25
  },
26
+ {
27
+ path: 'create/:parentId',
28
+ component: () => this.#element,
29
+ setup: (_component, info) => {
30
+ const parentId = info.match.params.parentId === 'null' ? null : info.match.params.parentId;
31
+ this.#workspaceContext.create(parentId);
32
+ },
33
+ },
26
34
  ];
27
35
  }
28
36
  #workspaceContext;
@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { UMB_DICTIONARY_WORKSPACE_CONTEXT } from '../../dictionary-workspace.context.js';
8
8
  import { UmbDictionaryRepository } from '../../../repository/dictionary.repository.js';
9
9
  import { UUITextareaEvent } from '../../../../../../external/uui/index.js';
10
- import { css, html, customElement, state, repeat, ifDefined } from '../../../../../../external/lit/index.js';
10
+ import { css, html, customElement, state, repeat, ifDefined, unsafeHTML } from '../../../../../../external/lit/index.js';
11
11
  import { UmbLitElement } from '../../../../../../shared/lit-element/index.js';
12
12
  export let UmbWorkspaceViewDictionaryEditorElement = class UmbWorkspaceViewDictionaryEditorElement extends UmbLitElement {
13
13
  constructor() {
@@ -54,8 +54,7 @@ export let UmbWorkspaceViewDictionaryEditorElement = class UmbWorkspaceViewDicti
54
54
  render() {
55
55
  return html `
56
56
  <uui-box>
57
- <p>Edit the different language versions for the dictionary item '<em>${this._dictionary?.name}</em>' below.</p>
58
-
57
+ ${unsafeHTML(this.localize.term('dictionaryItem_description', this._dictionary?.name || 'unnamed'))}
59
58
  ${repeat(this._languages, (item) => item.isoCode, (item) => this.#renderTranslation(item))}
60
59
  </uui-box>
61
60
  `;