Merge branch 'main' into sprint-release

Deliverables/sprint-11/imp-squared-backlog.tsv

@@ -0,0 +1,24 @@
+Title	Assignees	Status	Priority	Estimate	Size	Iteration
+Stay on topic in Meetings		Done				
+Ingest more datasets and make them USABLE		Done				
+Cut down plans for the release		Done				
+Start to prioritize the final release		Done				
+Better concept for pull request: Discuss in meeting		Done				
+Plan mid-term release		Done				
+[Workshop] Checking out bugs before estimating them		Done				
+Documentation mainly on GitHub Wiki		Done				
+Read user story and acceptance during sprint review		Done				
+Smaller, atomic issues		Done				
+Frontend/Backend team communication		Done				
+Avoid pushing decsions to extra meetings		Done				
+Small follow-up summary messages after meetings		Done				
+Using our new milestones - epics - tickets structure		Done				
+Earlier feature preparation for sprint		Done				
+Have an (async) meeting: Better oncept for pull request review and merging		Done				
+Discuss deliverables sooner		Done				
+better testing for errors on pull reqeusts		Done				
+[Workshop] In Person Coding/Meetups		Done				
+Code review and code documentation		In Progress				
+[workshop] Accept you're not able to finish a task		In Progress				
+Start relaxing		In Progress				
+Team celebration of the final release (vote for date async)		In Progress				

README.md

@@ -1,6 +1,10 @@
 <div align="center">
   <div align="center" style="background-color:#0d1117; padding-bottom: 20px; border-radius:10px">
-    <img src="https://github.com/amosproj/amos2024ss04-building-information-enhancer/blob/main/Deliverables/sprint-01/team-logo.png?raw=true" width="400" alt="Code.ing Group Logo">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://github.com/amosproj/amos2024ss04-building-information-enhancer/blob/main/Deliverables/sprint-01/team-logo.png?raw=true">
+        <source media="(prefers-color-scheme: light)" srcset="https://github.com/amosproj/amos2024ss04-building-information-enhancer/blob/main/Deliverables/sprint-01/team-logo-black.png?raw=true">
+        <img src="https://github.com/amosproj/amos2024ss04-building-information-enhancer/blob/main/Deliverables/sprint-01/team-logo.png?raw=true" width="400" alt="Code.ing Group Logo">
+    </picture>
     </br>
   </div>
   <h1 style="padding:15px;border-bottom: 0;">Building Information Enhancer (AMOS SS 2024)</h1>
@@ -13,11 +17,15 @@
 
 ## 📢 About the Project
 
