Feature/change app structure (#1063)

* Move files

* Move types

* Clean load functions

* Fix unit tests

* Fix naming convention on API error type

* Remove '.types' from type filenames

---------

Co-authored-by: Johan Bisse Mattsson <[email protected]>

lxl-web/src/hooks.server.ts

@@ -2,7 +2,7 @@ import { defaultLocale, Locales } from '$lib/i18n/locales';
 import { env } from '$env/dynamic/private';
 import { DisplayUtil, VocabUtil } from '$lib/utils/xl';
 import fs from 'fs';
-import { DERIVED_LENSES } from '$lib/utils/display.types';
+import { DERIVED_LENSES } from '$lib/types/display';
 import displayWeb from '$lib/assets/json/display-web.json';
 
 let utilCache;

lxl-web/src/lib/actions/resourcePopover/ResourcePopover.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { ResourceData } from '$lib/types/ResourceData';
+	import type { ResourceData } from '$lib/types/resourceData';
 	import { onMount } from 'svelte';
 	import { computePosition, offset, shift, inline, flip, arrow } from '@floating-ui/dom';
 	import DecoratedData from '$lib/components/DecoratedData.svelte';

lxl-web/src/lib/actions/resourcePopover/index.ts

@@ -1,7 +1,7 @@
 import type { Action } from 'svelte/action';
 import type { LocaleCode } from '$lib/i18n/locales';
 import ResourcePopover from './ResourcePopover.svelte';
-import type { ResourceData } from '$lib/types/ResourceData';
+import type { ResourceData } from '$lib/types/resourceData';
 
 /** Tests to do
  * - [] Attaches popover when user hovers over trigger node (after delay)

lxl-web/src/lib/components/DecoratedData.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import type { ResourceData } from '$lib/types/ResourceData';
-	import { ShowLabelsOptions } from '$lib/types/DecoratedData';
+	import type { ResourceData } from '$lib/types/resourceData';
+	import { ShowLabelsOptions } from '$lib/types/decoratedData';
 	import { page } from '$app/stores';
 	import resourcePopover from '$lib/actions/resourcePopover';
 	import { hasStyle, getStyle, getResourceId, getPropertyValue } from '$lib/utils/resourceData';
@@ -122,7 +122,7 @@
 	}
 </script>
 
-<!-- 
+<!--
   @component
 	Component used for rendering decorated data.
 -->

lxl-web/src/lib/components/ResourceImage.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { type Image, Width } from '$lib/utils/auxd.types';
+	import { type Image, Width } from '$lib/types/auxd';
 	import placeholder from '$lib/assets/img/placeholder.svg';
 	import getTypeIcon from '$lib/utils/getTypeIcon';
 	import { bestSize } from '$lib/utils/auxd';

lxl-web/src/lib/components/Search.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { page } from '$app/stores';
 	import { afterNavigate } from '$app/navigation';
-	import getDefaultSearchParams from '$lib/utils/addDefaultSearchParams';
+	import addDefaultSearchParams from '$lib/utils/addDefaultSearchParams';
 	import getSortedSearchParams from '$lib/utils/getSortedSearchParams';
 	import BiSearch from '~icons/bi/search';
 
@@ -13,7 +13,7 @@
 		? $page.url.searchParams.get('_q')?.trim()
 		: $page.url.searchParams.get('_i')?.trim();
 
-	let params = getSortedSearchParams(getDefaultSearchParams($page.url.searchParams));
+	let params = getSortedSearchParams(addDefaultSearchParams($page.url.searchParams));
 	// Always reset these params on new search
 	params.set('_offset', '0');
 	params.delete('_i');

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/FacetGroup.svelte → lxl-web/src/lib/components/find/FacetGroup.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { LocaleCode } from '$lib/i18n/locales';
 	import { page } from '$app/stores';
-	import { type FacetGroup } from './search';
+	import { type FacetGroup } from '$lib/types/search';
 	import BiChevronRight from '~icons/bi/chevron-right';
 	import FacetRange from './FacetRange.svelte';
 

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/FacetRange.svelte → lxl-web/src/lib/components/find/FacetRange.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { page } from '$app/stores';
 	import { afterNavigate } from '$app/navigation';
-	import type { FacetSearch } from './search';
+	import type { FacetSearch } from '$lib/types/search';
 
 	export let search: FacetSearch;
 

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/Filters.svelte → lxl-web/src/lib/components/find/Filters.svelte

@@ -2,9 +2,9 @@
 	import { page } from '$app/stores';
 	import { getModalContext } from '$lib/contexts/modal';
 	import FacetGroup from './FacetGroup.svelte';
-	import type { DisplayMapping, FacetGroup as TypedFacetGroup } from './search';
+	import type { DisplayMapping, FacetGroup as TypedFacetGroup } from '$lib/types/search';
 	import SearchMapping from './SearchMapping.svelte';
-	import { shouldShowMapping } from './utils';
+	import { shouldShowMapping } from '$lib/utils/search';
 
 	export let facets: TypedFacetGroup[];
 	export let mapping: DisplayMapping[];

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/Pagination.svelte → lxl-web/src/lib/components/find/Pagination.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { page } from '$app/stores';
-	import type { SearchResult } from './search';
+	import type { SearchResult } from '$lib/types/search';
 	import BiChevronRight from '~icons/bi/chevron-right';
 	import BiChevronLeft from '~icons/bi/chevron-left';
 	export let data: SearchResult;

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/SearchCard.svelte → lxl-web/src/lib/components/find/SearchCard.svelte

@@ -1,14 +1,15 @@
 <script lang="ts">
 	import jmespath from 'jmespath';
-	import type { SearchResultItem } from './search';
-	import DecoratedData from '$lib/components/DecoratedData.svelte';
-	import type { ResourceData } from '$lib/types/ResourceData';
-	import { ShowLabelsOptions } from '$lib/types/DecoratedData';
+	import type { SearchResultItem } from '$lib/types/search';
+	import type { ResourceData } from '$lib/types/resourceData';
+	import { LensType } from '$lib/types/xl';
+	import { ShowLabelsOptions } from '$lib/types/decoratedData';
+	import { LxlLens } from '$lib/types/display';
+
 	import { relativizeUrl } from '$lib/utils/http';
-	import { LensType } from '$lib/utils/xl';
-	import { LxlLens } from '$lib/utils/display.types';
-	import placeholder from '$lib/assets/img/placeholder.svg';
 	import getTypeIcon from '$lib/utils/getTypeIcon';
+	import placeholder from '$lib/assets/img/placeholder.svg';
+	import DecoratedData from '$lib/components/DecoratedData.svelte';
 	import { page } from '$app/stores';
 
 	export let item: SearchResultItem;

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/SearchMapping.svelte → lxl-web/src/lib/components/find/SearchMapping.svelte

@@ -1,13 +1,15 @@
 <script lang="ts">
+	import { ShowLabelsOptions } from '$lib/types/decoratedData';
+	import type { DisplayMapping, SearchOperators } from '$lib/types/search';
+
 	import { page } from '$app/stores';
 	import DecoratedData from '$lib/components/DecoratedData.svelte';
-	import { ShowLabelsOptions } from '$lib/types/DecoratedData';
 	import { getModalContext } from '$lib/contexts/modal';
-	import type { DisplayMapping, SearchOperators } from './search';
 	import BiXLg from '~icons/bi/x-lg';
 	import BiPencil from '~icons/bi/pencil';
 	import BiPencilFill from '~icons/bi/pencil-fill';
 	import BiTrash from '~icons/bi/trash';
+
 	export let mapping: DisplayMapping[];
 	export let parentOperator: keyof typeof SearchOperators | undefined = undefined;
 	export let depth = 0;

lxl-web/src/routes/(app)/[[lang=lang]]/(find)/+layout.svelte → lxl-web/src/lib/components/find/SearchResult.svelte

@@ -8,12 +8,11 @@
 	import Filters from './Filters.svelte';
 	import IconSliders from '~icons/bi/sliders';
 	import BiChevronDown from '~icons/bi/chevron-down';
-	import type { SearchResult, DisplayMapping } from './search';
-	import { shouldShowMapping } from './utils';
+	import type { SearchResult, DisplayMapping } from '$lib/types/search';
+	import { shouldShowMapping } from '$lib/utils/search';
 
 	let showFiltersModal = false;
-
-	$: searchResult = $page.data.searchResult as SearchResult;
+	export let searchResult: SearchResult;
 
 	$: sortOrder = $page.url.searchParams.get('_sort');
 	const sortOptions = [

lxl-web/src/lib/types/API.ts → lxl-web/src/lib/types/api.ts

@@ -1,6 +1,6 @@
 import type { NumericRange } from '@sveltejs/kit';
 
-export type apiError = {
+export type ApiError = {
 	message: string;
 	status_code: NumericRange<400, 599>;
 	status: string;

lxl-web/src/lib/utils/auxd.types.ts → lxl-web/src/lib/types/auxd.ts

@@ -1,4 +1,4 @@
-import { isObject, JsonLd, type Link, Owl } from '$lib/utils/xl';
+import { JsonLd, Owl, type Link } from './xl';
 
 type SizePx = `${number}px`;
 
@@ -37,11 +37,3 @@ export interface Image {
 export interface SecureImage extends Image {
 	sizes: SecureImageResolution[];
 }
-
-export function isImage(v: unknown): v is Image {
-	return isObject(v) && 'sizes' in v && 'recordId' in v;
-}
-
-export function isImageResolution(v: unknown): v is ImageResolution {
-	return isObject(v) && 'url' in v && 'widthṔx' in v && 'heightPx' in v;
-}

lxl-web/src/lib/utils/display.types.ts → lxl-web/src/lib/types/display.ts

@@ -1,4 +1,4 @@
-import { type DerivedLensTypeDefinition, LensType } from '$lib/utils/xl';
+import { type DerivedLensTypeDefinition, LensType } from '$lib/types/xl';
 
 export enum LxlLens {
 	PageHeading = 'page-heading',

lxl-web/src/lib/types/search.ts

@@ -0,0 +1,139 @@
+import { JsonLd, type Link, type DisplayDecorated, type FramedData } from '$lib/types/xl';
+import { type SecureImageResolution } from '$lib/types/auxd';
+import { LxlLens } from '$lib/types/display';
+
+export interface SearchResult {
+	itemOffset: number;
+	itemsPerPage: number;
+	totalItems: number;
+	maxItems: number;
+	mapping: DisplayMapping[];
+	first: Link;
+	last: Link;
+	next?: Link;
+	items: SearchResultItem[];
+	facetGroups: FacetGroup[];
+	predicates: MultiSelectFacet[];
+}
+
+export interface SearchResultItem {
+	[JsonLd.ID]: string;
+	[JsonLd.TYPE]: string;
+	[LxlLens.CardHeading]: DisplayDecorated;
+	[LxlLens.CardBody]: DisplayDecorated;
+	image: SecureImageResolution | undefined;
+	typeStr: string;
+}
+
+type FacetGroupId = string;
+
+export type FacetSearch = {
+	mapping: {
+		greaterThanOrEquals: string;
+		lessThanOrEquals: string;
+		variable: FacetGroupId;
+	};
+	template: string;
+};
+
+export interface FacetGroup {
+	label: string;
+	dimension: FacetGroupId;
+	search?: FacetSearch;
+	// TODO better to do this distinction on the group level?
+	facets: (Facet | MultiSelectFacet)[];
+}
+
+export interface Facet {
+	totalItems: number;
+	view: Link;
+	object: DisplayDecorated;
+	str: string;
+	discriminator: string;
+}
+
+export interface MultiSelectFacet extends Facet {
+	selected: boolean;
+}
+
+export interface DisplayMapping {
+	display?: DisplayDecorated;
+	up?: Link;
+	children?: DisplayMapping[];
+	label?: string;
+	operator: keyof typeof SearchOperators;
+}
+
+export interface PartialCollectionView {
+	[JsonLd.TYPE]: 'PartialCollectionView';
+	[JsonLd.ID]: string;
+	[JsonLd.CONTEXT]: string;
+	itemOffset: number;
+	itemsPerPage: number;
+	totalItems: number;
+	maxItems: number;
+	search: {
+		mapping: SearchMapping[];
+	};
+	first: Link;
+	last: Link;
+	next?: Link;
+	items: FramedData[];
+	stats?: {
+		[JsonLd.ID]: '#stats';
+		sliceByDimension: Record<FacetGroupId, Slice>;
+		_predicates: Observation[];
+		_boolFilters?: Observation[];
+	};
+}
+
+interface Slice {
+	alias: string;
+	dimension: FacetGroupId;
+	observation: Observation[];
+	search?: FacetSearch;
+}
+
+interface Observation {
+	totalItems: number;
+	view: Link;
+	object: FramedData;
+	_selected?: boolean;
+}
+
+export enum SearchOperators {
+	and = 'and',
+	or = 'or',
+	not = 'not',
+	equals = 'equals',
+	notEquals = 'notEquals',
+	greaterThan = 'greaterThan',
+	greaterThanOrEquals = 'greaterThanOrEquals',
+	lessThan = 'lessThan',
+	lessThanOrEquals = 'lessThanOrEquals',
+	existence = 'existence',
+	notExistence = 'notExistence',
+	none = 'none'
+}
+
+type MappingObj = { [key in SearchOperators]: SearchMapping[] | string | FramedData };
+
+export interface SearchMapping extends MappingObj {
+	alias: string;
+	property?: ObjectProperty | DatatypeProperty | PropertyChainAxiom;
+	object?: FramedData;
+	up: { '@id': string };
+}
+
+interface ObjectProperty {}
+
+export interface DatatypeProperty {
+	'@type': 'DataTypeProperty';
+	'@id': string;
+}
+
+interface PropertyChainAxiom {
+	propertyChainAxiom: (ObjectProperty | DatatypeProperty)[];
+	label: string; // e.g. "instanceOf language"
+	_key: string; // e.g. "instanceOf.language"
+}