@@ -33,7 +33,7 @@ const ModalContent: FC<{}> = () => {
);
}
case ModalType.NodeUpdatedSuccessfully: {
- const nodeUrl = `${process.env.REACT_APP_OSM_API_URL}/node/${nodeId}/`;
+ const nodeUrl = `${import.meta.env.VITE_OSM_API_URL}/node/${nodeId}/`;
return (
{t("modal.aed_updated_successfully")}
diff --git a/src/components/sidebar-left.tsx b/src/components/sidebar-left.tsx
index cca6c33..e17738c 100644
--- a/src/components/sidebar-left.tsx
+++ b/src/components/sidebar-left.tsx
@@ -1,10 +1,10 @@
import React, { FC } from "react";
import "./sidebar.css";
import { Marker } from "maplibre-gl";
+import SidebarAction from "~/model/sidebarAction";
+import { DefibrillatorData } from "~/model/defibrillatorData";
import DefibrillatorDetails from "./sidebar/defibrillatorDetails";
-import SidebarAction from "../model/sidebarAction";
import DefibrillatorEditor from "./sidebar/defibrillatorEditor";
-import { DefibrillatorData } from "../model/defibrillatorData";
import PhotoReport from "./sidebar/photoReporter";
import PhotoUpload from "./sidebar/photoUploader";
diff --git a/src/components/sidebar/buttons.tsx b/src/components/sidebar/buttons.tsx
index 1955260..dcb5e27 100644
--- a/src/components/sidebar/buttons.tsx
+++ b/src/components/sidebar/buttons.tsx
@@ -1,16 +1,16 @@
import {
mdiMagnify, mdiPencil, mdiContentCopy, mdiMap, mdiMapMarkerPlus,
+ mdiGoogleMaps,
} from "@mdi/js";
import Icon from "@mdi/react";
import { Button } from "react-bulma-components";
import { useTranslation } from "react-i18next";
-import { mdiGoogleMaps } from "@mdi/js/commonjs/mdi";
import React, { FC } from "react";
-import { OSM_DOMAIN } from "../../constants";
-import { useAppContext } from "../../appContext";
-import SidebarAction from "../../model/sidebarAction";
-import { fetchNodeDataFromOsm } from "../../osm";
-import { initialModalState, ModalType } from "../../model/modal";
+import { OSM_DOMAIN } from "~/constants";
+import { useAppContext } from "~/appContext";
+import SidebarAction from "~/model/sidebarAction";
+import { fetchNodeDataFromOsm } from "~/osm";
+import { initialModalState, ModalType } from "~/model/modal";
type OsmId = string;
diff --git a/src/components/sidebar/defibrillatorDetails.tsx b/src/components/sidebar/defibrillatorDetails.tsx
index 7c48ce3..da71d14 100644
--- a/src/components/sidebar/defibrillatorDetails.tsx
+++ b/src/components/sidebar/defibrillatorDetails.tsx
@@ -11,7 +11,10 @@ import {
import Icon from "@mdi/react";
import ImageGallery, { ReactImageGalleryItem } from "react-image-gallery";
import "react-image-gallery/styles/css/image-gallery.css";
-import SidebarAction from "src/model/sidebarAction";
+import SidebarAction from "~/model/sidebarAction";
+import { DefibrillatorData } from "~/model/defibrillatorData";
+import { useAppContext } from "~/appContext";
+import { backendBaseUrl } from "~/backend";
import {
CloseSidebarButton,
CopyUrlButton, EditButton,
@@ -21,11 +24,8 @@ import {
} from "./buttons";
import { OpeningHoursField } from "./openingHours";
import { CheckDateField } from "./verificationDate";
-import { DefibrillatorData } from "../../model/defibrillatorData";
import DetailTextRow from "./detailTextRow";
-import { useAppContext } from "../../appContext";
import { accessColourClass } from "./access";
-import { backendBaseUrl } from "../../backend";
import { initialModalState, ModalType } from "../../model/modal";
function photoGallery(data: DefibrillatorData, closeSidebar: () => void) {
@@ -102,7 +102,7 @@ const DefibrillatorDetails: FC
= (props) => {
if (data === null) return null;
const accessText = data.tags.access ? ` - ${t(`access.${data.tags.access}`)}` : "";
const defibrillatorLocation = data.tags[`defibrillator:location:${resolvedLanguage}`]
- || data.tags["defibrillator:location"];
+ ?? data.tags["defibrillator:location"];
const levelText = data.tags.level ? ` (${t("sidebar.level")}: ${data.tags.level})` : "";
const indoorText = data.tags.indoor ? t(`indoor.${data.tags.indoor}`) + levelText : "";
@@ -172,7 +172,7 @@ const DefibrillatorDetails: FC = (props) => {
diff --git a/src/components/sidebar/defibrillatorEditor.tsx b/src/components/sidebar/defibrillatorEditor.tsx
index 5fb7c1b..28455d1 100644
--- a/src/components/sidebar/defibrillatorEditor.tsx
+++ b/src/components/sidebar/defibrillatorEditor.tsx
@@ -2,8 +2,8 @@ import React, { FC, useState } from "react";
import { Image, Card } from "react-bulma-components";
import { useTranslation } from "react-i18next";
import { Marker } from "maplibre-gl";
+import { initialModalState, ModalType } from "~/model/modal";
import { addDefibrillatorToOSM, editDefibrillatorInOSM, getOpenChangesetId } from "../../osm";
-import { initialModalState, ModalType } from "../../model/modal";
import { AddAedButton, CloseSidebarButton, SaveAedButton } from "./buttons";
import AccessFormField from "./access";
import IndoorFormField from "./indoor";
@@ -21,13 +21,13 @@ const DefibrillatorEditor: FC = ({
const { authState: { auth }, setModalState } = useAppContext();
const newAED = data === null;
const initialTags = data !== null ? data.tags : { emergency: "defibrillator" };
- const [access, setAccess] = useState(initialTags.access || "");
- const [indoor, setIndoor] = useState(initialTags.indoor || "");
- const [level, setLevel] = useState(initialTags.level || "");
+ const [access, setAccess] = useState(initialTags.access ?? "");
+ const [indoor, setIndoor] = useState(initialTags.indoor ?? "");
+ const [level, setLevel] = useState(initialTags.level ?? "");
const [location, setLocation] = useState(
- initialTags[`defibrillator:location:${language}`] || "",
+ initialTags[`defibrillator:location:${language}`] ?? "",
);
- const [phoneNumber, setPhoneNumber] = useState(initialTags.phone || initialTags["contact:phone"] || "");
+ const [phoneNumber, setPhoneNumber] = useState(initialTags.phone ?? initialTags["contact:phone"] ?? "");
const todayDate = new Date().toISOString().substring(0, 10);
const [checkDate, setCheckDate] = useState(todayDate);
diff --git a/src/components/sidebar/openingHours.tsx b/src/components/sidebar/openingHours.tsx
index e1d13f5..48ba3e2 100644
--- a/src/components/sidebar/openingHours.tsx
+++ b/src/components/sidebar/openingHours.tsx
@@ -4,8 +4,8 @@ import i18n from "i18next";
import React, { FC, useEffect, useState } from "react";
import { getFuzzyLocalTimeFromPoint } from "@mapbox/timespace";
-import { getNominatimReverseGeocodingState } from "src/backend";
-import { NominatimStateData } from "src/model/Nominatim";
+import { getNominatimReverseGeocodingState } from "~/backend";
+import { NominatimStateData } from "~/model/Nominatim";
import SpanNoData from "./spanNoData";
interface OpeningHoursProps {
diff --git a/src/components/sidebar/photoReporter.tsx b/src/components/sidebar/photoReporter.tsx
index 4f0ef8c..33b09cb 100644
--- a/src/components/sidebar/photoReporter.tsx
+++ b/src/components/sidebar/photoReporter.tsx
@@ -1,15 +1,15 @@
import React, { FC } from "react";
import { Button, Card, Image } from "react-bulma-components";
import { useTranslation } from "react-i18next";
-import { DefibrillatorData } from "src/model/defibrillatorData";
-import SidebarAction from "src/model/sidebarAction";
-import { initialModalState, ModalType } from "src/model/modal";
import { mdiArrowLeftBold, mdiSend } from "@mdi/js";
import Icon from "@mdi/react";
+import { DefibrillatorData } from "~/model/defibrillatorData";
+import SidebarAction from "~/model/sidebarAction";
+import { initialModalState, ModalType } from "~/model/modal";
+import { useAppContext } from "~/appContext";
+import { backendBaseUrl } from "~/backend";
import { CloseSidebarButton } from "./buttons";
import { accessColourClass } from "./access";
-import { useAppContext } from "../../appContext";
-import { backendBaseUrl } from "../../backend";
interface DefibrillatorDetailsProps {
data: DefibrillatorData | null,
diff --git a/src/components/sidebar/photoUploader.tsx b/src/components/sidebar/photoUploader.tsx
index 07f0e25..15a8ded 100644
--- a/src/components/sidebar/photoUploader.tsx
+++ b/src/components/sidebar/photoUploader.tsx
@@ -3,16 +3,16 @@ import {
Button, Card, Image,
} from "react-bulma-components";
import { useTranslation } from "react-i18next";
-import { DefibrillatorData } from "src/model/defibrillatorData";
-import SidebarAction from "src/model/sidebarAction";
import store from "store";
-import { initialModalState, ModalType } from "src/model/modal";
import { mdiArrowLeftBold, mdiFileDocumentRemove, mdiFileSend } from "@mdi/js";
import Icon from "@mdi/react";
+import { DefibrillatorData } from "~/model/defibrillatorData";
+import SidebarAction from "~/model/sidebarAction";
+import { initialModalState, ModalType } from "~/model/modal";
+import { useAppContext } from "~/appContext";
+import { backendBaseUrl } from "~/backend";
import { CloseSidebarButton } from "./buttons";
import { accessColourClass } from "./access";
-import { useAppContext } from "../../appContext";
-import { backendBaseUrl } from "../../backend";
interface DefibrillatorDetailsProps {
data: DefibrillatorData | null,
diff --git a/src/i18n.ts b/src/i18n.ts
index e32a94e..e0a779f 100644
--- a/src/i18n.ts
+++ b/src/i18n.ts
@@ -3,7 +3,7 @@ import { initReactI18next } from "react-i18next";
import LanguageDetector from "i18next-browser-languagedetector";
import Backend from "i18next-http-backend";
-const isProduction = process.env.REACT_APP_ENV === "production";
+const isProduction = import.meta.env.VITE_ENV === "production";
const languages: { [index: string]: { nativeName: string } } = {
be: { nativeName: "беларуская мова" },
diff --git a/src/index.css b/src/index.css
index 9e65bff..1883210 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,5 +1,3 @@
-@import '~bulma-checkradio';
-
html {
overflow-y: hidden !important; /* Hide vertical scrollbar */
overflow-x: hidden !important; /* Hide horizontal scrollbar */
diff --git a/src/osm.ts b/src/osm.ts
index e9fcc7c..4fe82e2 100644
--- a/src/osm.ts
+++ b/src/osm.ts
@@ -68,8 +68,8 @@ export function getOpenChangesetId(
const changesetComment = `Defibrillator ${newAED ? "added" : "modified"} via https://openaedmap.org #aed`;
changeset.appendChild(createTagElement("comment", changesetComment));
changeset.appendChild(createTagElement("created_by", "https://openaedmap.org"));
- if (process.env.REACT_APP_GIT_COMMIT) {
- changeset.appendChild(createTagElement("git_commit", process.env.REACT_APP_GIT_COMMIT));
+ if (import.meta.env.VITE_GIT_COMMIT) {
+ changeset.appendChild(createTagElement("git_commit", import.meta.env.VITE_GIT_COMMIT));
}
changeset.appendChild(createTagElement("locale", lang));
changeset.appendChild(createTagElement("hashtags", "#aed"));
diff --git a/tsconfig.json b/tsconfig.json
index 54daf98..b08d50d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -25,7 +25,11 @@
"./types/",
"./node_modules/@types"
],
- "baseUrl": "."
+ "types": ["vite/client"],
+ "baseUrl": ".",
+ "paths": {
+ "~*": ["./src/*"]
+ }
},
"include": [
"src",
diff --git a/types/custom.d.ts b/types/custom.d.ts
index 12c2eac..a1656ba 100644
--- a/types/custom.d.ts
+++ b/types/custom.d.ts
@@ -6,10 +6,3 @@ declare module "*.svg" {
declare module "@mapbox/timespace" {
export function getFuzzyLocalTimeFromPoint(timestamp: number, point: number[]): { _d: Date };
}
-
-declare module "@maplibre/maplibre-gl-geocoder" {
- export default class MaplibreGeocoder {
- constructor(geocoderApi, options);
- setLanguage(language: string): void;
- }
-}
diff --git a/vite.config.js b/vite.config.js
new file mode 100644
index 0000000..c8fa76d
--- /dev/null
+++ b/vite.config.js
@@ -0,0 +1,22 @@
+import path from 'path';
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import commonjs from 'vite-plugin-commonjs'
+
+export default defineConfig(() => {
+ return {
+ // https://github.com/vitejs/vite/issues/1973#issuecomment-787571499
+ define: {
+ 'process.env': {},
+ },
+ resolve: {
+ alias: {
+ '~': path.resolve(__dirname, './src'),
+ },
+ },
+ build: {
+ outDir: 'build',
+ },
+ plugins: [react(), commonjs()],
+ };
+});