-Welcome to the official repository for the `CODE.ING` group, developing an open-source `Building Information Enhancer` software for the `BUILD.ING` partner and the `AMOS 2024` project. Together, we create a Building information system for potential energy savings. To read about the architecture of our service visit our GitHub [wiki](https://github.com/amosproj/amos2024ss04-building-information-enhancer/wiki).
+Welcome to the official repository for the `CODE.ING` group, developing an open-source `Building Information Enhancer` software for the `BUILD.ING` partner as a part of the `AMOS 2024` project. 
+
+The `BCI Building Information Enhancer` is a platform for individual building owners or industry professionals, allowing them to access information about specific addresses, locations, or regions. This information can be used for a variety of applications, from sustainability certifications for buildings, over calculating the solar power potential, up to aiding in district planning. In general, the BCI building information enhancer offers significant benefits for various stakeholders in the property market.
+
+For our project mission, the team agreed to create an MVP for the BCI Building Information Enhancer, the core functionality will be displaying data from a fixed number of sources, including satellite images, charging stations, and data needed for sustainability certification. Our goal is to build a practical and scalable tool that can grow with our users' needs. Finally, to read about the architecture of our service visit our [GitHub Wiki Pages](https://github.com/amosproj/amos2024ss04-building-information-enhancer/wiki).
 
 ## 🚀 Setup & Deployment
 
-This project is integrated with a full CI/CD pipeline, thus deployed automatically on the web. However, it is possible to deploy a production-ready system on your local machine using Docker. For further information on the `CI/CD` pipeline visit our GitHub [wiki](https://github.com/amosproj/amos2024ss04-building-information-enhancer/wiki/CI%E2%80%90CD-Pipeline) documentation.
+`BCI Building Information Enhancer` project is integrated with a full [CI-CD pipeline](https://github.com/amosproj/amos2024ss04-building-information-enhancer/wiki/CI%E2%80%90CD-Pipeline) and thus deployed  automatically for public use as a [BCI website](http://prod.amos.b-ci.de/) using servers provided by the industry partner. However, production servers might be turned off in the future, so it is also possible to deploy a production-ready system on your local machine using the provided Docker compose file.
 
 ## 📦 Deployment using Docker
 
@@ -28,7 +36,7 @@ To deploy the latest release of the project on your local machine using Docker E
 3. Run the `npm run deploy` command in the root folder of the repository. \*
 4. Connect to the frontend at port 80 (`localhost:80`).
 
-\* This command pulls the newest release of the images, if you want to build your local files, use `npm run deploy:build` instead.
+\* This command pulls the newest public release of the images, if you want to build your local files, use `npm run deploy:build` instead.
 
 ## 💻 Developement Deployment
 
@@ -37,18 +45,18 @@ In order to deploy and/or develop one or more services, follow the instructions
 ### Setup
 
 1. Clone this repository (https://github.com/amosproj/amos2024ss04-building-information-enhancer).
-2. Before deploying the project make sure you have installed the [Node.js](https://nodejs.org/en) ( >= 20.12.2) and [Dotnet SDK](https://dotnet.microsoft.com/en-us/download) ( >= 8.0.3).
+2. Before deploying the project make sure you have installed the [Node.js](https://nodejs.org/en) ( >= 20.12.2), [Dotnet SDK](https://dotnet.microsoft.com/en-us/download) ( >= 8.0.3) and a running [Docker Engine](https://docs.docker.com/engine/install/).
 3. Run the `npm run setup:<os>` command to download all necessary packages and build the services, replacing `<os>` with `windows`, `linux` or `macos` based on your operating system.
 
 ### Developement
 
-By following the micro-service architecture, each of the services can be deployed and developed separately. However, some of the services depend on each other. Follow instructions below to develop a specific service:
+By following the micro-service architecture, each of the services can be deployed and developed separately. However, some of the services depend on each other. Follow instructions below to develop a specific service. Finally, the recommender way to deploy individual services is the docker images.
 
-- **Frontend**: To develop the frontend service, one can run the `npm run deploy:frontend:dev` to deploy the VITE development server (with hot reloading). The code is located in the `frontend` folder. At a minimum, the frontend depends on the API Gateway and the MongoDB metadata database. If you want to query the datasets, the API Composer and the Geospatial DB needs to be deployed too.
-- **API Gateway**: To develop the C# API Gateway, first make your changes in the `backend/API-Gateway` folder and run inside of it the `dotnet build` command to build the executables. Finally, to run the Gateway run type the `dotnet run` command. The API Gateway can run on its own, however, to use one of its API endpoints, one needs to deploy the corresponding service (for more information about the endpoints, read our [System Architecture](https://github.com/amosproj/amos2024ss04-building-information-enhancer/wiki/System-Architecture) wiki page).
-- **API Composer**: Similarly to the API Gateway, go to the corresponding folder in the `backend` directory, make the changes, and run `dotnet build` and `dotnet run`.
-- **Data Pipeline**: Similarly to the API Gateway, go to the corresponding folder in the `backend` directory, make the changes, and run `dotnet build` and `dotnet run`.
-- **Metadata Database**: To deploy the MongoDB database one needs to use the Docker `docker compose up --build -d metadata-database` command in the root folder.
+- **Frontend**: To develop the frontend service, one can run the `npm run deploy:frontend:dev` to deploy the VITE development server (with hot reloading). The code is located in the `frontend` folder. At a minimum, the frontend depends on the API Gateway and the MongoDB metadata database. If you want to query the datasets, the API Composer and the Geospatial DB needs to be deployed too. To deploy the service as a container use `docker compose up --build -d frontend`
+- **API Gateway**: To develop the C# API Gateway, first make your changes in the `backend/API-Gateway` folder and run inside of it the `dotnet build` command to build the executables. Finally, to run the Gateway run type the `dotnet run` command. The API Gateway can run on its own, however, to use one of its API endpoints, one needs to deploy the corresponding service (for more information about the endpoints, read our [System Architecture](https://github.com/amosproj/amos2024ss04-building-information-enhancer/wiki/System-Architecture) wiki page). To deploy the service as a container use `docker compose up --build -d api-gateway`.
+- **API Composer**: Similarly to the API Gateway, go to the corresponding folder in the `backend` directory, make the changes, and run `dotnet build` and `dotnet run`. To deploy the service as a container use `docker compose up --build -d api-composer`.
+- **Data Pipeline**: Similarly to the API Gateway, go to the corresponding folder in the `backend` directory, make the changes, and run `dotnet build` and `dotnet run`. To deploy the service as a container use `docker compose up --build -d datapipeline`.
+- **Metadata Database**: To deploy the MongoDB database one needs to use the Docker `docker compose up --build -d metadata-database` command in the root folder. In order to change the metadata, edit the `init-db.js` file inside `backend/metadata-database` folder.
 - **Geospatial Databases**: To deploy the Geospatial databases one needs to use the Docker `docker compose up --build -d sql-database` command in the root folder.
 
 ## 👥 The Team

backend/lib/BieMetadata/MetadataObject.cs

@@ -7,13 +7,13 @@ public class MetadataObject
 {
     [BsonRepresentation(BsonType.ObjectId)]
     public string _id { get; set; } = string.Empty;
-    
+
     [BsonElement("basicData")]
     public BasicData basicData { get; set; } = new BasicData();
 
     [BsonElement("additionalData")]
     public AdditionalData additionalData { get; set; } = new AdditionalData();
-    
+
     /// <summary>
     /// The general and most important data about a dataset.
     /// </summary>
@@ -23,17 +23,17 @@ public class BasicData
         /// The Id of the dataset
         /// </summary>
         public string DatasetId { get; set; } = string.Empty;
-        
+
         /// <summary>
         /// The displayname of the dataset
         /// </summary>
         public string Name { get; set; } = string.Empty;
-        
+
         /// <summary>
         /// a short description of the dataset
         /// </summary>
         public string ShortDescription { get; set; } = string.Empty;
-        
+
         /// <summary>
         /// the icon used to display dataset
         /// </summary>
@@ -59,16 +59,16 @@ public class AdditionalData
         /// Zoom level is higher the closer you look at something. If current zoom level is below this, it shouldn't display any value.
         /// </summary>
         public int MinZoomLevel { get; set; } = 0;
-        
+
         /// <summary>
         /// The zoom threshold where areas start to turn into markers
         /// </summary>
         public int MarkersThreshold { get; set; } = 0;
 
         /// <summary>
-        /// A list of display properties that should be shown in a marker popup.
+        /// The display property is the property that should be shown in a popup.
         /// </summary>
-        public List<DisplayProperty> DisplayProperty { get; set; } = new List<DisplayProperty>();
+        public string DisplayProperty { get; set; } = string.Empty;
 
         /// <summary>
         /// Table data populated by the data pipeline. Contains the name and the size of the all .yaml files correlated to that specific dataset.
@@ -81,7 +81,7 @@ public class AdditionalData
         [BsonIgnoreIfNull] // Add this attribute to ignore null values
         public PolygonColoring? PolygonColoring { get; set; }
     }
-    
+
     /// <summary>
     /// Table data populated by the data pipeline. Contains the name and the size of the all .yaml files correlated to that specific dataset.
     /// </summary>
@@ -91,17 +91,17 @@ public class TableData
         /// the name of the table
         /// </summary>
         public string Name { get; set; } = string.Empty;
-        
+
         /// <summary>
         /// the number of lines in the table
         /// </summary>
         public int NumberOfLines { get; set; } = 0;
-        
+
         /// <summary>
         /// the bounding box of the geomtry data in the table
         /// </summary>
         public BoundingBox? BoundingBox { get; set; }
-        
+
         /// <summary>
         /// the headers of the dataset. Should NOT include the special Location header.
         /// </summary>

frontend/src/components/MapView/MapDatasetVisualizer.tsx

@@ -1,22 +1,20 @@
 import { useMap } from "react-leaflet";
-import { Fragment, useCallback, useContext, useEffect, useState } from "react";
-import { Feature, FeatureCollection, GeoJsonProperties, Point } from "geojson";
+import { useCallback, useContext, useEffect } from "react";
+import { FeatureCollection } from "geojson";
 import { MapContext } from "../../contexts/MapContext";
 import { TabsContext } from "../../contexts/TabsContext";
 import GeoDataFetcher from "./GeoDataFetcher";
-import L, { DivIcon, LatLng } from "leaflet";
+import L, { DivIcon } from "leaflet";
 import { LatLngBounds } from "leaflet";
 import "proj4leaflet";
 import "proj4";
 import { createRoot } from "react-dom/client";
 import { flushSync } from "react-dom";
 import { MapPin } from "@phosphor-icons/react";
-import { Dataset, DisplayProperty } from "../../types/DatasetTypes";
+import { Dataset } from "../../types/DatasetTypes";
 import { MarkersTypes } from "../../types/MarkersTypes";
 import { createDivIcon } from "../../utils/mergeIcons";
 import { convertPolygonsToMarkers } from "../../utils/polgonsToMarkers";
-import { Popup } from "react-leaflet/Popup";
-import { MarkerSelection } from "../../types/MapSelectionTypes";
 
 interface MapDatasetVisualizerProps {
   dataset: Dataset;
@@ -43,17 +41,8 @@ const MapDatasetVisualizer: React.FC<MapDatasetVisualizerProps> = ({
   dataset,
 }) => {
   const map = useMap();
-  const { currentMapCache, setCurrentMapCache } = useContext(MapContext);
-
+  const { currentMapCache } = useContext(MapContext);
   const { setCurrentTabsCache } = useContext(TabsContext);
-  const [popupData, setPopupData] = useState<Feature<
-    Point,
-    GeoJsonProperties
-  > | null>(null);
-  const [isPopupOpen, setIsPopupOpen] = useState(false);
-  const [latLngCoordinates, setLatLngCoordinates] = useState<LatLng>(
-    new LatLng(51.505, -0.09)
-  );
 
   /**
    * Updates the data for a specific dataset.
@@ -152,17 +141,16 @@ const MapDatasetVisualizer: React.FC<MapDatasetVisualizerProps> = ({
       } else {
         // Convert polygons to markers
         const markerData = convertPolygonsToMarkers(geoData);
-
         // Add the markers to the map instead
         const geojsonLayer = L.geoJson(markerData, {
           pointToLayer: function (_feature, latlng) {
-            const marker = L.marker(latlng, {
+            return L.marker(latlng, {
               icon: dataset.metaData
                 ? createDivIcon(dataset.metaData.icon)
                 : divIcondefault,
             });
-            return marker;
           },
+
           style: { fillOpacity: 0.1 },
         });
         const markerClusterGroup = L.markerClusterGroup();
@@ -177,28 +165,14 @@ const MapDatasetVisualizer: React.FC<MapDatasetVisualizerProps> = ({
       // For Markers type datasets
     } else {
       const geojsonLayer = L.geoJson(geoData, {
-        pointToLayer: function (feature, latlng) {
-          const marker = L.marker(latlng, {
+        pointToLayer: function (_feature, latlng) {
+          return L.marker(latlng, {
             icon: dataset.metaData
               ? createDivIcon(dataset.metaData.icon)
               : divIcondefault,
-          }).on("click", () => {
-            setPopupData(feature);
-            setIsPopupOpen(true);
-            setLatLngCoordinates(latlng);
-            // Select a marker on the map
-            const markerSelection = new MarkerSelection(
-              latlng,
-              "Custom Marker",
-              true
-            );
-            setCurrentMapCache((prevCache) => ({
-              ...prevCache,
-              selectedCoordinates: markerSelection,
-            }));
           });
-          return marker;
         },
+
         style: { fillOpacity: 0.1 },
       });
       const markerClusterGroup = L.markerClusterGroup();
@@ -210,61 +184,9 @@ const MapDatasetVisualizer: React.FC<MapDatasetVisualizerProps> = ({
         map.removeLayer(markerClusterGroup);
       };
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [dataset, currentMapCache.zoom, map, geoData]);
 
-  /**
-   * Creates a list of the properties for the popup data
-   * @param popupData the popup data object
-   * @param displayProperties the list of properties to display with displayName and value fields
-   * @returns a list of strings
-   */
-  const listProperties = (popupData: GeoJsonProperties): DisplayProperty[] => {
-    const listOfProperties: DisplayProperty[] = [];
-    if (popupData && dataset.metaData) {
-      for (const property in popupData.properties) {
-        if (
-          Object.prototype.hasOwnProperty.call(popupData.properties, property)
-        ) {
-          // Check if the property is in the displayProperties list
-          const displayProperty = dataset.metaData.displayProperty.find(
-            (dp) => dp.value === property
-          );
-          // If it is, format and push to the list
-          if (displayProperty) {
-            listOfProperties.push({
-              displayName: displayProperty.displayName,
-              value: String(popupData.properties[property]),
-            });
-          }
-        }
-      }
-    }
-    return listOfProperties;
-  };
-
-  return (
-    <>
-      {isPopupOpen && popupData && (
-        <Popup position={latLngCoordinates} offset={[0, -25]}>
-          {popupData.properties ? (
-            <Fragment>
-              {listProperties(popupData).map((displayProperty) => {
-                return (
-                  <div key={displayProperty.displayName}>
-                    <b>{displayProperty.displayName}: </b>
-                    <span>{displayProperty.value}</span>
-                  </div>
-                );
-              })}
-            </Fragment>
-          ) : (
-            <p>No data available</p>
-          )}
-        </Popup>
-      )}
-    </>
-  );
+  return null;
 };
 
 export default MapDatasetVisualizer;