diff --git a/webstillas/src/Pages/addProjectMap.js b/webstillas/src/Pages/addProjectMap.js
index 00b7d4134262c9418ae49364fda1ada7cef677b3..8eee79ff01e63fe964d8d224df0dcb715392fcee 100644
--- a/webstillas/src/Pages/addProjectMap.js
+++ b/webstillas/src/Pages/addProjectMap.js
@@ -9,6 +9,9 @@ import polygon from "@mapbox/mapbox-gl-draw/src/feature_types/polygon";
import "../Assets/Styles/map.css"
import {MapBoxAPIKey} from "../Config/firebaseConfig";
import {AlertCatch} from "../components/Indicators/error";
+import {Button, Spinner} from "react-bootstrap";
+import {PROJECT_URL} from "../Constants/webURL";
+import {useNavigate} from "react-router-dom";
const AddProjectMap = ReactMapboxGl({
accessToken: MapBoxAPIKey
@@ -23,9 +26,13 @@ const AddProjectMap = ReactMapboxGl({
export function MapClass(props) {
//Query client that will manage the caching.
const queryClient = useQueryClient()
+ let navigate = useNavigate();
+
//Setting variables
const [ok, setOk] = useState(false)
const [mapInfo, setMapInfo] = useState([])
+ const [buttonPressed, setButtonPressed] = useState(false)
+
/**
* Function that will validate the polygon the user has drawn.
@@ -35,8 +42,7 @@ export function MapClass(props) {
*/
const onDrawCreate = ({features}) => {
if (features[0].geometry.coordinates[0].length !== 5) {
- console.log("length is invalid")
- window.alert("Invalid geo format. Only valid is 4 points")
+ window.alert("Format ikke godkjent! Kun fire punkter er tillatt ")
} else {
setMapInfo(features)
setOk(true)
@@ -82,10 +88,15 @@ export function MapClass(props) {
* @constructor
*/
const AddProjectRequest = async () => {
+
try {
+ setButtonPressed(true)
await postModel(PROJECTS_URL, (project))
- await queryClient.refetchQueries("allProjects")
+ await queryClient.refetchQueries("allProjects").then(
+ navigate(PROJECT_URL)
+ )
} catch (e) {
+ setButtonPressed(true)
AlertCatch()
}
}
@@ -122,7 +133,22 @@ export function MapClass(props) {
/>
</AddProjectMap>
</div>
- <button className={"confirm-btn"} disabled={!ok || !props.valid} onClick={AddProjectRequest}>Add Project</button>
+
+ {buttonPressed ? <Button className={"confirm-btn"}
+ disabled>
+ <Spinner
+ as="span"
+ animation="grow"
+ size="sm"
+ role="status"
+ aria-hidden="true"
+ />
+ Legger til
+ </Button> :
+ <button className={"confirm-btn"} disabled={!ok || !props.valid} onClick={AddProjectRequest}>Add Project</button>}
+
+
+
</div>
);
}
diff --git a/webstillas/src/components/Indicators/error.js b/webstillas/src/components/Indicators/error.js
index da95832803808d126d6e4432f4220f894d31deed..398a55bc83c395552b258674f6709acf20fa45bb 100644
--- a/webstillas/src/components/Indicators/error.js
+++ b/webstillas/src/components/Indicators/error.js
@@ -22,5 +22,5 @@ export function InternalServerError() {
export function AlertCatch(){
- window.alert("Something went wrong. Please try again later")
+ window.alert("En feil oppstod! Prøv igjen senere.")
}
diff --git a/webstillas/src/components/addproject/addProject.js b/webstillas/src/components/addproject/addProject.js
index 6a1f342d2c43bb2ed294cbbc9bef25c43c156493..4005a4945e2453c2445add7c50f1d88eccb9e789 100644
--- a/webstillas/src/components/addproject/addProject.js
+++ b/webstillas/src/components/addproject/addProject.js
@@ -29,7 +29,7 @@ export default function AddProjectFunc() {
projectName: '',
latitude: 0,
longitude: 0,
- state: "Inactive"
+ state: ""
})
const [size, setSize] = useState({size: 0})
@@ -212,89 +212,95 @@ export default function AddProjectFunc() {
*/
const parseReverseGeo = async (lat, long) => {
let street, postcode, region, place
- await fetch("https://api.mapbox.com/geocoding/v5/mapbox.places/" + long + "," + lat + ".json?access_token=pk.eyJ1IjoiYWxla3NhYWIxIiwiYSI6ImNrbnFjbms1ODBkaWEyb3F3OTZiMWd6M2gifQ.vzOmLzHH3RXFlSsCRrxODQ")
- .then(res => res.json())
- .then(res => {
- let validStreet, validZip, validCounty, validMunicipality
- for (const re of res.features) {
- console.log((re.place_type[0]))
- switch (re.place_type[0]) {
- case "address": {
- street = re.text
- if ((re.text.length > 3)) {
- validStreet = true
- }
- }
- break;
- case "poi": {
- street = re.text
- if ((re.text.length > 3)) {
- validStreet = true
+ try {
+ await fetch("https://api.mapbox.com/geocoding/v5/mapbox.places/" + long + "," + lat + ".json?access_token=pk.eyJ1IjoiYWxla3NhYWIxIiwiYSI6ImNrbnFjbms1ODBkaWEyb3F3OTZiMWd6M2gifQ.vzOmLzHH3RXFlSsCRrxODQ")
+ .then(res => res.json())
+ .then(res => {
+ let validStreet, validZip, validCounty, validMunicipality
+ for (const re of res.features) {
+ console.log((re.place_type[0]))
+ switch (re.place_type[0]) {
+ case "address": {
+ street = re.text
+ if ((re.text.length > 3)) {
+ validStreet = true
+ }
}
+ break;
+ case "poi": {
+ street = re.text
+ if ((re.text.length > 3)) {
+ validStreet = true
+ }
- }
- break;
- case "postcode": {
- postcode = re.text
- if ((re.text.length === 4)) {
- validZip = true
}
+ break;
+ case "postcode": {
+ postcode = re.text
+ if ((re.text.length === 4)) {
+ validZip = true
+ }
- }
- break;
- case ("region"): {
- region = re.text
- if ((re.text.length !== undefined)) {
- validCounty = true
}
- }
- break;
- case ("place") : {
- place = re.text
- if ((re.text.length !== undefined)) {
- validMunicipality = true
+ break;
+ case ("region"): {
+ region = re.text
+ if ((re.text.length !== undefined)) {
+ validCounty = true
+ }
}
+ break;
+ case ("place") : {
+ place = re.text
+ if ((re.text.length !== undefined)) {
+ validMunicipality = true
+ }
+ }
+ break;
+ default:
+ console.log("Ikke validert")
}
- break;
- default:
- console.log("Ikke validert")
- }
- }
+ }
- if (validStreet && validZip && validCounty && validMunicipality) {
- setValid({
- ...valid,
- countyValid: validCounty,
- municipalityValid: validMunicipality,
- zipcodeValid: validZip,
- streetValid: validStreet
- })
-
- //If region is oslo the municipality is not set.
- if (region === "Oslo") {
- setAddress({
- ...address,
- street: street,
- county: region,
- municipality: region,
- zipcode: postcode
+ if (validStreet && validZip && validCounty && validMunicipality) {
+ setValid({
+ ...valid,
+ countyValid: validCounty,
+ municipalityValid: validMunicipality,
+ zipcodeValid: validZip,
+ streetValid: validStreet
})
+
+ //If region is oslo the municipality is not set.
+ if (region === "Oslo") {
+ setAddress({
+ ...address,
+ street: street,
+ county: region,
+ municipality: region,
+ zipcode: postcode
+ })
+ } else {
+ setAddress({...address, street: street, county: region, municipality: place, zipcode: postcode})
+ }
} else {
- setAddress({...address, street: street, county: region, municipality: place, zipcode: postcode})
+ setErrors({...errors, address: "You have entered an invalid address"})
}
- } else {
- setErrors({...errors, address: "You have entered an invalid address"})
+
+
}
+ ).then(() => setProjectDetails({
+ ...projectDetails,
+ longitude: long,
+ latitude: lat
+ }))
+ }catch (e) {
+ console.log(e)
+ }
- }
- ).then(() => setProjectDetails({
- ...projectDetails,
- longitude: long,
- latitude: lat
- }))
}
/**
@@ -491,6 +497,24 @@ export default function AddProjectFunc() {
</p>
</div>
+
+
+ <div className="col">
+ <p className={"input-field-text"}>Prosjekt status</p>
+ <select className={"form-select options"} onChange={(e) =>
+ setProjectDetails({...projectDetails, state: e.target.value})}>
+ <option defaultValue="">Velg her</option>
+ <option value={"Active"}>Aktiv</option>
+ <option value={"Inactive"}>Inaktiv</option>
+ <option value={"Upcoming"}>Kommende</option>
+ </select>
+ </div>
+
+
+
+
+
+
</div>
</div>
<div className="col">
diff --git a/webstillas/src/components/projects/mainProjectCard.js b/webstillas/src/components/projects/mainProjectCard.js
index 2e642f0c8cf3fd5da2a3c650ee5334ae3c8e9f5d..1d36533ca40dc833a8b6ee5216912c78c3bbfe7a 100644
--- a/webstillas/src/components/projects/mainProjectCard.js
+++ b/webstillas/src/components/projects/mainProjectCard.js
@@ -25,7 +25,7 @@ function CardElement(props) {
* @returns {Promise<void>}
*/
const DeleteProject = async () => {
- if (window.confirm("Are you sure you want to delete " + props.name + "?")) {
+ if (window.confirm("Er du sikker på at du vil slette? " + props.name + "?")) {
const deleteBody =
[
{
@@ -34,11 +34,11 @@ function CardElement(props) {
]
try {
await deleteModel(PROJECTS_URL, (deleteBody)).then(() =>
- window.alert("Sucsessfylly deleted project")
+ window.alert("Prosjektet er slettet")
)
await queryClient.invalidateQueries("allProjects")
} catch (e) {
- window.alert("Something wrong happened! Try again later")
+ window.alert("Noe gikk galt! Prøv igjen senere")
}
}
}