diff --git a/src/views/Project/ProjectDetail.vue b/src/views/Project/ProjectDetail.vue
index 54b5a96c7c5902cecb74199e39d0ff6868a3fab7..af54519200e6519cd5db9bea736bb430a4651868 100644
--- a/src/views/Project/ProjectDetail.vue
+++ b/src/views/Project/ProjectDetail.vue
@@ -389,42 +389,51 @@ export default {
       this.featureTypeToDelete = featureType;
       this.OPEN_PROJECT_MODAL('deleteFeatureType');
     },
-
+    /**
+     * Initializes the map if the project is accessible and the user has view permissions.
+     * This method sets up the map, loads vector tile layers, and handles offline features.
+     */
     async initMap() {
+      // Check if the project is accessible and the user has view permissions
       if (this.project && this.permissions.can_view_project) {
+        // Initialize the map using the provided element reference
         await this.INITIATE_MAP({ el: this.$refs.map });
+        // Check for offline features
         this.checkForOfflineFeature();
+        // Define the URL for vector tile layers
         const mvtUrl = `${this.API_BASE_URL}features.mvt`;
-        mapService.addVectorTileLayer({
-          url: mvtUrl,
+        // Define parameters for loading layers
+        const params = {
           project_slug: this.slug,
           featureTypes: this.feature_types,
           queryParams: {
             ordering: this.project.feature_browsing_default_sort,
             filter: this.project.feature_browsing_default_filter,
-          }
+          },
+        };
+        // Add vector tile layers to the map
+        mapService.addVectorTileLayer({
+          url: mvtUrl,
+          ...params
         });
-
+        // Modify offline feature properties (setting color to 'red')
         this.arraysOffline.forEach((x) => (x.geojson.properties.color = 'red'));
+        // Extract offline features from arraysOffline
         const featuresOffline = this.arraysOffline.map((x) => x.geojson);
+        // Add offline features to the map if available
         if (featuresOffline && featuresOffline.length > 0) {
           mapService.addFeatures({
             addToMap: true,
-            project_slug: this.slug,
             features: featuresOffline,
-            featureTypes: this.feature_types,
-            queryParams: {
-              ordering: this.project.feature_browsing_default_sort,
-              filter: this.project.feature_browsing_default_filter,
-            },
+            ...params
           });
         }
-        
+        // Get the bounding box of features and fit the map to it
         featureAPI.getFeaturesBbox(this.slug).then((bbox) => {
           if (bbox) {
             mapService.fitBounds(bbox);
           }
-          this.mapLoading = false;
+          this.mapLoading = false; // Mark map loading as complete
         });
       }
     },