From 0dd05f95182bf2ca942cfe70607a6935099a1423 Mon Sep 17 00:00:00 2001 From: Nishit Suwal <81785002+NSUWAL123@users.noreply.github.com> Date: Fri, 20 Dec 2024 21:01:29 +0545 Subject: [PATCH] refactor(mapper): ts errors on frontend (#2006) * fix(tsconfig): add path aliases to tsconfig * refactor(toast): remove unused css * refactor(login): remove unused prop type * fix(bottom-sheet): ts type fix * fix(dialog-task-actions): ts error fix * fix(header): update shoelace component reference types * fix(comment): ts error fix * fix(common): update ts types * fix(editor): remove empty style tag * fix(toolbar): onkeydown event add * [pre-commit.ci] auto fixes from pre-commit.com hooks for more information, see https://pre-commit.ci * fix(getDeviceRotation): ts type add * fix(+page): ts type fix * fix(store): ts type fix * fix(types): update ts type * fix(main): update ts type * fix(tasks): update ts types --------- Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com> --- .../src/lib/components/bottom-sheet.svelte | 24 ++++-- .../lib/components/dialog-task-actions.svelte | 18 ++-- .../src/lib/components/editor/editor.svelte | 3 - .../src/lib/components/editor/toolbar.svelte | 82 ++++++++++++++++++- src/mapper/src/lib/components/header.svelte | 43 +++++----- src/mapper/src/lib/components/login.svelte | 5 -- src/mapper/src/lib/components/map/main.svelte | 14 ++-- .../src/lib/components/more/comment.svelte | 2 +- src/mapper/src/lib/components/toast.svelte | 6 -- src/mapper/src/lib/types.ts | 15 +--- src/mapper/src/lib/utils/getDeviceRotation.ts | 2 +- .../src/routes/[projectId]/+page.svelte | 17 ++-- src/mapper/src/store/common.svelte.ts | 6 +- src/mapper/src/store/entities.svelte.ts | 6 +- src/mapper/src/store/tasks.svelte.ts | 13 +-- src/mapper/tsconfig.json | 13 ++- 16 files changed, 177 insertions(+), 92 deletions(-) diff --git a/src/mapper/src/lib/components/bottom-sheet.svelte b/src/mapper/src/lib/components/bottom-sheet.svelte index d31cdbf84c..54c16907a4 100644 --- a/src/mapper/src/lib/components/bottom-sheet.svelte +++ b/src/mapper/src/lib/components/bottom-sheet.svelte @@ -7,8 +7,8 @@ let startY: number; let startHeight: number; - let currSheetHeight: number = $state(); - let show: boolean = $state(); + let currSheetHeight: number = $state(0); + let show: boolean = $state(false); let isDragging: boolean = $state(false); interface Props { @@ -37,17 +37,27 @@ document.body.style.overflowY = 'auto'; }; - const dragStart = (e) => { + const dragStart = (e: MouseEvent | TouchEvent) => { e.preventDefault(); - const pagesY = e.pageY || e.changedTouches[0].screenY; + let pagesY: number = 0; + if (e instanceof MouseEvent) { + pagesY = e.pageY; + } else if (e instanceof TouchEvent) { + pagesY = e.changedTouches[0].screenY; + } startY = pagesY; startHeight = parseInt(sheetContentRef.style.height); isDragging = true; }; - const dragging = (e) => { + const dragging = (e: MouseEvent | TouchEvent) => { if (!isDragging) return; - const delta = startY - (e.pageY || e.changedTouches[0].screenY); + let delta: number = 0; + if (e instanceof MouseEvent) { + delta = startY - e.pageY; + } else if (e instanceof TouchEvent) { + delta = startY - e.changedTouches[0].screenY; + } const newHeight = startHeight + (delta / window.innerHeight) * 100; bottomSheetRef.style.height = `100vh`; updateSheetHeight(newHeight); @@ -106,8 +116,6 @@ > - -
{@render children?.()} diff --git a/src/mapper/src/lib/components/dialog-task-actions.svelte b/src/mapper/src/lib/components/dialog-task-actions.svelte index dceaf3720e..1f152a7623 100644 --- a/src/mapper/src/lib/components/dialog-task-actions.svelte +++ b/src/mapper/src/lib/components/dialog-task-actions.svelte @@ -80,10 +80,12 @@ variant="default" size="small" class="primary" - onclick={() => mapTask(projectData?.id, taskStore.selectedTaskId)} + onclick={() => { + if (taskStore.selectedTaskId) mapTask(projectData?.id, taskStore.selectedTaskId); + }} onkeydown={(e: KeyboardEvent) => { if (e.key === 'Enter') { - mapTask(projectData?.id, taskStore.selectedTaskId); + if (taskStore.selectedTaskId) mapTask(projectData?.id, taskStore.selectedTaskId); } }} role="button" @@ -98,14 +100,16 @@

Task #{taskStore.selectedTaskIndex} has been locked. Is the task completely mapped?

resetTask(projectData?.id, taskStore.selectedTaskId)} + onclick={() => { + if (taskStore.selectedTaskId) resetTask(projectData?.id, taskStore.selectedTaskId); + }} variant="default" outline size="small" class="secondary" onkeydown={(e: KeyboardEvent) => { if (e.key === 'Enter') { - resetTask(projectData?.id, taskStore.selectedTaskId); + if (taskStore.selectedTaskId) resetTask(projectData?.id, taskStore.selectedTaskId); } }} role="button" @@ -119,13 +123,15 @@ CANCEL MAPPING finishTask(projectData?.id, taskStore.selectedTaskId)} + onclick={() => { + if (taskStore.selectedTaskId) finishTask(projectData?.id, taskStore.selectedTaskId); + }} variant="default" size="small" class="green" onkeydown={(e: KeyboardEvent) => { if (e.key === 'Enter') { - finishTask(projectData?.id, taskStore.selectedTaskId); + if (taskStore.selectedTaskId) finishTask(projectData?.id, taskStore.selectedTaskId); } }} role="button" diff --git a/src/mapper/src/lib/components/editor/editor.svelte b/src/mapper/src/lib/components/editor/editor.svelte index ee18e2f922..62f5c021e4 100644 --- a/src/mapper/src/lib/components/editor/editor.svelte +++ b/src/mapper/src/lib/components/editor/editor.svelte @@ -51,6 +51,3 @@
- - diff --git a/src/mapper/src/lib/components/editor/toolbar.svelte b/src/mapper/src/lib/components/editor/toolbar.svelte index 56da5e4042..1abc329cae 100644 --- a/src/mapper/src/lib/components/editor/toolbar.svelte +++ b/src/mapper/src/lib/components/editor/toolbar.svelte @@ -11,6 +11,11 @@ class={`${iconClassName}`} class:active={editor.isActive('bold')} onclick={() => editor?.chain()?.focus()?.toggleBold().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleBold().run(); + }} + role="button" + tabindex="0" > @@ -19,6 +24,11 @@ class={`${iconClassName}`} class:active={editor.isActive('italic')} onclick={() => editor?.chain()?.focus()?.toggleItalic().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleItalic().run(); + }} + role="button" + tabindex="0" > @@ -27,6 +37,11 @@ class={`${iconClassName}`} class:active={editor.isActive('strike')} onclick={() => editor?.chain()?.focus()?.toggleStrike().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleStrike().run(); + }} + role="button" + tabindex="0" > @@ -35,6 +50,11 @@ class={`${iconClassName}`} class:active={editor.isActive('heading', { level: 1 })} onclick={() => editor?.chain()?.focus()?.toggleHeading({ level: 1 }).run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleHeading({ level: 1 }).run(); + }} + role="button" + tabindex="0" > @@ -43,6 +63,11 @@ class={`${iconClassName}`} class:active={editor.isActive('heading', { level: 2 })} onclick={() => editor?.chain()?.focus()?.toggleHeading({ level: 2 }).run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleHeading({ level: 2 }).run(); + }} + role="button" + tabindex="0" > @@ -51,6 +76,11 @@ class={`${iconClassName}`} class:active={editor.isActive('heading', { level: 3 })} onclick={() => editor?.chain()?.focus()?.toggleHeading({ level: 3 }).run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleHeading({ level: 3 }).run(); + }} + role="button" + tabindex="0" > @@ -59,6 +89,11 @@ class={`${iconClassName}`} class:active={editor.isActive('bulletList')} onclick={() => editor?.chain()?.focus()?.toggleBulletList().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleBulletList().run(); + }} + role="button" + tabindex="0" > @@ -67,6 +102,11 @@ class={`${iconClassName}`} class:active={editor.isActive('orderedList')} onclick={() => editor?.chain()?.focus()?.toggleOrderedList().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleOrderedList().run(); + }} + role="button" + tabindex="0" > @@ -75,6 +115,11 @@ class={`${iconClassName}`} class:active={editor.isActive('codeBlock')} onclick={() => editor?.chain()?.focus()?.toggleCodeBlock().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleCodeBlock().run(); + }} + role="button" + tabindex="0" > @@ -83,17 +128,48 @@ class={`${iconClassName}`} class:active={editor.isActive('blockquote')} onclick={() => editor?.chain()?.focus()?.toggleBlockquote().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.toggleBlockquote().run(); + }} + role="button" + tabindex="0" > - editor?.chain()?.focus()?.setHorizontalRule().run()} + editor?.chain()?.focus()?.setHorizontalRule().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.setHorizontalRule().run(); + }} + role="button" + tabindex="0" > - editor?.chain()?.focus()?.undo().run()}> + editor?.chain()?.focus()?.undo().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.undo().run(); + }} + role="button" + tabindex="0" + > - editor?.chain()?.focus()?.redo().run()}> + editor?.chain()?.focus()?.redo().run()} + onkeydown={(e: KeyboardEvent) => { + if (e.key === 'Enter') editor?.chain()?.focus()?.redo().run(); + }} + role="button" + tabindex="0" + > diff --git a/src/mapper/src/lib/components/header.svelte b/src/mapper/src/lib/components/header.svelte index 1a7848c112..3aa939b5d9 100644 --- a/src/mapper/src/lib/components/header.svelte +++ b/src/mapper/src/lib/components/header.svelte @@ -8,20 +8,23 @@ import { getAlertStore } from '$store/common.svelte'; import { getProjectSetupStepStore } from '$store/common.svelte.ts'; import { projectSetupStep as projectSetupStepEnum } from '$constants/enums.ts'; + import type { SlDrawer, SlTooltip } from '@shoelace-style/shoelace'; - let drawerRef: any = $state(); - let drawerOpenButtonRef: any = $state(); + let drawerRef: SlDrawer | undefined = $state(); + let drawerOpenButtonRef: SlTooltip | undefined = $state(); const loginStore = getLoginStore(); const alertStore = getAlertStore(); const projectSetupStepStore = getProjectSetupStepStore(); - let isFirstLoad = $derived(+projectSetupStepStore.projectSetupStep === projectSetupStepEnum['odk_project_load']); + let isFirstLoad = $derived( + +(projectSetupStepStore.projectSetupStep || 0) === projectSetupStepEnum['odk_project_load'], + ); const handleSignOut = async () => { try { await revokeCookies(); loginStore.signOut(); - drawerRef.hide(); + drawerRef?.hide(); // window.location.href = window.location.origin; } catch (error) { alertStore.setAlert({ variant: 'danger', message: 'Sign Out Failed' }); @@ -87,30 +90,30 @@ class="!text-[1.8rem] text-[#52525B] leading-0 cursor-pointer hover:text-red-600 duration-200" style={isFirstLoad ? 'background-color: var(--sl-color-yellow-300);' : ''} onclick={() => { - drawerRef.show(); + drawerRef?.show(); }} onkeydown={() => { - drawerRef.show(); + drawerRef?.show(); }} role="button" tabindex="0" > - {/snippet} + {/snippet} {#if isFirstLoad} - { - // Always keep tooltip open - drawerOpenButtonRef.show(); - }} - > - {@render drawerOpenButton()} - - + { + // Always keep tooltip open + drawerOpenButtonRef?.show(); + }} + > + {@render drawerOpenButton()} + + {:else} {@render drawerOpenButton()} {/if} diff --git a/src/mapper/src/lib/components/login.svelte b/src/mapper/src/lib/components/login.svelte index 3cb45c78a3..7ec79c795b 100644 --- a/src/mapper/src/lib/components/login.svelte +++ b/src/mapper/src/lib/components/login.svelte @@ -3,11 +3,6 @@ import { osmLoginRedirect } from '$lib/utils/login'; import { getLoginStore } from '$store/login.svelte.ts'; - type Props = { - open: boolean; - toggleOpen: (value: boolean) => void; - }; - type loginOptionsType = { id: string; name: string; diff --git a/src/mapper/src/lib/components/map/main.svelte b/src/mapper/src/lib/components/map/main.svelte index ce75c68af5..69dd581b25 100644 --- a/src/mapper/src/lib/components/map/main.svelte +++ b/src/mapper/src/lib/components/map/main.svelte @@ -23,7 +23,7 @@ import { polygon } from '@turf/helpers'; import { buffer } from '@turf/buffer'; import { bbox } from '@turf/bbox'; - import type { GeoJSON as GeoJSONType, Position, Geometry as GeoJSONGeometry } from 'geojson'; + import type { Position, Geometry as GeoJSONGeometry, FeatureCollection } from 'geojson'; import LocationArcImg from '$assets/images/locationArc.png'; import LocationDotImg from '$assets/images/locationDot.png'; @@ -77,7 +77,7 @@ let taskAreaClicked: boolean = $state(false); let toggleGeolocationStatus: boolean = $state(false); let toggleNavigationMode: boolean = $state(false); - let projectSetupStep = $state(null); + let projectSetupStep: number | null = $state(null); // Trigger adding the PMTiles layer to baselayers, if PmtilesUrl is set let allBaseLayers: maplibregl.StyleSpecification[] = $derived( projectBasemapStore.projectPmtilesUrl @@ -131,7 +131,7 @@ }); $effect(() => { - projectSetupStep = +projectSetupStepStore.projectSetupStep; + projectSetupStep = +(projectSetupStepStore.projectSetupStep || 0); }); // set the map ref to parent component @@ -165,7 +165,7 @@ taskAreaClicked = true; const clickedTaskId = clickedTaskFeature[0]?.properties?.fid; taskStore.setSelectedTaskId(clickedTaskId, clickedTaskFeature[0]?.properties?.task_index); - if (+projectSetupStepStore.projectSetupStep === projectSetupStepEnum['task_selection']) { + if (+(projectSetupStepStore.projectSetupStep || 0) === projectSetupStepEnum['task_selection']) { localStorage.setItem(`project-${projectId}-setup`, projectSetupStepEnum['complete_setup']); projectSetupStepStore.setProjectSetupStep(projectSetupStepEnum['complete_setup']); } @@ -221,7 +221,7 @@ // Save the drawn geometry location, then delete all geoms from store const features: { id: string; geometry: GeoJSONGeometry }[] = drawInstance.getSnapshot(); const drawnFeature = features.find((geom) => geom.id === id); - let firstGeom: GeoJSONGeometry = null; + let firstGeom: GeoJSONGeometry | null = null; if (drawnFeature && drawnFeature.geometry) { firstGeom = drawnFeature.geometry; } else { @@ -254,11 +254,11 @@ } }); - function addStatusToGeojsonProperty(geojsonData: GeoJSONType) { + function addStatusToGeojsonProperty(geojsonData: FeatureCollection) { return { ...geojsonData, features: geojsonData.features.map((feature) => { - const entity = entitiesStore.entitiesStatusList.find((entity) => entity.osmid === feature.properties.osm_id); + const entity = entitiesStore.entitiesStatusList.find((entity) => entity.osmid === feature?.properties?.osm_id); return { ...feature, properties: { diff --git a/src/mapper/src/lib/components/more/comment.svelte b/src/mapper/src/lib/components/more/comment.svelte index 6b8f502cf1..2688554245 100644 --- a/src/mapper/src/lib/components/more/comment.svelte +++ b/src/mapper/src/lib/components/more/comment.svelte @@ -94,7 +94,7 @@ size="small" class="primary col-span-2 sm:col-span-1" onclick={() => { - commentTask(projectId, taskStore.selectedTaskId, currentComment); + if (taskStore.selectedTaskId) commentTask(projectId, taskStore.selectedTaskId, currentComment); editorRef?.commands.clearContent(true); }} onkeydown={() => {}} diff --git a/src/mapper/src/lib/components/toast.svelte b/src/mapper/src/lib/components/toast.svelte index 7da7fa7c2a..06b3561d48 100644 --- a/src/mapper/src/lib/components/toast.svelte +++ b/src/mapper/src/lib/components/toast.svelte @@ -35,9 +35,3 @@ {alertStore.alert?.message} - - diff --git a/src/mapper/src/lib/types.ts b/src/mapper/src/lib/types.ts index 20fbe4965a..22165ffc43 100644 --- a/src/mapper/src/lib/types.ts +++ b/src/mapper/src/lib/types.ts @@ -1,23 +1,12 @@ import type { UUID } from 'crypto'; +import type { Polygon } from 'geojson'; export type ProjectTask = { id: number; project_id: number; project_task_index: number; feature_count: number; - outline: { - type: string; - geometry: { - type: string; - coordinates: []; - }; - properties: { - fid: number; - uid: number; - name: string; - }; - id: number; - }; + outline: Polygon; }; export interface ProjectData { diff --git a/src/mapper/src/lib/utils/getDeviceRotation.ts b/src/mapper/src/lib/utils/getDeviceRotation.ts index 66dfda2cce..7a59bc260d 100644 --- a/src/mapper/src/lib/utils/getDeviceRotation.ts +++ b/src/mapper/src/lib/utils/getDeviceRotation.ts @@ -1,4 +1,4 @@ -export function GetDeviceRotation(quaternion) { +export function GetDeviceRotation(quaternion: any) { // https://w3c.github.io/orientation-sensor/#model explains the order of // the 4 elements in the sensor.quaternion array. let [qx, qy, qz, qw] = quaternion; diff --git a/src/mapper/src/routes/[projectId]/+page.svelte b/src/mapper/src/routes/[projectId]/+page.svelte index 43720e2694..619b7d4c7b 100644 --- a/src/mapper/src/routes/[projectId]/+page.svelte +++ b/src/mapper/src/routes/[projectId]/+page.svelte @@ -82,8 +82,8 @@ }); onDestroy(() => { - taskEventStream.unsubscribeAll(); - entityStatusStream.unsubscribeAll(); + taskEventStream?.unsubscribeAll(); + entityStatusStream?.unsubscribeAll(); }); const projectSetupStepStore = getProjectSetupStepStore(); @@ -91,13 +91,14 @@ $effect(() => { // if project loaded for the first time, set projectSetupStep to 1 else get it from localStorage if (!localStorage.getItem(`project-${data.projectId}-setup`)) { - localStorage.setItem(`project-${data.projectId}-setup`, projectSetupStepEnum['odk_project_load']); + localStorage.setItem(`project-${data.projectId}-setup`, projectSetupStepEnum['odk_project_load'].toString()); projectSetupStepStore.setProjectSetupStep(projectSetupStepEnum['odk_project_load']); } else { - projectSetupStepStore.setProjectSetupStep(localStorage.getItem(`project-${data.projectId}-setup`)); + const projectStep = localStorage.getItem(`project-${data.projectId}-setup`); + projectSetupStepStore.setProjectSetupStep(projectStep ? +projectStep : 0); } // if project loaded for the first time then show qrcode tab - if (+projectSetupStepStore.projectSetupStep === projectSetupStepEnum['odk_project_load']) { + if (+(projectSetupStepStore.projectSetupStep || 0) === projectSetupStepEnum['odk_project_load']) { tabGroup.updateComplete.then(() => { tabGroup.show('qrcode'); }); @@ -163,7 +164,7 @@ {#if commonStore.selectedTab === 'qrcode'} - {#if +projectSetupStepStore.projectSetupStep !== projectSetupStepEnum['odk_project_load']} + {#if +(projectSetupStepStore.projectSetupStep || 0) !== projectSetupStepEnum['odk_project_load']} (alert = { variant: alertDetails.variant, message: alertDetails.message }), - clearAlert: (alertDetails: AlertDetails) => (alert = { variant: null, message: '' }), + clearAlert: (alertDetails: AlertDetails) => (alert = { variant: 'default', message: '' }), }; } diff --git a/src/mapper/src/store/entities.svelte.ts b/src/mapper/src/store/entities.svelte.ts index 3e36e9e160..46702cdc80 100644 --- a/src/mapper/src/store/entities.svelte.ts +++ b/src/mapper/src/store/entities.svelte.ts @@ -44,7 +44,11 @@ function getEntityStatusStream(projectId: number): ShapeStream | undefined { } function getEntitiesStatusStore() { - async function subscribeToEntityStatusUpdates(entitiesStream: ShapeStream, entitiesList: entitiesListType[]) { + async function subscribeToEntityStatusUpdates( + entitiesStream: ShapeStream | undefined, + entitiesList: entitiesListType[], + ) { + if (!entitiesStream) return; entitiesShape = new Shape(entitiesStream); entitiesShape.subscribe((entities: ShapeData) => { diff --git a/src/mapper/src/store/tasks.svelte.ts b/src/mapper/src/store/tasks.svelte.ts index 704f1d8230..51b13eb16d 100644 --- a/src/mapper/src/store/tasks.svelte.ts +++ b/src/mapper/src/store/tasks.svelte.ts @@ -1,12 +1,12 @@ import { ShapeStream, Shape } from '@electric-sql/client'; import type { ShapeData, Row } from '@electric-sql/client'; -import type { GeoJSON } from 'geojson'; +import type { Feature, FeatureCollection, GeoJSON } from 'geojson'; import type { ProjectTask, TaskEventType } from '$lib/types'; let taskEventShape: Shape; -let featcol = $state({ type: 'FeatureCollection', features: [] }); -let latestEvent = $state(null); +let featcol: FeatureCollection = $state({ type: 'FeatureCollection', features: [] }); +let latestEvent: TaskEventType | null = $state(null); let events: TaskEventType[] = $state([]); // for UI show task index for simplicity & for api's use task id @@ -29,7 +29,8 @@ function getTaskEventStream(projectId: number): ShapeStream | undefined { } function getTaskStore() { - async function subscribeToTaskEvents(taskEventStream: ShapeStream) { + async function subscribeToTaskEvents(taskEventStream: ShapeStream | undefined) { + if (!taskEventStream) return; taskEventShape = new Shape(taskEventStream); taskEventShape.subscribe((taskEvent: ShapeData) => { @@ -49,7 +50,7 @@ function getTaskStore() { async function appendTaskStatesToFeatcol(projectTasks: ProjectTask[]) { const latestTaskStates = await getLatestStatePerTask(); - const features = projectTasks.map((task) => ({ + const features: Feature[] = projectTasks.map((task) => ({ type: 'Feature', geometry: task.outline, properties: { @@ -88,7 +89,7 @@ function getTaskStore() { const allTasksCurrentStates = await getLatestStatePerTask(); selectedTask = allTasksCurrentStates.get(taskId); selectedTaskState = selectedTask?.state || 'UNLOCKED_TO_MAP'; - selectedTaskGeom = featcol.features.find((x) => x.properties.fid === taskId)?.geometry || null; + selectedTaskGeom = featcol.features.find((x) => x?.properties?.fid === taskId)?.geometry || null; } return { diff --git a/src/mapper/tsconfig.json b/src/mapper/tsconfig.json index 1c1f843a3f..3812f96020 100644 --- a/src/mapper/tsconfig.json +++ b/src/mapper/tsconfig.json @@ -10,7 +10,18 @@ "sourceMap": true, "strict": true, "moduleResolution": "bundler", - "types": ["vite-plugin-pwa/client"] + "types": ["vite-plugin-pwa/client"], + "paths": { + "$lib/*": ["./src/lib/*"], + "$components/*": ["./src/components/*"], + "$store/*": ["./src/store/*"], + "$routes/*": ["./src/routes/*"], + "$constants/*": ["./src/constants/*"], + "$static/*": ["./static"], + "$styles/*": ["./src/styles/*"], + "$assets/*": ["./src/assets/*"] + }, + "allowImportingTsExtensions": true } // Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias // except $lib which is handled by https://kit.svelte.dev/docs/configuration#files