diff --git a/webstillas/src/components/mapPage/mapPage.js b/webstillas/src/components/mapPage/mapPage.js
index 63069804ed42f806dcacfc4cfab6a8a1ba975277..49ada1ce131e4732d9e56e3d0b3f0e670deffdd6 100644
--- a/webstillas/src/components/mapPage/mapPage.js
+++ b/webstillas/src/components/mapPage/mapPage.js
@@ -45,6 +45,7 @@ function MapPageClass(props) {
             {projectData.map(res => {
                 return (
                     <Marker
+                        key = {res.projectID}
                         offsetTop={-48}
                         offsetLeft={-24}
                         coordinates={[res.longitude, res.latitude]}
diff --git a/webstillas/src/components/projects/elements/Modal.js b/webstillas/src/components/projects/elements/Modal.js
index 9296a3a6119b4493331b80aa2fba138cc323bdcc..cb9a4b86debaa5705536853ca5e788985f9191a9 100644
--- a/webstillas/src/components/projects/elements/Modal.js
+++ b/webstillas/src/components/projects/elements/Modal.js
@@ -83,7 +83,7 @@ export default function InfoModalFunc(props) {
     const [scaffolding, setScaffolding] = useState(scaffoldingMove);
     const [ToProject, setToProject] = useState("");
     const [FromProject, setFromProject] = useState("");
-
+    const [buttonPressed, setButtonPressed] = useState(false)
 
     /**
      * Function to set quantity of scaffolding types
@@ -112,8 +112,10 @@ export default function InfoModalFunc(props) {
      * @returns {Promise<void>}
      */
     const AddScaffold = async () => {
+        setButtonPressed(true)
         try {
-            await putModel(TRANSFER_SCAFFOLDING, JSON.stringify(move))
+            const adding = await putModel(TRANSFER_SCAFFOLDING, JSON.stringify(move))
+            console.log(adding)
             await queryClient.resetQueries(["project", props.id])
         } catch (e) {
             if (e.text === "invalid body"){
@@ -172,7 +174,7 @@ export default function InfoModalFunc(props) {
                                     className={"form-select"}
                                     value={ToProject}
                                     onChange={(e) => setToProject(e.target.value)}>
-                                    <option selected defaultValue="">Choose here</option>
+                                    <option  defaultValue="">Choose here</option>
                                     <option value={0}>Storage</option>
                                     {jsonProjects?.map(e => {
                                         return (
@@ -187,11 +189,11 @@ export default function InfoModalFunc(props) {
                                     className={"form-select"}
                                     value={FromProject}
                                     onChange={(e) => setFromProject(e.target.value)}>
-                                    <option selected defaultValue="">Choose here</option>
+                                    <option  defaultValue="">Choose here</option>
                                     <option value={0}>Storage</option>
                                     {jsonProjects?.map(e => {
                                         return (
-                                            <option value={e.projectID}>{e.projectName}</option>
+                                            <option key={e.projectID} value={e.projectID}>{e.projectName}</option>
                                         )
                                     })}
                                 </select>
@@ -225,9 +227,29 @@ export default function InfoModalFunc(props) {
                         <Button variant="secondary" onClick={handleClose}>
                             Close
                         </Button>
-                        <Button variant="primary" disabled={!validFormat} onClick={AddScaffold}>
-                            Save Changes
-                        </Button>
+
+
+                        {buttonPressed ? <Button disabled>
+                                <Spinner
+                                    as="span"
+                                    animation="grow"
+                                    size="sm"
+                                    role="status"
+                                    aria-hidden="true"
+                                />
+                                Transferring...
+                            </Button> :
+                            <Button variant="primary" disabled={!validFormat} onClick={AddScaffold}>
+                                Save Changes
+                            </Button>}
+
+
+
+
+
+
+
+
                     </Modal.Footer>
                 </Modal>
             </>
diff --git a/webstillas/src/components/projects/elements/preView.js b/webstillas/src/components/projects/elements/preView.js
index fec37ef6d8502e8eaadd8a8be2ec350451468c9a..80378eb9c0d1646b5e8eb8a23778a531ee76f20f 100644
--- a/webstillas/src/components/projects/elements/preView.js
+++ b/webstillas/src/components/projects/elements/preView.js
@@ -6,7 +6,6 @@ import InfoModal from "./Modal";
 import {
     MAP_STYLE_V11,
     PROJECTS_URL_WITH_ID,
-    PROJECTS_WITH_SCAFFOLDING_URL,
     WITH_SCAFFOLDING_URL
 } from "../../../modelData/constantsFile";
 import img from "./../../mapPage/marker.png"
@@ -165,8 +164,6 @@ export const PreView = () => {
         return <InternalServerError />
     } else {
         const project = JSON.parse(data.text)
-
-
             return (
             <div className={"preView-Project-Main"}>
                 <div className={"map-preview"}>
diff --git a/webstillas/src/components/projects/projects.js b/webstillas/src/components/projects/projects.js
index 6f55896ccb0a6fac856ecc426ffd48d9370efcda..b8d32b9ab8a77b499a4cda0dc68fccea470e8560 100644
--- a/webstillas/src/components/projects/projects.js
+++ b/webstillas/src/components/projects/projects.js
@@ -12,7 +12,7 @@ import {InternalServerError} from "../error/error";
 /**
  Class that will create an overview of the projects
  */
-export function Project(){
+export function Project() {
     const [fromSize, setFromSize] = useState(0)
     const [toSize, setToSize] = useState(0)
 
@@ -22,37 +22,27 @@ export function Project(){
 
     const [startDate, setStartDate] = useState(null);
     const [endDate, setEndDate] = useState(null);
-    const [focusedInput, setFocusedInput] = useState(null);
-    const handleDatesChange = ({ startDate, endDate }) => {
-        setStartDate(startDate);
-        setEndDate(endDate);
-    };
-
-
-
-
-
 
 
     const {isLoading, data, isError} = GetDummyData("allProjects", PROJECTS_WITH_SCAFFOLDING_URL)
 
 
-
+    //If data is loading
     if (isLoading) {
-        return(
-            <SpinnerDefault />
+        return (
+            <SpinnerDefault/>
         )
-    } else if (isError){
+    } else if (isError) //If an error while fetching data has occurred
+        {
         return <InternalServerError/>
     } else {
         const allProjects = (JSON.parse(data.text))
-
         return (
             <div className={"main-project-window"}>
 
-                <div className={"main-sidebar"} >
+                <div className={"main-sidebar"}>
                     <div className={"search-filter"}>
-                        <p className = {"input-sorting-text"}>Status</p>
+                        <p className={"input-sorting-text"}>Status</p>
                         <select className={"form-select options"} onChange={(e) =>
                             setSelectedOption(e.target.value)}>
                             <option defaultValue="">Velg her</option>
@@ -62,7 +52,7 @@ export function Project(){
                         </select>
                     </div>
                     <div className={"search-filter"}>
-                        <p className = {"input-sorting-text"}>Prosjekt navn: </p>
+                        <p className={"input-sorting-text"}>Prosjekt navn: </p>
                         <input
                             className={"form-control"}
                             type="text"
@@ -73,7 +63,7 @@ export function Project(){
                             }}/>
                     </div>
                     <div className={"search-filter"}>
-                        <p className = {"input-sorting-text"}>Stillsmengde: </p>
+                        <p className={"input-sorting-text"}>Stillsmengde: </p>
                         <div className={"search-filter size"}>
                             <input
                                 className={"form-control size-search"}
@@ -95,7 +85,7 @@ export function Project(){
                         </div>
                     </div>
                     <div className={"date-filter"}>
-                        <p className = {"input-sorting-text"}>Fra dato: </p>
+                        <p className={"input-sorting-text"}>Fra dato: </p>
                         <input
                             className={"form-control"}
                             type="date"
@@ -104,7 +94,7 @@ export function Project(){
                             }}/>
                     </div>
                     <div className={"search-filter"}>
-                        <p className = {"input-sorting-text"}>Til dato: </p>
+                        <p className={"input-sorting-text"}>Til dato: </p>
                         <input
                             className={"form-control"}
                             type="date"
@@ -126,7 +116,7 @@ export function Project(){
                             })
                             .filter(data => {
                                 console.log(startDate)
-                                if (startDate !== null ) {
+                                if (startDate !== null) {
                                     return formatDate(data.period.startDate) >= formatDate(startDate)
                                 } else {
                                     return true
@@ -184,13 +174,22 @@ export function Project(){
 }
 
 
-
-export function formatDate (inputDate) {
+/**
+ * Function to format date from "mm-dd-yyyy" to "dd-mm-yyyy"
+ * @param inputDate in format "mm-dd-yyyy"
+ * @returns {Date} in format "dd-mm-yyyy"
+ */
+export function formatDate(inputDate) {
     const dateArray = inputDate.split('-')
     return new Date(dateArray[2] + '-' + dateArray[1] + '-' + dateArray[0])
 }
 
-export function formatDateToString (inputDate) {
+/**
+ * Function to format date from "mm-dd-yyyy" to "dd-mm-yyyy"
+ * @param inputDate in format "mm-dd-yyyy"
+ * @returns {string} in format "dd-mm-yyyy"
+ */
+export function formatDateToString(inputDate) {
     const dateArray = inputDate.split('-')
     return (dateArray[2] + '-' + dateArray[1] + '-' + dateArray[0])
 }
diff --git a/webstillas/src/components/scaffolding/elements/ModalScaffolding.js b/webstillas/src/components/scaffolding/elements/ModalScaffolding.js
index 53c470dcb9b8b0ee796c09e4d828e337ee069240..f057db5ec1341a0d7af2a2602eb01f87485c5057 100644
--- a/webstillas/src/components/scaffolding/elements/ModalScaffolding.js
+++ b/webstillas/src/components/scaffolding/elements/ModalScaffolding.js
@@ -8,7 +8,13 @@ import {PROJECTS_WITH_SCAFFOLDING_URL} from "../../../modelData/constantsFile";
 import "./Modalscaffolding.css"
 
 
-function ScaffoldingInProject(type, projects) {
+/**
+ * Function will return information about quantity of scaffolding in a specific project, including the end date of the project.
+ *
+ * @param type of scaffolding, the user would like more information about
+ * @returns {JSX.Element|*}
+ */
+function ScaffoldingInProject(type) {
 
     const {isLoading, data} = GetDummyData("allProjects", PROJECTS_WITH_SCAFFOLDING_URL)
     if (isLoading){
@@ -65,6 +71,12 @@ function ScaffoldingInProject(type, projects) {
 }
 
 
+/**
+ * Function will display a Modal, of with information of the projects that has the selected scaffolding types.
+ *
+ * @param props is type of scaffolding.
+ * @returns {JSX.Element}
+ */
 export default function InfoModal(props) {
     const [show, setShow] = useState(false);
     const handleClose = () => setShow(false);
diff --git a/webstillas/src/components/scaffolding/elements/scaffoldingCard.js b/webstillas/src/components/scaffolding/elements/scaffoldingCard.js
index 267dc4b2ae0bd7700b1479d66a570656c9c5cf3e..5781c30881a3ab8d3249994c5067b6d41ff3d4c4 100644
--- a/webstillas/src/components/scaffolding/elements/scaffoldingCard.js
+++ b/webstillas/src/components/scaffolding/elements/scaffoldingCard.js
@@ -3,7 +3,13 @@ import './scaffoldingCard.css'
 import InfoModal from "./ModalScaffolding";
 
 
-
+/**
+ * Will return an infromation card, where the user get information about how many of the specific
+ * scaffolding the storage has, including total amount that is in projects.
+ *
+ * @param props type of scaffolding
+ * @returns {JSX.Element}
+ */
 function CardElement(props){
     console.log(props.type)
     console.log(`../images/${props.type}.jpg`)
diff --git a/webstillas/src/components/scaffolding/elements/scaffoldingCardProject.js b/webstillas/src/components/scaffolding/elements/scaffoldingCardProject.js
index 37f3249bdaab3734a258425278a851218d3b6bad..d0c68fc9b9de206335d10cf634cb0fa14569c1f7 100644
--- a/webstillas/src/components/scaffolding/elements/scaffoldingCardProject.js
+++ b/webstillas/src/components/scaffolding/elements/scaffoldingCardProject.js
@@ -1,5 +1,12 @@
 import React from "react";
 
+
+/**
+ * Function that will display number of expected and registered scaffolding parts in the project.
+ *
+ * @param props wil return key, type, expected and registered, of that scaffolding
+ * @returns {JSX.Element}
+ */
 function ScaffoldingProject(props){
     return(
         <div className={"scaffoldingElement"}>