Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Minor mapper frontend bug fixes #1933

Merged
merged 10 commits into from
Dec 2, 2024
12 changes: 7 additions & 5 deletions src/mapper/src/lib/components/dialog-entities-actions.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,13 @@
const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (isMobile) {
entitiesStore.updateEntityStatus(projectData.id, {
entity_id: entityUuid,
status: 1,
label: `Task ${selectedEntity?.task_id} Feature ${selectedEntity?.osmid}`,
});
if (selectedEntity?.status === 'READY') {
entitiesStore.updateEntityStatus(projectData.id, {
entity_id: entityUuid,
status: 1,
label: `Task ${selectedEntity?.task_id} Feature ${selectedEntity?.osmid}`,
});
}
// Load entity in ODK Collect by intent
document.location.href = `odkcollect://form/${xformId}?feature=${entityUuid}`;
} else {
Expand Down
42 changes: 24 additions & 18 deletions src/mapper/src/lib/components/header.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@

<div class="p-3 flex items-center justify-between">
<div class="flex items-center gap-1">
<img src={HotLogo} alt="hot-logo" />
<img src={HotLogoText} alt="hot-logo" />
<img src={HotLogo} alt="hot-logo" class="h-[2.2rem] sm:h-[3rem]" />
<img src={HotLogoText} alt="hot-logo" class="h-[2.2rem] sm:h-[3rem]" />
</div>
<div class="flex items-center gap-4">
<!-- profile image and username display -->
Expand All @@ -55,7 +55,11 @@
class="w-[1.8rem] h-[1.8rem] min-w-[1.8rem] min-h-[1.8rem] max-w-[1.8rem] max-h-[1.8rem] rounded-full"
/>
{/if}
<p class="font-barlow-medium">{loginStore?.getAuthDetails?.username}</p>
<p
class="font-barlow-medium text-sm sm:text-base text-ellipsis whitespace-nowrap overflow-hidden max-w-[6rem] sm:max-w-fit"
>
{loginStore?.getAuthDetails?.username}
</p>
</div>
{:else}
<sl-button
Expand Down Expand Up @@ -103,20 +107,22 @@
class="hover:text-red-600 cursor-pointer duration-200 decoration-none text-black">{menu.name}</a
>
{/each}
<sl-button
class="primary rounded"
variant="primary"
size="small"
onclick={handleSignOut}
onkeydown={(e: KeyboardEvent) => {
if (e.key === 'Enter') {
handleSignOut();
}
}}
role="button"
tabindex="0"
>
<span class="font-barlow-medium text-base">SIGN OUT</span>
</sl-button>
{#if loginStore?.getAuthDetails}
<sl-button
class="primary rounded"
variant="primary"
size="small"
onclick={handleSignOut}
onkeydown={(e: KeyboardEvent) => {
if (e.key === 'Enter') {
handleSignOut();
}
}}
role="button"
tabindex="0"
>
<span class="font-barlow-medium text-base">SIGN OUT</span>
</sl-button>
{/if}
</div>
</hot-drawer>
26 changes: 13 additions & 13 deletions src/mapper/src/lib/components/map/main.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -67,21 +67,21 @@
let projectSetupStep = $state(null);
// Trigger adding the PMTiles layer to baselayers, if PmtilesUrl is set
let allBaseLayers: maplibregl.StyleSpecification[] = $derived(
projectBasemapStore.projectPmtilesUrl ?
[
...baseLayers,
{
...pmtilesStyle,
sources: {
...pmtilesStyle.sources,
pmtiles: {
...pmtilesStyle.sources.pmtiles,
url: projectBasemapStore.projectPmtilesUrl,
projectBasemapStore.projectPmtilesUrl
? [
...baseLayers,
{
...pmtilesStyle,
sources: {
...pmtilesStyle.sources,
pmtiles: {
...pmtilesStyle.sources.pmtiles,
url: projectBasemapStore.projectPmtilesUrl,
},
},
},
},
]
: baseLayers
]
: baseLayers,
);
// // This does not work! Infinite looping
// // Trigger adding the PMTiles layer to baselayers, if PmtilesUrl is set
Expand Down
10 changes: 4 additions & 6 deletions src/mapper/src/routes/[projectId]/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,7 @@
import BasemapComponent from '$lib/components/offline/basemaps.svelte';
import DialogTaskActions from '$lib/components/dialog-task-actions.svelte';
import DialogEntityActions from '$lib/components/dialog-entities-actions.svelte';
import { generateQrCode, downloadQrCode } from '$lib/utils/qrcode';
import type { ProjectTask, ZoomToTaskEventDetail } from '$lib/types';
import type { ProjectTask } from '$lib/types';
import { convertDateToTimeAgo } from '$lib/utils/datetime';
import { getTaskStore, getTaskEventStream } from '$store/tasks.svelte.ts';
import { getEntitiesStatusStore, getEntityStatusStream } from '$store/entities.svelte.ts';
Expand All @@ -31,7 +30,6 @@
}
let { data }: Props = $props();
// $effect: ({ electric, project } = data)
let mapComponent: maplibregl.Map | undefined = $state(undefined);
let tabGroup: SlTabGroup;
Expand Down Expand Up @@ -113,7 +111,7 @@
{/if}

<!-- The main page -->
<div class="h-[calc(100svh-4.625rem)]">
<div class="h-[calc(100svh-3.699rem)] sm:h-[calc(100svh-4.625rem)]">
<MapComponent
setMapRef={(map) => {
mapComponent = map;
Expand Down Expand Up @@ -181,9 +179,9 @@
class="h-[70vh]"
/>
<sl-button
onclick={() => infoDialogRef?.close()}
onclick={() => infoDialogRef?.hide()}
onkeydown={(e: KeyboardEvent) => {
e.key === 'Enter' && infoDialogRef?.close();
e.key === 'Enter' && infoDialogRef?.hide();
}}
role="button"
tabindex="0"
Expand Down