pict-section-recordset 1.3.1 → 1.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pict-section-recordset",
-  "version": "1.3.1",
+  "version": "1.5.0",
   "description": "Pict dynamic record set management views",
   "main": "source/Pict-Section-RecordSet.js",
   "files": [

package/source/views/Filter-PersistenceView.js

@@ -29,6 +29,10 @@ const _DEFAULT_CONFIGURATION_FilterPersistenceView = (
 .prsp-exp-select, .prsp-exp-name { font: inherit; font-size: 0.9rem; padding: 0.42rem 0.6rem; border-radius: 8px;
 	border: 1px solid var(--theme-color-border-default, #d7dce3); background: var(--theme-color-background-primary, #fff); color: var(--theme-color-text-primary, #1f2733); }
 .prsp-exp-select { flex: 0 0 auto; width: 230px; min-width: 0; max-width: 100%; }
+/* When a host layers select2 (or a similar widget) on the stored-filter <select>, its container
+   defaults to display:block at the row's full width, pushing Save/Delete onto a second line. Pin it to
+   a fixed-width inline flex item so the controls stay on one row. */
+.prsp-exp-row .select2-container { flex: 0 0 auto !important; display: inline-block !important; width: 230px !important; max-width: 100%; vertical-align: middle; }
 .prsp-exp-select:focus, .prsp-exp-name:focus { outline: none; border-color: var(--theme-color-brand-primary, #156dd1);
 	box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-color-brand-primary, #156dd1) 16%, transparent); }
 .prsp-exp-btn { flex: 0 0 auto; white-space: nowrap; }

package/source/views/RecordSet-Filters.js

@@ -67,7 +67,9 @@ const _DEFAULT_CONFIGURATION_SUBSET_Filter =
 .prsp-filters-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 0.5rem; }
 
 /* Module-owned "Add filter" popover (replaces the old native <select> pickers). */
-.prsp-addfilter-pop { position: absolute; z-index: 30; top: calc(100% + 0.35rem); left: 0; min-width: 280px; max-width: 360px; display: none; }
+/* Fixed (viewport-anchored) + JS-positioned on open, so no ancestor overflow:hidden — the filter card,
+   the slide-out drawer — can clip it, whatever the host's layout. */
+.prsp-addfilter-pop { position: fixed; z-index: 30; min-width: 280px; max-width: 360px; display: none; }
 .prsp-addfilter-pop.open { display: block; }
 /* Transparent full-viewport backdrop: catches outside clicks to close (no document listener). */
 .prsp-addfilter-backdrop { position: fixed; inset: 0; z-index: 0; }
@@ -112,7 +114,7 @@ const _DEFAULT_CONFIGURATION_SUBSET_Filter =
 		</form>
 		<div class="prsp-filters-drawer" id="PRSP_Filter_Drawer">
 			<div class="prsp-filters-drawer-inner">
-				<div id="PRSP_Filter_Instances" class="prsp-filters-clauses">
+				<div id="PRSP_Filter_Instances" class="prsp-filters-clauses" onkeydown="if (event.key === 'Enter' &amp;&amp; !event.target.closest('.pps')) { event.preventDefault(); _Pict.views['PRSP-Filters'].handleSearch(event, '{~D:Record.RecordSet~}', '{~D:Record.ViewContext~}'); }">
 					{~FIV:Record~}
 				</div>
 				{~T:PRSP-SUBSET-Filters-Template-AddFilter-Fieldset~}
@@ -751,7 +753,46 @@ class ViewRecordSetSUBSETFilters extends libPictView
 	_paintAddFilterOpenState()
 	{
 		const tmpPopover = document.getElementById('PRSP_AddFilter_Popover');
-		if (tmpPopover) { tmpPopover.classList.toggle('open', !!this._addFilterOpen); }
+		if (!tmpPopover) { return; }
+		tmpPopover.classList.toggle('open', !!this._addFilterOpen);
+		if (this._addFilterOpen) { this._positionAddFilterPopover(tmpPopover); }
+	}
+
+	/**
+	 * Position the (fixed) add-filter popover against its trigger button, flipping above when there's
+	 * more room there. Fixed positioning means no ancestor overflow:hidden (the host's filter card, the
+	 * slide-out drawer) can clip it — the price is we set its top/left from the trigger's rect here.
+	 *
+	 * @param {HTMLElement} pPopover - the #PRSP_AddFilter_Popover element (already display:block).
+	 */
+	_positionAddFilterPopover(pPopover)
+	{
+		const tmpTrigger = document.getElementById('PRSP_Filter_Button_Add');
+		if (!tmpTrigger) { return; }
+		const tmpPanel = /** @type {HTMLElement} */ (pPopover.querySelector('.prsp-addfilter-panel'));
+		const tmpRect = tmpTrigger.getBoundingClientRect();
+		const tmpGap = 6;
+		const tmpMargin = 8;
+		const tmpVH = window.innerHeight;
+		const tmpVW = window.innerWidth;
+		const tmpWidth = pPopover.offsetWidth || 300;
+		pPopover.style.left = `${Math.round(Math.max(tmpMargin, Math.min(tmpRect.left, tmpVW - tmpWidth - tmpMargin)))}px`;
+		pPopover.style.right = 'auto';
+		const tmpSpaceBelow = tmpVH - tmpRect.bottom - tmpGap - tmpMargin;
+		const tmpSpaceAbove = tmpRect.top - tmpGap - tmpMargin;
+		// Prefer the natural downward direction; only flip above when the room below is genuinely cramped.
+		if (tmpSpaceBelow >= 220 || tmpSpaceBelow >= tmpSpaceAbove)
+		{
+			pPopover.style.top = `${Math.round(tmpRect.bottom + tmpGap)}px`;
+			pPopover.style.bottom = 'auto';
+			if (tmpPanel) { tmpPanel.style.maxHeight = `${Math.max(160, Math.min(tmpSpaceBelow, 460))}px`; }
+		}
+		else
+		{
+			pPopover.style.top = 'auto';
+			pPopover.style.bottom = `${Math.round(tmpVH - tmpRect.top + tmpGap)}px`;
+			if (tmpPanel) { tmpPanel.style.maxHeight = `${Math.max(160, Math.min(tmpSpaceAbove, 460))}px`; }
+		}
 	}
 
 	/**

package/source/views/filters/RecordSet-Filter-EntityReference-Base.js

@@ -0,0 +1,304 @@
+const ViewRecordSetSUBSETFilterBase = require('./RecordSet-Filter-Base');
+
+/**
+ * Shared base for the four entity-reference filter types — Internal/External join × single/list.
+ *
+ * These were ~95% duplicate views, each with the same bespoke "search results | selection" table UI
+ * and identical search/add/remove logic. This base consolidates all of it. Subclasses supply only the
+ * two seams that actually differ:
+ *   - `getSearchEntity(pClause)` — internal join searches `RemoteTable`, external `ExternalFilterByTable`.
+ *   - `isMultiSelect()` — the `…List` variants append; the plain `…SelectedValue` variants replace.
+ *
+ * Rendering uses the same mechanism as before (the input template is emitted during the clause's
+ * template parse, via `getFilterFormTemplate()`), so the consolidation is behavior-preserving. The
+ * input template is itself a seam (`getEntityInputTemplate()`) so a host can swap the table UI for a
+ * picker-backed input (a pict-section-form `Picker` InputType) without the module changing.
+ *
+ * Host-injected contextual scoping rides through `getContextScopeFilter(pClause)` — extra FoxHound
+ * stanzas AND-applied to the entity search (project / spec-year / …). The module never learns what
+ * those contexts mean; the host overrides the hook to read its own app state.
+ */
+const _DEFAULT_CONFIGURATION_EntityReference =
+{
+	ViewIdentifier: 'PRSP-FilterType-EntityReference-Base',
+
+	// When set (by a host), entity clauses delegate their input to this pict-section-form InputType
+	// (rendered via {~IWVDA:PSRSFilterProxyView:Record.ClauseDescriptor~}) instead of the built-in
+	// table UI — e.g. 'Picker' to use pict-section-picker. Default false → the table UI.
+	EntityInputType: false,
+
+	Templates:
+	[
+		{
+			// Table UI (default). Two cells: live search results | current selection.
+			Hash: 'PRSP-Filter-EntityRef-Table',
+			Template: /*html*/`
+	<table><tbody><tr>
+		<td valign="top">{~T:PRSP-Filter-EntityRef-SearchResults~}</td>
+		<td valign="top">{~T:PRSP-Filter-EntityRef-SelectedValues~}</td>
+	</tr></tbody></table>
+`
+		},
+		{
+			// Picker / form-input delegation (opt-in via EntityInputType). Renders one dynamic input
+			// on the shared PSRSFilterProxyView from the clause's ClauseDescriptor (whose PictForm
+			// InputType is stamped in prepareRecord). Bound to the clause's Values address.
+			Hash: 'PRSP-Filter-EntityRef-Input',
+			Template: /*html*/`
+	{~IWVDA:PSRSFilterProxyView:Record.ClauseDescriptor~}
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SearchResults',
+			Template: /*html*/`
+	<form id="PRSP_Filter_{~D:Record.Hash~}_Search_Form" onsubmit="_Pict.views['{~D:Context[0].Hash~}'].performSearch(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}'); return false;">
+		<input id="PRSP_Filter_{~D:Record.Hash~}_Search_Value" type="text" placeholder="Search..." value="{~D:Record.SearchInputValue~}" />
+		<button type="submit" id="PRSP_Filter_{~D:Record.Hash~}_Button_Search" onclick="_Pict.views['{~D:Context[0].Hash~}'].performSearch(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}')">Search</button>
+	</form>
+	<table>
+		<thead><tr><th colspan="2">{~D:Record.Label~}</th></tr></thead>
+		<tbody>{~TSWP:PRSP-Filter-EntityRef-SearchResults-Entry:Record.SearchResults:Record~}</tbody>
+	</table>
+	<button type="button" id="PRSP_Filter_{~D:Record.Hash~}_Button_LoadMore" class="is-hidden" onclick="_Pict.views['{~D:Context[0].Hash~}'].loadMore(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}', {~D:Record.SearchResultsOffset:0~})">Load More</button>
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SelectedValues',
+			Template: /*html*/`
+	<table>
+		<thead><tr><th colspan="2">Selection</th></tr></thead>
+		<tbody>{~TSWP:PRSP-Filter-EntityRef-SelectedValues-Entry:Record.SelectedValues:Record~}</tbody>
+	</table>
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SearchResults-Entry',
+			Template: /*html*/`
+	<tr><td><button onclick="_Pict.views['{~D:Context[0].Hash~}'].handleAdd(event, {~DVBK:Record.Data:Record.Payload.ExternalFilterTableLookupColumn~}, '{~D:Record.Payload.ClauseAddress~}', '{~D:Record.Payload.Hash~}')">Select</button></td><td>{~TFA:Record.Payload.ExternalRecordDisplayTemplate:Record~}</td></tr>
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SelectedValues-Entry',
+			Template: /*html*/`
+	<tr><td><button onclick="_Pict.views['{~D:Context[0].Hash~}'].handleRemove(event, {~DVBK:Record.Data:Record.Payload.ExternalFilterTableLookupColumn~}, '{~D:Record.Payload.ClauseAddress~}', '{~D:Record.Payload.Hash~}')">Remove</button></td><td>{~TFA:Record.Payload.ExternalRecordDisplayTemplate:Record~}</td></tr>
+`
+		},
+	],
+};
+
+class ViewRecordSetSUBSETFilterEntityReferenceBase extends ViewRecordSetSUBSETFilterBase
+{
+	constructor(pFable, pOptions, pServiceHash)
+	{
+		if (!pOptions.PageSize)
+		{
+			pOptions.PageSize = 15;
+		}
+		super(pFable, pOptions, pServiceHash);
+	}
+
+	// --- Seams the subclasses override (the only real differences between the 4 types) ---
+
+	/** @param {Record<string, any>} pClause @return {string} The entity to search (RemoteTable / ExternalFilterByTable). */
+	getSearchEntity(pClause)
+	{
+		return pClause.RemoteTable || pClause.ExternalFilterByTable;
+	}
+
+	/** @param {Record<string, any>} pClause @return {string} The value/ID column on the searched entity. */
+	getLookupColumn(pClause)
+	{
+		return pClause.ExternalFilterTableLookupColumn || `ID${this.getSearchEntity(pClause)}`;
+	}
+
+	/** @return {boolean} True for the `…List` (multi-select) variants. */
+	isMultiSelect()
+	{
+		return true;
+	}
+
+	/**
+	 * Host-injectable contextual search scope. Returns extra FoxHound filter stanza(s) AND-applied to
+	 * the entity search (e.g. "only this project's line items"). Default: the clause's static
+	 * `ContextScopeFilter` if any, else none. Hosts override this to read app state — the module never
+	 * learns what a "project" or "spec year" is.
+	 *
+	 * @param {Record<string, any>} pClause @return {string|Array<string>}
+	 */
+	getContextScopeFilter(pClause)
+	{
+		return pClause.ContextScopeFilter || '';
+	}
+
+	/** @return {string} The template hash for the clause's value input (table UI, or the opt-in delegated input). */
+	getFilterFormTemplate()
+	{
+		return this.options.EntityInputType ? 'PRSP-Filter-EntityRef-Input' : 'PRSP-Filter-EntityRef-Table';
+	}
+
+	/** @param {Record<string, any>} pRecord */
+	prepareRecord(pRecord)
+	{
+		super.prepareRecord(pRecord);
+
+		pRecord.ClauseDescriptor.PictForm = Object.assign({}, pRecord.PictForm);
+		if (this.options.EntityInputType)
+		{
+			// Delegated input: a csv string round-trips through the informary at `.StringArrayValue`,
+			// while the picker adapter writes the real ARRAY to `.Values` (what Filter.js reads) via
+			// ValueArrayAddress. Keeping the informary off `.Values` avoids a Number field defaulting it
+			// to "0". The descriptor also carries everything the picker needs + the contextual scope hook.
+			pRecord.ClauseDescriptor.Address = pRecord.ClauseAddress + '.StringArrayValue';
+			pRecord.ClauseDescriptor.DataType = 'String';
+			pRecord.ClauseDescriptor.PictForm.InputType = pRecord.ClauseDescriptor.PictForm.InputType || this.options.EntityInputType;
+			pRecord.ClauseDescriptor.PictForm.Entity = pRecord.ClauseDescriptor.PictForm.Entity || this.getSearchEntity(pRecord);
+			pRecord.ClauseDescriptor.PictForm.ValueField = pRecord.ClauseDescriptor.PictForm.ValueField || this.getLookupColumn(pRecord);
+			pRecord.ClauseDescriptor.PictForm.Multiple = this.isMultiSelect();
+			pRecord.ClauseDescriptor.PictForm.SearchFields = pRecord.ClauseDescriptor.PictForm.SearchFields
+				|| pRecord.ExternalFilterByColumns || (pRecord.ExternalFilterByColumn ? [ pRecord.ExternalFilterByColumn ] : [ 'Name' ]);
+			pRecord.ClauseDescriptor.PictForm.ValueArrayAddress = pRecord.ClauseValuesAddress;
+			pRecord.ClauseDescriptor.PictForm.GetContextScopeFilter = () => this.getContextScopeFilter(this.getInformaryScopedValue(pRecord.ClauseAddress) || pRecord);
+			// JoinEntity compound display (host opt-in on the clause): show each searched row joined to a
+			// parent entity's field — e.g. a LineItem disambiguated by its Project. The picker fetch-then-
+			// merges the join (Meadow can't join in one read). Forwarded straight through; no-op when unset.
+			if (pRecord.JoinEntity || pRecord.ClauseDescriptor.PictForm.JoinEntity)
+			{
+				const tmpPF = pRecord.ClauseDescriptor.PictForm;
+				tmpPF.JoinEntity = tmpPF.JoinEntity || pRecord.JoinEntity;
+				tmpPF.JoinField = tmpPF.JoinField || pRecord.JoinField;
+				tmpPF.JoinEntityValueField = tmpPF.JoinEntityValueField || pRecord.JoinEntityValueField;
+				tmpPF.JoinEntityDisplayField = tmpPF.JoinEntityDisplayField || pRecord.JoinEntityDisplayField;
+				if (tmpPF.JoinEntityFirst === undefined && pRecord.JoinEntityFirst !== undefined) { tmpPF.JoinEntityFirst = pRecord.JoinEntityFirst; }
+				if (tmpPF.JoinSeparator === undefined && pRecord.JoinSeparator !== undefined) { tmpPF.JoinSeparator = pRecord.JoinSeparator; }
+			}
+			// Saved-filter seeding: mirror the live clause's Values array into the csv `.StringArrayValue`
+			// the input reads, so a reloaded/persisted filter shows its current selections on render.
+			const tmpLiveClause = this.getInformaryScopedValue(pRecord.ClauseAddress);
+			if (tmpLiveClause && Array.isArray(tmpLiveClause.Values))
+			{
+				tmpLiveClause.StringArrayValue = tmpLiveClause.Values.join(',');
+			}
+		}
+		else
+		{
+			pRecord.ClauseDescriptor.DataType = pRecord.DataType || 'Number';
+		}
+		if (!pRecord.ExternalFilterTableLookupColumn)
+		{
+			pRecord.ExternalFilterTableLookupColumn = this.getLookupColumn(pRecord);
+		}
+		if (!pRecord.SearchResults) { pRecord.SearchResults = []; }
+		if (!pRecord.SelectedValues) { pRecord.SelectedValues = []; }
+	}
+
+	// --- Table UI search/select methods (consolidated from the 4 legacy views) ---
+
+	loadMore(pEvent, pClauseInformaryAddress, pClauseHash, pCurrentOffset = 0)
+	{
+		this.performSearch(pEvent, pClauseInformaryAddress, pClauseHash, pCurrentOffset + this.options.PageSize);
+	}
+
+	performSearch(pEvent, pClauseInformaryAddress, pClauseHash, pOffset = 0)
+	{
+		if (pEvent) { pEvent.preventDefault(); }
+		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
+		if (!tmpClause)
+		{
+			this.pict.log.error(`[Filter-EntityReference] No clause found for address: ${pClauseInformaryAddress}`);
+			return;
+		}
+		tmpClause.SearchResultsOffset = pOffset;
+		const tmpSearchInputValue = pOffset > 0 ? tmpClause.SearchInputValue : this.pict.ContentAssignment.readContent(`#PRSP_Filter_${tmpClause.Hash}_Search_Value`);
+		tmpClause.SearchInputValue = tmpSearchInputValue;
+		if (!tmpSearchInputValue)
+		{
+			tmpClause.SearchResults = [];
+			tmpClause.LoadMoreEnabled = false;
+			this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+			return;
+		}
+		const tmpFilterByColumns = tmpClause.ExternalFilterByColumns || (tmpClause.ExternalFilterByColumn ? [ tmpClause.ExternalFilterByColumn ] : [ 'Name' ]);
+		const tmpSearchStanza = tmpFilterByColumns.map((pColumn) => `FBVOR~${pColumn}~LK~${encodeURIComponent(`%${tmpSearchInputValue}%`)}`).join('~');
+		const tmpScope = this.getContextScopeFilter(tmpClause);
+		const tmpScopeStanza = Array.isArray(tmpScope) ? tmpScope.filter(Boolean).join('~') : tmpScope;
+		const tmpMeadowFilter = [ tmpScopeStanza, tmpSearchStanza ].filter(Boolean).join('~');
+		this.pict.EntityProvider.gatherDataFromServer(
+			[
+				{
+					Entity: this.getSearchEntity(tmpClause),
+					Filter: tmpMeadowFilter,
+					Destination: pOffset > 0 ? `${this.getInformaryAddressPrefix()}${pClauseInformaryAddress}.SearchResultsAppend` : `${this.getInformaryAddressPrefix()}${pClauseInformaryAddress}.SearchResults`,
+					RecordStartCursor: pOffset,
+					PageSize: this.options.PageSize,
+				}
+			],
+			() =>
+			{
+				if (pOffset > 0 && tmpClause.SearchResultsAppend?.length > 0)
+				{
+					tmpClause.SearchResults = tmpClause.SearchResults.concat(tmpClause.SearchResultsAppend);
+				}
+				const tmpLoadedRecords = pOffset > 0 ? tmpClause.SearchResultsAppend : tmpClause.SearchResults;
+				delete tmpClause.SearchResultsAppend;
+				tmpClause.SearchResultsOffset = pOffset;
+				tmpClause.LoadMoreEnabled = tmpLoadedRecords && tmpLoadedRecords.length >= this.options.PageSize;
+				this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+				if (tmpClause.LoadMoreEnabled)
+				{
+					this.pict.ContentAssignment.removeClass(`#PRSP_Filter_${tmpClause.Hash}_Button_LoadMore`, 'is-hidden');
+				}
+			});
+	}
+
+	handleAdd(pEvent, pRecordLookupValue, pClauseInformaryAddress, pClauseHash)
+	{
+		if (pEvent) { pEvent.preventDefault(); }
+		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
+		if (!tmpClause) { return; }
+		const tmpRecordLookupColumn = this.getLookupColumn(tmpClause);
+		const tmpRecordToAdd = (tmpClause.SearchResults || []).find((pRow) => pRow[tmpRecordLookupColumn] == pRecordLookupValue);
+		if (!tmpRecordToAdd) { return; }
+		const tmpValue = tmpRecordToAdd[tmpRecordLookupColumn];
+		if (tmpValue == null) { return; }
+		if (!tmpClause.SelectedValues) { tmpClause.SelectedValues = []; }
+		if (!tmpClause.Values) { tmpClause.Values = []; }
+		if (this.isMultiSelect())
+		{
+			if (tmpClause.SelectedValues.some((pSV) => pSV[tmpRecordLookupColumn] == pRecordLookupValue)) { return; }
+			tmpClause.SelectedValues.push(tmpRecordToAdd);
+			if (!tmpClause.Values.some((pV) => pV == tmpValue)) { tmpClause.Values.push(tmpValue); }
+		}
+		else
+		{
+			tmpClause.SelectedValues = [ tmpRecordToAdd ];
+			tmpClause.Values = [ tmpValue ];
+		}
+		this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+	}
+
+	handleRemove(pEvent, pRecordLookupValue, pClauseInformaryAddress, pClauseHash)
+	{
+		if (pEvent) { pEvent.preventDefault(); }
+		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
+		if (!tmpClause) { return; }
+		const tmpRecordLookupColumn = this.getLookupColumn(tmpClause);
+		const tmpIndex = (tmpClause.SelectedValues || []).findIndex((pRow) => pRow[tmpRecordLookupColumn] == pRecordLookupValue);
+		if (tmpIndex < 0) { return; }
+		const tmpRemoved = tmpClause.SelectedValues.splice(tmpIndex, 1)[0];
+		const tmpValue = tmpRemoved[tmpRecordLookupColumn];
+		tmpClause.Values = (tmpClause.Values || []).filter((pV) => pV !== tmpValue);
+		this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+	}
+
+	/** Re-render a clause's container (the table UI re-paints on every search / add / remove). */
+	_reRenderClause(pClause, pClauseInformaryAddress, pClauseHash)
+	{
+		const tmpRecord = Object.assign({ ClauseAddress: pClauseInformaryAddress }, pClause);
+		this.prepareRecord(tmpRecord);
+		this.render(null, `#PRSP_Filter_Container_${pClauseHash}`, tmpRecord);
+	}
+}
+
+module.exports = ViewRecordSetSUBSETFilterEntityReferenceBase;
+
+module.exports.default_configuration = Object.assign({}, ViewRecordSetSUBSETFilterBase.default_configuration, _DEFAULT_CONFIGURATION_EntityReference);

package/source/views/filters/RecordSet-Filter-ExternalJoinSelectedValue.js

@@ -1,271 +1,25 @@
+const ViewRecordSetSUBSETFilterEntityReferenceBase = require('./RecordSet-Filter-EntityReference-Base');
 
-const ViewRecordSetSUBSETFilterBase = require('./RecordSet-Filter-Base');
-
-const _DEFAULT_CONFIGURATION_Filter_ExternalJoin_SelectedValue =
+// External-join (through a junction table), single-select entity-reference filter. Shared base;
+// entity seam = ExternalFilterByTable, single-select (replace, not append).
+const _DEFAULT_CONFIGURATION =
 {
 	ViewIdentifier: 'PRSP-FilterType-ExternalJoinSelectedValue',
-
-	Templates:
-	[
-		{
-			Hash: 'PRSP-Filter-ExternalJoin-SelectedValue-Template',
-			Template: /*html*/`
-	<!-- DefaultPackage pict view template: [PRSP-Filter-ExternalJoin-SelectedValue-Template] -->
-	<table>
-		<tbody>
-		<td valign="top">{~T:PRSP-Filter-ExternalJoin-SelectedValue-SearchResults~}</td><td valign="top">{~T:PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues~}</td>
-		</tbody>
-	</table>
-	<!-- DefaultPackage end view template:	[PRSP-Filter-ExternalJoin-SelectedValue-Template] -->
-`
-		},
-		{
-			Hash: 'PRSP-Filter-ExternalJoin-SelectedValue-SearchResults',
-			Template: /*html*/`
-	<!-- DefaultPackage pict view template: [PRSP-Filter-ExternalJoin-SearchResults] -->
-	<form id="PRSP_Filter_{~D:Record.Hash~}_Search_Form" onsubmit="_Pict.views['{~D:Context[0].Hash~}'].performSearch(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}'); return false;">
-		<input id="PRSP_Filter_{~D:Record.Hash~}_Search_Value" type="text" placeholder="Search..." value="{~D:Record.SearchInputValue~}" />
-		<button type="submit" id="PRSP_Filter_{~D:Record.Hash~}_Button_Search" onclick="_Pict.views['{~D:Context[0].Hash~}'].performSearch(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}')">Search</button>
-	</form>
-	<table>
-		<thead>
-			<tr><th colspan="2">{~D:Record.Label~}</th></tr>
-		</thead>
-		<tbody>
-			{~TSWP:PRSP-Filter-ExternalJoin-SelectedValue-SearchResults-Entry:Record.SearchResults:Record~}
-		</tbody>
-	</table>
-	<button type="button" id="PRSP_Filter_{~D:Record.Hash~}_Button_LoadMore" class="is-hidden" onclick="_Pict.views['{~D:Context[0].Hash~}'].loadMore(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}', {~D:Record.SearchResultsOffset:0~})">Load More</button>
-	<!-- DefaultPackage end view template:	[PRSP-Filter-ExternalJoin-SearchResults] -->
-`
-		},
-		{
-			Hash: 'PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues',
-			Template: /*html*/`
-	<!-- DefaultPackage view template:	[PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues] -->
-	<table>
-		<thead>
-			<tr><th colspan="2">Selection</th></tr>
-		</thead>
-		<tbody>
-			{~TSWP:PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues-Entry:Record.SelectedValues:Record~}
-		</tbody>
-	</table>
-	<!-- DefaultPackage end view template:	[PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues] -->
-`
-		},
-		{
-			Hash: 'PRSP-Filter-ExternalJoin-SelectedValue-SearchResults-Entry',
-			Template: /*html*/`
-	<!-- DefaultPackage pict view template: [PRSP-Filter-ExternalJoin-SelectedValue-Template] -->
-	<tr><td><button onclick="_Pict.views['{~D:Context[0].Hash~}'].handleSelect(event, {~DVBK:Record.Data:Record.Payload.ExternalFilterTableLookupColumn~}, '{~D:Record.Payload.ClauseAddress~}', '{~D:Record.Payload.Hash~}')">Select</button></td><td>{~TFA:Record.Payload.ExternalRecordDisplayTemplate:Record~}</td></tr>
-	<!-- DefaultPackage end view template:	[PRSP-Filter-ExternalJoin-SelectedValue-Template] -->
-`
-		},
-		{
-			Hash: 'PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues-Entry',
-			Template: /*html*/`
-	<!-- DefaultPackage pict view template: [PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues-Entry] -->
-	<tr><td><button onclick="_Pict.views['{~D:Context[0].Hash~}'].handleRemove(event, {~DVBK:Record.Data:Record.Payload.ExternalFilterTableLookupColumn~}, '{~D:Record.Payload.ClauseAddress~}', '{~D:Record.Payload.Hash~}')">Remove</button></td><td>{~TFA:Record.Payload.ExternalRecordDisplayTemplate:Record~}</td></tr>
-	<!-- DefaultPackage end view template:	[PRSP-Filter-ExternalJoin-SelectedValue-SelectedValues-Entry] -->
-`
-		}
-	],
 };
 
-class ViewRecordSetSUBSETFilterExternalJoinSelectedValue extends ViewRecordSetSUBSETFilterBase
+class ViewRecordSetSUBSETFilterExternalJoinSelectedValue extends ViewRecordSetSUBSETFilterEntityReferenceBase
 {
-	constructor(pFable, pOptions, pServiceHash)
-	{
-		if (!pOptions.PageSize)
-		{
-			pOptions.PageSize = 15; // default page size for search results
-		}
-		super(pFable, pOptions, pServiceHash);
-		/*
-		 * show / hide the complex editor since it'll be large ?
-		 * selected record lookup values
-		 * using bundle to load those records (if any)
-		 * templating out the selection
-		 * templating out the search results
-		 * controls to add search result values to selection
-		 */
-	}
-
-	/**
-	 * @param {Record<string, any>} pRecord
-	 */
-	prepareRecord(pRecord)
-	{
-		super.prepareRecord(pRecord);
-
-		pRecord.ClauseDescriptor.DataType = pRecord.DataType || 'Number';
-		pRecord.ClauseDescriptor.PictForm = pRecord.PictForm || {};
-		if (!pRecord.ExternalFilterTableLookupColumn)
-		{
-			pRecord.ExternalFilterTableLookupColumn = `ID${pRecord.ExternalFilterByTable}`;
-		}
-		if (!pRecord.SearchResults)
-		{
-			pRecord.SearchResults = [];
-		}
-		if (!pRecord.SelectedValues)
-		{
-			pRecord.SelectedValues = [];
-		}
-	}
-
-	getFilterFormTemplate()
-	{
-		return 'PRSP-Filter-ExternalJoin-SelectedValue-Template';
-	}
-
-	/**
-	 * @param {UIEvent} pEvent
-	 * @param {string} pClauseInformaryAddress
-	 * @param {string} pClauseHash
-	 */
-	loadMore(pEvent, pClauseInformaryAddress, pClauseHash, pCurrentOffset = 0)
-	{
-		this.performSearch(pEvent, pClauseInformaryAddress, pClauseHash, pCurrentOffset + this.options.PageSize);
-	}
-
-	/**
-	 * @param {UIEvent} pEvent
-	 * @param {string} pClauseInformaryAddress
-	 * @param {string} pClauseHash
-	 * @param {number} [pOffset=0] - The offset for the search results, defaults to 0
-	 */
-	performSearch(pEvent, pClauseInformaryAddress, pClauseHash, pOffset = 0)
-	{
-		pEvent.preventDefault();
-		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
-		if (!tmpClause)
-		{
-			this.pict.log.error(`[Filter-ExternalJoinSelectedValue]  No clause found for address: ${pClauseInformaryAddress}`);
-			return;
-		}
-		tmpClause.SearchResultsOffset = pOffset;
-		// get the input value (search box)
-		const tmpSearchInputValue = pOffset > 0 ? tmpClause.SearchInputValue : this.pict.ContentAssignment.readContent(`#PRSP_Filter_${tmpClause.Hash}_Search_Value`);
-		tmpClause.SearchInputValue = tmpSearchInputValue;
-		if (!tmpSearchInputValue)
-		{
-			tmpClause.SearchResults = [];
-			tmpClause.LoadMoreEnabled = false;
-			const tmpRecord = Object.assign({ ClauseAddress: pClauseInformaryAddress }, tmpClause);
-			this.prepareRecord(tmpRecord);
-			const tmpDestinationAddress = `#PRSP_Filter_Container_${pClauseHash}`;
-			this.render(null, tmpDestinationAddress, tmpRecord);
-			return;
-		}
-		const tmpFilterByColumns = tmpClause.ExternalFilterByColumns || (tmpClause.ExternalFilterByColumn ? [ tmpClause.ExternalFilterByColumn ] : [ 'Name' ]);
-		const tmpMeadowFilter = tmpFilterByColumns.map((pColumn) => `FBVOR~${pColumn}~LK~${encodeURIComponent(`%${tmpSearchInputValue}%`)}`).join('~');
-		// bundle load the remote records and put them in the clause
-		this.pict.EntityProvider.gatherDataFromServer(
-			[
-				{
-					Entity: tmpClause.ExternalFilterByTable,
-					Filter: tmpMeadowFilter,
-					Destination: pOffset > 0 ? `${this.getInformaryAddressPrefix()}${pClauseInformaryAddress}.SearchResultsAppend` : `${this.getInformaryAddressPrefix()}${pClauseInformaryAddress}.SearchResults`,
-					RecordStartCursor: pOffset,
-					PageSize: this.options.PageSize,
-				}
-			],
-			(pError, pResult) =>
-			{
-				if (pOffset > 0 && tmpClause.SearchResultsAppend?.length > 0)
-				{
-					tmpClause.SearchResults = tmpClause.SearchResults.concat(tmpClause.SearchResultsAppend);
-				}
-				delete tmpClause.SearchResultsAppend;
-				tmpClause.SearchResultsOffset = pOffset;
-				const tmpRecord = Object.assign({ ClauseAddress: pClauseInformaryAddress }, tmpClause);
-				this.prepareRecord(tmpRecord);
-				const tmpDestinationAddress = `#PRSP_Filter_Container_${pClauseHash}`;
-				this.render(null, tmpDestinationAddress, tmpRecord);
-				const tmpLoadedRecords = pOffset > 0 ? tmpClause.SearchResultsAppend : tmpClause.SearchResults;
-				const tmpLoadMoreEnabled = tmpLoadedRecords && tmpLoadedRecords.length >= this.options.PageSize;
-				tmpClause.LoadMoreEnabled = tmpLoadMoreEnabled;
-				if (tmpClause.LoadMoreEnabled)
-				{
-					this.pict.ContentAssignment.removeClass(`#PRSP_Filter_${tmpClause.Hash}_Button_LoadMore`, 'is-hidden');
-				}
-			});
-	}
-
-	handleSelect(pEvent, pRecordLookupValue, pClauseInformaryAddress, pClauseHash)
+	getSearchEntity(pClause)
 	{
-		pEvent.preventDefault();
-		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
-		if (!tmpClause)
-		{
-			this.pict.log.error(`[Filter-ExternalJoinSelectedValue]  No clause found for address: ${pClauseInformaryAddress}`);
-			return;
-		}
-		const tmpRecordLookupColumn = tmpClause.ExternalFilterTableLookupColumn || `ID${tmpClause.ExternalFilterByTable}`;
-		const tmpRecordToSelect = tmpClause.SearchResults.find((r) => r[tmpRecordLookupColumn] == pRecordLookupValue);
-		if (!tmpRecordToSelect)
-		{
-			this.pict.log.error(`[Filter-ExternalJoinSelectedValue]  No record found to add for value: ${pRecordLookupValue}`);
-			return;
-		}
-		if (!tmpClause.SelectedValues)
-		{
-			tmpClause.SelectedValues = [];
-		}
-		if (tmpClause.SelectedValues.some((pSV) => pSV[tmpRecordLookupColumn] == pRecordLookupValue))
-		{
-			return;
-		}
-		const tmpValue = tmpRecordToSelect[tmpRecordLookupColumn];
-		if (tmpValue == null)
-		{
-			this.pict.log.error(`[Filter-ExternalJoinSelectedValue]  No value found in record to add: ${JSON.stringify(tmpRecordToSelect)}`);
-			return;
-		}
-		tmpClause.SelectedValues = [ tmpRecordToSelect ];
-		tmpClause.Values = [ tmpValue ];
-		const tmpRecord = Object.assign({ ClauseAddress: pClauseInformaryAddress }, tmpClause);
-		this.prepareRecord(tmpRecord);
-		const tmpDestinationAddress = `#PRSP_Filter_Container_${pClauseHash}`;
-		this.render(null, tmpDestinationAddress, tmpRecord);
-		if (tmpClause.LoadMoreEnabled)
-		{
-			this.pict.ContentAssignment.removeClass(`#PRSP_Filter_${tmpClause.Hash}_Button_LoadMore`, 'is-hidden');
-		}
+		return pClause.ExternalFilterByTable;
 	}
 
-	handleRemove(pEvent, pRecordLookupValue, pClauseInformaryAddress, pClauseHash)
+	isMultiSelect()
 	{
-		pEvent.preventDefault();
-		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
-		if (!tmpClause)
-		{
-			this.pict.log.error(`[Filter-ExternalJoinSelectedValue]  No clause found for address: ${pClauseInformaryAddress}`);
-			return;
-		}
-		const tmpRecordLookupColumn = tmpClause.ExternalFilterTableLookupColumn || `ID${tmpClause.ExternalFilterByTable}`;
-		const tmpRecordIndexToRemove = tmpClause.SelectedValues.findIndex((r) => r[tmpRecordLookupColumn] == pRecordLookupValue);
-		if (tmpRecordIndexToRemove < 0)
-		{
-			this.pict.log.error(`[Filter-ExternalJoinSelectedValue]  No record found to remove for value: ${pRecordLookupValue}`);
-			return;
-		}
-		const tmpRecordToRemove = tmpClause.SelectedValues.splice(tmpRecordIndexToRemove, 1)[0];
-		const tmpValue = tmpRecordToRemove[tmpRecordLookupColumn];
-		tmpClause.Values = tmpClause.Values.filter((pV) => pV !== tmpValue);
-		const tmpRecord = Object.assign({ ClauseAddress: pClauseInformaryAddress }, tmpClause);
-		this.prepareRecord(tmpRecord);
-		const tmpDestinationAddress = `#PRSP_Filter_Container_${pClauseHash}`;
-		this.render(null, tmpDestinationAddress, tmpRecord);
-		if (tmpClause.LoadMoreEnabled)
-		{
-			this.pict.ContentAssignment.removeClass(`#PRSP_Filter_${tmpClause.Hash}_Button_LoadMore`, 'is-hidden');
-		}
+		return false;
 	}
 }
 
 module.exports = ViewRecordSetSUBSETFilterExternalJoinSelectedValue;
 
-module.exports.default_configuration = Object.assign({}, ViewRecordSetSUBSETFilterExternalJoinSelectedValue.default_configuration, _DEFAULT_CONFIGURATION_Filter_ExternalJoin_SelectedValue);
+module.exports.default_configuration = Object.assign({}, ViewRecordSetSUBSETFilterEntityReferenceBase.default_configuration, _DEFAULT_CONFIGURATION);