Add cityID in creation and update and edit some graphics in the map

Found a hibernate cascade issue and was fixed by reuse the existing collection instaed of creating a new one in updating the datacenter entity

docker-compose.yml

@@ -0,0 +1,39 @@
+services:
+  backend:
+    build:
+      context: ./sge-backend
+      dockerfile: Dockerfile
+    ports:
+      - "8080:8080"
+    env_file:
+      - ./config.conf
+    environment:
+      SPRING_PROFILES_ACTIVE: docker
+    depends_on:
+      - database
+    restart: unless-stopped  
+
+  frontend:
+    build:
+      context: ./sge-frontend
+      dockerfile: Dockerfile
+    ports:
+      - "80:80"
+    env_file:
+      - ./config.conf
+    restart: unless-stopped  
+
+  database:
+    image: postgres:15
+    environment:
+      POSTGRES_DB: sge
+      POSTGRES_USER: sge
+      POSTGRES_PASSWORD: 147
+    ports:
+      - "5432:5432"
+    volumes:
+      - postgres_data:/var/lib/postgresql/data
+    restart: unless-stopped  
+
+volumes:
+  postgres_data:

sge-backend/src/main/java/com/sgs/SgsApplication.java

@@ -121,7 +121,8 @@ public class SgsApplication implements CommandLineRunner {
 
     @Autowired
     public SgsApplication(RoleService roleService, PermissionService permissionService, RoleRepo roleRepo,
-            AreaService areaService, NeighborhoodRepo neighborhoodRepo, NeighborhoodService neighborhoodService, CityService cityService,
+            AreaService areaService, NeighborhoodRepo neighborhoodRepo, NeighborhoodService neighborhoodService,
+            CityService cityService,
             CityRepo cityRepo, DistrictRepo districtRepo, DistrictService districtService, CountryRepo countryRepo,
             CountryService countryService, OrganizationService organizationService, UserService userService,
             PasswordEncoder passwordEncoder, SectorService sectorService, SubSectorService subSectorService,
@@ -858,6 +859,7 @@ public class SgsApplication implements CommandLineRunner {
         }
         if (cityService.findAll().isEmpty()) {
             createCitiesFromJson();
+            createDefaultArea();
         }
         if (districtService.findAll().isEmpty()) {
             createDistrictFromJson();
@@ -865,9 +867,6 @@ public class SgsApplication implements CommandLineRunner {
         if (neighborhoodService.findAll().isEmpty()) {
             createNeighborhoodsFromJson();
         }
-        if (!cityService.findAll().isEmpty()) {
-            createDefaultArea();
-        }
     }
 
     void createDefaultArea() {

sge-backend/src/main/java/com/sgs/graphql/dataCenter/domain/DataCenter.java

@@ -1,4 +1,5 @@
 package com.sgs.graphql.dataCenter.domain;
+
 import com.fasterxml.jackson.annotation.JsonBackReference;
 import com.fasterxml.jackson.annotation.JsonManagedReference;
 import com.sgs.graphql.area.domain.Area;
@@ -15,7 +16,6 @@ import org.hibernate.annotations.LazyCollection;
 import org.hibernate.annotations.LazyCollectionOption;
 import org.hibernate.annotations.Fetch;
 import org.hibernate.annotations.FetchMode;
-import org.springframework.transaction.annotation.Transactional;
 
 import java.util.ArrayList;
 import java.util.List;
@@ -46,9 +46,7 @@ public class DataCenter extends BaseDomain {
     private Double latitude;
     private Double longitude;
 
-
     @Column(name = "data_center_name")
-    @Transactional
     public String getDataCenter() {
         return dataCenter;
     }
@@ -96,7 +94,6 @@ public class DataCenter extends BaseDomain {
         this.number = number;
     }
 
-
     @ManyToOne(fetch = FetchType.EAGER)
     @JoinColumn(name = "sector_id")
     public Sector getSector() {

sge-backend/src/main/java/com/sgs/graphql/dataCenter/mutation/DataCenterMutation.java

@@ -1,18 +1,26 @@
 package com.sgs.graphql.dataCenter.mutation;
 
+import com.sgs.exception.GraphQLCustomException;
 import com.sgs.graphql.dataCenter.mutation.mapper.DataCenterMapper;
 import com.sgs.graphql.dataCenter.service.DataCenterService;
 import com.sgs.graphql.dataCenter.domain.DataCenter;
 import com.sgs.graphql.dataCenter.mutation.input.DataCenterCreateInput;
 import com.sgs.graphql.dataCenter.mutation.input.DataCenterUpdateInput;
 import com.sgs.graphql.permission.domain.PermissionName;
+import com.sgs.graphql.systemHistory.enums.LogType;
+import com.sgs.graphql.systemHistory.mutation.SystemLogger;
+import com.sgs.graphql.userHistory.mutation.UserLogger;
+import com.sgs.graphql.userNotification.mutation.UserNotificationMutation;
 import graphql.kickstart.tools.GraphQLMutationResolver;
+import graphql.schema.DataFetchingEnvironment;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.stereotype.Component;
 import org.springframework.validation.annotation.Validated;
 
+import javax.transaction.Transactional;
 import javax.validation.Valid;
+import java.util.NoSuchElementException;
 import java.util.UUID;
 
 @Validated
@@ -21,57 +29,128 @@ public class DataCenterMutation implements GraphQLMutationResolver {
 
     private final DataCenterService dataCenterService;
     private final DataCenterMapper dataCenterMapper;
+    private final SystemLogger systemLogger;
+    private final UserLogger userLogger;
+    private final UserNotificationMutation notificationMutation;
 
     @Autowired
-    public DataCenterMutation(DataCenterService dataCenterService, DataCenterMapper dataCenterMapper) {
+    public DataCenterMutation(DataCenterService dataCenterService, DataCenterMapper dataCenterMapper,
+            SystemLogger systemLogger, UserLogger userLogger,
+            UserNotificationMutation notificationMutation) {
         this.dataCenterService = dataCenterService;
         this.dataCenterMapper = dataCenterMapper;
+        this.systemLogger = systemLogger;
+        this.userLogger = userLogger;
+        this.notificationMutation = notificationMutation;
     }
 
     @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_CREATE + "')")
-    public DataCenter createDataCenter(@Valid DataCenterCreateInput input) {
+    @Transactional
+    public DataCenter createDataCenter(@Valid DataCenterCreateInput input, DataFetchingEnvironment environment) {
+        try {
             // Check for duplicate externalId
             if (input.getExternalId() != null && dataCenterService.existsByExternalId(input.getExternalId())) {
-            throw new RuntimeException("This external id already exists: " + input.getExternalId());
+                throw new GraphQLCustomException("2010", input.getExternalId().toString());
             }
 
             DataCenter dataCenter = dataCenterMapper.toEntity(input);
 
             // Set auto-generated number if not provided
             if (dataCenter.getNumber() == null) {
-            Integer maxNumber = dataCenterService.getRepository().findMaxNumber();
+                Integer maxNumber = dataCenterService.findMaxNumber();
                 dataCenter.setNumber((maxNumber == null) ? 1 : maxNumber + 1);
             }
 
-        return dataCenterService.save(dataCenter);
+            DataCenter savedDataCenter = dataCenterService.save(dataCenter);
+
+            // Log and notify
+            String dataCenterName = savedDataCenter.getDataCenter() != null ? savedDataCenter.getDataCenter()
+                    : "DataCenter #" + savedDataCenter.getNumber();
+            systemLogger.createSystemLog(LogType.INFO, dataCenterName + " adlı veri merkezi oluşturuldu");
+            userLogger.createUserLog(LogType.INFO, dataCenterName + " adlı veri merkezi oluşturuldu", environment);
+            notificationMutation.createNotification(environment, "Veri Merkezi",
+                    dataCenterName + " adlı veri merkezi oluşturuldu", "Yeni kayıt");
+
+            return savedDataCenter;
+        } catch (GraphQLCustomException e) {
+            throw e;
+        } catch (Exception e) {
+            systemLogger.createSystemLog(LogType.ERROR,
+                    "Yeni veri merkezi oluşturulurken hata oluştu: " + e.getMessage());
+            throw e;
+        }
     }
 
     @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_UPDATE + "')")
-    public DataCenter updateDataCenter(UUID id, @Valid DataCenterUpdateInput input) {
-        return dataCenterService.findById(id)
-                .map(dataCenter -> {
+    @Transactional
+    public DataCenter updateDataCenter(UUID id, @Valid DataCenterUpdateInput input,
+            DataFetchingEnvironment environment) {
+        try {
+            DataCenter dataCenter = dataCenterService.findById(id)
+                    .orElseThrow(() -> new NoSuchElementException("Data center not found with ID: " + id));
+
             // Check for duplicate externalId if it's being updated
             if (input.getExternalId() != null &&
                     !input.getExternalId().equals(dataCenter.getExternalId()) &&
                     dataCenterService.existsByExternalId(input.getExternalId())) {
-                        throw new RuntimeException("This external id already exists: " + input.getExternalId());
+                throw new GraphQLCustomException("2010", input.getExternalId().toString());
+            }
+
+            DataCenter updatedDataCenter = dataCenterService.update(dataCenterMapper.updateEntity(dataCenter, input));
+
+            // Log and notify
+            String dataCenterName = updatedDataCenter.getDataCenter() != null ? updatedDataCenter.getDataCenter()
+                    : "DataCenter #" + updatedDataCenter.getNumber();
+            systemLogger.createSystemLog(LogType.INFO, dataCenterName + " adlı veri merkezi güncellendi");
+            userLogger.createUserLog(LogType.INFO, dataCenterName + " adlı veri merkezi güncellendi", environment);
+            notificationMutation.createNotification(environment, "Veri Merkezi",
+                    dataCenterName + " adlı veri merkezi güncellendi", "Güncelleme");
+
+            return updatedDataCenter;
+        } catch (GraphQLCustomException e) {
+            throw e;
+        } catch (NoSuchElementException e) {
+            systemLogger.createSystemLog(LogType.ERROR, "Veri merkezi bulunamadı: " + id);
+            throw e;
+        } catch (Exception e) {
+            systemLogger.createSystemLog(LogType.ERROR, "Veri merkezi güncellenirken hata oluştu: " + e.getMessage());
+            throw e;
         }
-                    return dataCenterService.update(dataCenterMapper.updateEntity(dataCenter, input));
-                })
-                .orElseThrow(() -> new RuntimeException("Data center not found with ID: " + id));
     }
 
     @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_DELETE + "')")
-    public Boolean deleteDataCenter(UUID id) {
+    @Transactional
+    public String deleteDataCenter(UUID id, DataFetchingEnvironment environment) {
+        String dataCenterName = "";
         try {
             DataCenter dataCenter = dataCenterService.findById(id)
-                    .orElseThrow(() -> new RuntimeException("Data center not found with ID: " + id));
+                    .orElseThrow(() -> new NoSuchElementException("Data center not found with ID: " + id));
+
+            dataCenterName = dataCenter.getDataCenter() != null ? dataCenter.getDataCenter()
+                    : "DataCenter #" + dataCenter.getNumber();
+
+            // Check if data center has physical machines or other dependencies
+            if (dataCenter.getPhysicalMachines() != null && !dataCenter.getPhysicalMachines().isEmpty()) {
+                String message = "Silinmeye çalışılan veri merkezinin fiziksel makineleri olduğu için silinememektedir";
+                systemLogger.createSystemLog(LogType.WARN, dataCenterName + ": " + message);
+                return message;
+            }
 
             dataCenterService.delete(dataCenter);
-            return true;
+
+            // Log and notify
+            systemLogger.createSystemLog(LogType.INFO, dataCenterName + " adlı veri merkezi silindi");
+            userLogger.createUserLog(LogType.INFO, dataCenterName + " adlı veri merkezi silindi", environment);
+            notificationMutation.createNotification(environment, "Veri Merkezi",
+                    dataCenterName + " adlı veri merkezi silindi", "Silme");
+
+            return "true";
+        } catch (NoSuchElementException e) {
+            systemLogger.createSystemLog(LogType.ERROR, "Veri merkezi bulunamadı: " + id);
+            return "false";
         } catch (Exception e) {
-            System.out.println("DataCenter deletion error: " + e.getMessage());
-            return false;
+            systemLogger.createSystemLog(LogType.ERROR, "Veri merkezi silinirken hata oluştu: " + e.getMessage());
+            return "false";
         }
     }
 }

sge-backend/src/main/java/com/sgs/graphql/dataCenter/mutation/input/DataCenterCreateInput.java

@@ -16,7 +16,6 @@ public class DataCenterCreateInput extends BaseCreateInput {
     private Integer number;
     private Double consuptionAmount;
     
-    @NotNull(message = "Alan ID gereklidir")
     private UUID areaId;
     
     private UUID cityId;

sge-backend/src/main/java/com/sgs/graphql/dataCenter/mutation/input/DataCenterUpdateInput.java

@@ -4,6 +4,8 @@ import com.sgs.lib.dao.mutation.input.BaseUpdateInput;
 import java.util.List;
 import java.util.UUID;
 
+import javax.validation.constraints.NotNull;
+
 public class DataCenterUpdateInput extends BaseUpdateInput {
     private String dataCenter;
     private Integer externalId;
@@ -12,6 +14,7 @@ public class DataCenterUpdateInput extends BaseUpdateInput {
     
     private UUID areaId;
     private UUID cityId;
+    @NotNull(message = "Sektör ID gereklidir")
     private UUID sectorId;
     private UUID subSectorId;
     private UUID emissionScopeId;

sge-backend/src/main/java/com/sgs/graphql/dataCenter/mutation/mapper/DataCenterMapper.java

@@ -97,16 +97,19 @@ public class DataCenterMapper extends BaseCreateUpdateMapper<DataCenter, DataCen
 
                 // Set EmissionSource
                 if (emissionSourceInput.getEmissionSourceId() != null) {
-                    dcEmissionSource.setEmissionSource(emissionSourceService.findById(UUID.fromString(emissionSourceInput.getEmissionSourceId())).orElse(null));
+                    dcEmissionSource.setEmissionSource(emissionSourceService
+                            .findById(UUID.fromString(emissionSourceInput.getEmissionSourceId())).orElse(null));
                 }
 
                 // Set ConsuptionUnit
                 if (emissionSourceInput.getConsuptionUnitId() != null) {
-                    dcEmissionSource.setConsuptionUnit(consuptionUnitService.findById(UUID.fromString(emissionSourceInput.getConsuptionUnitId())).orElse(null));
+                    dcEmissionSource.setConsuptionUnit(consuptionUnitService
+                            .findById(UUID.fromString(emissionSourceInput.getConsuptionUnitId())).orElse(null));
                 }
 
                 // Set optional fields
-                dcEmissionSource.setIsDefault(emissionSourceInput.getIsDefault() != null ? emissionSourceInput.getIsDefault() : false);
+                dcEmissionSource.setIsDefault(
+                        emissionSourceInput.getIsDefault() != null ? emissionSourceInput.getIsDefault() : false);
                 dcEmissionSource.setPercentage(emissionSourceInput.getPercentage());
 
                 dataCenterEmissionSources.add(dcEmissionSource);
@@ -163,28 +166,31 @@ public class DataCenterMapper extends BaseCreateUpdateMapper<DataCenter, DataCen
 
         // Handle multiple emission sources update if provided
         if (input.getDataCenterEmissionSources() != null) {
-            // Clear existing emission sources and add new ones
+            // Clear existing emission sources from the managed collection
             entity.getDataCenterEmissionSources().clear();
 
-            List<DataCenterEmissionSource> dataCenterEmissionSources = new ArrayList<>();
+            // Add new emission sources to the same managed collection
             for (DataCenterEmissionSourceInput emissionSourceInput : input.getDataCenterEmissionSources()) {
                 DataCenterEmissionSource dcEmissionSource = new DataCenterEmissionSource();
                 dcEmissionSource.setDataCenter(entity);
 
                 if (emissionSourceInput.getEmissionSourceId() != null) {
-                    dcEmissionSource.setEmissionSource(emissionSourceService.findById(UUID.fromString(emissionSourceInput.getEmissionSourceId())).orElse(null));
+                    dcEmissionSource.setEmissionSource(emissionSourceService
+                            .findById(UUID.fromString(emissionSourceInput.getEmissionSourceId())).orElse(null));
                 }
 
                 if (emissionSourceInput.getConsuptionUnitId() != null) {
-                    dcEmissionSource.setConsuptionUnit(consuptionUnitService.findById(UUID.fromString(emissionSourceInput.getConsuptionUnitId())).orElse(null));
+                    dcEmissionSource.setConsuptionUnit(consuptionUnitService
+                            .findById(UUID.fromString(emissionSourceInput.getConsuptionUnitId())).orElse(null));
                 }
 
-                dcEmissionSource.setIsDefault(emissionSourceInput.getIsDefault() != null ? emissionSourceInput.getIsDefault() : false);
+                dcEmissionSource.setIsDefault(
+                        emissionSourceInput.getIsDefault() != null ? emissionSourceInput.getIsDefault() : false);
                 dcEmissionSource.setPercentage(emissionSourceInput.getPercentage());
 
-                dataCenterEmissionSources.add(dcEmissionSource);
+                // Add to the existing managed collection instead of creating a new one
+                entity.getDataCenterEmissionSources().add(dcEmissionSource);
             }
-            entity.setDataCenterEmissionSources(dataCenterEmissionSources);
         }
 
         // New attributes (partial update - only if provided)

sge-backend/src/main/java/com/sgs/graphql/dataCenter/query/DataCenterQueryResolver.java

@@ -11,17 +11,16 @@ import javax.transaction.Transactional;
 import org.apache.commons.lang3.ObjectUtils;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.data.domain.Sort;
+import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.stereotype.Component;
 
-import com.sgs.graphql.auth.service.AuthorizationService;
 import com.sgs.graphql.dataCenter.domain.DataCenter;
 import com.sgs.graphql.dataCenter.domain.PhysicalMachine;
 import com.sgs.graphql.dataCenter.query.pagination.DataCenterPageable;
-import com.sgs.graphql.dataCenter.repo.DataCenterRepo;
-import com.sgs.graphql.dataCenter.repo.PhysicalMachineRepo;
 import com.sgs.graphql.dataCenter.repo.criteria.DataCenterCriteria;
 import com.sgs.graphql.dataCenter.service.DataCenterService;
-import com.sgs.graphql.systemHistory.mutation.SystemLogger;
+import com.sgs.graphql.dataCenter.service.PhysicalMachineService;
+import com.sgs.graphql.permission.domain.PermissionName;
 import com.sgs.lib.dao.query.pagination.Pagination;
 import com.sgs.lib.dao.query.sort.SortBy;
 
@@ -30,48 +29,46 @@ import graphql.kickstart.tools.GraphQLQueryResolver;
 @Component
 public class DataCenterQueryResolver implements GraphQLQueryResolver {
 
-    private final DataCenterService DataCenterService;
-    private final DataCenterRepo dataCenterRepo;
-    private final PhysicalMachineRepo physicalMachineRepo;
-    private final AuthorizationService authorizationService;
-    private final SystemLogger systemLogger;
+    private final DataCenterService dataCenterService;
+    private final PhysicalMachineService physicalMachineService;
 
     @Autowired
-    public DataCenterQueryResolver(AuthorizationService authorizationService, SystemLogger systemLogger, DataCenterService DataCenterService, DataCenterRepo dataCenterRepo, PhysicalMachineRepo physicalMachineRepo) {
-        this.DataCenterService = DataCenterService;
-        this.dataCenterRepo = dataCenterRepo;
-        this.physicalMachineRepo = physicalMachineRepo;
-        this.authorizationService = authorizationService;
-        this.systemLogger = systemLogger;
+    public DataCenterQueryResolver(DataCenterService dataCenterService, PhysicalMachineService physicalMachineService) {
+        this.dataCenterService = dataCenterService;
+        this.physicalMachineService = physicalMachineService;
     }
 
+    @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_READ + "')")
     public DataCenter dataCenter(UUID id) {
-        return DataCenterService.findById(id).orElse(null);
+        return dataCenterService.findById(id).orElse(null);
     }
 
     @Transactional
+    @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_READ + "')")
     public List<DataCenter> dataCenters(DataCenterCriteria criteria, List<SortBy> sortBy) {
-        List<DataCenter> dataCenters = DataCenterService.filterWithSort(ObjectUtils.defaultIfNull(criteria, new DataCenterCriteria()),
+        return dataCenterService.filterWithSort(ObjectUtils.defaultIfNull(criteria, new DataCenterCriteria()),
                 Sort.by(ObjectUtils.defaultIfNull(sortBy, new ArrayList<SortBy>())
                         .stream()
                         .map(SortBy::toOrder)
                         .collect(Collectors.toList())));
-
-        return dataCenters;
     }
 
-    public DataCenterPageable paginateDataCenters(Pagination pagination, DataCenterCriteria criteria, List<SortBy> sortBy) {
-        return new DataCenterPageable(DataCenterService.filterWithPaginate(ObjectUtils.defaultIfNull(criteria, new DataCenterCriteria()),
+    @PreAuthorize("hasAuthority('" + PermissionName.PAGINATE_DATACENTERS_GET + "')")
+    public DataCenterPageable paginateDataCenters(Pagination pagination, DataCenterCriteria criteria,
+            List<SortBy> sortBy) {
+        return new DataCenterPageable(
+                dataCenterService.filterWithPaginate(ObjectUtils.defaultIfNull(criteria, new DataCenterCriteria()),
                         Pagination.toPageRequest(pagination, sortBy)));
     }
 
-
-    public Optional<DataCenter> getByNumber(Integer id) {
-        return dataCenterRepo.findByNumber(id).stream().findFirst();
+    @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_READ + "')")
+    public Optional<DataCenter> getByNumber(Integer number) {
+        return dataCenterService.findByNumber(number);
     }
 
+    @PreAuthorize("hasAuthority('" + PermissionName.DATA_CENTER_READ + "')")
     public List<PhysicalMachine> physicalMachines(UUID datacenterId) {
-        return physicalMachineRepo.findByDatacenterId(datacenterId);
+        return physicalMachineService.findByDatacenterId(datacenterId);
     }
 
 }

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/DataCenterEmissionSourceRepo.java

@@ -2,7 +2,8 @@ package com.sgs.graphql.dataCenter.repo;
 
 import com.sgs.graphql.dataCenter.domain.DataCenter;
 import com.sgs.graphql.dataCenter.domain.DataCenterEmissionSource;
-import org.springframework.data.jpa.repository.JpaRepository;
+import com.sgs.lib.dao.repo.BaseRepo;
+
 import org.springframework.data.jpa.repository.Query;
 import org.springframework.data.repository.query.Param;
 import org.springframework.stereotype.Repository;
@@ -11,7 +12,7 @@ import java.util.List;
 import java.util.Optional;
 
 @Repository
-public interface DataCenterEmissionSourceRepo extends JpaRepository<DataCenterEmissionSource, String> {
+public interface DataCenterEmissionSourceRepo extends BaseRepo<DataCenterEmissionSource> {
 
     List<DataCenterEmissionSource> findByDataCenter(DataCenter dataCenter);
 

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/criteria/DataCenterEmissionSourceCriteria.java

@@ -0,0 +1,6 @@
+package com.sgs.graphql.dataCenter.repo.criteria;
+
+import com.sgs.lib.dao.repo.criteria.BaseCriteria;
+
+public class DataCenterEmissionSourceCriteria extends BaseCriteria {
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/criteria/PhysicalMachineCriteria.java

@@ -0,0 +1,6 @@
+package com.sgs.graphql.dataCenter.repo.criteria;
+
+import com.sgs.lib.dao.repo.criteria.BaseCriteria;
+
+public class PhysicalMachineCriteria extends BaseCriteria {
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/criteria/VMCriteria.java

@@ -0,0 +1,6 @@
+package com.sgs.graphql.dataCenter.repo.criteria;
+
+import com.sgs.lib.dao.repo.criteria.BaseCriteria;
+
+public class VMCriteria extends BaseCriteria {
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/criteria/spec/DataCenterEmissionSourceCriteriaSpec.java

@@ -0,0 +1,17 @@
+package com.sgs.graphql.dataCenter.repo.criteria.spec;
+
+import com.sgs.graphql.dataCenter.domain.DataCenterEmissionSource;
+import com.sgs.graphql.dataCenter.repo.criteria.DataCenterEmissionSourceCriteria;
+import com.sgs.lib.dao.repo.criteria.spec.BaseCriteriaSpec;
+import org.springframework.data.jpa.domain.Specification;
+import org.springframework.stereotype.Component;
+
+@Component
+public class DataCenterEmissionSourceCriteriaSpec
+        extends BaseCriteriaSpec<DataCenterEmissionSource, DataCenterEmissionSourceCriteria> {
+
+    @Override
+    public Specification<DataCenterEmissionSource> createForAll(DataCenterEmissionSourceCriteria criteria) {
+        return null;
+    }
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/criteria/spec/PhysicalMachineCriteriaSpec.java

@@ -0,0 +1,16 @@
+package com.sgs.graphql.dataCenter.repo.criteria.spec;
+
+import com.sgs.graphql.dataCenter.domain.PhysicalMachine;
+import com.sgs.graphql.dataCenter.repo.criteria.PhysicalMachineCriteria;
+import com.sgs.lib.dao.repo.criteria.spec.BaseCriteriaSpec;
+import org.springframework.data.jpa.domain.Specification;
+import org.springframework.stereotype.Component;
+
+@Component
+public class PhysicalMachineCriteriaSpec extends BaseCriteriaSpec<PhysicalMachine, PhysicalMachineCriteria> {
+
+    @Override
+    public Specification<PhysicalMachine> createForAll(PhysicalMachineCriteria criteria) {
+        return null;
+    }
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/repo/criteria/spec/VMCriteriaSpec.java

@@ -0,0 +1,16 @@
+package com.sgs.graphql.dataCenter.repo.criteria.spec;
+
+import com.sgs.graphql.dataCenter.domain.VM;
+import com.sgs.graphql.dataCenter.repo.criteria.VMCriteria;
+import com.sgs.lib.dao.repo.criteria.spec.BaseCriteriaSpec;
+import org.springframework.data.jpa.domain.Specification;
+import org.springframework.stereotype.Component;
+
+@Component
+public class VMCriteriaSpec extends BaseCriteriaSpec<VM, VMCriteria> {
+
+    @Override
+    public Specification<VM> createForAll(VMCriteria criteria) {
+        return null;
+    }
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/service/DataCenterEmissionSourceService.java

@@ -0,0 +1,40 @@
+package com.sgs.graphql.dataCenter.service;
+
+import com.sgs.graphql.dataCenter.domain.DataCenter;
+import com.sgs.graphql.dataCenter.domain.DataCenterEmissionSource;
+import com.sgs.graphql.dataCenter.repo.DataCenterEmissionSourceRepo;
+import com.sgs.graphql.dataCenter.repo.criteria.DataCenterEmissionSourceCriteria;
+import com.sgs.graphql.dataCenter.repo.criteria.spec.DataCenterEmissionSourceCriteriaSpec;
+import com.sgs.lib.dao.service.BaseService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+import java.util.Optional;
+
+@Service
+public class DataCenterEmissionSourceService extends
+        BaseService<DataCenterEmissionSource, DataCenterEmissionSourceRepo, DataCenterEmissionSourceCriteria, DataCenterEmissionSourceCriteriaSpec> {
+
+    @Autowired
+    public DataCenterEmissionSourceService(DataCenterEmissionSourceRepo repository,
+            DataCenterEmissionSourceCriteriaSpec criteriaSpec) {
+        super(repository, criteriaSpec);
+    }
+
+    public List<DataCenterEmissionSource> findByDataCenter(DataCenter dataCenter) {
+        return getRepository().findByDataCenter(dataCenter);
+    }
+
+    public Optional<DataCenterEmissionSource> findByDataCenterAndIsDefaultTrue(DataCenter dataCenter) {
+        return getRepository().findByDataCenterAndIsDefaultTrue(dataCenter);
+    }
+
+    public List<DataCenterEmissionSource> findByDataCenterId(String dataCenterId) {
+        return getRepository().findByDataCenterId(dataCenterId);
+    }
+
+    public void deleteByDataCenter(DataCenter dataCenter) {
+        getRepository().deleteByDataCenter(dataCenter);
+    }
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/service/DataCenterService.java

@@ -8,8 +8,11 @@ import com.sgs.lib.dao.service.BaseService;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 
+import java.util.Optional;
+
 @Service
-public class DataCenterService extends BaseService<DataCenter, DataCenterRepo, DataCenterCriteria, DataCenterCriteriaSpec> {
+public class DataCenterService
+        extends BaseService<DataCenter, DataCenterRepo, DataCenterCriteria, DataCenterCriteriaSpec> {
 
     @Autowired
     public DataCenterService(DataCenterRepo repository, DataCenterCriteriaSpec criteriaSpec) {
@@ -19,4 +22,12 @@ public class DataCenterService extends BaseService<DataCenter, DataCenterRepo, D
     public boolean existsByExternalId(Integer externalId) {
         return getRepository().existsByExternalId(externalId);
     }
+
+    public Optional<DataCenter> findByNumber(Integer number) {
+        return getRepository().findByNumber(number);
+    }
+
+    public Integer findMaxNumber() {
+        return getRepository().findMaxNumber();
+    }
 }

sge-backend/src/main/java/com/sgs/graphql/dataCenter/service/PhysicalMachineService.java

@@ -0,0 +1,26 @@
+package com.sgs.graphql.dataCenter.service;
+
+import com.sgs.graphql.dataCenter.domain.PhysicalMachine;
+import com.sgs.graphql.dataCenter.repo.PhysicalMachineRepo;
+import com.sgs.graphql.dataCenter.repo.criteria.PhysicalMachineCriteria;
+import com.sgs.graphql.dataCenter.repo.criteria.spec.PhysicalMachineCriteriaSpec;
+import com.sgs.lib.dao.service.BaseService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+import java.util.UUID;
+
+@Service
+public class PhysicalMachineService extends
+        BaseService<PhysicalMachine, PhysicalMachineRepo, PhysicalMachineCriteria, PhysicalMachineCriteriaSpec> {
+
+    @Autowired
+    public PhysicalMachineService(PhysicalMachineRepo repository, PhysicalMachineCriteriaSpec criteriaSpec) {
+        super(repository, criteriaSpec);
+    }
+
+    public List<PhysicalMachine> findByDatacenterId(UUID datacenterId) {
+        return getRepository().findByDatacenterId(datacenterId);
+    }
+}

sge-backend/src/main/java/com/sgs/graphql/dataCenter/service/VMService.java

@@ -0,0 +1,29 @@
+package com.sgs.graphql.dataCenter.service;
+
+import com.sgs.graphql.dataCenter.domain.VM;
+import com.sgs.graphql.dataCenter.repo.VMRepo;
+import com.sgs.graphql.dataCenter.repo.criteria.VMCriteria;
+import com.sgs.graphql.dataCenter.repo.criteria.spec.VMCriteriaSpec;
+import com.sgs.lib.dao.service.BaseService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+import java.util.Optional;
+
+@Service
+public class VMService extends BaseService<VM, VMRepo, VMCriteria, VMCriteriaSpec> {
+
+    @Autowired
+    public VMService(VMRepo repository, VMCriteriaSpec criteriaSpec) {
+        super(repository, criteriaSpec);
+    }
+
+    public List<VM> findAllByVmName(String vmName) {
+        return getRepository().findAllByVmName(vmName);
+    }
+
+    public Optional<VM> findFirstByVmNameOrderByIdDesc(String vmName) {
+        return getRepository().findFirstByVmNameOrderByIdDesc(vmName);
+    }
+}

sge-backend/src/main/java/com/sgs/graphql/mainDataTable/service/MainDataTableService.java

@@ -22,7 +22,8 @@ import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 
 @Service
-public class MainDataTableService extends BaseService<MainDataTable, MainDataTableRepo, MainDataTableCriteria, MainDataTableCriteriaSpec> {
+public class MainDataTableService
+        extends BaseService<MainDataTable, MainDataTableRepo, MainDataTableCriteria, MainDataTableCriteriaSpec> {
 
     @PersistenceContext
     private EntityManager entityManager;
@@ -112,6 +113,7 @@ public class MainDataTableService extends BaseService<MainDataTable, MainDataTab
 
     /**
      * Converts PostgreSQL hex format UUID to proper UUID format
+     * 
      * @param hexUuid UUID in hex format (e.g., \x6205c18b8d1e4f0fa5154212fb44050b)
      * @return UUID object
      */

sge-backend/src/main/java/com/sgs/utils/rabbitMQ/MessageListener.java

@@ -850,6 +850,7 @@ public class MessageListener {
         System.out.println("   Month: " + (input.getMonth() != null ? input.getMonth().length() : "null"));
         System.out.println("   ConsuptionAmount: " + (input.getConsuptionAmount() != null ? input.getConsuptionAmount().length() : "null"));
 
+
         System.out.println("🔍 VM Emission Input for Source:");
         System.out.println("   VM ID: " + vm.getId());
         System.out.println("   VM Name: " + vm.getVmName());

sge-backend/src/main/resources/application.properties

@@ -17,16 +17,10 @@ security.jwt.token.secret-key=secret
 
 app.survey.base-url=http://localhost.com
 
-# spring.rabbitmq.host=188.132.198.145
-# spring.rabbitmq.port=5672
-# spring.rabbitmq.username=testuser
-# spring.rabbitmq.password=JGasF24561AZv2894De
-
-#spring.rabbitmq.host=rabbitmq
-spring.rabbitmq.host=localhost
+spring.rabbitmq.host=188.132.198.145
 spring.rabbitmq.port=5672
-spring.rabbitmq.username=guest
-spring.rabbitmq.password=guest
+spring.rabbitmq.username=testuser
+spring.rabbitmq.password=JGasF24561AZv2894De
 spring.rabbitmq.virtual-host=/
 spring.rabbitmq.connection-timeout=20000
 spring.rabbitmq.template.retry.enabled=true
@@ -34,3 +28,6 @@ spring.rabbitmq.template.retry.max-attempts=3
 spring.rabbitmq.template.retry.initial-interval=1000ms
 
 logging.level.org.springframework.amqp=DEBUG
+spring.jpa.show-sql=true
+logging.level.org.hibernate.SQL=DEBUG
+logging.level.org.hibernate.type.descriptor.sql.BasicBinder=TRACE

sge-frontend/src/locales/en/translation.json

@@ -67,7 +67,11 @@
 
   "Common": {
     "save": "Save",
-    "cancel": "Cancel"
+    "cancel": "Cancel",
+    "yes": "Yes",
+    "no": "No",
+    "areYouSure": "Are you sure?",
+    "cantRevert": "This action cannot be undone!"
   },
 
   "DataInput": {

sge-frontend/src/locales/tr/translation.json

@@ -66,7 +66,11 @@
 
   "Common": {
     "save": "Kaydet",
-    "cancel": " İptal"
+    "cancel": "İptal",
+    "yes": "Evet",
+    "no": "Hayır",
+    "areYouSure": "Emin misiniz?",
+    "cantRevert": "Bu işlem geri alınamaz!"
   },
 
   "DataInput": {

sge-frontend/src/navigation/horizontal/index.js

@@ -49,9 +49,9 @@ export default [
       permissionCheck("paginate_roles_get")) && [
       {
         id: "Organizations",
-        title: "DataCenters.title",
+        title: "Data Center Management",
         icon: <Home size={20} />,
-        navLink: "/organizasyonlar",
+        navLink: "/veri-merkezi-yonetimi",
         display: (permissionCheck("paginate_datacenters_get") || 
                  permissionCheck("data_center_create") || 
                  permissionCheck("data_center_update") || 
@@ -142,9 +142,63 @@ export default [
   },
   {
     id: "DataCenter",
-    title: "Data Centers",
+    title: "Data Center Overview",
     icon: <Zap size={20} />,
-    navLink: "/verimerkezi",
+    navLink: "/veri-merkezi-genel",
+  },
+  {
+    id: "Areas",
+    title: "Areas.areas",
+    icon: <Map size={20} />,
+    display:
+      permissionCheck("paginate_areas_get") ||
+      permissionCheck("paginate_countries_get") ||
+      permissionCheck("paginate_cities_get") ||
+      permissionCheck("paginate_districts_get") ||
+      permissionCheck("paginate_neighborhoods_get")
+        ? ""
+        : "none",
+    children: (permissionCheck("paginate_areas_get") ||
+      permissionCheck("paginate_countries_get") ||
+      permissionCheck("paginate_cities_get") ||
+      permissionCheck("paginate_districts_get") ||
+      permissionCheck("paginate_neighborhoods_get")) && [
+      {
+        id: "AreasManagement",
+        title: "Areas.areas",
+        icon: <ArrowRight size={20} />,
+        navLink: "/alanlar",
+        display: permissionCheck("paginate_areas_get") ? "" : "none",
+      },
+      {
+        id: "Countries",
+        title: "Areas.countries",
+        icon: <ArrowRight size={20} />,
+        navLink: "/ulkeler",
+        display: permissionCheck("paginate_countries_get") ? "" : "none",
+      },
+      {
+        id: "Cities",
+        title: "Areas.cities",
+        icon: <ArrowRight size={20} />,
+        navLink: "/iller",
+        display: permissionCheck("paginate_cities_get") ? "" : "none",
+      },
+      {
+        id: "Districts",
+        title: "Areas.districts",
+        icon: <ArrowRight size={20} />,
+        navLink: "/ilceler",
+        display: permissionCheck("paginate_districts_get") ? "" : "none",
+      },
+      {
+        id: "Neighborhoods",
+        title: "Areas.neighborhoods",
+        icon: <ArrowRight size={20} />,
+        navLink: "/mahalleler",
+        display: permissionCheck("paginate_neighborhoods_get") ? "" : "none",
+      },
+    ],
   },
   {
     id: "Survey",

sge-frontend/src/navigation/vertical/index.js

@@ -49,9 +49,9 @@ export default [
       permissionCheck("paginate_roles_get")) && [
       {
         id: "DataCenters",
-        title: "DataCenters.title",
+        title: "Data Center Management",
         icon: <Zap size={20} />,
-        navLink: "/organizasyonlar",
+        navLink: "/veri-merkezi-yonetimi",
         display: (permissionCheck("paginate_datacenters_get") || 
                  permissionCheck("data_center_create") || 
                  permissionCheck("data_center_update") || 
@@ -142,9 +142,63 @@ export default [
   },
   {
     id: "DataCenter",
-    title: "DataCenters",
+    title: "Data Center Overview",
     icon: <Zap size={20} />,
-    navLink: "/verimerkezi",
+    navLink: "/veri-merkezi-genel",
+  },
+  {
+    id: "Areas",
+    title: "Areas.areas",
+    icon: <Map size={20} />,
+    display:
+      permissionCheck("paginate_areas_get") ||
+      permissionCheck("paginate_countries_get") ||
+      permissionCheck("paginate_cities_get") ||
+      permissionCheck("paginate_districts_get") ||
+      permissionCheck("paginate_neighborhoods_get")
+        ? ""
+        : "none",
+    children: (permissionCheck("paginate_areas_get") ||
+      permissionCheck("paginate_countries_get") ||
+      permissionCheck("paginate_cities_get") ||
+      permissionCheck("paginate_districts_get") ||
+      permissionCheck("paginate_neighborhoods_get")) && [
+      {
+        id: "AreasManagement",
+        title: "Areas.areas",
+        icon: <ArrowRight size={20} />,
+        navLink: "/alanlar",
+        display: permissionCheck("paginate_areas_get") ? "" : "none",
+      },
+      {
+        id: "Countries",
+        title: "Areas.countries",
+        icon: <ArrowRight size={20} />,
+        navLink: "/ulkeler",
+        display: permissionCheck("paginate_countries_get") ? "" : "none",
+      },
+      {
+        id: "Cities",
+        title: "Areas.cities",
+        icon: <ArrowRight size={20} />,
+        navLink: "/iller",
+        display: permissionCheck("paginate_cities_get") ? "" : "none",
+      },
+      {
+        id: "Districts",
+        title: "Areas.districts",
+        icon: <ArrowRight size={20} />,
+        navLink: "/ilceler",
+        display: permissionCheck("paginate_districts_get") ? "" : "none",
+      },
+      {
+        id: "Neighborhoods",
+        title: "Areas.neighborhoods",
+        icon: <ArrowRight size={20} />,
+        navLink: "/mahalleler",
+        display: permissionCheck("paginate_neighborhoods_get") ? "" : "none",
+      },
+    ],
   },
   {
     id: "Survey",

sge-frontend/src/redux/actions/areas/index.js

@@ -12,6 +12,15 @@ export const getAreas = () => {
                 id
                 tag
                 isDeleted
+                cities {
+                  id
+                  name
+                  coordinates
+                  country {
+                    id
+                    name
+                  }
+                }
               }
             }
            `,

sge-frontend/src/redux/actions/dataCenter/index.js

@@ -34,23 +34,64 @@ export const getDataCenters = () => {
                 latitude
                 longitude
                 area {
+                  id
                   tag
-                  name
-                  cityId
-                  districtId
-                }
-                projects {
+                  cities {
                     id
                     name
+                  }
+                  districts {
+                    id
+                    name
+                  }
+                }
+                city {
+                  id
+                  name
+                }
+                emissionScope {
+                  id
+                  tag
+                  description
+                }
+                sector {
+                  id
+                  tag
+                }
+                subSector {
+                  id
+                  tag
+                }
+                dataCenterEmissionSources {
+                  id
+                  emissionSource {
+                    id
+                    tag
+                  }
+                  consuptionUnit {
+                    id
+                    description
+                  }
+                  isDefault
+                  percentage
+                }
+                activitySubUnit {
+                  id
+                  tag
+                }
                 physicalMachines {
                   id
                   name
                   vms {
-                      active {
                     id
-                        status
-                        name
+                    vmName
+                    state
                     power
+                    calcOn
+                    hostingPm
+                    host
+                    flavorName
+                    tag
                     config {
                       id
                       cpu
@@ -61,8 +102,6 @@ export const getDataCenters = () => {
                 }
               }
             }
-              }
-            }
           `,
         },
         {
@@ -77,7 +116,7 @@ export const getDataCenters = () => {
         console.log("GraphQL Response:", {
           status: response.status,
           data: response.data,
-          errors: response.data?.errors
+          errors: response.data?.errors,
         });
 
         // Check for GraphQL errors
@@ -110,7 +149,7 @@ export const getDataCenters = () => {
           message: error.message,
           response: error.response?.data,
           status: error.response?.status,
-          stack: error.stack
+          stack: error.stack,
         });
 
         // Check for specific error types
@@ -155,10 +194,50 @@ export const createDataCenter = (dataCenterData) => {
                 latitude
                 longitude
                 area {
+                  id
                   tag
+                  cities {
+                    id
                     name
-                  cityId
-                  districtId
+                  }
+                  districts {
+                    id
+                    name
+                  }
+                }
+                city {
+                  id
+                  name
+                }
+                emissionScope {
+                  id
+                  tag
+                  description
+                }
+                sector {
+                  id
+                  tag
+                }
+                subSector {
+                  id
+                  tag
+                }
+                dataCenterEmissionSources {
+                  id
+                  emissionSource {
+                    id
+                    tag
+                  }
+                  consuptionUnit {
+                    id
+                    description
+                  }
+                  isDefault
+                  percentage
+                }
+                activitySubUnit {
+                  id
+                  tag
                 }
               }
             }
@@ -169,13 +248,23 @@ export const createDataCenter = (dataCenterData) => {
               externalId: parseInt(dataCenterData.externalId),
               ayposURL: dataCenterData.ayposURL || "",
               number: parseInt(dataCenterData.number) || 1,
-              areaId: dataCenterData.areaId,
+              areaId: dataCenterData.areaId || null,
+              cityId: dataCenterData.cityId || null,
               address: dataCenterData.address || "",
-              latitude: dataCenterData.latitude ? parseFloat(dataCenterData.latitude) : null,
-              longitude: dataCenterData.longitude ? parseFloat(dataCenterData.longitude) : null,
-              city: dataCenterData.city
-            }
-          }
+              latitude: dataCenterData.latitude
+                ? parseFloat(dataCenterData.latitude)
+                : null,
+              longitude: dataCenterData.longitude
+                ? parseFloat(dataCenterData.longitude)
+                : null,
+              emissionScopeId: dataCenterData.emissionScopeId || null,
+              sectorId: dataCenterData.sectorId || null,
+              subSectorId: dataCenterData.subSectorId || null,
+              dataCenterEmissionSources:
+                dataCenterData.dataCenterEmissionSources || [],
+              activitySubUnitId: dataCenterData.activitySubUnitId || null,
+            },
+          },
         },
         {
           headers: {
@@ -188,7 +277,7 @@ export const createDataCenter = (dataCenterData) => {
       console.log("Create Response:", {
         status: response.status,
         data: response.data,
-        errors: response.data?.errors
+        errors: response.data?.errors,
       });
 
       if (response.data?.errors) {
@@ -240,10 +329,50 @@ export const updateDataCenter = (id, dataCenterData) => {
                 latitude
                 longitude
                 area {
+                  id
                   tag
+                  cities {
+                    id
                     name
-                  cityId
-                  districtId
+                  }
+                  districts {
+                    id
+                    name
+                  }
+                }
+                city {
+                  id
+                  name
+                }
+                emissionScope {
+                  id
+                  tag
+                  description
+                }
+                sector {
+                  id
+                  tag
+                }
+                subSector {
+                  id
+                  tag
+                }
+                dataCenterEmissionSources {
+                  id
+                  emissionSource {
+                    id
+                    tag
+                  }
+                  consuptionUnit {
+                    id
+                    description
+                  }
+                  isDefault
+                  percentage
+                }
+                activitySubUnit {
+                  id
+                  tag
                 }
               }
             }
@@ -255,13 +384,23 @@ export const updateDataCenter = (id, dataCenterData) => {
               externalId: parseInt(dataCenterData.externalId),
               ayposURL: dataCenterData.ayposURL || "",
               number: parseInt(dataCenterData.number) || 1,
-              areaId: dataCenterData.areaId,
+              areaId: dataCenterData.areaId || null,
+              cityId: dataCenterData.cityId || null,
               address: dataCenterData.address || "",
-              latitude: dataCenterData.latitude ? parseFloat(dataCenterData.latitude) : null,
-              longitude: dataCenterData.longitude ? parseFloat(dataCenterData.longitude) : null,
-              city: dataCenterData.city
-            }
-          }
+              latitude: dataCenterData.latitude
+                ? parseFloat(dataCenterData.latitude)
+                : null,
+              longitude: dataCenterData.longitude
+                ? parseFloat(dataCenterData.longitude)
+                : null,
+              emissionScopeId: dataCenterData.emissionScopeId || null,
+              sectorId: dataCenterData.sectorId || null,
+              subSectorId: dataCenterData.subSectorId || null,
+              dataCenterEmissionSources:
+                dataCenterData.dataCenterEmissionSources || [],
+              activitySubUnitId: dataCenterData.activitySubUnitId || null,
+            },
+          },
         },
         {
           headers: {
@@ -276,7 +415,7 @@ export const updateDataCenter = (id, dataCenterData) => {
 
       dispatch({
         type: "UPDATE_DATA_CENTER_SUCCESS",
-        payload: response.data.data.updateDataCenter
+        payload: response.data.data.updateDataCenter,
       });
 
       return response.data.data.updateDataCenter;
@@ -309,8 +448,8 @@ export const deleteDataCenter = (id) => {
             }
           `,
           variables: {
-            id: id
-          }
+            id: id,
+          },
         },
         {
           headers: {
@@ -325,7 +464,7 @@ export const deleteDataCenter = (id) => {
 
       dispatch({
         type: "DELETE_DATA_CENTER_SUCCESS",
-        payload: id
+        payload: id,
       });
 
       return true;
@@ -342,19 +481,71 @@ export const deleteDataCenter = (id) => {
   };
 };
 
+export const getEmissionScopes = () => {
+  return async (dispatch) => {
+    dispatch({
+      type: "GET_EMISSION_SCOPES_LOADING",
+    });
+
+    try {
+      const response = await ApplicationService.http().post(
+        "/graphql",
+        {
+          query: `
+            query GetEmissionScopes {
+              emissionScopes {
+                id
+                tag
+                description
+              }
+            }
+          `,
+        },
+        {
+          headers: {
+            Authorization: "Bearer " + localStorage.getItem("accessToken"),
+          },
+        }
+      );
+
+      if (response.data?.errors) {
+        throw new Error(response.data.errors[0].message);
+      }
+
+      dispatch({
+        type: "GET_EMISSION_SCOPES_SUCCESS",
+        payload: response.data.data.emissionScopes,
+      });
+
+      return response.data.data.emissionScopes;
+    } catch (error) {
+      console.error("Error fetching emission scopes:", error);
+      dispatch({
+        type: "GET_EMISSION_SCOPES_ERROR",
+        payload: {
+          error: error.message || "Failed to fetch emission scopes",
+        },
+      });
+      throw error;
+    }
+  };
+};
+
 export const getDataCenterVMs = (dataCenterId) => {
   return new Promise(async (resolve, reject) => {
     // Don't make the request if dataCenterId is undefined, null, or empty
     if (!dataCenterId || dataCenterId === "undefined") {
-      console.log('getDataCenterVMs: No dataCenterId provided');
+      console.log("getDataCenterVMs: No dataCenterId provided");
       resolve([]);
       return;
     }
 
     try {
-      console.log('getDataCenterVMs: Fetching VMs for data center:', dataCenterId);
-      const response = await ApplicationService.http()
-        .post(
+      console.log(
+        "getDataCenterVMs: Fetching VMs for data center:",
+        dataCenterId
+      );
+      const response = await ApplicationService.http().post(
         "/graphql",
         {
           query: `
@@ -362,22 +553,18 @@ export const getDataCenterVMs = (dataCenterId) => {
                 dataCenter(id: "${dataCenterId}") {
                   id
                   dataCenter
-                  projects {
-                    id
-                    name
                   physicalMachines {
                     id
                     name
                     vms {
                       id
-                        name
-                        status
+                      vmName
+                      state
                       power
                     }
                   }
                 }
               }
-              }
              `,
         },
         {
@@ -388,23 +575,19 @@ export const getDataCenterVMs = (dataCenterId) => {
       );
 
       const dataCenter = response?.data?.data?.dataCenter;
-      console.log('getDataCenterVMs: Data center response:', dataCenter);
+      console.log("getDataCenterVMs: Data center response:", dataCenter);
 
       let allVMs = [];
 
-      if (dataCenter && dataCenter.projects) {
-        dataCenter.projects.forEach(project => {
-          if (project.physicalMachines) {
-            project.physicalMachines.forEach(pm => {
+      if (dataCenter && dataCenter.physicalMachines) {
+        dataCenter.physicalMachines.forEach((pm) => {
           if (pm.vms) {
             allVMs = allVMs.concat(pm.vms);
           }
         });
       }
-        });
-      }
 
-      console.log('getDataCenterVMs: Found VMs:', allVMs);
+      console.log("getDataCenterVMs: Found VMs:", allVMs);
       resolve(allVMs);
     } catch (error) {
       console.error("Error fetching VMs by data center:", error);

sge-frontend/src/redux/actions/mainDataTables/index.js

@@ -1,6 +1,6 @@
 import ApplicationService from "../../../services/ApplicationService";
 
-export const getVMEmissionSummary = () => {
+export const getVMEmissionSummary = (datacenterId) => {
   return async (dispatch) => {
     try {
       const response = await ApplicationService.http()
@@ -8,8 +8,8 @@ export const getVMEmissionSummary = () => {
           "/graphql",
           {
             query: `
-              {
-                vmEmissionSummary {
+              query GetVMEmissions($datacenterId: ID) {
+                vmEmissionSummary(datacenterId: $datacenterId) {
                   vmId
                   vmName
                   vmPower
@@ -17,7 +17,7 @@ export const getVMEmissionSummary = () => {
                   totalEmission
                   createdDate
                   physicalMachine
-                  project
+                  cloudSystem
                   dataCenter
                   co2
                   ch4
@@ -25,7 +25,10 @@ export const getVMEmissionSummary = () => {
                   reportGeneratedTime
                 }
               }
-            `
+            `,
+            variables: {
+              datacenterId: datacenterId
+            }
           },
           {
             headers: {
@@ -125,11 +128,12 @@ export const getMainDataTablesWithPaginate = (data) => {
             {
               paginateMainDataTables(
                 pagination: { page: 0, rowsPerPage: 100 }
-                criteria: { deleted: false }
+                criteria: { deleted: false, hasVm: true }
                 sortBy: [{ field: "createdDate", direction: DESC }]
               ) {
                 content {
                   id
+                  year
                   sector {
                     id
                     tag
@@ -138,11 +142,40 @@ export const getMainDataTablesWithPaginate = (data) => {
                     id
                     tag
                   }
+                  activitySubUnit {
+                    id
+                    tag
+                  }
+                  emissionSource {
+                    id
+                    tag
+                  }
+                  emissionScope {
+                    id
+                    tag
+                  }
                   co2
                   ch4
                   n2o
                   totalEmission
                   createdDate
+                  vm {
+                    id
+                    vmName
+                    state
+                    power
+                    calcOn
+                    hostingPm
+                    host
+                    flavorName
+                    tag
+                    config {
+                      id
+                      cpu
+                      ram
+                      disk
+                    }
+                  }
                 }
                 pageInfo {
                   totalElements

sge-frontend/src/redux/reducers/emissionScope/index.js

@@ -0,0 +1,33 @@
+const initialState = {
+  emissionScopes: [],
+  loading: false,
+  error: null,
+};
+
+const emissionScopeReducer = (state = initialState, action) => {
+  switch (action.type) {
+    case "GET_EMISSION_SCOPES_LOADING":
+      return {
+        ...state,
+        loading: true,
+        error: null,
+      };
+    case "GET_EMISSION_SCOPES_SUCCESS":
+      return {
+        ...state,
+        loading: false,
+        emissionScopes: action.payload,
+        error: null,
+      };
+    case "GET_EMISSION_SCOPES_ERROR":
+      return {
+        ...state,
+        loading: false,
+        error: action.payload.error,
+      };
+    default:
+      return state;
+  }
+};
+
+export default emissionScopeReducer;

sge-frontend/src/redux/reducers/rootReducer.js

@@ -27,6 +27,7 @@ import surveys from "./surveys";
 import uploads from "./upload";
 import mailSettings from "./mailSettings";
 import dataCenter from "./dataCenter";
+import emissionScope from "./emissionScope";
 
 const rootReducer = combineReducers({
   accessToken,
@@ -57,6 +58,7 @@ const rootReducer = combineReducers({
   uploads,
   mailSettings,
   dataCenter,
+  emissionScope,
 });
 
 export default rootReducer;

sge-frontend/src/router/routes/index.js

@@ -25,7 +25,7 @@ const Routes = [
     display: permissionCheck("paginate_users_get"),
   },
   {
-    path: "/organizasyonlar",
+    path: "/veri-merkezi-yonetimi",
     component: lazy(() => import("../../views/DataCenterManagement")),
     display: permissionCheck("paginate_datacenters_get") || 
              permissionCheck("data_center_create") || 
@@ -74,7 +74,7 @@ const Routes = [
     display: permissionCheck("activity_sub_units_get"),
   },
   {
-    path: "/verimerkezi",
+    path: "/veri-merkezi-genel",
     component: lazy(() => import("../../views/DataCenter")),
   },
   {

sge-frontend/src/views/DataCenter.js

@@ -18,17 +18,16 @@ const DataCenter = () => {
   const [refreshInterval, setRefreshInterval] = useState(null);
 
   const getAllPhysicalMachines = (dataCenter) => {
-    if (!dataCenter.projects) return [];
-    return dataCenter.projects.flatMap(project =>
-      project.physicalMachines || []
-    );
+    // Physical machines are directly in the dataCenter object, not in projects
+    const pms = dataCenter.physicalMachines || [];
+    return pms;
   };
 
   // Table columns following your pattern
   const initialColumns = [
     {
-      name: "Number",
-      selector: (row) => row.number,
+      name: "External ID",
+      selector: (row) => row.externalId,
       sortable: true,
       minWidth: "100px",
     },
@@ -38,19 +37,33 @@ const DataCenter = () => {
       sortable: true,
       minWidth: "200px",
     },
-    // Projects
-    {
-      name: "Projects",
-      selector: (row) =>
-        (row.projects || []).map((p) => p.name).join(", "),
-      sortable: false,
-      minWidth: "200px",
-      cell: (row) => (
-        <span>
-          {(row.projects || []).map((p) => p.name).join(", ") || "-"}
-        </span>
-      ),
-    },
+    // Projects - Based on API response, this field might not exist or be structured differently
+    // {
+    //   name: "Projects",
+    //   selector: (row) => row.projects?.length || 0,
+    //   sortable: true,
+    //   minWidth: "200px",
+    //   cell: (row) => (
+    //     <div>
+    //       {row.projects && row.projects.length > 0 ? (
+    //         <div className="d-flex flex-column">
+    //           {row.projects.map((project, index) => (
+    //             <div
+    //               key={project.id}
+    //               className={`badge badge-light-primary ${
+    //                 index > 0 ? "mt-1" : ""
+    //               }`}
+    //             >
+    //               {project.name}
+    //             </div>
+    //           ))}
+    //         </div>
+    //       ) : (
+    //         <span className="text-muted">-</span>
+    //       )}
+    //     </div>
+    //   ),
+    // },
     // Physical Machines
     {
       name: "Physical Machines",
@@ -68,26 +81,55 @@ const DataCenter = () => {
       },
     },
     {
-      name: "Total Active VMs",
+      name: "Virtual Machines",
       selector: (row) => {
         const pms = getAllPhysicalMachines(row);
-        return pms.reduce(
-          (total, pm) => total + (pm.vms?.active?.length || 0),
-          0
+        const vms = pms.reduce(
+          (acc, pm) => {
+            if (!pm.vms) return acc;
+            return {
+              active:
+                acc.active +
+                pm.vms.filter((vm) => vm.state?.toLowerCase() === "active")
+                  .length,
+              total: acc.total + pm.vms.length,
+            };
+          },
+          { active: 0, total: 0 }
         );
+        return vms.total;
       },
       sortable: true,
-      minWidth: "150px",
+      minWidth: "200px",
       cell: (row) => {
         const pms = getAllPhysicalMachines(row);
-        const totalVMs = pms.reduce(
-          (total, pm) => total + (pm.vms?.active?.length || 0),
-          0
+        const vms = pms.reduce(
+          (acc, pm) => {
+            if (!pm.vms) return acc;
+            return {
+              active:
+                acc.active +
+                pm.vms.filter((vm) => vm.state?.toLowerCase() === "active")
+                  .length,
+              total: acc.total + pm.vms.length,
+            };
+          },
+          { active: 0, total: 0 }
         );
+
         return (
           <div className="d-flex align-items-center">
-            <Monitor size={16} className="mr-1" />
-            <span>{totalVMs}</span>
+            <Monitor size={16} className="mr-2" />
+            <div>
+              <div className="font-weight-bold">{vms.total} Total</div>
+              <div className="small">
+                <span className="text-success">{vms.active} Active</span>
+                <span className="text-muted mx-1">•</span>
+                <span className="text-warning">
+                  {vms.total - vms.active} Inactive
+                </span>
+              </div>
+            </div>
           </div>
         );
       },
@@ -138,76 +180,112 @@ const DataCenter = () => {
           <div key={pm.id} className="mb-3 border rounded p-3">
             <h6 className="text-primary">{pm.name}</h6>
 
-            {/* Active VMs */}
-            <p className="mb-2">
-              <strong>Active VMs ({pm.vms?.active?.length || 0}):</strong>
-            </p>
-            {pm.vms?.active?.length > 0 ? (
-              <div className="ml-3">
-                {pm.vms.active.map((vm) => (
-                  <div
-                    key={vm.id}
-                    className="mb-2 p-2 border-left border-success"
-                  >
-                    <div className="row">
-                      <div className="col-md-3">
-                        <strong>Name:</strong> {vm.name}
+            {/* All VMs */}
+            <div className="mb-2 d-flex justify-content-between align-items-center">
+              <h6 className="mb-0">
+                <Monitor size={16} className="mr-1" />
+                Virtual Machines ({pm.vms?.length || 0})
+              </h6>
             </div>
-                      <div className="col-md-2">
-                        <strong>Status:</strong>
-                        <span className="badge badge-success ml-1">
-                          {vm.status}
+            {pm.vms?.length > 0 ? (
+              <div className="table-responsive mt-2">
+                <table className="table table-bordered table-hover">
+                  <thead className="thead-light">
+                    <tr>
+                      <th>Name</th>
+                      <th>Status</th>
+                      <th>Power (W)</th>
+                      <th>Configuration</th>
+                      <th>Host</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {pm.vms.map((vm) => {
+                      const isActive =
+                        vm.state && ["ACTIVE", "active"].includes(vm.state);
+                      return (
+                        <tr key={vm.id}>
+                          <td>
+                            <span className="font-weight-bold">
+                              {vm.vmName || vm.vm_name}
                             </span>
+                          </td>
+                          <td>
+                            <div
+                              className={`d-inline-block px-2 py-1 rounded-pill ${
+                                isActive
+                                  ? "bg-light-success text-success"
+                                  : "bg-light-warning text-warning"
+                              }`}
+                            >
+                              {vm.state}
                             </div>
-                      <div className="col-md-2">
-                        <strong>Power:</strong> {vm.power}
-                      </div>
-                      <div className="col-md-5">
-                        <strong>Config:</strong> CPU: {vm.config?.cpu}, RAM:{" "}
-                        {vm.config?.ram}, Disk: {vm.config?.disk}
-                      </div>
-                    </div>
-                  </div>
-                ))}
-              </div>
+                          </td>
+                          <td>
+                            {vm.power ? (
+                              <span>{vm.power.toFixed(2)}</span>
                             ) : (
-              <p className="text-muted ml-3">No active VMs</p>
+                              <span className="text-muted">-</span>
                             )}
-
-            {/* Inactive VMs */}
-            <p className="mb-2 mt-3">
-              <strong>Inactive VMs ({pm.vms?.inactive?.length || 0}):</strong>
-            </p>
-            {pm.vms?.inactive?.length > 0 ? (
-              <div className="ml-3">
-                {pm.vms.inactive.map((vm) => (
-                  <div
-                    key={vm.id}
-                    className="mb-2 p-2 border-left border-warning"
-                  >
-                    <div className="row">
-                      <div className="col-md-3">
-                        <strong>Name:</strong> {vm.name}
-                      </div>
-                      <div className="col-md-2">
-                        <strong>Status:</strong>
-                        <span className="badge badge-warning ml-1">
-                          {vm.status}
+                          </td>
+                          <td>
+                            <div className="d-flex align-items-center">
+                              <div className="mr-3">
+                                <small className="text-muted d-block">
+                                  CPU
+                                </small>
+                                <span>
+                                  {vm.config?.cpu ||
+                                    (vm.confg && vm.confg[1]) ||
+                                    "-"}
                                 </span>
                               </div>
-                      <div className="col-md-2">
-                        <strong>Power:</strong> {vm.power}
+                              <div className="mr-3">
+                                <small className="text-muted d-block">
+                                  RAM
+                                </small>
+                                <span>
+                                  {vm.config?.ram ||
+                                    (vm.confg && vm.confg[2]) ||
+                                    "-"}{" "}
+                                  GB
+                                </span>
                               </div>
-                      <div className="col-md-5">
-                        <strong>Config:</strong> CPU: {vm.config?.cpu}, RAM:{" "}
-                        {vm.config?.ram}, Disk: {vm.config?.disk}
+                              <div>
+                                <small className="text-muted d-block">
+                                  Disk
+                                </small>
+                                <span>
+                                  {vm.config?.disk ||
+                                    (vm.confg && vm.confg[3]) ||
+                                    "-"}{" "}
+                                  GB
+                                </span>
                               </div>
                             </div>
+                          </td>
+                          <td>
+                            <div className="d-flex align-items-center">
+                              <Server size={14} className="mr-1" />
+                              <span>
+                                {vm.host ||
+                                  vm.hostingPm ||
+                                  (vm.confg && vm.confg[4]) ||
+                                  "-"}
+                              </span>
                             </div>
-                ))}
+                          </td>
+                        </tr>
+                      );
+                    })}
+                  </tbody>
+                </table>
               </div>
             ) : (
-              <p className="text-muted ml-3">No inactive VMs</p>
+              <div className="text-center p-3 bg-light-secondary rounded">
+                <Monitor size={24} className="text-muted mb-1" />
+                <p className="text-muted mb-0">No virtual machines found</p>
+              </div>
             )}
           </div>
         ))}
@@ -215,8 +293,6 @@ const DataCenter = () => {
     );
   };
 
-
-
   return (
     <div style={{ marginTop: "2%" }}>
       <Card>

sge-frontend/src/views/DataSet/MainDataTables.js

@@ -1,101 +1,157 @@
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useMemo } from "react";
 import { MaterialReactTable } from "material-react-table";
 import { useDispatch, useSelector } from "react-redux";
 import { useTranslation } from "react-i18next";
-import { Card, CardHeader, CardTitle, Alert } from "reactstrap";
+import {
+  Card,
+  CardHeader,
+  CardTitle,
+  Alert,
+  Row,
+  Col,
+  Label,
+} from "reactstrap";
 import { getVMEmissionSummary } from "../../redux/actions/mainDataTables/index";
+import { getDataCenters } from "../../redux/actions/dataCenter";
 import { editNumbers } from "../../components/edit-numbers";
+import Select from "react-select";
 
 function MainDataTables() {
   const { t } = useTranslation();
   const dispatch = useDispatch();
   const mainDataTablesStore = useSelector((state) => state.mainDataTables);
+  const dataCenterStore = useSelector((state) => state.dataCenter);
   const [error, setError] = useState(null);
+  const [selectedDataCenter, setSelectedDataCenter] = useState(null);
+  const [dataCenterOptions, setDataCenterOptions] = useState([]);
+  const [loading, setLoading] = useState(false);
 
+  // Fetch datacenters on component mount
   useEffect(() => {
-    try {
-      // Fetch VM emission data
-      dispatch(getVMEmissionSummary());
-    } catch (err) {
-      console.error('Error in MainDataTables:', err);
-      setError(err.message);
-    }
+    dispatch(getDataCenters());
   }, [dispatch]);
 
-  // Debug log for store data
+  // Update datacenter options when datacenters are loaded
   useEffect(() => {
-    console.log('Current store data:', mainDataTablesStore);
-  }, [mainDataTablesStore]);
+    if (dataCenterStore?.dataCenters?.length > 0) {
+      const options = dataCenterStore.dataCenters.map((dataCenter) => ({
+        value: dataCenter.id,
+        label: dataCenter.dataCenter,
+        externalId: dataCenter.externalId,
+      }));
+      setDataCenterOptions(options);
+    }
+  }, [dataCenterStore?.dataCenters]);
 
-  const columns = [
+  // Fetch VM emission data when datacenter is selected
+  useEffect(() => {
+    if (selectedDataCenter?.value) {
+      const fetchData = async () => {
+        try {
+          setLoading(true);
+          setError(null);
+          await dispatch(getVMEmissionSummary(selectedDataCenter.value));
+        } catch (err) {
+          console.error("Error in MainDataTables:", err);
+          setError(err.message);
+        } finally {
+          setLoading(false);
+        }
+      };
+      fetchData();
+    }
+  }, [selectedDataCenter, dispatch]);
+
+  // Memoize columns to prevent re-renders
+  const columns = useMemo(
+    () => [
       {
-      header: "VM ID",
+        header: t("VM ID"),
         accessorKey: "vmId",
+        size: 150,
         Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
       },
       {
-      header: "Data Center",
-      accessorKey: "dataCenter",
-      Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
-    },
-    {
-      header: "Project",
-      accessorKey: "project",
-      Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
-    },
-    {
-      header: "Physical Machine",
-      accessorKey: "physicalMachine",
-      Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
-    },
-    {
-      header: "Virtual Machine",
+        header: t("VM Name"),
         accessorKey: "vmName",
+        size: 200,
         Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
       },
       {
-      header: "VM Power (W)",
+        header: t("VM Power"),
         accessorKey: "vmPower",
+        size: 120,
         Cell: ({ cell }) => <span>{editNumbers(cell.getValue()) || "-"}</span>,
       },
       {
-      header: "VM Status",
+        header: t("VM Status"),
         accessorKey: "vmStatus",
+        size: 100,
         Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
       },
       {
-      header: "Total Emissions",
+        header: t("Total Emission"),
         accessorKey: "totalEmission",
+        size: 150,
         Cell: ({ cell }) => <span>{editNumbers(cell.getValue()) || "-"}</span>,
       },
+      {
+        header: t("Physical Machine"),
+        accessorKey: "physicalMachine",
+        size: 150,
+        Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
+      },
+      {
+        header: t("Cloud System"),
+        accessorKey: "cloudSystem",
+        size: 150,
+        Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
+      },
+      {
+        header: t("Data Center"),
+        accessorKey: "dataCenter",
+        size: 150,
+        Cell: ({ cell }) => <span>{cell.getValue() || "-"}</span>,
+      },
       {
         header: "CO2",
         accessorKey: "co2",
+        size: 100,
         Cell: ({ cell }) => <span>{editNumbers(cell.getValue()) || "-"}</span>,
       },
       {
         header: "CH4",
         accessorKey: "ch4",
+        size: 100,
         Cell: ({ cell }) => <span>{editNumbers(cell.getValue()) || "-"}</span>,
       },
       {
         header: "N2O",
         accessorKey: "n2o",
+        size: 100,
         Cell: ({ cell }) => <span>{editNumbers(cell.getValue()) || "-"}</span>,
       },
       {
-      header: "Created Date",
+        header: t("Created Date"),
         accessorKey: "createdDate",
+        size: 180,
         Cell: ({ cell }) => (
           <span>
             {cell.getValue() ? new Date(cell.getValue()).toLocaleString() : "-"}
           </span>
         ),
+        sortable: true,
       },
-  ];
+    ],
+    [t]
+  );
 
-  const tableData = mainDataTablesStore?.vmEmissionSummary || [];
-  console.log('VM Emission data:', tableData);
+  // Memoize table data to prevent unnecessary re-renders
+  const tableData = useMemo(() => {
+    const data = mainDataTablesStore?.vmEmissionSummary || [];
+    console.log("VM Emission data count:", data.length);
+    return data;
+  }, [mainDataTablesStore?.vmEmissionSummary]);
 
   if (error) {
     return (
@@ -109,37 +165,109 @@ function MainDataTables() {
     <div style={{ marginTop: "2%" }}>
       <Card>
         <CardHeader className="border-bottom">
-          <CardTitle tag="h4">{t("Carbon Emission Data")}</CardTitle>
+          <CardTitle tag="h4">{t("Raw Data")}</CardTitle>
+          {tableData.length > 0 && (
+            <small className="text-muted">
+              {tableData.length} records loaded
+            </small>
+          )}
         </CardHeader>
+
+        {/* Datacenter Selection */}
+        <div className="p-3 border-bottom">
+          <Row>
+            <Col md="6">
+              <Label for="datacenter-select">{t("Data Center")}</Label>
+              <Select
+                id="datacenter-select"
+                value={selectedDataCenter}
+                onChange={setSelectedDataCenter}
+                options={dataCenterOptions}
+                placeholder={t("Select a data center...")}
+                isClearable
+                isSearchable
+                isLoading={dataCenterStore?.loading}
+                noOptionsMessage={() => t("No data centers available")}
+                styles={{
+                  menu: (provided) => ({
+                    ...provided,
+                    zIndex: 9999, // Ensure dropdown appears above other elements
+                  }),
+                }}
+                menuPortalTarget={document.body} // Render dropdown in body to avoid container overflow
+              />
+            </Col>
+          </Row>
+        </div>
+
+        {selectedDataCenter ? (
           <MaterialReactTable
             columns={columns}
             data={tableData}
+            // Performance optimizations for large datasets
             enableColumnFilters={true}
             enableFilters={true}
             enableGlobalFilter={true}
             enablePagination={true}
-          enableColumnResizing={true}
+            enableColumnResizing={true} // Disable resizing for better performance
             enableStickyHeader={true}
-          muiTableContainerProps={{ sx: { maxHeight: 'calc(100vh - 180px)' } }}
-          muiTableProps={{
-            sx: {
-              tableLayout: 'auto',
-            },
-          }}
+            enableRowVirtualization={true} // Enable virtualization for large datasets
+            enableColumnVirtualization={false} // Keep columns visible
+            // Pagination settings for large datasets
             initialState={{
               pagination: {
-              pageSize: 100,
-              pageIndex: 0
+                pageSize: 100, // Reduce page size for better performance
+                pageIndex: 0,
               },
-            sorting: [
-              { id: 'dataCenter', desc: false }
-            ],
-            density: 'compact'
+              sorting: [{ id: "createdDate", desc: true }],
+              density: "compact",
             }}
+            // Performance-optimized table props
+            muiTableContainerProps={{
+              sx: {
+                maxHeight: "calc(100vh - 250px)",
+                minHeight: "400px",
+              },
+            }}
+            muiTableProps={{
+              sx: {
+                tableLayout: "fixed", // Better performance with fixed layout
+              },
+            }}
+            // Pagination options
+            muiTablePaginationProps={{
+              rowsPerPageOptions: [10, 25, 50, 100],
+              showFirstButton: true,
+              showLastButton: true,
+            }}
+            // Loading and error states
             state={{
-            isLoading: !mainDataTablesStore?.vmEmissionSummary
+              isLoading: loading || mainDataTablesStore?.loading,
+              showProgressBars: loading || mainDataTablesStore?.loading,
+              showSkeletons: loading || mainDataTablesStore?.loading,
+            }}
+            // Disable features that can slow down large tables
+            enableRowSelection={false}
+            enableColumnOrdering={true}
+            enableColumnDragging={false}
+            enableDensityToggle={false}
+            enableFullScreenToggle={false}
+            // Custom loading overlay
+            renderProgressBarCell={({ cell }) => (
+              <div
+                style={{
+                  width: "100%",
+                  height: "20px",
+                  backgroundColor: "#f0f0f0",
                 }}
               />
+            )}
+          />
+        ) : (
+          <div className="p-4 text-center text-muted">
+            {t("Please select a data center to view raw data")}
+          </div>
+        )}
       </Card>
     </div>
   );

sge-frontend/src/views/Map.js

@@ -32,15 +32,87 @@ import { getCities } from "../redux/actions/cities";
 import { v4 as uuidv4 } from "uuid";
 import { getCity } from "../redux/actions/city";
 import { getDistrict } from "../redux/actions/district";
-import {
-  getOrganisations,
-  getOrganisationById,
-} from "../redux/actions/organisations";
+// import {
+//   getOrganisations,
+//   getOrganisationById,
+// } from "../redux/actions/organisations";
 import { getAreasWithCriteria } from "../redux/actions/areas";
 import { ChromePicker } from "react-color";
 import { customFilterForSelect } from "../utility/Utils";
 import { permissionCheck } from "../components/permission-check";
 import { getDataCenters } from "../redux/actions/dataCenter";
+import L from "leaflet";
+
+// Custom data center icon
+const dataCenterIcon = new L.Icon({
+  iconUrl:
+    "data:image/svg+xml;base64," +
+    btoa(`
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48">
+      <defs>
+        <linearGradient id="serverGradient" x1="0%" y1="0%" x2="0%" y2="100%">
+          <stop offset="0%" style="stop-color:#4A90E2;stop-opacity:1" />
+          <stop offset="100%" style="stop-color:#2E5BBA;stop-opacity:1" />
+        </linearGradient>
+        <linearGradient id="rackGradient" x1="0%" y1="0%" x2="0%" y2="100%">
+          <stop offset="0%" style="stop-color:#F5F5F5;stop-opacity:1" />
+          <stop offset="100%" style="stop-color:#E0E0E0;stop-opacity:1" />
+        </linearGradient>
+      </defs>
+      
+      <!-- Main server rack -->
+      <rect x="8" y="4" width="32" height="40" rx="2" ry="2" fill="url(#rackGradient)" stroke="#B0B0B0" stroke-width="1"/>
+      
+      <!-- Server units -->
+      <rect x="10" y="6" width="28" height="4" rx="1" fill="url(#serverGradient)" stroke="#2E5BBA" stroke-width="0.5"/>
+      <rect x="10" y="12" width="28" height="4" rx="1" fill="url(#serverGradient)" stroke="#2E5BBA" stroke-width="0.5"/>
+      <rect x="10" y="18" width="28" height="4" rx="1" fill="url(#serverGradient)" stroke="#2E5BBA" stroke-width="0.5"/>
+      <rect x="10" y="24" width="28" height="4" rx="1" fill="url(#serverGradient)" stroke="#2E5BBA" stroke-width="0.5"/>
+      <rect x="10" y="30" width="28" height="4" rx="1" fill="url(#serverGradient)" stroke="#2E5BBA" stroke-width="0.5"/>
+      <rect x="10" y="36" width="28" height="4" rx="1" fill="url(#serverGradient)" stroke="#2E5BBA" stroke-width="0.5"/>
+      
+      <!-- LED indicators -->
+      <circle cx="13" cy="8" r="0.8" fill="#00FF00"/>
+      <circle cx="13" cy="14" r="0.8" fill="#00FF00"/>
+      <circle cx="13" cy="20" r="0.8" fill="#FFFF00"/>
+      <circle cx="13" cy="26" r="0.8" fill="#00FF00"/>
+      <circle cx="13" cy="32" r="0.8" fill="#FF0000"/>
+      <circle cx="13" cy="38" r="0.8" fill="#00FF00"/>
+      
+      <!-- Power indicators -->
+      <circle cx="35" cy="8" r="0.6" fill="#0080FF"/>
+      <circle cx="35" cy="14" r="0.6" fill="#0080FF"/>
+      <circle cx="35" cy="20" r="0.6" fill="#0080FF"/>
+      <circle cx="35" cy="26" r="0.6" fill="#0080FF"/>
+      <circle cx="35" cy="32" r="0.6" fill="#0080FF"/>
+      <circle cx="35" cy="38" r="0.6" fill="#0080FF"/>
+      
+      <!-- Ventilation grilles -->
+      <rect x="16" y="7" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="8.5" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="13" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="14.5" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="19" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="20.5" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="25" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="26.5" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="31" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="32.5" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="37" width="16" height="0.5" fill="#1A4A8A"/>
+      <rect x="16" y="38.5" width="16" height="0.5" fill="#1A4A8A"/>
+      
+      <!-- Base/feet -->
+      <rect x="6" y="42" width="4" height="2" rx="1" fill="#808080"/>
+      <rect x="38" y="42" width="4" height="2" rx="1" fill="#808080"/>
+      
+      <!-- Shadow -->
+      <ellipse cx="24" cy="45" rx="18" ry="2" fill="#000000" opacity="0.2"/>
+    </svg>
+  `),
+  iconSize: [48, 48],
+  iconAnchor: [18, 36],
+  popupAnchor: [0, -36],
+});
 
 const ColorPicker = ({ selectedColors, setSelectedColors, index }) => {
   const [showColorPicker, setShowColorPicker] = useState(false);
@@ -117,20 +189,20 @@ const Map = () => {
   const citiesStore = useSelector((state) => state.cities);
   const cityStore = useSelector((state) => state.city);
   const districtStore = useSelector((state) => state.district);
-  const OrganisationsStore = useSelector((state) => state.organizations);
+  // const OrganisationsStore = useSelector((state) => state.organizations);
   const areasStore = useSelector((state) => state.areas);
   const dataCenterStore = useSelector((state) => state.dataCenter);
 
   const [cities, setCities] = useState([]);
   const [districts, setDistricts] = useState([]);
   const [neighborhoods, setNeighborhoods] = useState([]);
-  const [organizationOptions, setOrganizationOptions] = useState([]);
-  const organizationId = localStorage.getItem("organizationId");
-  const roleTag = localStorage.getItem("roleTag");
-  const [selectedOrganization, setSelectedOrganization] = useState({
-    label: localStorage.getItem("organizationName"),
-    value: organizationId,
-  });
+  // const [organizationOptions, setOrganizationOptions] = useState([]);
+  // const organizationId = localStorage.getItem("organizationId");
+  // const roleTag = localStorage.getItem("roleTag");
+  // const [selectedOrganization, setSelectedOrganization] = useState({
+  //   label: localStorage.getItem("organizationName"),
+  //   value: organizationId,
+  // });
   const [areasOptions, setAreasOptions] = useState([]);
 
   const [done, setDone] = useState(false);
@@ -146,7 +218,7 @@ const Map = () => {
 
   const [showDataInputModal, setShowDataInputModal] = useState(false);
   const [inputData, setInputData] = useState({
-    organization: selectedOrganization,
+    // organization: selectedOrganization,
   });
   const [referance, setReferance] = useState(
     Number(localStorage.getItem("referance")) || 1000
@@ -176,15 +248,17 @@ const Map = () => {
     dispatch(getDataCenters());
   }, []);
 
-  useEffect(() => {
-    if (selectedOrganization?.value != "undefined") {
-      dispatch(getAreasWithCriteria(selectedOrganization.value));
-    }
-  }, [selectedOrganization]);
+  // useEffect(() => {
+  //   if (selectedOrganization?.value != "undefined") {
+  //     dispatch(getAreasWithCriteria(selectedOrganization.value));
+  //   }
+  // }, [selectedOrganization]);
 
   useEffect(() => {
     setAreasOptions([]);
 
+    // Load all areas without organization filter for now
+    // You may want to add organization filtering back later if needed
     const citiesOptions =
       areasStore?.areasWithCriteria
         ?.map((area) =>
@@ -235,13 +309,13 @@ const Map = () => {
     ]);
   }, [areasStore]);
 
-  useEffect(() => {
-    if (roleTag === "SUPER_ADMIN") {
-      dispatch(getOrganisations());
-    } else {
-      dispatch(getOrganisationById(organizationId));
-    }
-  }, []);
+  // useEffect(() => {
+  //   if (roleTag === "SUPER_ADMIN") {
+  //     dispatch(getOrganisations());
+  //   } else {
+  //     dispatch(getOrganisationById(organizationId));
+  //   }
+  // }, []);
 
   const handleDataInputButtonPressed = ({ area, type }) => {
     const areaName =
@@ -348,38 +422,38 @@ const Map = () => {
     });
   }, [selectedDistrict, districtStore?.district, year.value]);
 
-  useEffect(() => {
-    let organizationOptions = [];
+  // useEffect(() => {
+  //   let organizationOptions = [];
 
-    if (
-      OrganisationsStore.organization &&
-      OrganisationsStore.organization.length !== 0
-    ) {
-      organizationOptions.push({
-        value: OrganisationsStore.organization.id,
-        label: OrganisationsStore.organization.tag,
-      });
+  //   if (
+  //     OrganisationsStore.organization &&
+  //     OrganisationsStore.organization.length !== 0
+  //   ) {
+  //     organizationOptions.push({
+  //       value: OrganisationsStore.organization.id,
+  //       label: OrganisationsStore.organization.tag,
+  //     });
 
-      if (OrganisationsStore.organization.children) {
-        organizationOptions = [
-          ...organizationOptions,
-          ...OrganisationsStore.organization.children.map((organization) => ({
-            value: organization.child.id,
-            label: organization.child.tag,
-          })),
-        ];
-      }
-    } else {
-      organizationOptions = OrganisationsStore.dataOrganization.map(
-        (organization) => ({
-          value: organization.id,
-          label: organization.tag,
-        })
-      );
-    }
+  //     if (OrganisationsStore.organization.children) {
+  //       organizationOptions = [
+  //         ...organizationOptions,
+  //         ...OrganisationsStore.organization.children.map((organization) => ({
+  //           value: organization.child.id,
+  //           label: organization.child.tag,
+  //         })),
+  //       ];
+  //     }
+  //   } else {
+  //     organizationOptions = OrganisationsStore.dataOrganization.map(
+  //       (organization) => ({
+  //         value: organization.id,
+  //         label: organization.tag,
+  //       })
+  //     );
+  //   }
 
-    setOrganizationOptions(organizationOptions);
-  }, [OrganisationsStore]);
+  //   setOrganizationOptions(organizationOptions);
+  // }, [OrganisationsStore]);
 
   const renderDataInputModal = () => {
     return (
@@ -628,24 +702,55 @@ const Map = () => {
             <Marker
               key={dc.id}
               position={[dc.latitude, dc.longitude]}
+              icon={dataCenterIcon}
             >
               <Popup>
                 <div className="data-center-popup">
-                  <h5 className="mb-2">{dc.dataCenter}</h5>
-                  <p className="mb-1"><strong>{t('DataCenter.number')}:</strong> {dc.number}</p>
-                  <p className="mb-1"><strong>{t('DataCenter.externalId')}:</strong> {dc.externalId}</p>
-                  <p className="mb-1"><strong>{t('DataCenter.city')}:</strong> {dc.area?.cities?.map(city => city.name).join(', ') || "-"}</p>
-                  {dc.area && <p className="mb-1"><strong>{t('Area')}:</strong> {dc.area.tag}</p>}
-                  {dc.projects?.length > 0 && (
+                  <h5 className="mb-2 text-primary">{dc.dataCenter}</h5>
+                  <div className="mb-2">
                     <p className="mb-1">
-                      <strong>{t('Projects')}:</strong> {dc.projects.length}
+                      <strong>{t("DataCenter.city")}:</strong>{" "}
+                      <span>{dc.city?.name || "-"}</span>
+                    </p>
+                    {dc.address && (
+                      <p className="mb-1 small text-muted">
+                        <strong>{t("Address")}:</strong> {dc.address}
+                      </p>
+                    )}
+                  </div>
+                  <p className="mb-1">
+                    <strong>{t("DataCenter.number")}:</strong> {dc.number}
+                  </p>
+                  <p className="mb-1">
+                    <strong>{t("DataCenter.externalId")}:</strong>{" "}
+                    {dc.externalId}
+                  </p>
+                  {dc.area && (
+                    <p className="mb-1">
+                      <strong>{t("Area")}:</strong> {dc.area.tag}
+                    </p>
+                  )}
+                  {dc.physicalMachines?.length > 0 && (
+                    <p className="mb-1">
+                      <strong>{t("Physical Machines")}:</strong>{" "}
+                      <span className="badge badge-secondary">
+                        {dc.physicalMachines.length}
+                      </span>
+                    </p>
+                  )}
+                  {dc.dataCenterEmissionSources?.length > 0 && (
+                    <p className="mb-1">
+                      <strong>{t("EmissionSources.emissionSources")}:</strong>{" "}
+                      <span className="badge badge-info">
+                        {dc.dataCenterEmissionSources.length}
+                      </span>
                     </p>
                   )}
                   {dc.ayposURL && (
                     <Button
                       className="w-100 mb-1"
                       color="primary"
-                      onClick={() => window.open(dc.ayposURL, '_blank')}
+                      onClick={() => window.open(dc.ayposURL, "_blank")}
                     >
                       Dashboard
                     </Button>
@@ -699,7 +804,9 @@ const Map = () => {
                         setDistrictView(true);
                         setZoom(8.0);
 
-                        let convertCordinates = convertCoordinates(city.coordinates);
+                        let convertCordinates = convertCoordinates(
+                          city.coordinates
+                        );
                         let length = convertCordinates[0][0][0].length;
                         let mlength = ((length + 1) / 2).toFixed(0);
                         let lat1 = convertCordinates[0][0][0][0];
@@ -710,7 +817,7 @@ const Map = () => {
                           lat: ((lat1 + lat2) / 2).toFixed(2),
                           lng: ((lng1 + lng2) / 2).toFixed(2),
                         });
-                      }
+                      },
                     }}
                   >
                     <Tooltip permanent direction="center">