diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml index 946efbfa6..ab780c9d7 100644 --- a/.pre-commit-config.yaml +++ b/.pre-commit-config.yaml @@ -9,7 +9,7 @@ repos: # Lint / autoformat: Python code - repo: https://github.com/astral-sh/ruff-pre-commit # Ruff version. - rev: "v0.6.9" + rev: "v0.7.0" hooks: # Run the linter - id: ruff @@ -73,7 +73,7 @@ repos: # Lint & Autoformat: SQL - repo: https://github.com/sqlfluff/sqlfluff - rev: 3.2.3 + rev: 3.2.4 hooks: - id: sqlfluff-lint files: ^src/backend/migrations/.*\.sql$ diff --git a/src/mapper/src/lib/components/common/toast.svelte b/src/mapper/src/lib/components/common/toast.svelte new file mode 100644 index 000000000..2666bdd3c --- /dev/null +++ b/src/mapper/src/lib/components/common/toast.svelte @@ -0,0 +1,40 @@ + + +
+ + + {alertInfo?.message} + +
+ + diff --git a/src/mapper/src/routes/+layout.svelte b/src/mapper/src/routes/+layout.svelte index 9b62715fe..686ffa81d 100644 --- a/src/mapper/src/routes/+layout.svelte +++ b/src/mapper/src/routes/+layout.svelte @@ -2,6 +2,7 @@ import '@hotosm/ui/dist/style.css'; import '@hotosm/ui/dist/hotosm-ui'; import { setBasePath } from '@hotosm/ui/dist/hotosm-ui'; + import Toast from '$lib/components/common/toast.svelte'; setBasePath('/mapnow'); @@ -10,5 +11,6 @@
+
diff --git a/src/mapper/src/routes/[projectId]/+page.svelte b/src/mapper/src/routes/[projectId]/+page.svelte index 14ff1a767..d5eadd6cd 100644 --- a/src/mapper/src/routes/[projectId]/+page.svelte +++ b/src/mapper/src/routes/[projectId]/+page.svelte @@ -40,14 +40,15 @@ import LayerSwitcher from '$lib/components/page/layer-switcher.svelte'; import BottomSheet from '$lib/components/common/bottom-sheet.svelte'; import Error from './+error.svelte'; - import '../../styles/page.css'; - import BlackLockImg from '../../assets/images/black-lock.png'; - import RedLockImg from '../../assets/images/red-lock.png'; - import More from '../../lib/components/page/more/index.svelte'; - import '../../styles/button.css'; - import { GetDeviceRotation } from '../../utilFunctions/getDeviceRotation'; - import LocationArcImg from '../../assets/images/locationArc.png'; - import LocationDotImg from '../../assets/images/locationDot.png'; + import '$styles/page.css'; + import BlackLockImg from '$assets/images/black-lock.png'; + import RedLockImg from '$assets/images/red-lock.png'; + import More from '$lib/components/page/more/index.svelte'; + import '$styles/button.css'; + import { GetDeviceRotation } from '$utilFunctions/getDeviceRotation'; + import LocationArcImg from '$assets/images/locationArc.png'; + import LocationDotImg from '$assets/images/locationDot.png'; + import { setAlert } from '$store/common'; export let data: PageData; @@ -256,6 +257,10 @@ $: if (map && toggleGeolocationStatus) { if (isFirefox || isSafari) { // firefox & safari doesn't support device orientation sensor + setAlert.set({ + variant: 'warning', + message: "Unable to handle device orientation. Your browser doesn't support device orientation sensors.", + }); } else { // See the API specification at: https://w3c.github.io/orientation-sensor // We use referenceFrame: 'screen' because the web page will rotate when diff --git a/src/mapper/src/store/common.ts b/src/mapper/src/store/common.ts new file mode 100644 index 000000000..a191f81dc --- /dev/null +++ b/src/mapper/src/store/common.ts @@ -0,0 +1,6 @@ +import { writable } from 'svelte/store'; + +export const setAlert = writable({ + variant: '', + message: '', +}); diff --git a/src/mapper/static/assets/icons/exclamation-octagon.svg b/src/mapper/static/assets/icons/exclamation-octagon.svg new file mode 100644 index 000000000..7f2593813 --- /dev/null +++ b/src/mapper/static/assets/icons/exclamation-octagon.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/src/mapper/static/assets/icons/exclamation-triangle.svg b/src/mapper/static/assets/icons/exclamation-triangle.svg new file mode 100644 index 000000000..506b7774a --- /dev/null +++ b/src/mapper/static/assets/icons/exclamation-triangle.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/src/mapper/static/assets/icons/info-circle.svg b/src/mapper/static/assets/icons/info-circle.svg new file mode 100644 index 000000000..e2b50eb5f --- /dev/null +++ b/src/mapper/static/assets/icons/info-circle.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/src/mapper/vite.config.ts b/src/mapper/vite.config.ts index e70837c6a..fc8f8bb81 100644 --- a/src/mapper/vite.config.ts +++ b/src/mapper/vite.config.ts @@ -23,6 +23,10 @@ export default defineConfig({ $lib: path.resolve('./src/lib'), $components: path.resolve('./src/components'), $static: path.resolve('./static'), + $store: path.resolve('./src/store'), + $styles: path.resolve('./src/styles'), + $assets: path.resolve('./src/assets'), + $utilFunctions: path.resolve('./src/utilFunctions'), }, }, test: {