@startinblox/components-ds4go 4.1.7 → 4.1.9

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@startinblox/components-ds4go",
3
- "version": "4.1.7",
3
+ "version": "4.1.9",
4
4
  "description": "Startin'blox DS4GO",
5
5
  "main": "dist/index.js",
6
6
  "type": "module",
@@ -0,0 +1,240 @@
1
+ import { localized, msg, str } from "@lit/localize";
2
+ import type {
3
+ Constraint,
4
+ Duty,
5
+ OdrlPermission,
6
+ PolicyDefinition,
7
+ PolicyTemplate,
8
+ Prohibition,
9
+ } from "@src/component";
10
+ import { html, LitElement, nothing, unsafeCSS } from "lit";
11
+ import { customElement, property } from "lit/decorators.js";
12
+ import ComponentStyles from "@styles/odrl/policy-composer.scss?inline";
13
+
14
+ @customElement("policy-composer-simple")
15
+ @localized()
16
+ export class PolicyComposerSimple extends LitElement {
17
+ static styles = [unsafeCSS(ComponentStyles)];
18
+
19
+ @property({ attribute: false })
20
+ template?: PolicyTemplate;
21
+
22
+ @property({ attribute: false })
23
+ policy?: PolicyDefinition;
24
+
25
+ _emitPolicyChange() {
26
+ if (!this.policy) return;
27
+ this.dispatchEvent(
28
+ new CustomEvent("policy-changed", {
29
+ detail: this.policy,
30
+ bubbles: true,
31
+ composed: true,
32
+ }),
33
+ );
34
+ }
35
+
36
+ _updateConstraintRightOperand(
37
+ policyField: "permission" | "prohibition" | "obligation",
38
+ itemIndex: number,
39
+ constraintIndex: number,
40
+ value: any,
41
+ dutyIndex?: number,
42
+ ) {
43
+ if (!this.policy) return;
44
+
45
+ if (policyField === "permission" && dutyIndex !== undefined) {
46
+ // Update constraint in duty within permission
47
+ const permissions = [...(this.policy.policy.permission || [])];
48
+ const duties = [...(permissions[itemIndex].duty || [])];
49
+ const constraints = [...(duties[dutyIndex].constraint || [])];
50
+ constraints[constraintIndex] = {
51
+ ...constraints[constraintIndex],
52
+ rightOperand: value,
53
+ };
54
+ duties[dutyIndex] = { ...duties[dutyIndex], constraint: constraints };
55
+ permissions[itemIndex] = { ...permissions[itemIndex], duty: duties };
56
+
57
+ this.policy = {
58
+ ...this.policy,
59
+ policy: {
60
+ ...this.policy.policy,
61
+ permission: permissions,
62
+ },
63
+ };
64
+ } else {
65
+ // Update constraint directly in permission, prohibition, or obligation
66
+ const items = [...(this.policy.policy[policyField] || [])];
67
+ const constraints = [...(items[itemIndex].constraint || [])];
68
+ constraints[constraintIndex] = {
69
+ ...constraints[constraintIndex],
70
+ rightOperand: value,
71
+ };
72
+ items[itemIndex] = { ...items[itemIndex], constraint: constraints };
73
+
74
+ this.policy = {
75
+ ...this.policy,
76
+ policy: {
77
+ ...this.policy.policy,
78
+ [policyField]: items,
79
+ },
80
+ };
81
+ }
82
+
83
+ this._emitPolicyChange();
84
+ }
85
+
86
+ _getConstraintLabel(leftOperand: string, operator: string): string {
87
+ return `${leftOperand} ${operator}`;
88
+ }
89
+
90
+ _renderConstraint(
91
+ constraint: Constraint,
92
+ policyField: "permission" | "prohibition" | "obligation",
93
+ itemIndex: number,
94
+ constraintIndex: number,
95
+ dutyIndex?: number,
96
+ ) {
97
+ const label = this._getConstraintLabel(
98
+ constraint.leftOperand || "",
99
+ constraint.operator || "eq",
100
+ );
101
+
102
+ return html`<div class="flex flex-column spacer-auto">
103
+ <tems-input
104
+ type="text"
105
+ label="${msg(str`${label}`)}"
106
+ .value=${String(constraint.rightOperand || "")}
107
+ @change=${(e: Event) => {
108
+ this._updateConstraintRightOperand(
109
+ policyField,
110
+ itemIndex,
111
+ constraintIndex,
112
+ (e as CustomEvent).detail.value,
113
+ dutyIndex,
114
+ );
115
+ }}
116
+ ></tems-input>
117
+ </div>`;
118
+ }
119
+
120
+ _renderConstraintsFromItems<T extends OdrlPermission | Prohibition | Duty>(
121
+ items: T[] | undefined,
122
+ policyField: "permission" | "prohibition" | "obligation",
123
+ ) {
124
+ if (!items || items.length === 0) return nothing;
125
+
126
+ return html`${items.map((item, itemIndex) => {
127
+ return html`${item.constraint && item.constraint.length > 0
128
+ ? html`${item.constraint.map((constraint, constraintIndex) =>
129
+ this._renderConstraint(
130
+ constraint,
131
+ policyField,
132
+ itemIndex,
133
+ constraintIndex,
134
+ ),
135
+ )}`
136
+ : nothing}
137
+ ${policyField === "permission" && (item as OdrlPermission).duty
138
+ ? html`${(item as OdrlPermission).duty?.map((duty, dutyIndex) => {
139
+ return html`${(duty.constraint || []).map(
140
+ (constraint, constraintIndex) =>
141
+ this._renderConstraint(
142
+ constraint,
143
+ policyField,
144
+ itemIndex,
145
+ constraintIndex,
146
+ dutyIndex,
147
+ ),
148
+ )}`;
149
+ })}`
150
+ : nothing}`;
151
+ })}`;
152
+ }
153
+
154
+ _cancelCustomization() {
155
+ this.dispatchEvent(
156
+ new CustomEvent("cancel-policy-customization", {
157
+ bubbles: true,
158
+ composed: true,
159
+ }),
160
+ );
161
+ }
162
+
163
+ _resetPolicy() {
164
+ if (!this.template) return;
165
+ const templateId = this.template["id"] as string;
166
+ this.policy = {
167
+ "@id": templateId,
168
+ policy: {
169
+ ...this.template.policy,
170
+ "@type": "Set",
171
+ },
172
+ };
173
+ this._emitPolicyChange();
174
+ }
175
+
176
+ render() {
177
+ if (!this.template) {
178
+ return html`<p>${msg("No policy template provided")}</p>`;
179
+ }
180
+
181
+ if (!this.policy) {
182
+ this.policy = {
183
+ "@id": this.template["id"],
184
+ policy: {
185
+ ...this.template.policy,
186
+ "@type": "Set",
187
+ },
188
+ };
189
+ }
190
+
191
+ const hasConstraints =
192
+ (this.policy.policy.permission &&
193
+ this.policy.policy.permission.some((p) => p.constraint?.length)) ||
194
+ (this.policy.policy.prohibition &&
195
+ this.policy.policy.prohibition.some((p) => p.constraint?.length)) ||
196
+ (this.policy.policy.obligation &&
197
+ this.policy.policy.obligation.some((o) => o.constraint?.length));
198
+
199
+ return html`<form @submit=${(e: Event) => e.preventDefault()}>
200
+ <div class="flex">
201
+ <tems-label
202
+ class="flex-1"
203
+ label=${msg(str`Custom ${this.template.name} policy`)}
204
+ ></tems-label>
205
+ <tems-button
206
+ type="outline-gray"
207
+ label=${msg("Cancel policy customization")}
208
+ size="sm"
209
+ @click=${this._cancelCustomization}
210
+ ></tems-button>
211
+ </div>
212
+
213
+ ${!hasConstraints
214
+ ? html`<p>${msg("No constraints available to edit")}</p>`
215
+ : html`
216
+ <fieldset>
217
+ <legend>${msg("Policy Customization")}</legend>
218
+ ${this._renderConstraintsFromItems(
219
+ this.policy.policy.permission,
220
+ "permission",
221
+ )}
222
+ ${this._renderConstraintsFromItems(
223
+ this.policy.policy.prohibition,
224
+ "prohibition",
225
+ )}
226
+ ${this._renderConstraintsFromItems(
227
+ this.policy.policy.obligation,
228
+ "obligation",
229
+ )}
230
+ </fieldset>
231
+ `}
232
+
233
+ <div class="flex align-right spacer-top">
234
+ <tems-button type="outline-gray" size="sm" @click=${this._resetPolicy}>
235
+ ${msg(str`Reset to ${this.template.name} default`)}
236
+ </tems-button>
237
+ </div>
238
+ </form>`;
239
+ }
240
+ }
@@ -736,7 +736,7 @@ export class SolidFactBundle extends OrbitComponent {
736
736
  </div>
737
737
  </div>`
738
738
  : html`<div>
739
- <policy-composer
739
+ <policy-composer-simple
740
740
  .template=${this.policyTemplates.find(
741
741
  (policy) =>
742
742
  policy.id === this.bundleAccessPolicy,
@@ -746,7 +746,7 @@ export class SolidFactBundle extends OrbitComponent {
746
746
  ._updateBundleAccessPolicyDefinition}
747
747
  @cancel-policy-customization=${this
748
748
  ._resetBundleAccessPolicy}
749
- ></policy-composer>
749
+ ></policy-composer-simple>
750
750
  </div>`}
751
751
  ${!this.displayContractPolicyCustomization
752
752
  ? html`<div class="select">
@@ -777,7 +777,7 @@ export class SolidFactBundle extends OrbitComponent {
777
777
  </div>
778
778
  </div>`
779
779
  : html`<div>
780
- <policy-composer
780
+ <policy-composer-simple
781
781
  .template=${this.policyTemplates.find(
782
782
  (policy) =>
783
783
  policy.id === this.bundleContractPolicy,
@@ -787,7 +787,7 @@ export class SolidFactBundle extends OrbitComponent {
787
787
  ._updateBundleContractPolicyDefinition}
788
788
  @cancel-policy-customization=${this
789
789
  ._resetBundleContractPolicy}
790
- ></policy-composer>
790
+ ></policy-composer-simple>
791
791
  </div>`}
792
792
  </div>`}
793
793
  </section>
@@ -149,24 +149,20 @@ export class SolidFactList extends OrbitComponent {
149
149
  if (asset) {
150
150
  const bundleUrl = asset?.dataAddress?.baseUrl;
151
151
  if (bundleUrl) {
152
- // FIXME: Getting 403 when calling a provider with agreement id from consumer
153
- // bundles.push(
154
- // this.dspConnector.instance.fetchProtectedResource(bundleUrl),
155
- // );
156
- // Temp workaround, using ldp store to bypass the issue
157
- bundles.push(bundleUrl);
152
+ bundles.push(
153
+ this.dspConnector.instance.fetchProtectedResource(bundleUrl),
154
+ );
158
155
  }
159
156
  }
160
157
  }
158
+
161
159
 
162
- const fetchedBundles = (await Promise.all(bundles)).map((bundle) =>
163
- this._getProxyValue(bundle),
164
- );
160
+ const fetchedBundles = await Promise.all(bundles);
165
161
 
166
162
  const facts = Array.from(
167
163
  new Set(
168
164
  (await Promise.all(fetchedBundles))
169
- .flatMap((bundle: any) => bundle?.facts || [])
165
+ .flatMap((bundle: any) => bundle?.["ldp:contains"] || [])
170
166
  .map((fact: Fact) => fact["@id"]),
171
167
  ),
172
168
  );