+
${this.label && this.label !== 'label' ? this.label : ''}
diff --git a/src/elements/internal/InternalAsyncResourceLinkListControl/InternalAsyncResourceLinkListControl.ts b/src/elements/internal/InternalAsyncResourceLinkListControl/InternalAsyncResourceLinkListControl.ts
index 8db3c432..54efb6df 100644
--- a/src/elements/internal/InternalAsyncResourceLinkListControl/InternalAsyncResourceLinkListControl.ts
+++ b/src/elements/internal/InternalAsyncResourceLinkListControl/InternalAsyncResourceLinkListControl.ts
@@ -2,10 +2,10 @@ import type { CSSResultArray, PropertyDeclarations } from 'lit-element';
import type { CheckboxElement } from '@vaadin/vaadin-checkbox';
import type { TemplateResult } from 'lit-html';
import type { ItemRenderer } from '../../public/CollectionPage/types';
+import type { Collection } from './types';
import { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';
import { NucleonElement } from '../../public/NucleonElement/NucleonElement';
-import { getResourceId } from '@foxy.io/sdk/core';
import { ifDefined } from 'lit-html/directives/if-defined';
import { classMap } from '../../../utils/class-map';
import { html } from 'lit-html';
@@ -85,53 +85,31 @@ export class InternalAsyncResourceLinkListControl extends InternalEditableContro
`;
if (!ctx.href || ctx.href.startsWith('foxy://')) return wrap(render(ctx));
- let linkHref: string | undefined;
- const id = getResourceId(ctx.data?._links.self.href ?? '');
+ if (this.readonly) return wrap(render(ctx));
- try {
- const url = new URL(this.linksHref ?? '');
- url.searchParams.set(this.foreignKeyForId ?? '', String(id ?? ''));
- url.searchParams.set('limit', '1');
- linkHref = url.toString();
- } catch {
- linkHref = undefined;
- }
-
- const content = html`
-
this.requestUpdate()}
- >
- ${render(ctx)}
-
- `;
-
- if (this.readonly) return wrap(content);
+ const foreignKeyForUri = this.foreignKeyForUri;
+ const linkResource = foreignKeyForUri
+ ? this.__allLinks?.find(link => link[foreignKeyForUri] === ctx.href)
+ : undefined;
- const nucleon = this.renderRoot.querySelector(`#link-${id}`) as NucleonElement
| null;
- const checked = !!nucleon?.data?.returned_items;
- const isDisabled = this.disabled || !nucleon?.in('idle') || this.__isFetching;
+ const isDisabled = this.disabled || !this.__allLinks || this.__isFetching;
return wrap(html`
{
const target = evt.currentTarget as CheckboxElement;
if (target.checked) {
this.__insertLink(ctx.data?._links.self.href ?? '');
} else {
- this.__deleteLink(
- nucleon?.data?._embedded?.[this.embedKey ?? '']?.[0]?._links.self.href ?? ''
- );
+ this.__deleteLink(linkResource?._links.self.href ?? '');
}
}}
>
- ${content}
+ ${render(ctx)}
`);
@@ -150,11 +128,7 @@ export class InternalAsyncResourceLinkListControl extends InternalEditableContro
firstHref = undefined;
}
- const nucleons = [
- ...(this.renderRoot.querySelectorAll('foxy-nucleon') as NodeListOf>),
- ];
-
- const isStatusVisible = this.__isFetching || nucleons.some(n => !n.in('idle'));
+ const isStatusVisible = this.__isFetching || !this.__allLinks;
return html`
@@ -203,6 +177,8 @@ export class InternalAsyncResourceLinkListControl extends InternalEditableContro
>
${this._errorMessage}
+
+ ${this.__renderLinkResourceLoaders()}