update families

src/main/java/com/faf223/expensetrackerfaf/controller/ExpenseController.java

@@ -98,7 +98,7 @@ public class ExpenseController {
 
     @GetMapping("/personal-expenses")
     @Transactional(readOnly = true)
-    public ResponseEntity<List<ExpenseDTO>> getExpensesByUser(@RequestParam Optional<LocalDate> date,
+    public ResponseEntity<List<ExpenseDTO>> getExpensesByTimeUnits(@RequestParam Optional<LocalDate> date,
                                                               @RequestParam Optional<Integer> month,
                                                               @RequestParam Optional<Integer> startYear,
                                                               @RequestParam Optional<Integer> endYear,

src/main/java/com/faf223/expensetrackerfaf/controller/FamilyController.java

@@ -0,0 +1,130 @@
+package com.faf223.expensetrackerfaf.controller;
+
+import com.faf223.expensetrackerfaf.dto.FamilyCreationDTO;
+import com.faf223.expensetrackerfaf.dto.FamilyDTO;
+import com.faf223.expensetrackerfaf.dto.mappers.FamilyMapper;
+import com.faf223.expensetrackerfaf.model.Family;
+import com.faf223.expensetrackerfaf.model.User;
+import com.faf223.expensetrackerfaf.service.FamilyService;
+import com.faf223.expensetrackerfaf.service.UserService;
+import com.faf223.expensetrackerfaf.util.errors.ErrorResponse;
+import com.faf223.expensetrackerfaf.util.exceptions.*;
+import jakarta.validation.Valid;
+import lombok.RequiredArgsConstructor;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.ResponseEntity;
+import org.springframework.security.access.prepost.PreAuthorize;
+import org.springframework.validation.BindingResult;
+import org.springframework.web.bind.annotation.*;
+
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+import java.util.Optional;
+import java.util.stream.Collectors;
+
+@RestController
+@RequestMapping("/families")
+@RequiredArgsConstructor
+public class FamilyController {
+
+    private final FamilyService familyService;
+    private final FamilyMapper familyMapper;
+    private final UserService userService;
+
+    @GetMapping()
+    @PreAuthorize("hasRole('ADMIN')")
+    public ResponseEntity<List<FamilyDTO>> getAllFamilies() {
+        List<FamilyDTO> families = familyService.getFamilies().stream().map(familyMapper::toDto).collect(Collectors.toList());
+        if (!families.isEmpty()) return ResponseEntity.ok(families);
+        else throw new FamiliesNotFoundException("Families not found");
+    }
+
+    @PostMapping()
+    public ResponseEntity<Map<String, Long>> createNewFamily(@RequestBody @Valid FamilyCreationDTO familyCreationDTO,
+                                                              BindingResult bindingResult) {
+        if(bindingResult.hasErrors())
+            throw new FamilyNotCreatedException("Could not create new family");
+
+        Family family = familyMapper.toFamily(familyCreationDTO);
+
+        familyService.createOrUpdate(family);
+        Map<String, Long> response = new HashMap<>();
+        response.put("familyId", family.getId());
+        return ResponseEntity.status(HttpStatus.CREATED).body(response);
+    }
+
+    @PatchMapping("/update/{id}")
+    public ResponseEntity<Void> updateFamily(@PathVariable long id, @RequestBody @Valid FamilyCreationDTO familyDTO,
+                                              BindingResult bindingResult) {
+        if(bindingResult.hasErrors())
+            throw new FamilyNotUpdatedException(ErrorResponse.from(bindingResult).getMessage());
+
+        Family family = familyService.getFamilyById(id);
+
+        if(family == null)
+            throw new FamiliesNotFoundException("The family has not been found");
+
+        if(!familyService.containsMember(family))
+            throw new NotAMemberOfTheFamily("You are not a member of this family");
+
+        family.setName(familyDTO.getName());
+
+        familyService.createOrUpdate(family);
+        return ResponseEntity.status(HttpStatus.CREATED).build();
+    }
+
+    @DeleteMapping("/delete/{id}")
+    public void deleteFamily(@PathVariable long id) {
+        familyService.deleteFamilyById(id);
+    }
+
+    @PatchMapping("/add-member/{id}")
+    public ResponseEntity<Void> addFamilyMember(@PathVariable long id, @RequestParam Optional<String> email) {
+        if(email.isEmpty())
+            throw new UserNotFoundException("You have not specified the user email");
+
+        Family family = familyService.getFamilyById(id);
+
+        if(family == null)
+            throw new FamiliesNotFoundException("The family has not been found");
+
+        if(!familyService.containsMember(family))
+            throw new NotAMemberOfTheFamily("You are not a member of this family");
+
+        User user = userService.getUserByEmail(email.get());
+
+        if(user == null)
+            throw new UserNotFoundException("User with the specified email has not been found");
+
+        family.getMembers().add(user);
+
+        familyService.createOrUpdate(family);
+        return ResponseEntity.status(HttpStatus.CREATED).build();
+    }
+
+    @PatchMapping("/remove-member/{id}")
+    public ResponseEntity<Void> removeFamilyMember(@PathVariable long id, @RequestParam Optional<String> email) {
+        if(email.isEmpty())
+            throw new UserNotFoundException("You have not specified the user email");
+
+        Family family = familyService.getFamilyById(id);
+
+        if(family == null)
+            throw new FamiliesNotFoundException("The family has not been found");
+
+        if(!familyService.containsMember(family))
+            throw new NotAMemberOfTheFamily("You are not a member of this family");
+
+        User user = userService.getUserByEmail(email.get());
+
+        if(user == null)
+            throw new UserNotFoundException("User with the specified email has not been found");
+
+        family.getMembers().remove(user);
+
+        familyService.createOrUpdate(family);
+        return ResponseEntity.status(HttpStatus.CREATED).build();
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/controller/IncomeController.java

@@ -98,7 +98,7 @@ public class IncomeController {
 
     @GetMapping("/personal-incomes")
     @Transactional(readOnly = true)
-    public ResponseEntity<List<IncomeDTO>> getIncomesByUser(@RequestParam Optional<LocalDate> date,
+    public ResponseEntity<List<IncomeDTO>> getIncomesByTimeUnits(@RequestParam Optional<LocalDate> date,
                                                              @RequestParam Optional<Integer> month,
                                                              @RequestParam Optional<Integer> startYear,
                                                              @RequestParam Optional<Integer> endYear,

src/main/java/com/faf223/expensetrackerfaf/controller/UserController.java

@@ -1,10 +1,8 @@
 package com.faf223.expensetrackerfaf.controller;
 
-import com.faf223.expensetrackerfaf.controller.auth.AuthenticationResponse;
 import com.faf223.expensetrackerfaf.controller.auth.ChangePasswordRequest;
 import com.faf223.expensetrackerfaf.dto.UserCreationDTO;
 import com.faf223.expensetrackerfaf.dto.UserDTO;
-import com.faf223.expensetrackerfaf.dto.UserUpdateDTO;
 import com.faf223.expensetrackerfaf.dto.mappers.UserMapper;
 import com.faf223.expensetrackerfaf.model.Credential;
 import com.faf223.expensetrackerfaf.model.User;
@@ -25,10 +23,7 @@ import org.springframework.security.core.userdetails.UserDetails;
 import org.springframework.validation.BindingResult;
 import org.springframework.web.bind.annotation.*;
 
-import java.util.ArrayList;
+import java.util.*;
-import java.util.HashMap;
-import java.util.Map;
-import java.util.Optional;
 
 @RestController
 @RequestMapping("/users")
@@ -65,12 +60,6 @@ public class UserController {
         return ResponseEntity.status(HttpStatus.OK).build();
     }
 
-    @PatchMapping("/update-user-data")
-    public ResponseEntity<AuthenticationResponse> updateUserData(@RequestBody UserUpdateDTO userUpdateDTO) {
-
-        return ResponseEntity.ok(userService.updateUser(userUpdateDTO));
-    }
-
     @GetMapping("/get-user-data")
     public ResponseEntity<Map<String, String>> getUser() {
         Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
@@ -84,8 +73,7 @@ public class UserController {
                 userData.put("firstname", user.getFirstName());
                 userData.put("lastname", user.getLastName());
                 userData.put("username", user.getUsername());
-                userData.put("email", credential.get().getEmail());
+                userData.put("userrole", credential.get().getRole().toString()); // Assuming UserRole is an enum
-                userData.put("userrole", credential.get().getRole().toString());
 
                 return ResponseEntity.ok(userData);
             }
@@ -95,25 +83,10 @@ public class UserController {
 
     @GetMapping()
     @PreAuthorize("hasRole('ADMIN')")
-    public ResponseEntity<ArrayList<Map<String, String>>> getAllUsers() {
+    public ResponseEntity<List<UserDTO>> getAllUsers() {
         ArrayList<User> users = new ArrayList<>(userService.getUsers());
 
-        ArrayList<Map<String, String>> mappedUsers = new ArrayList<>();
+        return ResponseEntity.ok(userMapper.toDto(users));
-
-        for (User u: users) {
-            Map<String, String> userData = new HashMap<>();
-            userData.put("firstname", u.getFirstName());
-            userData.put("lastname", u.getLastName());
-            userData.put("username", u.getUsername());
-            Optional<Credential> credential = credentialRepository.findByUser(u);
-            if (credential.isEmpty()) continue;
-            userData.put("email", credential.get().getEmail());
-            userData.put("userrole", credential.get().getRole().toString());
-            mappedUsers.add(userData);
-        }
-
-
-        return ResponseEntity.ok(mappedUsers);
     }
 
     @GetMapping("/delete/{username}")

src/main/java/com/faf223/expensetrackerfaf/dto/FamilyCreationDTO.java

@@ -0,0 +1,14 @@
+package com.faf223.expensetrackerfaf.dto;
+
+import jakarta.validation.constraints.NotEmpty;
+import jakarta.validation.constraints.NotNull;
+import lombok.AllArgsConstructor;
+import lombok.Data;
+
+@Data
+@AllArgsConstructor
+public class FamilyCreationDTO {
+    @NotNull(message = "Name must not be null")
+    @NotEmpty(message = "Name must not be empty")
+    private String name;
+}

src/main/java/com/faf223/expensetrackerfaf/dto/FamilyDTO.java

@@ -0,0 +1,14 @@
+package com.faf223.expensetrackerfaf.dto;
+
+import jakarta.validation.constraints.NotEmpty;
+import jakarta.validation.constraints.NotNull;
+import lombok.AllArgsConstructor;
+import lombok.Data;
+
+@Data
+@AllArgsConstructor
+public class FamilyDTO {
+    @NotNull(message = "Name must not be null")
+    @NotEmpty(message = "Name must not be empty")
+    private String name;
+}

src/main/java/com/faf223/expensetrackerfaf/dto/UserUpdateDTO.java

@@ -1,14 +0,0 @@
-package com.faf223.expensetrackerfaf.dto;
-
-import lombok.AllArgsConstructor;
-import lombok.Data;
-
-@Data
-@AllArgsConstructor
-public class UserUpdateDTO {
-
-    private String firstname;
-    private String lastname;
-    private String username;
-    private String email;
-}

src/main/java/com/faf223/expensetrackerfaf/dto/mappers/FamilyMapper.java

@@ -0,0 +1,25 @@
+package com.faf223.expensetrackerfaf.dto.mappers;
+
+import com.faf223.expensetrackerfaf.dto.FamilyCreationDTO;
+import com.faf223.expensetrackerfaf.dto.FamilyDTO;
+import com.faf223.expensetrackerfaf.model.Family;
+import lombok.RequiredArgsConstructor;
+import org.springframework.stereotype.Component;
+
+@Component
+@RequiredArgsConstructor
+public class FamilyMapper {
+
+    private final UserMapper userMapper;
+
+    public FamilyDTO toDto(Family family) {
+        return new FamilyDTO(family.getId(), family.getName(), userMapper.toDto(family.getMembers()));
+    }
+
+    public Family toFamily(FamilyCreationDTO familyCreationDTO) {
+        Family family = new Family();
+        family.setName(familyCreationDTO.getName());
+        return family;
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/dto/mappers/IncomeMapper.java

@@ -2,12 +2,9 @@ package com.faf223.expensetrackerfaf.dto.mappers;
 
 import com.faf223.expensetrackerfaf.dto.IncomeCreationDTO;
 import com.faf223.expensetrackerfaf.dto.IncomeDTO;
-import com.faf223.expensetrackerfaf.model.Expense;
 import com.faf223.expensetrackerfaf.model.Income;
 import com.faf223.expensetrackerfaf.service.IncomeCategoryService;
-import com.faf223.expensetrackerfaf.service.IncomeService;
 import lombok.RequiredArgsConstructor;
-import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Component;
 
 import java.time.LocalDate;

src/main/java/com/faf223/expensetrackerfaf/dto/mappers/UserMapper.java

@@ -6,6 +6,7 @@ import com.faf223.expensetrackerfaf.model.User;
 import org.springframework.stereotype.Component;
 
 import java.util.ArrayList;
+import java.util.List;
 
 @Component
 public class UserMapper {
@@ -14,10 +15,8 @@ public class UserMapper {
         return new UserDTO(user.getFirstName(), user.getLastName(), user.getUsername());
     }
 
-    public ArrayList<UserDTO> toDto(ArrayList<User> user) {
+    public List<UserDTO> toDto(List<User> user) {
-
+        List<UserDTO> list = new ArrayList<>();
-        ArrayList<UserDTO> list = new ArrayList<>();
-
         for (User u : user)
             list.add(toDto(u));
 

src/main/java/com/faf223/expensetrackerfaf/model/Credential.java

@@ -2,7 +2,6 @@ package com.faf223.expensetrackerfaf.model;
 
 import jakarta.persistence.*;
 import lombok.AllArgsConstructor;
-import lombok.Builder;
 import lombok.Data;
 import lombok.NoArgsConstructor;
 
@@ -10,7 +9,6 @@ import lombok.NoArgsConstructor;
 @Entity(name = "credentials")
 @NoArgsConstructor
 @AllArgsConstructor
-@Builder
 public class Credential {
     @Id
     @GeneratedValue(strategy = GenerationType.IDENTITY)

src/main/java/com/faf223/expensetrackerfaf/model/Expense.java

@@ -38,9 +38,6 @@ public class Expense implements IMoneyTransaction {
     @DecimalMin(value = "0.0", inclusive = false)
     private BigDecimal amount;
 
-    public Expense(LocalDate date, BigDecimal amount) {
-    }
-
     public Expense(ExpenseCategory expenseCategory, LocalDate date, BigDecimal amount) {
         this.category = expenseCategory;
         this.date = date;

src/main/java/com/faf223/expensetrackerfaf/model/Family.java

@@ -0,0 +1,42 @@
+package com.faf223.expensetrackerfaf.model;
+
+import jakarta.persistence.*;
+import jakarta.validation.constraints.NotEmpty;
+import lombok.*;
+
+import java.util.List;
+import java.util.Objects;
+
+@Data
+@AllArgsConstructor
+@NoArgsConstructor
+@Entity(name = "family")
+@Builder
+public class Family {
+
+    @Id
+    @GeneratedValue(strategy = GenerationType.IDENTITY)
+    @Column(name = "family_id")
+    private Long id;
+
+    @NotEmpty
+    @Column(name = "family_name")
+    private String name;
+
+    @OneToMany(mappedBy = "family", fetch = FetchType.LAZY, cascade = CascadeType.ALL)
+    @ToString.Exclude
+    private List<User> members;
+
+    @Override
+    public boolean equals(Object o) {
+        if (this == o) return true;
+        if (o == null || getClass() != o.getClass()) return false;
+        Family family = (Family) o;
+        return Objects.equals(id, family.id) && Objects.equals(name, family.name);
+    }
+
+    @Override
+    public int hashCode() {
+        return Objects.hash(id, name);
+    }
+}

src/main/java/com/faf223/expensetrackerfaf/model/User.java

@@ -1,5 +1,6 @@
 package com.faf223.expensetrackerfaf.model;
 
+import com.fasterxml.jackson.annotation.JsonIgnore;
 import jakarta.persistence.*;
 import jakarta.validation.constraints.NotEmpty;
 import jakarta.validation.constraints.NotNull;
@@ -34,6 +35,8 @@
     private String username;
 
     @Transient
+//    @NotNull(message = "Password must not be null")
+//    @NotEmpty(message = "Password must not be empty")
     private String password;
 
     @OneToMany(mappedBy = "user", fetch = FetchType.LAZY, cascade = CascadeType.ALL)
@@ -43,4 +46,10 @@
     @OneToMany(mappedBy = "user", fetch = FetchType.LAZY, cascade = CascadeType.ALL)
     @ToString.Exclude
     private List<Income> incomes;
+
+    @ManyToOne
+    @JoinColumn(name = "family_id")
+    @ToString.Exclude
+    @JsonIgnore
+    private Family family;
 }

src/main/java/com/faf223/expensetrackerfaf/repository/FamilyRepository.java

@@ -0,0 +1,9 @@
+package com.faf223.expensetrackerfaf.repository;
+
+import com.faf223.expensetrackerfaf.model.Family;
+import org.springframework.data.jpa.repository.JpaRepository;
+import org.springframework.stereotype.Repository;
+
+@Repository
+public interface FamilyRepository extends JpaRepository<Family, Long> {
+}

src/main/java/com/faf223/expensetrackerfaf/service/ExpenseService.java

@@ -130,6 +130,8 @@ public class ExpenseService implements ITransactionService {
 
             }
 
+            return true;
+
         }
 
         throw new UserNotAuthenticatedException("You are not authenticated");

src/main/java/com/faf223/expensetrackerfaf/service/FamilyService.java

@@ -0,0 +1,67 @@
+package com.faf223.expensetrackerfaf.service;
+
+import com.faf223.expensetrackerfaf.model.Credential;
+import com.faf223.expensetrackerfaf.model.Family;
+import com.faf223.expensetrackerfaf.model.User;
+import com.faf223.expensetrackerfaf.repository.CredentialRepository;
+import com.faf223.expensetrackerfaf.repository.FamilyRepository;
+import com.faf223.expensetrackerfaf.repository.UserRepository;
+import com.faf223.expensetrackerfaf.util.exceptions.UserNotAuthenticatedException;
+import com.faf223.expensetrackerfaf.util.exceptions.UserNotFoundException;
+import lombok.RequiredArgsConstructor;
+import org.springframework.security.core.Authentication;
+import org.springframework.security.core.context.SecurityContextHolder;
+import org.springframework.security.core.userdetails.UserDetails;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+import java.util.Optional;
+
+@Service
+@RequiredArgsConstructor
+public class FamilyService {
+
+    private final FamilyRepository familyRepository;
+    private final CredentialRepository credentialRepository;
+    private final UserRepository userRepository;
+
+    public List<Family> getFamilies() {
+        return familyRepository.findAll();
+    }
+
+    public void createOrUpdate(Family family) {
+        familyRepository.save(family);
+    }
+
+    public Family getFamilyById(long id) {
+        return familyRepository.findById(id).orElse(null);
+    }
+
+    public boolean containsMember(Family family) {
+        Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
+
+        if (authentication != null && authentication.getPrincipal() instanceof UserDetails userDetails) {
+
+            if(authentication.getAuthorities().stream().noneMatch(authority -> authority.getAuthority().equals("ADMIN"))) {
+
+                Optional<Credential> credential = credentialRepository.findByEmail(userDetails.getUsername());
+                if(credential.isEmpty()) throw new UserNotFoundException("The user has not been found");
+                Optional<User> user = userRepository.findById(credential.get().getUser().getUserUuid());
+                if(user.isEmpty()) throw new UserNotFoundException("The user has not been found");
+
+                return user.get().getFamily().equals(family);
+
+            }
+
+            return true;
+
+        }
+
+        throw new UserNotAuthenticatedException("You are not authenticated");
+    }
+
+    public void deleteFamilyById(long id) {
+        familyRepository.deleteById(id);
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/service/IncomeService.java

@@ -129,6 +129,8 @@ public class IncomeService implements ITransactionService {
 
             }
 
+            return true;
+
         }
 
         throw new UserNotAuthenticatedException("You are not authenticated");

src/main/java/com/faf223/expensetrackerfaf/service/UserService.java

@@ -1,20 +1,12 @@
 package com.faf223.expensetrackerfaf.service;
 
-import com.faf223.expensetrackerfaf.config.JwtService;
-import com.faf223.expensetrackerfaf.controller.auth.AuthenticationResponse;
-import com.faf223.expensetrackerfaf.dto.UserUpdateDTO;
 import com.faf223.expensetrackerfaf.model.Credential;
 import com.faf223.expensetrackerfaf.model.Role;
 import com.faf223.expensetrackerfaf.model.User;
 import com.faf223.expensetrackerfaf.repository.CredentialRepository;
 import com.faf223.expensetrackerfaf.repository.UserRepository;
-import com.faf223.expensetrackerfaf.security.PersonDetails;
-import com.faf223.expensetrackerfaf.util.exceptions.UserNotFoundException;
 import jakarta.transaction.Transactional;
 import lombok.RequiredArgsConstructor;
-import org.springframework.security.core.Authentication;
-import org.springframework.security.core.context.SecurityContextHolder;
-import org.springframework.security.core.userdetails.UserDetails;
 import org.springframework.stereotype.Service;
 
 import java.util.List;
@@ -26,48 +18,11 @@ public class UserService {
 
     private final UserRepository userRepository;
     private final CredentialRepository credentialRepository;
-    private final JwtService jwtService;
 
     public void updateUser(User user) {
         userRepository.save(user);
     }
 
-    public AuthenticationResponse updateUser(UserUpdateDTO userUpdate) {
-        Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
-
-        if (authentication != null && authentication.getPrincipal() instanceof UserDetails userDetails) {
-            User user = getUserByEmail(userDetails.getUsername());
-            Optional<Credential> credential = credentialRepository.findByUser(user);
-
-            if (credential.isPresent()) {
-
-                Credential credentialToUpdate = credential.get();
-
-                if (userUpdate.getUsername() != null)
-                    user.setUsername(userUpdate.getUsername());
-                if (userUpdate.getFirstname() != null)
-                    user.setFirstName(userUpdate.getFirstname());
-                if (userUpdate.getLastname() != null)
-                    user.setLastName(userUpdate.getLastname());
-                if (userUpdate.getEmail() != null)
-                    credentialToUpdate.setEmail(userUpdate.getEmail());
-
-                userRepository.save(user);
-                credentialRepository.save(credentialToUpdate);
-
-                UserDetails details = new PersonDetails(credentialToUpdate);
-                String jwtToken = jwtService.generateToken(details);
-                String refreshToken = jwtService.generateRefreshToken(details);
-
-                return AuthenticationResponse.builder()
-                        .accessToken(jwtToken)
-                        .refreshToken(refreshToken)
-                        .build();
-            }
-        }
-        throw new UserNotFoundException("User not found!");
-    }
-
     public List<User> getUsers() {
         return userRepository.findAll();
     }

src/main/java/com/faf223/expensetrackerfaf/util/exceptions/FamiliesNotFoundException.java

@@ -0,0 +1,9 @@
+package com.faf223.expensetrackerfaf.util.exceptions;
+
+public class FamiliesNotFoundException extends RuntimeException {
+
+    public FamiliesNotFoundException(String message) {
+        super(message);
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/util/exceptions/FamilyNotCreatedException.java

@@ -0,0 +1,9 @@
+package com.faf223.expensetrackerfaf.util.exceptions;
+
+public class FamilyNotCreatedException extends RuntimeException {
+
+    public FamilyNotCreatedException(String message) {
+        super(message);
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/util/exceptions/FamilyNotUpdatedException.java

@@ -0,0 +1,9 @@
+package com.faf223.expensetrackerfaf.util.exceptions;
+
+public class FamilyNotUpdatedException extends RuntimeException {
+
+    public FamilyNotUpdatedException(String message) {
+        super(message);
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/util/exceptions/NotAMemberOfTheFamily.java

@@ -0,0 +1,9 @@
+package com.faf223.expensetrackerfaf.util.exceptions;
+
+public class NotAMemberOfTheFamily extends RuntimeException {
+
+    public NotAMemberOfTheFamily(String message) {
+        super(message);
+    }
+
+}

src/main/java/com/faf223/expensetrackerfaf/web/fullchain.pem

@@ -1,86 +0,0 @@
------BEGIN CERTIFICATE-----
-MIIEHTCCAwWgAwIBAgISBGYC3YGfvdZxQg6y2YUSjvzLMA0GCSqGSIb3DQEBCwUA
-MDIxCzAJBgNVBAYTAlVTMRYwFAYDVQQKEw1MZXQncyBFbmNyeXB0MQswCQYDVQQD
-EwJSMzAeFw0yMzEyMTIxOTAxNTVaFw0yNDAzMTExOTAxNTRaMBkxFzAVBgNVBAMT
-DnRyYWNraW8ub25saW5lMFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEirToCuVv
-qNiT3Rxqsyu2+OmD7TYBW+CV9639OW4FhwHaFxyzoCWI3/w3gZNVE/5Y1CvwHAsw
-qfuam0LjfbnKOKOCAg8wggILMA4GA1UdDwEB/wQEAwIHgDAdBgNVHSUEFjAUBggr
-BgEFBQcDAQYIKwYBBQUHAwIwDAYDVR0TAQH/BAIwADAdBgNVHQ4EFgQUmUFyQf+b
-b16jD80QRaO9ipw7h9kwHwYDVR0jBBgwFoAUFC6zF7dYVsuuUAlA5h+vnYsUwsYw
-VQYIKwYBBQUHAQEESTBHMCEGCCsGAQUFBzABhhVodHRwOi8vcjMuby5sZW5jci5v
-cmcwIgYIKwYBBQUHMAKGFmh0dHA6Ly9yMy5pLmxlbmNyLm9yZy8wGQYDVR0RBBIw
-EIIOdHJhY2tpby5vbmxpbmUwEwYDVR0gBAwwCjAIBgZngQwBAgEwggEDBgorBgEE
-AdZ5AgQCBIH0BIHxAO8AdQA7U3d1Pi25gE6LMFsG/kA7Z9hPw/THvQANLXJv4frU
-FwAAAYxfnyo6AAAEAwBGMEQCIBqYq5pa2GE7UNJHzN+1AAbw///s8PtWNkauU9UO
-igWZAiAktf1uf/O90k1l/+ihkPxJXToxcH5yeOiqATqDMol5PwB2AHb/iD8KtvuV
-UcJhzPWHujS0pM27KdxoQgqf5mdMWjp0AAABjF+fKoMAAAQDAEcwRQIgfNyTycHQ
-D1OMAOBA8vHAyu//5SjnY0BtCxOITyY/W1oCIQCCHFH+VKTFCglsqcp2hwQJHGq/
-jiSj4tR0jYIm5xMlaTANBgkqhkiG9w0BAQsFAAOCAQEAqu7cvsrkAnyrBgQHovQ4
-r+F1S/H6vu/Bvt9x+d125uDa/pT55JO/wG1IvdT9fxws2oYcc/nc8DjvW9U7+peu
-5K675kH09QTi+GhBAU4gZBhx3PohA6qG0Wm/6gC4lOq+S7o32x6RpoptcSvB3UXQ
-9BkgbO6LgDu99jPm6Acv4wre6trXAbPOpSlruSKSENnda7l/CamfiOX0cRKHjZdX
-PNpIfqWXokXNNYDAdrcXbOm7mFVMo1WcjBQM6E++IXfDRqHQ82Y94YVhEdH/hCo6
-3ce9uSrgL9+HcwhHzlZj20rTHFJ6iX/+Ffk8wbYfR4Eu7MXDg8ULT0z93yIvDxgy
-uw==
------END CERTIFICATE-----
------BEGIN CERTIFICATE-----
-MIIFFjCCAv6gAwIBAgIRAJErCErPDBinU/bWLiWnX1owDQYJKoZIhvcNAQELBQAw
-TzELMAkGA1UEBhMCVVMxKTAnBgNVBAoTIEludGVybmV0IFNlY3VyaXR5IFJlc2Vh
-cmNoIEdyb3VwMRUwEwYDVQQDEwxJU1JHIFJvb3QgWDEwHhcNMjAwOTA0MDAwMDAw
-WhcNMjUwOTE1MTYwMDAwWjAyMQswCQYDVQQGEwJVUzEWMBQGA1UEChMNTGV0J3Mg
-RW5jcnlwdDELMAkGA1UEAxMCUjMwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEK
-AoIBAQC7AhUozPaglNMPEuyNVZLD+ILxmaZ6QoinXSaqtSu5xUyxr45r+XXIo9cP
-R5QUVTVXjJ6oojkZ9YI8QqlObvU7wy7bjcCwXPNZOOftz2nwWgsbvsCUJCWH+jdx
-sxPnHKzhm+/b5DtFUkWWqcFTzjTIUu61ru2P3mBw4qVUq7ZtDpelQDRrK9O8Zutm
-NHz6a4uPVymZ+DAXXbpyb/uBxa3Shlg9F8fnCbvxK/eG3MHacV3URuPMrSXBiLxg
-Z3Vms/EY96Jc5lP/Ooi2R6X/ExjqmAl3P51T+c8B5fWmcBcUr2Ok/5mzk53cU6cG
-/kiFHaFpriV1uxPMUgP17VGhi9sVAgMBAAGjggEIMIIBBDAOBgNVHQ8BAf8EBAMC
-AYYwHQYDVR0lBBYwFAYIKwYBBQUHAwIGCCsGAQUFBwMBMBIGA1UdEwEB/wQIMAYB
-Af8CAQAwHQYDVR0OBBYEFBQusxe3WFbLrlAJQOYfr52LFMLGMB8GA1UdIwQYMBaA
-FHm0WeZ7tuXkAXOACIjIGlj26ZtuMDIGCCsGAQUFBwEBBCYwJDAiBggrBgEFBQcw
-AoYWaHR0cDovL3gxLmkubGVuY3Iub3JnLzAnBgNVHR8EIDAeMBygGqAYhhZodHRw
-Oi8veDEuYy5sZW5jci5vcmcvMCIGA1UdIAQbMBkwCAYGZ4EMAQIBMA0GCysGAQQB
-gt8TAQEBMA0GCSqGSIb3DQEBCwUAA4ICAQCFyk5HPqP3hUSFvNVneLKYY611TR6W
-PTNlclQtgaDqw+34IL9fzLdwALduO/ZelN7kIJ+m74uyA+eitRY8kc607TkC53wl
-ikfmZW4/RvTZ8M6UK+5UzhK8jCdLuMGYL6KvzXGRSgi3yLgjewQtCPkIVz6D2QQz
-CkcheAmCJ8MqyJu5zlzyZMjAvnnAT45tRAxekrsu94sQ4egdRCnbWSDtY7kh+BIm
-lJNXoB1lBMEKIq4QDUOXoRgffuDghje1WrG9ML+Hbisq/yFOGwXD9RiX8F6sw6W4
-avAuvDszue5L3sz85K+EC4Y/wFVDNvZo4TYXao6Z0f+lQKc0t8DQYzk1OXVu8rp2
-yJMC6alLbBfODALZvYH7n7do1AZls4I9d1P4jnkDrQoxB3UqQ9hVl3LEKQ73xF1O
-yK5GhDDX8oVfGKF5u+decIsH4YaTw7mP3GFxJSqv3+0lUFJoi5Lc5da149p90Ids
-hCExroL1+7mryIkXPeFM5TgO9r0rvZaBFOvV2z0gp35Z0+L4WPlbuEjN/lxPFin+
-HlUjr8gRsI3qfJOQFy/9rKIJR0Y/8Omwt/8oTWgy1mdeHmmjk7j1nYsvC9JSQ6Zv
-MldlTTKB3zhThV1+XWYp6rjd5JW1zbVWEkLNxE7GJThEUG3szgBVGP7pSWTUTsqX
-nLRbwHOoq7hHwg==
------END CERTIFICATE-----
------BEGIN CERTIFICATE-----
-MIIFYDCCBEigAwIBAgIQQAF3ITfU6UK47naqPGQKtzANBgkqhkiG9w0BAQsFADA/
-MSQwIgYDVQQKExtEaWdpdGFsIFNpZ25hdHVyZSBUcnVzdCBDby4xFzAVBgNVBAMT
-DkRTVCBSb290IENBIFgzMB4XDTIxMDEyMDE5MTQwM1oXDTI0MDkzMDE4MTQwM1ow
-TzELMAkGA1UEBhMCVVMxKTAnBgNVBAoTIEludGVybmV0IFNlY3VyaXR5IFJlc2Vh
-cmNoIEdyb3VwMRUwEwYDVQQDEwxJU1JHIFJvb3QgWDEwggIiMA0GCSqGSIb3DQEB
-AQUAA4ICDwAwggIKAoICAQCt6CRz9BQ385ueK1coHIe+3LffOJCMbjzmV6B493XC
-ov71am72AE8o295ohmxEk7axY/0UEmu/H9LqMZshftEzPLpI9d1537O4/xLxIZpL
-wYqGcWlKZmZsj348cL+tKSIG8+TA5oCu4kuPt5l+lAOf00eXfJlII1PoOK5PCm+D
-LtFJV4yAdLbaL9A4jXsDcCEbdfIwPPqPrt3aY6vrFk/CjhFLfs8L6P+1dy70sntK
-4EwSJQxwjQMpoOFTJOwT2e4ZvxCzSow/iaNhUd6shweU9GNx7C7ib1uYgeGJXDR5
-bHbvO5BieebbpJovJsXQEOEO3tkQjhb7t/eo98flAgeYjzYIlefiN5YNNnWe+w5y
-sR2bvAP5SQXYgd0FtCrWQemsAXaVCg/Y39W9Eh81LygXbNKYwagJZHduRze6zqxZ
-Xmidf3LWicUGQSk+WT7dJvUkyRGnWqNMQB9GoZm1pzpRboY7nn1ypxIFeFntPlF4
-FQsDj43QLwWyPntKHEtzBRL8xurgUBN8Q5N0s8p0544fAQjQMNRbcTa0B7rBMDBc
-SLeCO5imfWCKoqMpgsy6vYMEG6KDA0Gh1gXxG8K28Kh8hjtGqEgqiNx2mna/H2ql
-PRmP6zjzZN7IKw0KKP/32+IVQtQi0Cdd4Xn+GOdwiK1O5tmLOsbdJ1Fu/7xk9TND
-TwIDAQABo4IBRjCCAUIwDwYDVR0TAQH/BAUwAwEB/zAOBgNVHQ8BAf8EBAMCAQYw
-SwYIKwYBBQUHAQEEPzA9MDsGCCsGAQUFBzAChi9odHRwOi8vYXBwcy5pZGVudHJ1
-c3QuY29tL3Jvb3RzL2RzdHJvb3RjYXgzLnA3YzAfBgNVHSMEGDAWgBTEp7Gkeyxx
-+tvhS5B1/8QVYIWJEDBUBgNVHSAETTBLMAgGBmeBDAECATA/BgsrBgEEAYLfEwEB
-ATAwMC4GCCsGAQUFBwIBFiJodHRwOi8vY3BzLnJvb3QteDEubGV0c2VuY3J5cHQu
-b3JnMDwGA1UdHwQ1MDMwMaAvoC2GK2h0dHA6Ly9jcmwuaWRlbnRydXN0LmNvbS9E
-U1RST09UQ0FYM0NSTC5jcmwwHQYDVR0OBBYEFHm0WeZ7tuXkAXOACIjIGlj26Ztu
-MA0GCSqGSIb3DQEBCwUAA4IBAQAKcwBslm7/DlLQrt2M51oGrS+o44+/yQoDFVDC
-5WxCu2+b9LRPwkSICHXM6webFGJueN7sJ7o5XPWioW5WlHAQU7G75K/QosMrAdSW
-9MUgNTP52GE24HGNtLi1qoJFlcDyqSMo59ahy2cI2qBDLKobkx/J3vWraV0T9VuG
-WCLKTVXkcGdtwlfFRjlBz4pYg1htmf5X6DYO8A4jqv2Il9DjXA6USbW1FzXSLr9O
-he8Y4IWS6wY7bCkjCWDcRQJMEhg76fsO3txE+FiYruq9RUWhiF1myv4Q6W+CyBFC
-Dfvp7OOGAN6dEOM4+qR9sdjoSYKEBpsr6GtPAQw4dy753ec5
------END CERTIFICATE-----

src/main/java/com/faf223/expensetrackerfaf/web/privkey.pem

@@ -1,5 +0,0 @@
------BEGIN PRIVATE KEY-----
-MIGHAgEAMBMGByqGSM49AgEGCCqGSM49AwEHBG0wawIBAQQg9kCIfgqNqFYgYU0Q
-HGi/jc5nLxhZxoXST5qeXBGtOAehRANCAASKtOgK5W+o2JPdHGqzK7b46YPtNgFb
-4JX3rf05bgWHAdoXHLOgJYjf/DeBk1UT/ljUK/AcCzCp+5qbQuN9uco4
------END PRIVATE KEY-----

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/+page.svelte

@@ -8,8 +8,6 @@
 
     function handleTabClick(tab) {
         selectedTab.set(tab);
-        // $isCategorizedIncome = false;
-        // $isCategorizedExpense = false;
     }
 
     let screenWidth;
@@ -41,11 +39,9 @@
 
 <style>
     @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400');
-    @import url('https://fonts.googleapis.com/css?family=Inconsolata');
 
     #wrapper {
         padding: 0;
-        font-family: Inconsolata,"Source Sans Pro",sans-serif;
         margin: 0;
         display: flex;
         align-items: stretch;

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/AdminPanel.svelte

@@ -1,80 +1 @@
-<script>
+<h1>ADMIN PANEL</h1>
-    import { onMount } from "svelte";
-    import axios from "axios";
-    import { getCookie } from "svelte-cookie";
-
-    let isLoaded = false;
-
-    onMount(async () => {
-        isLoaded = false;
-        isLoaded = true;
-        const token = getCookie('access_token');
-
-        if (token === '') {
-            window.location.href = '/auth/login';
-            return;
-        }
-
-        const config = {
-            headers: {
-                'Authorization': `Bearer ${token}`
-            }
-        };
-
-        try {
-            const response = await axios.get('https://trackio.online:8081/users', config);
-            const userResponse = response.data;
-            userData = userResponse;
-
-        } catch (error) {
-            console.error(error)
-        }
-    });
-</script>
-
-<div class="adminContainer">
-    {#if !isLoaded}
-        <div class="loading-container">
-            <div class="loading-spinner"></div>
-            <div class="loading-text">Loading...</div>
-        </div>
-    {:else}
-        LOL
-    {/if}
-</div>
-
-<style>
-
-    .adminContainer {
-        display: flex;
-        height: 100%;
-        flex-direction: row;
-        justify-content: center;
-        align-items: center;
-    }
-
-    .loading-container {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-    }
-
-    .loading-spinner {
-        border: 8px solid rgba(0, 0, 0, 0.1);
-        border-top: 8px solid #3498db;
-        border-radius: 50%;
-        width: 50px;
-        height: 50px;
-        animation: spin 1s linear infinite;
-    }
-
-    @keyframes spin {
-        0% { transform: rotate(0deg); }
-        100% { transform: rotate(360deg); }
-    }
-
-    .loading-text {
-        margin-top: 10px;
-    }
-</style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/Dashboard.svelte

@@ -13,8 +13,7 @@
             monthIncome,
             monthExpense,
             tempExpense,
-            tempIncome, copyExpenseData, copyIncomeData,
+            tempIncome
-            isAdmin, username
         } from "../stores.js";
         import {globalStyles} from "../styles.js";
 
@@ -45,17 +44,6 @@
                 };
 
             try {
-
-                try {
-                    const response = await axios.get('https://trackio.online:8081/users/get-user-data', config);
-                    const data = response.data;
-                    $username = data.username;
-                    $isAdmin = data.userrole === 'ROLE_ADMIN';
-
-                } catch (error) {
-                    console.error('Error:', error);
-                }
-
                 const currentDate = new Date();
                 const currentMonth = currentDate.getMonth() + 1;
                 const [incomeResponse, expenseResponse, incomeTypesResponse, expenseTypesResponse] = await Promise.all([
@@ -70,9 +58,6 @@
                 incomeData.set(incomeResponse.data);
                 expenseData.set(expenseResponse.data);
 
-                copyExpenseData.set(expenseResponse.data);
-                copyIncomeData.set(incomeResponse.data);
-
                 incomeTypes.set(incomeTypesResponse.data);
                 expenseTypes.set(expenseTypesResponse.data);
 

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/ExpenseDashboard.svelte

@@ -3,7 +3,6 @@
     import QuickInfobar from "./expenses/other/QuickInfobar.svelte";
     import Expenses from "./expenses/infolists/Expenses.svelte";
     import Graph3 from "./expenses/graphs/Graph3.svelte";
-    import Graph2 from "./expenses/graphs/Graph2.svelte";
 </script>
 
 <div class="expenseContainer">
@@ -15,7 +14,6 @@
 
         <div class="graphs">
             <Graph3 />
-            <Graph2 />
         </div>
     </div>
     <Expenses />
@@ -28,10 +26,6 @@
             flex: 1 1 auto;
             width: 100%;
         }
-
-        .graphs {
-            flex-wrap: wrap;
-        }
     }
 
     .graphs {
@@ -48,7 +42,6 @@
     .expenseContainer {
         display: flex;
         height: 100%;
-        background-color: #172233;
         flex-direction: row;
         justify-content: space-between;
     }
@@ -60,8 +53,7 @@
         flex-direction: column;
         flex: 1 1 auto;
         background-color: #212942;
-        border-radius: 20px;
+        padding: 10px;
-        /*padding: 10px;*/
     }
 </style>
 

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/IncomeDashboard.svelte

@@ -1,67 +1,9 @@
 <script>
     import DashHeader from "./incomes/other/DashHeader.svelte";
+    import DataMenu from "./incomes/other/DataMenu.svelte";
     import QuickInfobar from "./incomes/other/QuickInfobar.svelte";
-    import Incomes from "./incomes/infolists/Incomes.svelte";
-    import Graph3 from "./incomes/graphs/Graph3.svelte";
-    import Graph2 from "./incomes/graphs/Graph2.svelte";
 </script>
 
-<div class="incomeContainer">
-    <div class="dataHalf">
-        <div>
 <DashHeader />
 <QuickInfobar />
-        </div>
+<DataMenu />
-
-        <div class="graphs">
-            <Graph3 />
-            <Graph2 />
-        </div>
-    </div>
-    <Incomes />
-</div>
-
-<style>
-    @media only screen and (max-width: 900px) {
-        .incomeContainer {
-            flex-wrap: wrap;
-            flex: 1 1 auto;
-            width: 100%;
-        }
-
-        .graphs {
-            flex-wrap: wrap;
-        }
-    }
-
-    .graphs {
-        display:flex;
-        flex-direction: row;
-        justify-content: space-between;
-        align-items: stretch;
-        min-width: 0;
-        min-height: 0;
-        height: 100% !important;
-        width: 100% !important;
-        flex: 1 1 auto;
-    }
-    .incomeContainer {
-        display: flex;
-        height: 100%;
-        background-color: #172233;
-        flex-direction: row;
-        justify-content: space-between;
-    }
-
-    .dataHalf {
-        display:flex;
-        min-height: 0;
-        min-width: 0;
-        flex-direction: column;
-        flex: 1 1 auto;
-        background-color: #212942;
-        border-radius: 20px;
-        /*padding: 10px;*/
-    }
-</style>
-

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/expenses/graphs/Graph2.svelte

@@ -1,7 +1,7 @@
 <script>
 	import Chart from 'chart.js/auto';
 	import {onMount} from 'svelte';
-	import {monthExpense} from "../../../stores.js";
+	import {expenseData} from "../../../stores.js";
 	import {globalStyles} from "../../../styles.js";
 
 	let ctx;
@@ -10,7 +10,7 @@
 
 	function groupAndSumByCategory() {
 		const groupedData = new Map();
-		$monthExpense.forEach(expense => {
+		$expenseData.forEach(expense => {
 					const category = expense.expenseCategory.name;
 					if (groupedData.has(category)) {
 						groupedData.set(category, groupedData.get(category) + parseInt(expense.amount));
@@ -26,6 +26,8 @@
 	function createGraph() {
 		try {
 			const groupedExpenseData = groupAndSumByCategory();
+			console.log("============= here start")
+			console.log(groupedExpenseData);
 
 			const chartLabels = [];
 			const chartValues = [];
@@ -34,44 +36,32 @@
 				chartLabels.push(label);
 				chartValues.push(value);
 			}
-
+			console.log(chartLabels)
+			console.log(chartValues)
+			console.log("============= here end")
 			ctx = chartCanvas.getContext('2d');
 
 			if (!chart) {
 				chart = new Chart(ctx, {
-					type: 'doughnut',
+					type: 'bar',
 					data: {
 						labels: chartLabels,
 						datasets: [{
 							label: 'Spendings',
+							backgroundColor: [
+								'rgb(107, 80, 107)',
+								'rgb(171, 61, 169)',
+								'rgb(222, 37, 218)',
+								'rgb(235, 68, 232)',
+								'rgb(255, 128, 255)'],
 							data: chartValues
 						}]
 					},
 					options: {
 						responsive: true,
 						maintainAspectRatio: false,
-						backgroundColor: [
-							'rgb(255, 140, 140)',
-							'rgb(140, 180, 255)',
-							'rgb(255, 200, 140)',
-							'rgb(160, 200, 160)',
-							'rgb(160, 130, 200)',
-							'rgb(255, 160, 140)',
-							'rgb(140, 180, 255)',
-							'rgb(160, 255, 160)',
-							'rgb(255, 140, 120)',
-							'rgb(160, 140, 200)',
-							'rgb(255, 220, 140)',
-							'rgb(140, 255, 255)',
-							'rgb(255, 160, 140)',
-							'rgb(160, 255, 160)',
-							'rgb(160, 160, 255)'
-						],
 						plugins: {
 							legend: {
-								position: 'bottom',
-								align: 'start',
-								fullWidth: false,
 								labels: {
 									font: {
 										weight: 'bold'
@@ -93,7 +83,7 @@
 	}
 
 	$: {
-		if ($monthExpense) {
+		if ($expenseData) {
 			createGraph();
 		}
 	}
@@ -109,25 +99,16 @@
 
 <style>
 	#chart {
-		min-width: 0;
-		min-height:0;
 		box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 		transition: all 0.3s cubic-bezier(.25,.8,.25,1);
-		display: flex;
+		flex: 1;
-		flex: 1 1 auto;
+		border-radius: 0 0 10px 10px;
-		flex-grow: 1;
+		margin: 0 0 10px 10px;
-		padding: 10px;
+		min-width: 0;
-		border-radius: 10px;
+		min-height:0;
-		margin: 0 10px 10px;
 	}
 
 	#chart:hover {
 		box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
 	}
-
-	@media only screen and (max-width: 900px) {
-		#chart {
-			min-height: 400px;
-		}
-	}
 </style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/expenses/graphs/Graph3.svelte

@@ -1,7 +1,7 @@
 <script>
 	import Chart from 'chart.js/auto';
 	import { onMount } from 'svelte';
-	import {monthIncome, monthExpense, isCategorizedExpense, categorizedExpense, expenseCategoryLabel} from "../../../stores.js";
+	import {monthIncome, monthExpense, isCategorizedExpense, categorizedExpense} from "../../../stores.js";
 	import { globalStyles } from "../../../styles.js";
 
 	let ctx;
@@ -12,26 +12,19 @@
 
 	function createGraph() {
 		try {
+			// const allDates = [...new Set([...$monthIncome, ...$monthExpense].map(item => item.date))];
+			// const uniqueDates = allDates.sort((a, b) => new Date(a) - new Date(b));
+			//
+			// const incomeValues = uniqueDates.map(date => $monthIncome.filter(item => item.date === date).reduce((total, item) => total + item.amount, 0));
+			// const expenseValues = uniqueDates.map(date => $monthExpense.filter(item => item.date === date).reduce((total, item) => total + item.amount, 0));
+
 			if (chartCanvas.getContext('2d') !== undefined) {
 				ctx = chartCanvas.getContext('2d');
 				if (!chart) {
-					console.log(generatedData);
 					chart = new Chart(ctx, {
 						type: 'line',
 						data: generatedData,
 						options: {
-							scales: {
-								y: {
-									ticks: {
-										color: 'rgb(255,255,255)'
-									}
-								},
-								x: {
-									ticks: {
-										color: 'rgb(255,255,255)'
-									}
-								}
-							},
 							responsive: true,
 							maintainAspectRatio: false
 						}
@@ -41,10 +34,11 @@
 						chart.data.labels = generatedData.labels;
 						chart.data.datasets = generatedData.datasets;
 					} else {
-						generatedData.datasets = generatedData.datasets.filter(dataset => dataset.label !== $expenseCategoryLabel);
+						generatedData.datasets = generatedData.datasets.filter(dataset => dataset.label !== "Category");
 						chart.data.labels = generatedData.labels;
 						chart.data.datasets = generatedData.datasets;
 					}
+
 					chart.update();
 				}
 			}
@@ -65,7 +59,7 @@
 				labels: uniqueDates,
 				datasets: [
 					{
-						label: $expenseCategoryLabel,
+						label: "Category",
 						backgroundColor: "rgba(21, 194, 58, 0.4)",
 						borderColor: "rgba(21, 194, 58, 1)",
 						data: categorizedValues,
@@ -82,13 +76,6 @@
 					}
 				]
 			};
-
-			const tempData = generatedData.datasets.filter(dataset => dataset.label !== undefined);
-
-			generatedData = {
-				labels: generatedData.labels || [],
-				datasets: tempData
-			};
 		} else {
 			const allDates = [...new Set([...$monthExpense].map(item => item.date))];
 			const uniqueDates = allDates.sort((a, b) => new Date(a) - new Date(b));
@@ -107,13 +94,6 @@
 							fill: true
 						}
 			};
-
-			const tempData = generatedData.datasets.filter(dataset => dataset.label !== undefined);
-
-			generatedData = {
-				labels: generatedData.labels || [],
-				datasets: tempData
-			};
 		}
 
 		if ($monthIncome || $monthExpense || $isCategorizedExpense || $categorizedExpense) {
@@ -138,19 +118,11 @@
 		transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
 		display: flex;
 		flex: 1 1 auto;
-		flex-grow: 2;
+		border-radius: 0 0 10px 10px;
-		border-radius: 10px;
+		margin: 0 0 10px 10px;
-		margin: 0 10px 10px;
-		padding: 10px;
 	}
 
 	#chart:hover {
 		box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
 	}
-
-	@media only screen and (max-width: 900px) {
-		#chart {
-			min-height: 400px;
-		}
-	}
 </style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/expenses/infolists/Expenses.svelte

@@ -10,9 +10,7 @@
         monthIncome,
         monthExpense,
         isCategorizedExpense,
-        categorizedExpense,
+        categorizedExpense
-        expenseCategoryLabel,
-        currencyLabel, copyExpenseData, copyIncomeData, isCategorizedIncome
     } from "../../../stores.js";
     import {globalStyles} from "../../../styles.js";
     import {onMount} from "svelte";
@@ -38,9 +36,6 @@
 
     let isDateDropdownExpanded = false
     let isCategoryDropdownExpanded = false
-    let isCurrencyDropdownExpanded = false
-    let isFilterDown = false;
-
     let dropdownStates = {};
     let deleteDropdownStates = {}
 
@@ -53,27 +48,8 @@
         });
     }
 
-    function clickFilter() {
-        isDateDropdownExpanded = false;
-        isCategoryDropdownExpanded = false;
-        isFilterDown = !isFilterDown;
-        isCurrencyDropdownExpanded = false;
-    }
     function clickHandlerDate() {
         isDateDropdownExpanded = !isDateDropdownExpanded
-        isCategoryDropdownExpanded = false;
-    }
-
-    function clickHandlerCategory() {
-        isCategoryDropdownExpanded = !isCategoryDropdownExpanded;
-        isDateDropdownExpanded = false;
-    }
-
-    function clickHandlerCurrency() {
-        isCurrencyDropdownExpanded = !isCurrencyDropdownExpanded;
-        isCategoryDropdownExpanded = false;
-        isDateDropdownExpanded = false;
-        isFilterDown = false;
     }
 
     function clickItemHandler(id) {
@@ -86,19 +62,26 @@
         if (dropdownStates[id] === true) dropdownStates[id] = false;
     }
 
+    function clickHandlerCategory() {
+        isCategoryDropdownExpanded = !isCategoryDropdownExpanded;
+    }
+
     function clickOutsideHandler(event) {
-        const isDateButton = event.target.closest("#expenseInfo");
+        const isDateButton = event.target.closest("#btn1");
+        const isCategoryButton = event.target.closest("#btn2");
 
         if (!isDateButton) {
-            isFilterDown = false;
-            isCategoryDropdownExpanded = false;
             isDateDropdownExpanded = false;
-            isCurrencyDropdownExpanded = false;
+        }
+
+        if (!isCategoryButton) {
+            isCategoryDropdownExpanded = false;
         }
     }
 
     onMount(() => {
         document.body.addEventListener("click", clickOutsideHandler);
+
         return () => {
             document.body.removeEventListener("click", clickOutsideHandler);
         };
@@ -115,7 +98,6 @@
             });
             expenseData.set(response1.data);
             tempExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
             const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?date=' + currentDay, {
                 headers: {
                     'Authorization': `Bearer ${getCookie('access_token')}`
@@ -123,12 +105,10 @@
             });
             incomeData.set(response2.data);
             tempIncome.set(response2.data);
-            copyIncomeData.set(response1.data);
             $dateText = "Today"
 
             $isCategorizedExpense = false;
             categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
         } catch (error) {
             console.error("Error fetching expenses:", error);
         }
@@ -150,7 +130,6 @@
             });
             expenseData.set(response1.data);
             tempExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
             const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?date=' + yesterdayString, {
                 headers: {
                     'Authorization': `Bearer ${getCookie('access_token')}`
@@ -158,9 +137,7 @@
             });
             incomeData.set(response2.data);
             tempIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
             $dateText = "Yesterday"
-            changeCurrency($currencyLabel);
         } catch (error) {
             console.error("Error fetching expenses:", error);
         }
@@ -180,7 +157,6 @@
             expenseData.set(response1.data);
             tempExpense.set(response1.data);
             monthExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
             const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?month=' + year, {
                 headers: {
                     'Authorization': `Bearer ${getCookie('access_token')}`
@@ -190,12 +166,10 @@
             incomeData.set(response2.data);
             tempIncome.set(response2.data);
             monthIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
             $dateText = "This Month"
 
             $isCategorizedExpense = false;
             categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
         } catch (error) {
             console.error("Error fetching expenses:", error);
         }
@@ -215,7 +189,6 @@
             expenseData.set(response1.data);
             tempExpense.set(response1.data)
             monthExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
             const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?month=' + year, {
                 headers: {
                     'Authorization': `Bearer ${getCookie('access_token')}`
@@ -225,12 +198,10 @@
             incomeData.set(response2.data);
             tempIncome.set(response2.data);
             monthIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
             $dateText = "Last Month"
 
             $isCategorizedExpense = false;
             categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
         } catch (error) {
             console.error("Error fetching expenses:", error);
         }
@@ -250,7 +221,6 @@
             expenseData.set(response1.data);
             tempExpense.set(response1.data);
             monthExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
             const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?year=' + year, {
                 headers: {
                     'Authorization': `Bearer ${getCookie('access_token')}`
@@ -260,12 +230,10 @@
             incomeData.set(response2.data);
             tempIncome.set(response2.data);
             monthIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
             $dateText = "This Year"
 
             $isCategorizedExpense = false;
             categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
         } catch (error) {
             console.error("Error fetching expenses:", error);
         }
@@ -273,7 +241,6 @@
 
     function filterByCategory(category) {
         $isCategorizedExpense = true;
-        $expenseCategoryLabel = category;
         console.log($isCategorizedExpense);
         let tempArr = $tempExpense.filter(expense => expense.expenseCategory.name === category);
         categorizedExpense.set(tempArr);
@@ -282,7 +249,6 @@
 
     function getAll() {
         categorizedExpense.set([]);
-        $expenseCategoryLabel = "Category";
         $isCategorizedExpense = false;
         console.log($isCategorizedExpense);
         expenseData.set($tempExpense);
@@ -292,83 +258,13 @@
 
     }
 
-    function changeCurrency(currency) {
-        if (currency === 'USD') {
-            expenseData.set($copyExpenseData);
-            incomeData.set($copyIncomeData);
-            $currencyLabel = "USD";
-        }
-        if (currency === 'MDL') {
-            const tempData1 = $copyExpenseData.map(expense => ({
-                ...expense,
-                amount: expense.amount / 0.056
-            }));
-            expenseData.set(tempData1);
-
-            const tempData2 = $copyIncomeData.map(income => ({
-                ...income,
-                amount: income.amount / 0.056
-            }));
-            incomeData.set(tempData2);
-            $currencyLabel = "MDL";
-        }
-        if (currency === 'EUR') {
-            const tempData1 = $copyExpenseData.map(expense => ({
-                ...expense,
-                amount: expense.amount / 1.08
-            }));
-            expenseData.set(tempData1);
-
-            const tempData2 = $copyIncomeData.map(income => ({
-                ...income,
-                amount: income.amount / 1.08
-            }));
-            incomeData.set(tempData2);
-            $currencyLabel = "EUR";
-        }
-
-        if (currency === 'GBP') {
-            const tempData1 = $copyExpenseData.map(expense => ({
-                ...expense,
-                amount: expense.amount / 1.26
-            }));
-            expenseData.set(tempData1);
-
-            const tempData2 = $copyIncomeData.map(income => ({
-                ...income,
-                amount: income.amount / 1.26
-            }));
-            incomeData.set(tempData2);
-            $currencyLabel = "GBP";
-        }
-    }
 </script>
 
 <div id="expenseInfo" style="background-color: {$globalStyles.mainColor}">
     <ContentExpense/>
-    <div style="display: flex; justify-content: space-around">
+    <div style="display: flex; justify-content: space-between">
-
-        <div id="dropdown" style="margin: 10px; display: flex; justify-content: space-between">
-            <button id="btn1" class="button" on:click={clickFilter}>Filter ▼</button>
-        </div>
-
-        <div id="dropdown-currency" style="margin: 10px;">
-            <button id="btn2" class="button" on:click={clickHandlerCurrency}>Currency ▼</button>
-        </div>
-    </div>
-
-    <div>
-        {#if isFilterDown}
-            <div style="margin: 10px; display: flex; justify-content: space-between" transition:slide>
         <div id="dropdown-date" style="margin: 10px;">
-                    <button id="btn3" class="button" on:click={clickHandlerDate}>Filter by Date ▼</button></div>
+            <button id="btn1" class="button" on:click={clickHandlerDate}>Filter by Date ▼</button>
-
-                <div id="dropdown-category" style="margin: 10px;">
-                    <button id="btn4" class="button" on:click={clickHandlerCategory}>Filter by Category ▼</button>
-                </div>
-            </div>
-        {/if}
-
             {#if isDateDropdownExpanded}
                 <div id="date-list" transition:slide>
                     <div class="date-entry" on:click={() => getToday()} role="button" tabindex="0"
@@ -388,7 +284,10 @@
                     </div>
                 </div>
             {/if}
+        </div>
 
+        <div id="dropdown-category" style="margin: 10px;">
+            <button id="btn2" class="button" on:click={clickHandlerCategory}>Filter by Category ▼</button>
             {#if isCategoryDropdownExpanded}
                 <div id="date-list" transition:slide>
                     <div class="date-entry" on:click={() => getAll()} role="button"
@@ -401,52 +300,30 @@
                     {/each}
                 </div>
             {/if}
-
-        {#if isCurrencyDropdownExpanded}
-            <div id="date-list" transition:slide>
-                <div class="date-entry" on:click={() => changeCurrency("MDL")} role="button"
-                     tabindex="0" on:keydown={doNothing}>MDL Leu</div>
-                <div class="date-entry" on:click={() => changeCurrency("GBP")} role="button"
-                     tabindex="0" on:keydown={doNothing}>GBP Pound</div>
-                <div class="date-entry" on:click={() => changeCurrency("USD")} role="button"
-                     tabindex="0" on:keydown={doNothing}>USD Dollar</div>
-                <div class="date-entry" on:click={() => changeCurrency("EUR")} role="button"
-                     tabindex="0" on:keydown={doNothing}>EUR Euro</div>
         </div>
-        {/if}
     </div>
     <div id="listContainer" style="color: {$globalStyles.color}">
         <ul>
             {#each $expenseData.toReversed() as item (item.expenseId)}
                 <li style="display:flex; flex-direction: column; justify-content: space-between; color: {$globalStyles.color}">
                     <div style="display:flex; flex-direction: row; justify-content: space-between; align-items: center;">
-                    <div>
+                    <span>
                         {#if textToIcon[item.expenseCategory.name]}
                         {@html textToIcon[item.expenseCategory.name]}
                     {/if}
                         <span style="font-weight: bold">{item.incomeCategory ? `${item.incomeCategory.name}: ` : `${item.expenseCategory.name}: `}</span>
-                    <span style="font-weight:bold; margin-right: 10px; color: red; font-size: larger">{item.incomeCategory ? `+${item.amount.toFixed(2)} ${$currencyLabel}` : `-${item.amount.toFixed(2)} ${$currencyLabel}`}</span>
+                    <span style="font-weight:bold; margin-right: 10px; color: red; font-size: larger">{item.incomeCategory ? `+${item.amount}$` : `-${item.amount}$`}</span>
-                    </div>
+                    </span>
-                        <div style="margin-right: 5px; display: flex; flex-direction: row">
+                        <span style="margin-right: 5px;">{`${item.date}`}
-
+                            <span id="editBtn" role="button" tabindex="0" on:keydown={doNothing}
-                            <div>
+                                  on:click={() => clickItemHandler(item.expenseId)}><svg
-                                {`${item.date}`}
-                            </div>
-
-                            <div id="editBtnDiv" role="button" tabindex="0" on:keydown={doNothing}
-                                 on:click={() => clickItemHandler(item.expenseId)}>
-                                <span id="editBtn"><svg
                                     xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 512 512"><path
                                     d="M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.7 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160V416c0 53 43 96 96 96H352c53 0 96-43 96-96V320c0-17.7-14.3-32-32-32s-32 14.3-32 32v96c0 17.7-14.3 32-32 32H96c-17.7 0-32-14.3-32-32V160c0-17.7 14.3-32 32-32h96c17.7 0 32-14.3 32-32s-14.3-32-32-32H96z"/></svg></span>
-                            </div>
+                        <span id="deleteBtn" role="button" tabindex="0" on:keydown={doNothing}
-
+                              on:click={() => clickDeleteHandler(item.expenseId)}><svg
-                            <div id="deleteBtnDiv" role="button" tabindex="0" on:keydown={doNothing}
-                                 on:click={() => clickDeleteHandler(item.expenseId)}>
-                                <span id="deleteBtn"><svg
                                 xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><path
                                 d="M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z"/></svg></span>
-                            </div>
+                    </span>
-                            </div>
                     </div>
 
                     {#if dropdownStates[item.expenseId]}
@@ -474,7 +351,6 @@
 </div>
 
 <style>
-
     #textf {
         font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
         font-size: 20px;
@@ -546,7 +422,7 @@
     }
 
     #editBtn {
-        margin-left: 10px;
+        margin-left: 5px;
         margin-right: 5px;
         fill: darkblue;
     }
@@ -564,7 +440,6 @@
 
     #deleteBtn {
         fill: red;
-        margin-left: 5px;
     }
 
     #deleteBtn:hover {
@@ -675,10 +550,12 @@
 
     #date-list {
         background-color: black;
-        margin: 0 20px 20px;
+        position: absolute;
+        margin-top: 20px;
         max-height: 400px;
         overflow-y: scroll;
         border-radius: 20px;
+        z-index: 1;
     }
 
     .date-entry {

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/expenses/other/DashHeader.svelte

@@ -4,16 +4,17 @@ import {globalStyles} from "../../../styles.js";
 </script>
 
 <div id="header">
-    <div id="dashboardTitleWrapper" style="color: white">
+    <div id="dashboardTitleWrapper" style="color: {$globalStyles.dashTextColor}">
-        <h1 id="dashboardTitle">Dashboard - Expenses</h1>
+        <h5>Hello, welcome to your</h5>
+        <h1 id="dashboardTitle">Dashboard</h1>
     </div>
 
     <div id="icons">
         <div class="headerbtn searchButton">
-            <svg style="fill: white" xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 512 512"><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>
+            <svg style="fill: {$globalStyles.dashTextColor}" xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 512 512"><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>
         </div>
         <div class="headerbtn notificationButton">
-            <svg style="fill: white" xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 448 512"><path d="M224 0c-17.7 0-32 14.3-32 32V49.9C119.5 61.4 64 124.2 64 200v33.4c0 45.4-15.5 89.5-43.8 124.9L5.3 377c-5.8 7.2-6.9 17.1-2.9 25.4S14.8 416 24 416H424c9.2 0 17.6-5.3 21.6-13.6s2.9-18.2-2.9-25.4l-14.9-18.6C399.5 322.9 384 278.8 384 233.4V200c0-75.8-55.5-138.6-128-150.1V32c0-17.7-14.3-32-32-32zm0 96h8c57.4 0 104 46.6 104 104v33.4c0 47.9 13.9 94.6 39.7 134.6H72.3C98.1 328 112 281.3 112 233.4V200c0-57.4 46.6-104 104-104h8zm64 352H224 160c0 17 6.7 33.3 18.7 45.3s28.3 18.7 45.3 18.7s33.3-6.7 45.3-18.7s18.7-28.3 18.7-45.3z"/></svg>
+            <svg style="fill: {$globalStyles.dashTextColor}" xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 448 512"><path d="M224 0c-17.7 0-32 14.3-32 32V49.9C119.5 61.4 64 124.2 64 200v33.4c0 45.4-15.5 89.5-43.8 124.9L5.3 377c-5.8 7.2-6.9 17.1-2.9 25.4S14.8 416 24 416H424c9.2 0 17.6-5.3 21.6-13.6s2.9-18.2-2.9-25.4l-14.9-18.6C399.5 322.9 384 278.8 384 233.4V200c0-75.8-55.5-138.6-128-150.1V32c0-17.7-14.3-32-32-32zm0 96h8c57.4 0 104 46.6 104 104v33.4c0 47.9 13.9 94.6 39.7 134.6H72.3C98.1 328 112 281.3 112 233.4V200c0-57.4 46.6-104 104-104h8zm64 352H224 160c0 17 6.7 33.3 18.7 45.3s28.3 18.7 45.3 18.7s33.3-6.7 45.3-18.7s18.7-28.3 18.7-45.3z"/></svg>
         </div>
     </div>
 </div>
@@ -32,6 +33,10 @@ import {globalStyles} from "../../../styles.js";
         margin: 20px 20px 0;
     }
 
+    #dashboardTitleWrapper h5 {
+        margin: 0;
+    }
+
     #dashboardTitleWrapper h1 {
         margin-top: 0;
     }

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/expenses/other/QuickInfobar.svelte

@@ -1,52 +1,36 @@
 <script>
     import { onMount } from 'svelte';
-    import { incomeData, expenseData, currencyLabel } from "../../../stores.js";
+    import { incomeData, expenseData } from "../../../stores.js";
     import {globalStyles} from "../../../styles.js";
 
     let infobar1, infobar2, infobar3, infobar4;
     let totalExpenses = 0;
     let totalIncomes = 0;
-    let lastMonthIncome = 800;
+    let lastMonthIncome = 800; // Dummy last month's income
-    let lastMonthExpense = 200;
+    let lastMonthExpense = 200; // Dummy last month's expense
-    let incomeDifference;
-    let expenseDifference;
 
     function updateInfo() {
         totalExpenses = $expenseData.reduce((total, item) => total + parseInt(item.amount), 0);
         totalIncomes = $incomeData.reduce((total, item) => total + parseInt(item.amount), 0);
 
-        incomeDifference = ((totalIncomes - lastMonthIncome) / lastMonthIncome) * 100;
+        const incomeDifference = ((totalIncomes - lastMonthIncome) / lastMonthIncome) * 100;
-        expenseDifference = ((lastMonthExpense - totalExpenses) / lastMonthExpense) * 100;
+        const expenseDifference = ((lastMonthExpense - totalExpenses) / lastMonthExpense) * 100;
+
+        try {
+            infobar1.innerHTML = `<span style="font-size: larger">Total expenses:</span><br><span style="color:red;font-size: xxx-large">${totalExpenses.toFixed(2)}$</span>`;
+            infobar2.innerHTML = `<span style="font-size: larger">Total incomes:</span><br><span style="color:green;font-size: xxx-large">${totalIncomes.toFixed(2)}$</span>`;
+
+            infobar3.innerHTML = `<span style="font-size: larger">Income by last month:</span><br><span style="color:blue;font-size: xxx-large">${incomeDifference.toFixed(2)}%</span>`;
+            infobar4.innerHTML = `<span style="font-size: larger">Expense by last month:</span><br><span style="color:orange;font-size: xxx-large">${expenseDifference.toFixed(2)}%</span>`;
+        } catch {
+            console.log("not yet loaded");
+        }
     }
 
     $: {
-        if ($currencyLabel) {
-            if ($currencyLabel === 'USD') {
-                lastMonthIncome = 800;
-                lastMonthExpense = 200;
-            }
-
-            if ($currencyLabel === 'MDL') {
-                lastMonthIncome = 800 / 0.056;
-                lastMonthExpense = 200 / 0.056;
-            }
-
-            if ($currencyLabel === 'EUR') {
-                lastMonthIncome = 800 / 1.08;
-                lastMonthExpense = 200 / 1.08;
-            }
-
-            if ($currencyLabel === 'GBP') {
-                lastMonthIncome = 800 / 1.26;
-                lastMonthExpense = 200 / 1.26;
-            }
-        }
-
         if ($incomeData || $expenseData) {
             updateInfo();
         }
-
-
     }
 
     onMount(() => {
@@ -55,75 +39,26 @@
 </script>
 
 <div id="quickInfobar">
-    <div class="firstTwo">
+    <div class="infobarElement" bind:this={infobar1} style="background-color: {$globalStyles.mainColor}"></div>
-        <div class="infobarElement" bind:this={infobar1} style="background-color: {$globalStyles.mainColor}">
+    <div class="infobarElement" bind:this={infobar2} style="background-color: {$globalStyles.mainColor}"></div>
-            <span class="infobarSpan">Total expenses:</span><br><span class="dataSpan" style="color:#ab1a3c">{totalExpenses.toFixed(2)} {$currencyLabel}</span>
+    <div class="infobarElement" bind:this={infobar3} style="background-color: {$globalStyles.mainColor}"></div>
-        </div>
+    <div class="infobarElement" bind:this={infobar4} style="background-color: {$globalStyles.mainColor}"></div>
-        <div class="infobarElement" bind:this={infobar2} style="background-color: {$globalStyles.mainColor}">
-            <span class="infobarSpan">Total incomes:</span><br><span class="dataSpan" style="color:#38cc1b">{totalIncomes.toFixed(2)} {$currencyLabel}</span>
-        </div>
-    </div>
-
-    <div class="secondTwo">
-        <div class="infobarElement" bind:this={infobar3} style="background-color: {$globalStyles.mainColor}">
-            <span class="infobarSpan">Income by last month:</span><br><span class="dataSpan" style="color:#2763db">{incomeDifference.toFixed(2)}%</span>
-        </div>
-        <div class="infobarElement" bind:this={infobar4} style="background-color: {$globalStyles.mainColor}">
-            <span class="infobarSpan">Expense by last month:</span><br><span class="dataSpan" style="color:#dba527">{expenseDifference.toFixed(2)}%</span>
-        </div>
-    </div>
-
 </div>
 
 <style>
-
-    .firstTwo {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-    }
-
-    .secondTwo {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-    }
-
-    .infobarSpan {
-        font-size: larger;
-        color: #00FEFC
-    }
-
-    .dataSpan {
-        color:#ab1a3c;
-        font-size: xxx-large;
-    }
-
     #quickInfobar {
-        /*display: flex;*/
+        display: flex;
-        /*justify-content: space-between;*/
+        justify-content: space-between;
-        /*flex-wrap: wrap;*/
+        flex-wrap: wrap;
         min-height: 0;
         flex: 1 1 auto;
         margin: 20px;
     }
 
-    @media only screen and (min-width: 768px) and (max-width: 1200px) {
-        .infobarSpan {
-            font-size: medium;
-        }
-
-        .dataSpan {
-            font-size: large;
-        }
-    }
-
     .infobarElement {
-        font-family: Inconsolata,"Source Sans Pro",sans-serif;
-        font-size: larger;
         margin: 10px;
-        min-width: 0;
+        min-width: 0px;
-        min-height: 0;
+        min-height: 0px;
         flex: 1 1 auto;
         color: white;
         padding: 10px;

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/graphs/Graph1.svelte

@@ -0,0 +1,116 @@
+<script>
+	import Chart from 'chart.js/auto';
+	import { onMount } from 'svelte';
+	import { incomeData } from "../../../stores.js";
+	import {globalStyles} from "../../../styles.js";
+
+	let componentStyles;
+
+	$: {
+		console.log("got here")
+		componentStyles = $globalStyles;
+	}
+
+	let ctx;
+	let chartCanvas;
+	let chart = null;
+
+	function groupAndSumByCategory() {
+		const groupedData = new Map();
+		$incomeData.forEach(income => {
+					const category = income.incomeCategory.name;
+					if (groupedData.has(category)) {
+						groupedData.set(category, groupedData.get(category) + parseInt(income.amount));
+					} else {
+						groupedData.set(category, income.amount);
+					}
+				}
+		);
+
+		return new Map([...groupedData.entries()].sort());;
+	}
+
+	function createGraph() {
+		try {
+			const groupedIncomeData = groupAndSumByCategory();
+
+			const chartLabels = Array.from(groupedIncomeData.keys());
+			const chartValues = Array.from(groupedIncomeData.values());
+
+			ctx = chartCanvas.getContext('2d');
+
+			if (!chart) {
+				chart = new Chart(ctx, {
+					type: 'bar',
+					data: {
+						labels: chartLabels,
+						datasets: [{
+							label: 'Revenue',
+							backgroundColor:
+									['rgb(0, 0, 179)',
+									'rgb(0, 16, 217)',
+									'rgb(0, 32, 255)',
+									'rgb(0, 64, 255)',
+									'rgb(0, 96, 255)',
+									'rgb(0, 128, 255)',
+									'rgb(0, 159, 255)',
+									'rgb(0, 191, 255)',
+									'rgb(0, 255, 255)'],
+							data: chartValues
+						}]
+					},
+					options: {
+						responsive: true,
+						maintainAspectRatio: false,
+						plugins: {
+							legend: {
+								labels: {
+									font: {
+										weight: 'bold'
+									},
+									color: '#fff'
+								}
+							}
+						}
+					}
+				});
+			} else {
+				chart.data.labels = chartLabels;
+				chart.data.datasets[0].data = chartValues;
+				chart.update();
+			}
+		} catch (error) {
+			console.error('Error:', error);
+		}
+	}
+
+	$: {
+		if ($incomeData) {
+			createGraph();
+		}
+	}
+
+	onMount(() => {
+		createGraph();
+	});
+</script>
+
+<div id="chart" style="background-color: {componentStyles.mainColor}">
+	<canvas bind:this={chartCanvas}></canvas>
+</div>
+
+<style>
+	#chart {
+		box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+		transition: all 0.3s cubic-bezier(.25,.8,.25,1);
+		flex: 1;
+		border-radius: 0 0 10px 10px;
+		margin: 0 0 10px 10px;
+		min-width: 0;
+		min-height:0;
+	}
+
+	#chart:hover {
+		box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
+	}
+</style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/graphs/Graph2.svelte

@@ -1,133 +0,0 @@
-<script>
-	import Chart from 'chart.js/auto';
-	import {onMount} from 'svelte';
-	import {monthIncome} from "../../../stores.js";
-	import {globalStyles} from "../../../styles.js";
-
-	let ctx;
-	let chartCanvas;
-	let chart = null;
-
-	function groupAndSumByCategory() {
-		const groupedData = new Map();
-		$monthIncome.forEach(income => {
-					const category = income.incomeCategory.name;
-					if (groupedData.has(category)) {
-						groupedData.set(category, groupedData.get(category) + parseInt(income.amount));
-					} else {
-						groupedData.set(category, parseInt(income.amount));
-					}
-				}
-		);
-
-		return new Map([...groupedData.entries()].sort());
-	}
-
-	function createGraph() {
-		try {
-			const groupedIncomeData = groupAndSumByCategory();
-
-			const chartLabels = [];
-			const chartValues = [];
-
-			for (const [label, value] of groupedIncomeData.entries()) {
-				chartLabels.push(label);
-				chartValues.push(value);
-			}
-
-			ctx = chartCanvas.getContext('2d');
-
-			if (!chart) {
-				chart = new Chart(ctx, {
-					type: 'doughnut',
-					data: {
-						labels: chartLabels,
-						datasets: [{
-							label: 'Incomes',
-							data: chartValues
-						}]
-					},
-					options: {
-						responsive: true,
-						maintainAspectRatio: false,
-						backgroundColor: [
-							'rgb(255, 140, 140)',
-							'rgb(140, 180, 255)',
-							'rgb(255, 200, 140)',
-							'rgb(160, 200, 160)',
-							'rgb(160, 130, 200)',
-							'rgb(255, 160, 140)',
-							'rgb(140, 180, 255)',
-							'rgb(160, 255, 160)',
-							'rgb(255, 140, 120)',
-							'rgb(160, 140, 200)',
-							'rgb(255, 220, 140)',
-							'rgb(140, 255, 255)',
-							'rgb(255, 160, 140)',
-							'rgb(160, 255, 160)',
-							'rgb(160, 160, 255)'
-						],
-						plugins: {
-							legend: {
-								position: 'bottom',
-								align: 'start',
-								fullWidth: false,
-								labels: {
-									font: {
-										weight: 'bold'
-									},
-									color: '#fff'
-								}
-							}
-						}
-					}
-				});
-			} else {
-				chart.data.labels = chartLabels;
-				chart.data.datasets[0].data = chartValues;
-				chart.update();
-			}
-		} catch (error) {
-			console.error('Error:', error);
-		}
-	}
-
-	$: {
-		if ($monthIncome) {
-			createGraph();
-		}
-	}
-
-	onMount(() => {
-		createGraph();
-	});
-</script>
-
-<div id="chart" style="background-color: {$globalStyles.mainColor}">
-	<canvas bind:this={chartCanvas}></canvas>
-</div>
-
-<style>
-	#chart {
-		min-width: 0;
-		min-height:0;
-		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
-		transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
-		display: flex;
-		flex: 1 1 auto;
-		flex-grow: 1;
-		padding: 10px;
-		border-radius: 10px;
-		margin: 0 10px 10px;
-	}
-
-	#chart:hover {
-		box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
-	}
-
-	@media only screen and (max-width: 900px) {
-		#chart {
-			min-height: 400px;
-		}
-	}
-</style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/graphs/Graph3.svelte

@@ -1,49 +1,66 @@
 <script>
 	import Chart from 'chart.js/auto';
 	import { onMount } from 'svelte';
-	import {monthIncome, monthExpense, isCategorizedIncome, categorizedIncome, incomeCategoryLabel} from "../../../stores.js";
+	import { incomeData, expenseData } from "../../../stores.js";
 	import {globalStyles} from "../../../styles.js";
 
+	let componentStyles;
+
+	$: {
+		console.log("got here")
+		componentStyles = $globalStyles;
+	}
+
 	let ctx;
 	let chartCanvas;
 	let chart = null;
 
-	let generatedData;
-
 	function createGraph() {
 		try {
+			const totalIncomes = $incomeData.reduce((total, item) => total + item.amount, 0);
+			const totalExpenses = $expenseData.reduce((total, item) => total + item.amount, 0);
+
+			const chartLabels = ['Incomes', 'Expenses'];
+			const chartValues = [totalIncomes, totalExpenses];
+
 			if (chartCanvas.getContext('2d') !== undefined) {
 				ctx = chartCanvas.getContext('2d');
 				if (!chart) {
 					chart = new Chart(ctx, {
-						type: 'line',
+						type: 'pie',
-						data: generatedData,
+						data: {
+							labels: chartLabels,
+							datasets: [{
+								data: chartValues,
+								backgroundColor: [
+									'rgb(243, 188, 0)',
+									'rgb(0, 117, 164)'
+								],
+							}]
+						},
 						options: {
-							scales: {
-								y: {
-									ticks: {
-										color: 'rgb(255,255,255)'
-									}
-								},
-								x: {
-									ticks: {
-										color: 'rgb(255,255,255)'
-									}
-								}
-							},
 							responsive: true,
-							maintainAspectRatio: false
+							maintainAspectRatio: false,
+							plugins: {
+								legend: {
+									labels: {
+										font: {
+											weight: 'bold'
+										},
+										color: '#fff'
+									}
+								}
+							}
 						}
 					});
 				} else {
-					if ($isCategorizedIncome === true) {
+					const totalIncomesUpd = $incomeData.reduce((total, item) => total + parseInt(item.amount), 0);
-						chart.data.labels = generatedData.labels;
+					const totalExpensesUpd = $expenseData.reduce((total, item) => total + parseInt(item.amount), 0);
-						chart.data.datasets = generatedData.datasets;
+
-					} else {
+					const chartLabels = ['Incomes', 'Expenses'];
-						generatedData.datasets = generatedData.datasets.filter(dataset => dataset.label !== $incomeCategoryLabel);
+					const chartValues = [totalIncomesUpd, totalExpensesUpd];
-						chart.data.labels = generatedData.labels;
+					chart.data.labels = chartLabels;
-						chart.data.datasets = generatedData.datasets;
+					chart.data.datasets[0].data = chartValues;
-					}
 					chart.update();
 				}
 			}
@@ -53,68 +70,7 @@
 	}
 
 	$: {
-		if (isCategorizedIncome) {
+		if ($incomeData || $expenseData) {
-			const allDates = [...new Set([...$monthIncome, ...$categorizedIncome].map(item => item.date))];
-			const uniqueDates = allDates.sort((a, b) => new Date(a) - new Date(b));
-
-			const categorizedValues = uniqueDates.map(date => $categorizedIncome.filter(item => item.date === date).reduce((total, item) => total + item.amount, 0));
-			const incomeValues = uniqueDates.map(date => $monthIncome.filter(item => item.date === date).reduce((total, item) => total + item.amount, 0));
-
-			generatedData = {
-				labels: uniqueDates,
-				datasets: [
-					{
-						label: $incomeCategoryLabel,
-						backgroundColor: "rgba(21, 194, 58, 0.4)",
-						borderColor: "rgba(21, 194, 58, 1)",
-						data: categorizedValues,
-						tension: 0.2,
-						fill: true
-					},
-					{
-						label: "Revenue",
-						backgroundColor: "rgba(194, 21, 96, 0.4)",
-						borderColor: "rgba(194, 21, 96, 1)",
-						data: incomeValues,
-						tension: 0.4,
-						fill: true
-					}
-				]
-			};
-			const tempData = generatedData.datasets.filter(dataset => dataset.label !== undefined);
-
-			generatedData = {
-				labels: generatedData.labels || [],
-				datasets: tempData
-			};
-		} else {
-			const allDates = [...new Set([...$monthIncome].map(item => item.date))];
-			const uniqueDates = allDates.sort((a, b) => new Date(a) - new Date(b));
-
-			const incomeValues = uniqueDates.map(date => $monthIncome.filter(item => item.date === date).reduce((total, item) => total + item.amount, 0));
-
-			generatedData = {
-				labels: uniqueDates,
-				datasets:
-						{
-							label: "Income",
-							backgroundColor: "rgba(194, 21, 96, 0.4)",
-							borderColor: "rgba(194, 21, 96, 1)",
-							data: incomeValues,
-							tension: 0.4,
-							fill: true
-						}
-			};
-
-			const tempData = generatedData.datasets.filter(dataset => dataset.label !== undefined);
-
-			generatedData = {
-				labels: generatedData.labels || [],
-				datasets: tempData
-			};
-		}
-
-		if ($monthIncome || $monthExpense || $isCategorizedIncome || $categorizedIncome) {
 			createGraph();
 		}
 	}
@@ -124,31 +80,22 @@
 	});
 </script>
 
-<div id="chart" style="background-color: {$globalStyles.mainColor}">
+<div id="chart" style="background-color: {componentStyles.mainColor}">
-	<canvas id="canvas" bind:this={chartCanvas}></canvas>
+	<canvas bind:this={chartCanvas}></canvas>
 </div>
 
 <style>
 	#chart {
-		min-width: 0;
-		min-height:0;
 		box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 		transition: all 0.3s cubic-bezier(.25,.8,.25,1);
-		display: flex;
+		flex: 1;
-		flex: 1 1 auto;
+		border-radius: 0 0 10px 10px;
-		flex-grow: 2;
+		margin: 0 0 10px 10px;
-		border-radius: 10px;
+		min-width: 0;
-		margin: 0 10px 10px;
+		min-height:0;
-		padding: 10px;
 	}
 
 	#chart:hover {
 		box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
 	}
-
-	@media only screen and (max-width: 900px) {
-		#chart {
-			min-height: 400px;
-		}
-	}
 </style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/infolists/ContentIncome.svelte

@@ -1,23 +1,30 @@
 <script>
+    import Modal from './Modal.svelte';
     import { writable } from 'svelte/store';
     import axios from 'axios';
     import { getCookie } from "svelte-cookie";
-    import {incomeTypes, incomeData, dateText} from "../../../stores.js";
+    import {incomeData, incomeTypes} from "../../../stores.js";
-    import { slide } from 'svelte/transition';
 
-    let showModal = false;
+    let showModal;
     let amount = '';
     let newData;
 
     const selectedIncomeId = writable('');
 
-    function addNewIncome(expid, id, amount) {
+    function addNewIncome(id, amount) {
         const today = new Date().toISOString().split('T')[0];
         const incomeCategory = $incomeTypes.find(incomeType => incomeType.id === id);
 
+        console.log(amount);
+
         if (incomeCategory) {
             const newIncome = {
-                incomeId: expid,
+                incomeId: 0,
+                userDTO: {
+                    name: "Dummy",
+                    surname: "User",
+                    username: "dummyuser"
+                },
                 incomeCategory: incomeCategory,
                 date: today,
                 amount: parseInt(amount)
@@ -27,18 +34,19 @@
             newData.push(newIncome);
             $incomeData = newData;
         } else {
-            console.error('Expense category not found for id:', id);
+            console.error('Income category not found for id:', id);
         }
     }
 
     const createIncome = async () => {
-        showModal = false;
         const selectedIncome = $incomeTypes.find(income => income.id === $selectedIncomeId);
         const data = {
             incomeCategory: selectedIncome.id,
             amount: parseInt(amount),
         };
 
+        addNewIncome(selectedIncome.id, parseInt(amount));
+
         try {
             const token = getCookie('access_token');
 
@@ -50,7 +58,7 @@
             });
 
             if (response.status === 201) {
-                addNewIncome(response.data.incomeId, selectedIncome.id, parseInt(amount));
+                //console.log("cool");
             } else {
                 console.error('Error:', response.status);
             }
@@ -58,21 +66,17 @@
             console.error('Error:', error);
         }
     };
-
-    function toggleModal() {
-        showModal = !showModal;
-    }
 </script>
 
-<div id="exp">
+<div id="inc">
     <div id="optionField">
-        <h2>Incomes: {$dateText}</h2>
+        <h2>Incomes</h2>
-        <div id="openModal" class="plus-button" role="button" tabindex="0" on:click={toggleModal} on:keydown={() => console.log("keydown")}>
+        <div id="openModal" class="plus-button" role="button" tabindex="0" on:click={() => (showModal = true)} on:keydown={() => console.log("keydown")}>
             +
         </div>
     </div>
-        {#if showModal}
+    <Modal bind:showModal>
-        <div class="income-form" transition:slide>
+        <div class="income-form">
             <h3>Income Details</h3>
             <div class="form-group">
                 <label for="amount">Amount:</label>
@@ -90,48 +94,18 @@
                 </select>
             </div>
 
-            <div style="display: flex; justify-content: space-around">
+            <button class="btn btn-primary" on:click={createIncome}>Submit</button>
-                <button class="btn btn-primary" on:click={createIncome}>SUBMIT</button>
-                <button class="btn btn-primary" on:click={() => showModal = false}>CANCEL</button>
         </div>
-
+    </Modal>
-        </div>
-    {/if}
 </div>
 
 
 <style>
-    #exp {
+    #inc {
         padding: 10px 20px;
         text-align: center;
     }
 
-    button {
-        background-image: linear-gradient(92.88deg, #455EB5 9.16%, #5643CC 43.89%, #673FD7 64.72%);
-        border-radius: 8px;
-        border-style: none;
-        box-sizing: border-box;
-        color: #FFFFFF;
-        cursor: pointer;
-        flex-shrink: 0;
-        font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-        font-size: 16px;
-        font-weight: 500;
-        height: 3rem;
-        padding: 0 1.6rem;
-        text-align: center;
-        text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
-        transition: all .5s;
-        user-select: none;
-        -webkit-user-select: none;
-        touch-action: manipulation;
-    }
-
-    button:hover {
-        box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
-        transition-duration: .1s;
-    }
-
     #optionField {
         display: flex;
         align-items: center;
@@ -156,29 +130,10 @@
 
     .income-form {
         background-color: #fff;
-        border-radius: 20px;
+        border-radius: 5px;
         padding: 20px;
         max-width: 400px;
-        color: black;
+        margin: 0 auto;
-    }
-
-    input[type=text] {
-        padding: 12px 20px;
-        margin: 8px 0;
-        display: inline-block;
-        border: 1px solid #ccc;
-        border-radius: 4px;
-        box-sizing: border-box;
-    }
-
-    select {
-        padding: 12px 20px;
-        margin: 8px 0;
-        display: inline-block;
-        border: 1px solid #ccc;
-        border-radius: 4px;
-        box-sizing: border-box;
-        font-size: 16px;
     }
 
     h3 {

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/infolists/Incomes.svelte

@@ -1,23 +1,7 @@
 <script>
     import ContentIncome from "./ContentIncome.svelte";
-    import {
+    import { incomeData } from "../../../stores.js";
-        dateText,
-        expenseData,
-        incomeData,
-        tempExpense,
-        tempIncome,
-        monthIncome,
-        monthExpense,
-        isCategorizedExpense,
-        categorizedExpense,
-        currencyLabel, copyExpenseData, copyIncomeData, incomeCategoryLabel, categorizedIncome, isCategorizedIncome, incomeTypes
-    } from "../../../stores.js";
     import { globalStyles } from "../../../styles.js";
-    import {onMount} from "svelte";
-    import axios from "axios";
-    import {getCookie} from "svelte-cookie";
-    import {slide} from 'svelte/transition'
-    import EditEntry from "../util/EditEntry.svelte";
 
     const textToIcon = {
         'Interest': "<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"16\" width=\"20\" viewBox=\"0 0 640 512\"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d=\"M539.7 237.3c3.1-12.3 4.3-24.8 4.3-37.4C544 107.4 468.6 32 376.1 32c-77.2 0-144.6 53-163 127.8-15.3-13.2-34.9-20.5-55.2-20.5-46.3 0-84 37.7-84 84 0 7.4 .9 15 3.1 22.4-42.9 20.2-70.8 63.7-70.8 111.2C6.2 424.8 61.7 480 129.4 480h381.2c67.7 0 123.2-55.2 123.2-123.2 0-56.4-38.9-106-94.1-119.5zM199.9 401.6c0 8.3-7 15.3-15.3 15.3H153.6c-8.3 0-15.3-7-15.3-15.3V290.6c0-8.3 7-15.3 15.3-15.3h30.9c8.3 0 15.3 7 15.3 15.3v110.9zm89.5 0c0 8.3-7 15.3-15.3 15.3h-30.9c-8.3 0-15.3-7-15.3-15.3V270.1c0-8.3 7-15.3 15.3-15.3h30.9c8.3 0 15.3 7 15.3 15.3v131.5zm89.5 0c0 8.3-7 15.3-15.3 15.3h-30.9c-8.3 0-15.3-7-15.3-15.3V238.8c0-8.3 7-15.3 15.3-15.3h30.9c8.3 0 15.3 7 15.3 15.3v162.7zm87 0c0 8.3-7 15.3-15.3 15.3h-28.5c-8.3 0-15.3-7-15.3-15.3V176.9c0-8.6 7-15.6 15.3-15.6h28.5c8.3 0 15.3 7 15.3 15.6v224.6z\"/></svg>",
@@ -29,442 +13,22 @@
         'Gifts': "<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"16\" width=\"16\" viewBox=\"0 0 512 512\"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d=\"M190.5 68.8L225.3 128H224 152c-22.1 0-40-17.9-40-40s17.9-40 40-40h2.2c14.9 0 28.8 7.9 36.3 20.8zM64 88c0 14.4 3.5 28 9.6 40H32c-17.7 0-32 14.3-32 32v64c0 17.7 14.3 32 32 32H480c17.7 0 32-14.3 32-32V160c0-17.7-14.3-32-32-32H438.4c6.1-12 9.6-25.6 9.6-40c0-48.6-39.4-88-88-88h-2.2c-31.9 0-61.5 16.9-77.7 44.4L256 85.5l-24.1-41C215.7 16.9 186.1 0 154.2 0H152C103.4 0 64 39.4 64 88zm336 0c0 22.1-17.9 40-40 40H288h-1.3l34.8-59.2C329.1 55.9 342.9 48 357.8 48H360c22.1 0 40 17.9 40 40zM32 288V464c0 26.5 21.5 48 48 48H224V288H32zM288 512H432c26.5 0 48-21.5 48-48V288H288V512z\"/></svg>",
         'Government Payments': "<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"16\" width=\"18\" viewBox=\"0 0 576 512\"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d=\"M64 64C28.7 64 0 92.7 0 128V384c0 35.3 28.7 64 64 64H512c35.3 0 64-28.7 64-64V128c0-35.3-28.7-64-64-64H64zm64 320H64V320c35.3 0 64 28.7 64 64zM64 192V128h64c0 35.3-28.7 64-64 64zM448 384c0-35.3 28.7-64 64-64v64H448zm64-192c-35.3 0-64-28.7-64-64h64v64zM288 160a96 96 0 1 1 0 192 96 96 0 1 1 0-192z\"/></svg>"
     };
-
-    let isDateDropdownExpanded = false
-    let isCategoryDropdownExpanded = false
-    let isCurrencyDropdownExpanded = false
-    let isFilterDown = false;
-
-    let dropdownStates = {};
-    let deleteDropdownStates = {}
-
-    $: {
-        dropdownStates = {};
-        deleteDropdownStates = {};
-        $incomeData.toReversed().forEach(data => {
-            dropdownStates[data.incomeId] = false;
-            deleteDropdownStates[data.incomeId] = false;
-        });
-    }
-
-    function clickFilter() {
-        isDateDropdownExpanded = false;
-        isCategoryDropdownExpanded = false;
-        isFilterDown = !isFilterDown;
-        isCurrencyDropdownExpanded = false;
-    }
-    function clickHandlerDate() {
-        isDateDropdownExpanded = !isDateDropdownExpanded
-        isCategoryDropdownExpanded = false;
-    }
-
-    function clickHandlerCategory() {
-        isCategoryDropdownExpanded = !isCategoryDropdownExpanded;
-        isDateDropdownExpanded = false;
-    }
-
-    function clickHandlerCurrency() {
-        isCurrencyDropdownExpanded = !isCurrencyDropdownExpanded;
-        isCategoryDropdownExpanded = false;
-        isDateDropdownExpanded = false;
-        isFilterDown = false;
-    }
-
-    function clickItemHandler(id) {
-        dropdownStates[id] = !dropdownStates[id];
-        if (deleteDropdownStates[id] === true) deleteDropdownStates[id] = false;
-    }
-
-    function clickDeleteHandler(id) {
-        deleteDropdownStates[id] = !deleteDropdownStates[id];
-        if (dropdownStates[id] === true) dropdownStates[id] = false;
-    }
-
-    function clickOutsideHandler(event) {
-        const isDateButton = event.target.closest("#incomeInfo");
-
-        if (!isDateButton) {
-            isFilterDown = false;
-            isCategoryDropdownExpanded = false;
-            isDateDropdownExpanded = false;
-            isCurrencyDropdownExpanded = false;
-        }
-    }
-
-    onMount(() => {
-        $isCategorizedExpense = false;
-        $isCategorizedIncome = false;
-
-        document.body.addEventListener("click", clickOutsideHandler);
-
-        return () => {
-            document.body.removeEventListener("click", clickOutsideHandler);
-        };
-    });
-
-    async function getToday() {
-        const currentDate = new Date();
-        const currentDay = currentDate.toISOString().split('T')[0];
-        try {
-            const response1 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?date=' + currentDay, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-            expenseData.set(response1.data);
-            tempExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
-            const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?date=' + currentDay, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-            incomeData.set(response2.data);
-            tempIncome.set(response2.data);
-            copyIncomeData.set(response1.data);
-            $dateText = "Today"
-
-            $isCategorizedExpense = false;
-            categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
-        } catch (error) {
-            console.error("Error fetching expenses:", error);
-        }
-    }
-
-    async function getYesterday() {
-        const currentDate = new Date();
-
-        const yesterday = new Date(currentDate);
-        yesterday.setDate(currentDate.getDate() - 1);
-
-        const yesterdayString = yesterday.toISOString().split('T')[0];
-
-        try {
-            const response1 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?date=' + yesterdayString, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-            expenseData.set(response1.data);
-            tempExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
-            const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?date=' + yesterdayString, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-            incomeData.set(response2.data);
-            tempIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
-            $dateText = "Yesterday"
-            changeCurrency($currencyLabel);
-        } catch (error) {
-            console.error("Error fetching expenses:", error);
-        }
-    }
-
-    async function getMonth() {
-        const currentDate = new Date();
-        const year = currentDate.getMonth() + 1;
-
-        try {
-            const response1 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?month=' + year, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-
-            expenseData.set(response1.data);
-            tempExpense.set(response1.data);
-            monthExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
-            const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?month=' + year, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-
-            incomeData.set(response2.data);
-            tempIncome.set(response2.data);
-            monthIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
-            $dateText = "This Month"
-
-            $isCategorizedExpense = false;
-            categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
-        } catch (error) {
-            console.error("Error fetching expenses:", error);
-        }
-    }
-
-    async function getLastMonth() {
-        const currentDate = new Date();
-        const year = currentDate.getMonth();
-
-        try {
-            const response1 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?month=' + year, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-
-            expenseData.set(response1.data);
-            tempExpense.set(response1.data)
-            monthExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
-            const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?month=' + year, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-
-            incomeData.set(response2.data);
-            tempIncome.set(response2.data);
-            monthIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
-            $dateText = "Last Month"
-
-            $isCategorizedExpense = false;
-            categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
-        } catch (error) {
-            console.error("Error fetching expenses:", error);
-        }
-    }
-
-    async function getLastYear() {
-        const currentDate = new Date();
-        const year = currentDate.getFullYear();
-
-        try {
-            const response1 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?year=' + year, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-
-            expenseData.set(response1.data);
-            tempExpense.set(response1.data);
-            monthExpense.set(response1.data);
-            copyExpenseData.set(response1.data);
-            const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?year=' + year, {
-                headers: {
-                    'Authorization': `Bearer ${getCookie('access_token')}`
-                }
-            });
-
-            incomeData.set(response2.data);
-            tempIncome.set(response2.data);
-            monthIncome.set(response2.data);
-            copyIncomeData.set(response2.data);
-            $dateText = "This Year"
-
-            $isCategorizedExpense = false;
-            categorizedExpense.set([]);
-            changeCurrency($currencyLabel);
-        } catch (error) {
-            console.error("Error fetching expenses:", error);
-        }
-    }
-
-    function filterByCategory(category) {
-        $isCategorizedIncome = true;
-        $incomeCategoryLabel = category;
-        console.log($isCategorizedIncome);
-        let tempArr = $tempIncome.filter(income => income.incomeCategory.name === category);
-        categorizedIncome.set(tempArr);
-        incomeData.set(tempArr);
-    }
-
-    function getAll() {
-        categorizedIncome.set([]);
-        $incomeCategoryLabel = "Category";
-        $isCategorizedIncome = false;
-        console.log($isCategorizedIncome);
-        incomeData.set($tempIncome);
-    }
-
-    function doNothing() {
-
-    }
-
-    function changeCurrency(currency) {
-        if (currency === 'USD') {
-            expenseData.set($copyExpenseData);
-            incomeData.set($copyIncomeData);
-            $currencyLabel = "USD";
-        }
-        if (currency === 'MDL') {
-            const tempData1 = $copyExpenseData.map(expense => ({
-                ...expense,
-                amount: expense.amount / 0.056
-            }));
-            expenseData.set(tempData1);
-
-            const tempData2 = $copyIncomeData.map(income => ({
-                ...income,
-                amount: income.amount / 0.056
-            }));
-            incomeData.set(tempData2);
-            $currencyLabel = "MDL";
-        }
-        if (currency === 'EUR') {
-            const tempData1 = $copyExpenseData.map(expense => ({
-                ...expense,
-                amount: expense.amount / 1.08
-            }));
-            expenseData.set(tempData1);
-
-            const tempData2 = $copyIncomeData.map(income => ({
-                ...income,
-                amount: income.amount / 1.08
-            }));
-            incomeData.set(tempData2);
-            $currencyLabel = "EUR";
-        }
-
-        if (currency === 'GBP') {
-            const tempData1 = $copyExpenseData.map(expense => ({
-                ...expense,
-                amount: expense.amount / 1.26
-            }));
-            expenseData.set(tempData1);
-
-            const tempData2 = $copyIncomeData.map(income => ({
-                ...income,
-                amount: income.amount / 1.26
-            }));
-            incomeData.set(tempData2);
-            $currencyLabel = "GBP";
-        }
-    }
 </script>
 
 <div id="incomeInfo" style="background-color: {$globalStyles.mainColor}">
     <ContentIncome />
-    <div style="display: flex; justify-content: space-around">
-
-        <div id="dropdown" style="margin: 10px; display: flex; justify-content: space-between">
-            <button id="btn1" class="button" on:click={clickFilter}>Filter ▼</button>
-        </div>
-
-        <div id="dropdown-currency" style="margin: 10px;">
-            <button id="btn2" class="button" on:click={clickHandlerCurrency}>Currency ▼</button>
-        </div>
-    </div>
-
-    <div>
-        {#if isFilterDown}
-            <div style="margin: 10px; display: flex; justify-content: space-between" transition:slide>
-                <div id="dropdown-date" style="margin: 10px;">
-                    <button id="btn3" class="button" on:click={clickHandlerDate}>Filter by Date ▼</button></div>
-
-                <div id="dropdown-category" style="margin: 10px;">
-                    <button id="btn4" class="button" on:click={clickHandlerCategory}>Filter by Category ▼</button>
-                </div>
-            </div>
-        {/if}
-
-        {#if isDateDropdownExpanded}
-            <div id="date-list" transition:slide>
-                <div class="date-entry" on:click={() => getToday()} role="button" tabindex="0"
-                     on:keydown={doNothing}>Today
-                </div>
-                <div class="date-entry" on:click={() => getYesterday()} role="button" tabindex="0"
-                     on:keydown={doNothing}>Yesterday
-                </div>
-                <div class="date-entry" on:click={() => getMonth()} role="button" tabindex="0"
-                     on:keydown={doNothing}>This month
-                </div>
-                <div class="date-entry" on:click={() => getLastMonth()} role="button" tabindex="0"
-                     on:keydown={doNothing}>Last month
-                </div>
-                <div class="date-entry" on:click={() => getLastYear()} role="button" tabindex="0"
-                     on:keydown={doNothing}>This year
-                </div>
-            </div>
-        {/if}
-
-        {#if isCategoryDropdownExpanded}
-            <div id="date-list" transition:slide>
-                <div class="date-entry" on:click={() => getAll()} role="button"
-                     tabindex="0" on:keydown={doNothing}>All</div>
-                {#each $incomeTypes as income (income.id)}
-                    {#if income.id !== undefined}
-                        <div class="date-entry" on:click={() => filterByCategory(income.name)} role="button"
-                             tabindex="0" on:keydown={doNothing}>{income.name}</div>
-                    {/if}
-                {/each}
-            </div>
-        {/if}
-
-        {#if isCurrencyDropdownExpanded}
-            <div id="date-list" transition:slide>
-                <div class="date-entry" on:click={() => changeCurrency("MDL")} role="button"
-                     tabindex="0" on:keydown={doNothing}>MDL Leu</div>
-                <div class="date-entry" on:click={() => changeCurrency("GBP")} role="button"
-                     tabindex="0" on:keydown={doNothing}>GBP Pound</div>
-                <div class="date-entry" on:click={() => changeCurrency("USD")} role="button"
-                     tabindex="0" on:keydown={doNothing}>USD Dollar</div>
-                <div class="date-entry" on:click={() => changeCurrency("EUR")} role="button"
-                     tabindex="0" on:keydown={doNothing}>EUR Euro</div>
-            </div>
-        {/if}
-    </div>
     <div id="listContainer" style="color: {$globalStyles.color}">
         <ul>
-            {#each $incomeData.toReversed() as item (item.incomeId)}
+            {#each $incomeData.reverse() as item}
-                <li style="display:flex; flex-direction: column; justify-content: space-between; color: {$globalStyles.color}">
+                <li style="display:flex; justify-content: space-between; color: {$globalStyles.color}">
-                    <div style="display:flex; flex-direction: row; justify-content: space-between; align-items: center;">
+                    <span>
-                    <div>
                     {#if textToIcon[item.incomeCategory.name]}
                         {@html textToIcon[item.incomeCategory.name]}
                     {/if}
                     <span style="font-weight: bold">{item.incomeCategory ? `${item.incomeCategory.name}: ` : `${item.expenseCategory.name}: `}</span>
-                    <span style="font-weight:bold; margin-right: 10px; color: limegreen; font-size: larger">{item.incomeCategory ? `+${item.amount.toFixed(2)} ${$currencyLabel}` : `-${item.amount.toFixed(2)} ${$currencyLabel}`}</span>
+                    <span style="font-weight:bold; margin-right: 10px; color: green; font-size: larger">{item.incomeCategory ? `+${item.amount}$` : `-${item.amount}$`}</span>
-                    </div>
+                    </span>
-                        <div style="margin-right: 5px; display: flex; flex-direction: row">
+                    <span style="">{`${item.date}`}</span>
-
-                            <div>
-                                {`${item.date}`}
-                            </div>
-
-                            <div id="editBtnDiv" role="button" tabindex="0" on:keydown={doNothing}
-                                 on:click={() => clickItemHandler(item.incomeId)}>
-                                <span id="editBtn"><svg
-                                        xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 512 512"><path
-                                        d="M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.7 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160V416c0 53 43 96 96 96H352c53 0 96-43 96-96V320c0-17.7-14.3-32-32-32s-32 14.3-32 32v96c0 17.7-14.3 32-32 32H96c-17.7 0-32-14.3-32-32V160c0-17.7 14.3-32 32-32h96c17.7 0 32-14.3 32-32s-14.3-32-32-32H96z"/></svg></span>
-                            </div>
-
-                            <div id="deleteBtnDiv" role="button" tabindex="0" on:keydown={doNothing}
-                                 on:click={() => clickDeleteHandler(item.incomeId)}>
-                                <span id="deleteBtn"><svg
-                                        xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><path
-                                        d="M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z"/></svg></span>
-                            </div>
-                            </div>
-                    </div>
-
-                    {#if dropdownStates[item.incomeId]}
-                        <EditEntry {item} bind:isOn={dropdownStates[item.incomeId]}/>
-                    {/if}
-
-                    {#if deleteDropdownStates[item.incomeId]}
-                        <div style="padding: 5px; margin-top: 5px; display:flex; flex-direction: column; justify-content: space-evenly"
-                             class="inputForm" transition:slide>
-                            <span id="textf" style="text-align: center; margin-bottom: 10px">Confirm deletion?</span>
-                            <div style="display:flex; flex-direction: row; justify-content: space-evenly">
-                                <button id="confirmBtn">CONFIRM</button>
-                                <button id="cancelBtn">CANCEL</button>
-                            </div>
-
-                            <!--                            <button style="background-color: #8BD17C" on:click={() => console.log("LOL")}>Delete</button>-->
-                            <!--                            <button style="background-color: palevioletred" on:click={clickItemHandler(item.expenseId)}>Cancel</button>-->
-                        </div>
-                    {/if}
-
                 </li>
             {/each}
         </ul>
@@ -473,108 +37,13 @@
 
 <style>
 
-    #textf {
-        font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-        font-size: 20px;
-        font-weight: 500;
-    }
-
-    #confirmBtn {
-        background-image: linear-gradient(92.88deg, #455EB5 9.16%, #5643CC 43.89%, #673FD7 64.72%);
-        border-radius: 8px;
-        border-style: none;
-        box-sizing: border-box;
-        color: #FFFFFF;
-        cursor: pointer;
-        flex-shrink: 0;
-        font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-        font-size: 16px;
-        font-weight: 500;
-        height: 3rem;
-        padding: 0 1.6rem;
-        text-align: center;
-        text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
-        transition: all .5s;
-        user-select: none;
-        -webkit-user-select: none;
-        touch-action: manipulation;
-    }
-
-    #confirmBtn:hover {
-        box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
-        transition-duration: .1s;
-    }
-
-    #cancelBtn {
-        background-image: linear-gradient(92.88deg, #455EB5 9.16%, #5643CC 43.89%, #673FD7 64.72%);
-        border-radius: 8px;
-        border-style: none;
-        box-sizing: border-box;
-        color: #FFFFFF;
-        cursor: pointer;
-        flex-shrink: 0;
-        font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-        font-size: 16px;
-        font-weight: 500;
-        height: 3rem;
-        padding: 0 1.6rem;
-        text-align: center;
-        text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
-        transition: all .5s;
-        user-select: none;
-        -webkit-user-select: none;
-        touch-action: manipulation;
-    }
-
-    #cancelBtn:hover {
-        box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
-        transition-duration: .1s;
-    }
-
-    @media only screen and (max-width: 900px) {
-        #listContainer {
-            max-height: 50vh;
-            width: 100%;
-        }
-
     #incomeInfo {
-            margin: 0;
+        min-width: 300px;
-            width: 100%;
-        }
-    }
-
-    #editBtn {
-        margin-left: 10px;
-        margin-right: 5px;
-        fill: darkblue;
-    }
-
-    .inputForm {
-        display: flex;
-        flex-direction: column;
-        margin-bottom: 10px;
-    }
-
-    #editBtn:hover {
-        cursor: pointer;
-        fill: lightseagreen;
-    }
-
-    #deleteBtn {
-        fill: red;
-        margin-left: 5px;
-    }
-
-    #deleteBtn:hover {
-        cursor: pointer;
-        fill: palevioletred;
-    }
-
-    #incomeInfo {
-        min-width: 350px;
         min-height: 0;
         background-color: #212942;
         color: white;
+        border-radius: 0 0 10px 10px;
+        margin: 0 0 10px 0;
         display: flex;
         flex-direction: column;
         box-sizing: border-box;
@@ -585,7 +54,7 @@
         overflow-y: auto;
         min-height: 0;
         padding: 0 10px 10px;
-        /*margin: 0 0 10px;*/
+        margin: 0 0 10px;
         box-sizing: border-box;
         border-radius: 0 0 10px 10px;
     }
@@ -594,16 +63,19 @@
         width: 10px;
     }
 
+    /* Track */
     ::-webkit-scrollbar-track {
         background: #f1f1f1;
         border-radius: 10px;
     }
 
+    /* Handle */
     ::-webkit-scrollbar-thumb {
         background: #888;
         border-radius: 10px;
     }
 
+    /* Handle on hover */
     ::-webkit-scrollbar-thumb:hover {
         background: #555;
     }
@@ -626,85 +98,4 @@
     #listContainer li:hover {
         box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
     }
-
-    .button {
-        align-items: center;
-        background-color: #0A66C2;
-        border: 0;
-        border-radius: 100px;
-        box-sizing: border-box;
-        color: #ffffff;
-        cursor: pointer;
-        display: inline-flex;
-        font-family: -apple-system, system-ui, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Fira Sans", Ubuntu, Oxygen, "Oxygen Sans", Cantarell, "Droid Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Lucida Grande", Helvetica, Arial, sans-serif;
-        font-size: 16px;
-        font-weight: 600;
-        justify-content: center;
-        line-height: 20px;
-        max-width: 480px;
-        min-height: 40px;
-        min-width: 0;
-        overflow: hidden;
-        padding: 0 20px;
-        text-align: center;
-        touch-action: manipulation;
-        transition: background-color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s;
-        user-select: none;
-        -webkit-user-select: none;
-        vertical-align: middle;
-    }
-
-    .button:hover,
-    .button:focus {
-        background-color: #16437E;
-        color: #ffffff;
-    }
-
-    .button:active {
-        background: #09223b;
-        color: rgb(255, 255, 255, .7);
-    }
-
-    .button:disabled {
-        cursor: not-allowed;
-        background: rgba(0, 0, 0, .08);
-        color: rgba(0, 0, 0, .3);
-    }
-
-    #date-list {
-        background-color: black;
-        margin: 0 20px 20px;
-        max-height: 400px;
-        overflow-y: scroll;
-        border-radius: 20px;
-    }
-
-    .date-entry {
-        background-image: linear-gradient(92.88deg, #455EB5 9.16%, #5643CC 43.89%, #673FD7 64.72%);
-        border-radius: 8px;
-        border-style: none;
-        box-sizing: border-box;
-        color: #FFFFFF;
-        cursor: pointer;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-shrink: 0;
-        font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-        font-size: 16px;
-        font-weight: 500;
-        height: 3rem;
-        padding: 0 1.6rem;
-        text-align: center;
-        text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
-        transition: all .3s;
-        user-select: none;
-        -webkit-user-select: none;
-        touch-action: manipulation;
-        margin: 10px;
-    }
-
-    .date-entry:hover {
-        box-shadow: rgba(255, 255, 255, 0.8) 0 0 20px;
-    }
 </style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/infolists/Modal.svelte

@@ -0,0 +1,57 @@
+<script>
+    export let showModal;
+
+    let dialog;
+
+    $: if (dialog && showModal) dialog.showModal();
+</script>
+
+<!-- svelte-ignore a11y-click-events-have-key-events a11y-no-noninteractive-element-interactions -->
+<dialog
+        bind:this={dialog}
+        on:close={() => (showModal = false)}
+        on:click|self={() => dialog.close()}
+>
+    <!-- svelte-ignore a11y-no-static-element-interactions -->
+    <div on:click|stopPropagation>
+        <slot name="header" />
+        <slot />
+    </div>
+</dialog>
+
+<style>
+    dialog {
+        max-width: 32em;
+        border-radius: 20px;
+        border: none;
+        padding: 0;
+    }
+    dialog::backdrop {
+        background: rgba(0, 0, 0, 0.3);
+    }
+    dialog > div {
+        padding: 1em;
+    }
+    dialog[open] {
+        animation: zoom 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
+    }
+    @keyframes zoom {
+        from {
+            transform: scale(0.95);
+        }
+        to {
+            transform: scale(1);
+        }
+    }
+    dialog[open]::backdrop {
+        animation: fade 0.2s ease-out;
+    }
+    @keyframes fade {
+        from {
+            opacity: 0;
+        }
+        to {
+            opacity: 1;
+        }
+    }
+</style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/other/DashHeader.svelte

@@ -1,19 +1,19 @@
 <script>
-
     import {globalStyles} from "../../../styles.js";
 </script>
 
 <div id="header">
-    <div id="dashboardTitleWrapper" style="color: white">
+    <div id="dashboardTitleWrapper" style="color: {$globalStyles.dashTextColor}">
-        <h1 id="dashboardTitle">Dashboard - Incomes</h1>
+        <h5>Hello, welcome to your</h5>
+        <h1 id="dashboardTitle">Dashboard</h1>
     </div>
 
     <div id="icons">
         <div class="headerbtn searchButton">
-            <svg style="fill: white" xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 512 512"><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>
+            <svg xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 512 512"><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>
         </div>
         <div class="headerbtn notificationButton">
-            <svg style="fill: white" xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 448 512"><path d="M224 0c-17.7 0-32 14.3-32 32V49.9C119.5 61.4 64 124.2 64 200v33.4c0 45.4-15.5 89.5-43.8 124.9L5.3 377c-5.8 7.2-6.9 17.1-2.9 25.4S14.8 416 24 416H424c9.2 0 17.6-5.3 21.6-13.6s2.9-18.2-2.9-25.4l-14.9-18.6C399.5 322.9 384 278.8 384 233.4V200c0-75.8-55.5-138.6-128-150.1V32c0-17.7-14.3-32-32-32zm0 96h8c57.4 0 104 46.6 104 104v33.4c0 47.9 13.9 94.6 39.7 134.6H72.3C98.1 328 112 281.3 112 233.4V200c0-57.4 46.6-104 104-104h8zm64 352H224 160c0 17 6.7 33.3 18.7 45.3s28.3 18.7 45.3 18.7s33.3-6.7 45.3-18.7s18.7-28.3 18.7-45.3z"/></svg>
+            <svg xmlns="http://www.w3.org/2000/svg" height="1.3em" viewBox="0 0 448 512"><path d="M224 0c-17.7 0-32 14.3-32 32V49.9C119.5 61.4 64 124.2 64 200v33.4c0 45.4-15.5 89.5-43.8 124.9L5.3 377c-5.8 7.2-6.9 17.1-2.9 25.4S14.8 416 24 416H424c9.2 0 17.6-5.3 21.6-13.6s2.9-18.2-2.9-25.4l-14.9-18.6C399.5 322.9 384 278.8 384 233.4V200c0-75.8-55.5-138.6-128-150.1V32c0-17.7-14.3-32-32-32zm0 96h8c57.4 0 104 46.6 104 104v33.4c0 47.9 13.9 94.6 39.7 134.6H72.3C98.1 328 112 281.3 112 233.4V200c0-57.4 46.6-104 104-104h8zm64 352H224 160c0 17 6.7 33.3 18.7 45.3s28.3 18.7 45.3 18.7s33.3-6.7 45.3-18.7s18.7-28.3 18.7-45.3z"/></svg>
         </div>
     </div>
 </div>
@@ -29,7 +29,12 @@ import {globalStyles} from "../../../styles.js";
     #dashboardTitleWrapper {
         display: flex;
         flex-direction: column;
-        margin: 20px 20px 0;
+        margin:20px;
+        margin-bottom: 0px;
+    }
+
+    #dashboardTitleWrapper h5 {
+        margin: 0;
     }
 
     #dashboardTitleWrapper h1 {

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/other/DataMenu.svelte

@@ -0,0 +1,437 @@
+<script>
+    import Graph1 from '../graphs/Graph1.svelte';
+    import Graph3 from '../graphs/Graph3.svelte';
+    import Incomes from "../infolists/Incomes.svelte";
+    import {globalStyles} from "../../../styles.js";
+    import { slide } from 'svelte/transition'
+    import {dateText, expenseData, incomeData, incomeTypes, tempIncome, tempExpense} from "../../../stores.js";
+    import axios from "axios";
+    import {getCookie} from "svelte-cookie";
+    import {onMount} from "svelte";
+
+    let isDateDropdownExpanded = false
+    let isCategoryDropdownExpanded = false
+    let incomeAnalysisText = "REVENUE ANALYSIS: ";
+    $ : {
+        incomeAnalysisText = "REVENUE ANALYSIS: " + $dateText;
+    }
+
+    function clickHandlerDate() {
+        isDateDropdownExpanded = !isDateDropdownExpanded
+    }
+
+    function clickHandlerCategory() {
+        isCategoryDropdownExpanded = !isCategoryDropdownExpanded;
+    }
+
+    function clickOutsideHandler(event) {
+        const isDateButton = event.target.closest("#btn1");
+        const isCategoryButton = event.target.closest("#btn2");
+
+        if (!isDateButton) {
+            isDateDropdownExpanded = false;
+        }
+
+        if (!isCategoryButton) {
+            isCategoryDropdownExpanded = false;
+        }
+    }
+
+    onMount(() => {
+        document.body.addEventListener("click", clickOutsideHandler);
+
+        return () => {
+            document.body.removeEventListener("click", clickOutsideHandler);
+        };
+    });
+
+    async function getToday() {
+        var currentDate = new Date();
+        var currentDay = currentDate.toISOString().split('T')[0];
+        try {
+            const response1 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?date=' + currentDay, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+            incomeData.set(response1.data);
+            tempIncome.set(response1.data);
+            const response2 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?date=' + currentDay, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+            expenseData.set(response2.data);
+            tempExpense.set(response2.data);
+            $dateText = "Today"
+        } catch (error) {
+            console.error("Error fetching expenses:", error);
+        }
+    }
+
+    async function getYesterday() {
+        var currentDate = new Date();
+
+        var yesterday = new Date(currentDate);
+        yesterday.setDate(currentDate.getDate() - 1);
+
+        var yesterdayString = yesterday.toISOString().split('T')[0];
+
+        try {
+            const response1 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?date=' + yesterdayString, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+            incomeData.set(response1.data);
+            tempIncome.set(response1.data);
+            const response2 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?date=' + yesterdayString, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+            expenseData.set(response2.data);
+            tempExpense.set(response2.data);
+            $dateText = "Yesterday"
+        } catch (error) {
+            console.error("Error fetching expenses:", error);
+        }
+    }
+
+    async function getMonth() {
+        var currentDate = new Date();
+        var year = currentDate.getMonth() + 1;
+
+        try {
+            const response1 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?month=' + year, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+
+            incomeData.set(response1.data);
+            tempIncome.set(response1.data);
+
+            const response2 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?month=' + year, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+
+            expenseData.set(response2.data);
+            tempExpense.set(response2.data);
+            $dateText = "This Month"
+        } catch (error) {
+            console.error("Error fetching expenses:", error);
+        }
+    }
+
+    async function getLastMonth() {
+        var currentDate = new Date();
+        var year = currentDate.getMonth();
+
+        try {
+            const response1 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?month=' + year, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+
+            expenseData.set(response1.data);
+            tempExpense.set(response1.data);
+            const response2 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?month=' + year, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+
+            incomeData.set(response2.data);
+            tempIncome.set(response2.data);
+            $dateText = "Last Month"
+        } catch (error) {
+            console.error("Error fetching expenses:", error);
+        }
+    }
+
+    async function getLastYear() {
+        var currentDate = new Date();
+        var year = currentDate.getFullYear();
+
+        try {
+            const response1 = await axios.get('https://trackio.online:8081/incomes/personal-incomes?year=' + year, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+
+            incomeData.set(response1.data);
+            tempIncome.set(response1.data);
+            const response2 = await axios.get('https://trackio.online:8081/expenses/personal-expenses?year=' + year, {
+                headers: {
+                    'Authorization': `Bearer ${getCookie('access_token')}`
+                }
+            });
+
+            expenseData.set(response2.data);
+            tempExpense.set(response2.data);
+            $dateText = "This Year"
+        } catch (error) {
+            console.error("Error fetching expenses:", error);
+        }
+    }
+
+    function filterByCategory(category) {
+        console.log(category)
+        let tempArr = $tempIncome.filter(income => income.incomeCategory.name === category);
+        incomeData.set(tempArr);
+    }
+
+</script>
+
+<div id="main-data" style="background-color: {$globalStyles.dashColor}; color: {$globalStyles.color}">
+    <div id="data-header" style="background-color:{$globalStyles.mainColor}; color: {$globalStyles.altColor}">
+        <span style="color: {$globalStyles.altColor}" contenteditable="false" bind:innerHTML={incomeAnalysisText}></span>
+
+        <div id="dropdown-date">
+            <button id="btn1" class="button" on:click={clickHandlerDate}>Filter by Date ▼</button>
+            {#if isDateDropdownExpanded}
+                <div id="date-list" transition:slide>
+                    <div class="date-entry" on:click={() => getToday()}>Today</div>
+                    <div class="date-entry" on:click={() => getYesterday()}>Yesterday</div>
+                    <div class="date-entry" on:click={() => getMonth()}>This month</div>
+                    <div class="date-entry" on:click={() => getLastMonth()}>Last month</div>
+                    <!--                    <div on:click={() => console.log("Current quarter")}>Current quarter</div>-->
+                    <div class="date-entry" on:click={() => getLastYear()}>This year</div>
+                </div>
+            {/if}
+        </div>
+
+        <div id="dropdown-category">
+            <button id="btn2" class="button" on:click={clickHandlerCategory}>Filter by Category ▼</button>
+            {#if isCategoryDropdownExpanded}
+                <div id="date-list" transition:slide>
+                    {#each $incomeTypes as income (income.id)}
+                        {#if income.id !== undefined}
+                            <div class="date-entry" on:click={() => filterByCategory(income.name)} value={income.id}>{income.name}</div>
+                        {/if}
+                    {/each}
+                </div>
+            {/if}
+        </div>
+    </div>
+    <div id="data-menu">
+        <div id="first-graph">
+            <Graph1 />
+        </div>
+        <div id="second-graph">
+            <Graph3 />
+        </div>
+        <Incomes />
+    </div>
+
+</div>
+
+<style>
+    #main-data {
+        border-bottom-left-radius: 20px;
+        border-bottom-right-radius: 20px;
+        padding:0;
+        display: flex;
+        min-height: 0;
+        height: 0;
+        flex-direction: column;
+        justify-content: stretch;
+        align-items: stretch;
+        flex: 1 1 auto;
+    }
+
+    /*#button {*/
+    /*    background-color: #fff000;*/
+    /*    border-radius: 12px;*/
+    /*    color: #000;*/
+    /*    cursor: pointer;*/
+    /*    font-weight: bold;*/
+    /*    padding: 10px 15px;*/
+    /*    text-align: center;*/
+    /*    transition: 200ms;*/
+    /*    width: 100%;*/
+    /*    box-sizing: border-box;*/
+    /*    border: 0;*/
+    /*    font-size: 16px;*/
+    /*    user-select: none;*/
+    /*    -webkit-user-select: none;*/
+    /*    touch-action: manipulation;*/
+    /*}*/
+
+    /*#button:not(:disabled):hover,*/
+    /*#button:not(:disabled):focus {*/
+    /*    outline: 0;*/
+    /*    background: #f4e603;*/
+    /*    box-shadow: 0 0 0 2px rgba(0,0,0,.2), 0 3px 8px 0 rgba(0,0,0,.15);*/
+    /*}*/
+
+    /*#button:disabled {*/
+    /*    filter: saturate(0.2) opacity(0.5);*/
+    /*    -webkit-filter: saturate(0.2) opacity(0.5);*/
+    /*    cursor: not-allowed;*/
+    /*}*/
+
+    #date-list {
+        background-color: #007BFF;
+        position:absolute;
+        margin-top: 20px;
+        max-height: 400px;
+        overflow-y: scroll;
+        border-radius: 20px;
+        z-index:1;
+    }
+
+    .date-entry {
+        padding: 10px;
+        margin: 10px;
+        background-color: black;
+        color: white;
+        border-radius: 20px;
+        cursor: pointer;
+    }
+
+    .date-entry:hover {
+        background-color: rgb(128, 128, 128);
+    }
+
+
+    /*.button {*/
+    /*    font-size: large;*/
+    /*    margin: 10px;*/
+    /*    background-color: #007BFF;*/
+    /*    color: #fff;*/
+    /*    border: none;*/
+    /*    border-radius: 20px;*/
+    /*    line-height: 40px;*/
+    /*    cursor: pointer;*/
+    /*}*/
+
+    /*.button:hover {*/
+    /*    background-color: #0056b3;*/
+    /*}*/
+
+    .button {
+        align-items: center;
+        background-color: #0A66C2;
+        border: 0;
+        border-radius: 100px;
+        box-sizing: border-box;
+        color: #ffffff;
+        cursor: pointer;
+        display: inline-flex;
+        font-family: -apple-system, system-ui, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Fira Sans", Ubuntu, Oxygen, "Oxygen Sans", Cantarell, "Droid Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Lucida Grande", Helvetica, Arial, sans-serif;
+        font-size: 16px;
+        font-weight: 600;
+        justify-content: center;
+        line-height: 20px;
+        max-width: 480px;
+        min-height: 40px;
+        min-width: 0px;
+        overflow: hidden;
+        padding: 0px;
+        padding-left: 20px;
+        padding-right: 20px;
+        text-align: center;
+        touch-action: manipulation;
+        transition: background-color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s;
+        user-select: none;
+        -webkit-user-select: none;
+        vertical-align: middle;
+    }
+
+    .button:hover,
+    .button:focus {
+        background-color: #16437E;
+        color: #ffffff;
+    }
+
+    .button:active {
+        background: #09223b;
+        color: rgb(255, 255, 255, .7);
+    }
+
+    .button:disabled {
+        cursor: not-allowed;
+        background: rgba(0, 0, 0, .08);
+        color: rgba(0, 0, 0, .3);
+    }
+
+    /*#category-list {*/
+    /*    background-color: #8BD17C;*/
+    /*    position:absolute;*/
+    /*    z-index:1;*/
+    /*}*/
+
+    ::-webkit-scrollbar {
+        width: 10px;
+    }
+
+    /* Track */
+    ::-webkit-scrollbar-track {
+        background: #f1f1f1;
+        border-radius: 10px;
+    }
+
+    /* Handle */
+    ::-webkit-scrollbar-thumb {
+        background: #888;
+        border-radius: 10px;
+    }
+
+    /* Handle on hover */
+    ::-webkit-scrollbar-thumb:hover {
+        background: #555;
+    }
+
+    #data-header {
+        background-color: black;
+        min-height: 50px;
+        padding-left: 30px;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-around;
+        border-top-left-radius: 20px;
+        border-top-right-radius: 20px;
+        font-size: larger;
+        margin-bottom: 5px;
+        /*border: #8BD17C 2px solid;*/
+    }
+
+    #data-menu {
+        border-bottom-left-radius: 20px;
+        border-bottom-right-radius: 20px;
+        display:flex;
+        /*padding:10px;*/
+        flex-direction: row-reverse;
+        justify-content: space-between;
+        align-items: stretch;
+        flex: 1;
+        height: 0;
+        min-height: 0;
+    }
+
+    #first-graph {
+        display: flex;
+        flex-direction: column;
+        align-self: stretch;
+        flex-grow: 1;
+        min-width: 0;
+        min-height:0;
+    }
+
+    #second-graph {
+        display: flex;
+        flex-direction: column;
+        align-self: stretch;
+        flex-grow: 1;
+        min-width: 0;
+        min-height:0;
+    }
+
+</style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/other/QuickInfobar.svelte

@@ -1,52 +1,43 @@
 <script>
     import { onMount } from 'svelte';
-    import { incomeData, expenseData, currencyLabel } from "../../../stores.js";
+    import { incomeData, expenseData } from "../../../stores.js";
     import {globalStyles} from "../../../styles.js";
 
+    let componentStyles;
+
+    $: {
+        console.log("got here")
+        componentStyles = $globalStyles;
+    }
+
     let infobar1, infobar2, infobar3, infobar4;
     let totalExpenses = 0;
     let totalIncomes = 0;
-    let lastMonthIncome = 800;
+    let lastMonthIncome = 800; // Dummy last month's income
-    let lastMonthExpense = 200;
+    let lastMonthExpense = 200; // Dummy last month's expense
-    let incomeDifference;
-    let expenseDifference;
 
     function updateInfo() {
         totalExpenses = $expenseData.reduce((total, item) => total + parseInt(item.amount), 0);
         totalIncomes = $incomeData.reduce((total, item) => total + parseInt(item.amount), 0);
 
-        incomeDifference = ((totalIncomes - lastMonthIncome) / lastMonthIncome) * 100;
+        const incomeDifference = ((totalIncomes - lastMonthIncome) / lastMonthIncome) * 100;
-        expenseDifference = ((lastMonthExpense - totalExpenses) / lastMonthExpense) * 100;
+        const expenseDifference = ((lastMonthExpense - totalExpenses) / lastMonthExpense) * 100;
+
+        try {
+            infobar1.innerHTML = `<span style="font-size: larger">Total expenses:</span><br><span style="color:red;font-size: xxx-large">${totalExpenses.toFixed(2)}$</span>`;
+            infobar2.innerHTML = `<span style="font-size: larger">Total incomes:</span><br><span style="color:green;font-size: xxx-large">${totalIncomes.toFixed(2)}$</span>`;
+
+            infobar3.innerHTML = `<span style="font-size: larger">Income by last month:</span><br><span style="color:blue;font-size: xxx-large">${incomeDifference.toFixed(2)}%</span>`;
+            infobar4.innerHTML = `<span style="font-size: larger">Expense by last month:</span><br><span style="color:orange;font-size: xxx-large">${expenseDifference.toFixed(2)}%</span>`;
+        } catch {
+            console.log("not yet loaded");
+        }
     }
 
     $: {
-        if ($currencyLabel) {
-            if ($currencyLabel === 'USD') {
-                lastMonthIncome = 800;
-                lastMonthExpense = 200;
-            }
-
-            if ($currencyLabel === 'MDL') {
-                lastMonthIncome = 800 / 0.056;
-                lastMonthExpense = 200 / 0.056;
-            }
-
-            if ($currencyLabel === 'EUR') {
-                lastMonthIncome = 800 / 1.08;
-                lastMonthExpense = 200 / 1.08;
-            }
-
-            if ($currencyLabel === 'GBP') {
-                lastMonthIncome = 800 / 1.26;
-                lastMonthExpense = 200 / 1.26;
-            }
-        }
-
         if ($incomeData || $expenseData) {
             updateInfo();
         }
-
-
     }
 
     onMount(() => {
@@ -55,76 +46,24 @@
 </script>
 
 <div id="quickInfobar">
-    <div class="firstTwo">
+    <div class="infobarElement" bind:this={infobar1} style="background-color: {componentStyles.mainColor}"></div>
-        <div class="infobarElement" bind:this={infobar1} style="background-color: {$globalStyles.mainColor}">
+    <div class="infobarElement" bind:this={infobar2} style="background-color: {componentStyles.mainColor}"></div>
-            <span class="infobarSpan">Total expenses:</span><br><span class="dataSpan" style="color:#ab1a3c">{totalExpenses.toFixed(2)} {$currencyLabel}</span>
+    <div class="infobarElement" bind:this={infobar3} style="background-color: {componentStyles.mainColor}"></div>
-        </div>
+    <div class="infobarElement" bind:this={infobar4} style="background-color: {componentStyles.mainColor}"></div>
-        <div class="infobarElement" bind:this={infobar2} style="background-color: {$globalStyles.mainColor}">
-            <span class="infobarSpan">Total incomes:</span><br><span class="dataSpan" style="color:#38cc1b">{totalIncomes.toFixed(2)} {$currencyLabel}</span>
-        </div>
-    </div>
-
-    <div class="secondTwo">
-        <div class="infobarElement" bind:this={infobar3} style="background-color: {$globalStyles.mainColor}">
-            <span class="infobarSpan">Income by last month:</span><br><span class="dataSpan" style="color:#2763db">{incomeDifference.toFixed(2)}%</span>
-        </div>
-        <div class="infobarElement" bind:this={infobar4} style="background-color: {$globalStyles.mainColor}">
-            <span class="infobarSpan">Expense by last month:</span><br><span class="dataSpan" style="color:#dba527">{expenseDifference.toFixed(2)}%</span>
-        </div>
-    </div>
-
 </div>
 
 <style>
-
-    .firstTwo {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-    }
-
-    .secondTwo {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-    }
-
-    .infobarSpan {
-        font-size: larger;
-        color: #00FEFC
-    }
-
-    .dataSpan {
-        color:#ab1a3c;
-        font-size: xxx-large;
-    }
-
     #quickInfobar {
-        /*display: flex;*/
+        display: flex;
-        /*justify-content: space-between;*/
+        justify-content: space-between;
-        /*flex-wrap: wrap;*/
-        min-height: 0;
-        flex: 1 1 auto;
         margin: 20px;
     }
 
-    @media only screen and (min-width: 768px) and (max-width: 1200px) {
-        .infobarSpan {
-            font-size: medium;
-        }
-
-        .dataSpan {
-            font-size: large;
-        }
-    }
-
     .infobarElement {
-        font-family: Inconsolata,"Source Sans Pro",sans-serif;
-        font-size: larger;
         margin: 10px;
-        min-width: 0;
+        width: 200px;
-        min-height: 0;
+        min-width: 100px;
-        flex: 1 1 auto;
+        height: 100px;
         color: white;
         padding: 10px;
         border-radius: 10px;

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/incomes/util/EditEntry.svelte

@@ -1,114 +0,0 @@
-<script>
-    import {incomeTypes} from "../../../stores.js";
-    import { slide } from 'svelte/transition'
-    export let item;
-    export let isOn;
-
-    function handleSave() {
-        const amount = document.getElementById('amountInput').value;
-        const expenseCategory = document.getElementById('incomeCategory').value;
-
-        console.log("tryna save: " + item.incomeId + " " + amount + " " + expenseCategory)
-        // saveFunction(item.expenseId, amount, expenseCategory);
-    }
-</script>
-
-<div style="display: flex; flex-direction: column" transition:slide>
-    <span id="textf" style="margin-top: 10px; text-align: center">Edit Entry</span>
-    <input type="text" id="amountInput" bind:value={item.amount}>
-    <select id="incomeCategory" class="form-control">
-        {#each $incomeTypes as income (income.id)}
-            {#if income.id !== undefined}
-                {#if income.id === item.incomeCategory.id}
-                    <option value={income.id} selected>{income.name}</option>
-                {:else}
-                    <option value={income.id}>{income.name}</option>
-                {/if}
-            {/if}
-        {/each}
-    </select>
-    <div style="margin: 10px; display:flex; flex-direction: row; justify-content: space-evenly">
-        <button class="buttonCL" id="saveBtn" on:click={handleSave}>SAVE</button>
-        <button class="buttonCL" id="cancelBtn" on:click={() => isOn = false}>CANCEL</button>
-    </div>
-</div>
-
-<style>
-
-    #textf {
-        font-family: "Inter UI","SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;
-        font-size: 20px;
-        font-weight: 500;
-    }
-
-    input[type=text] {
-        padding: 12px 20px;
-        margin: 8px 0;
-        display: inline-block;
-        border: 1px solid #ccc;
-        border-radius: 4px;
-        box-sizing: border-box;
-    }
-
-    select {
-        padding: 12px 20px;
-        margin: 8px 0;
-        display: inline-block;
-        border: 1px solid #ccc;
-        border-radius: 4px;
-        box-sizing: border-box;
-        font-size: 16px;
-    }
-
-    #saveBtn {
-        background-image: linear-gradient(92.88deg, #455EB5 9.16%, #5643CC 43.89%, #673FD7 64.72%);
-        border-radius: 8px;
-        border-style: none;
-        box-sizing: border-box;
-        color: #FFFFFF;
-        cursor: pointer;
-        flex-shrink: 0;
-        font-family: "Inter UI","SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;
-        font-size: 16px;
-        font-weight: 500;
-        height: 3rem;
-        padding: 0 1.6rem;
-        text-align: center;
-        text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
-        transition: all .5s;
-        user-select: none;
-        -webkit-user-select: none;
-        touch-action: manipulation;
-    }
-
-    #saveBtn:hover {
-        box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
-        transition-duration: .1s;
-    }
-
-    #cancelBtn {
-        background-image: linear-gradient(92.88deg, #455EB5 9.16%, #5643CC 43.89%, #673FD7 64.72%);
-        border-radius: 8px;
-        border-style: none;
-        box-sizing: border-box;
-        color: #FFFFFF;
-        cursor: pointer;
-        flex-shrink: 0;
-        font-family: "Inter UI","SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;
-        font-size: 16px;
-        font-weight: 500;
-        height: 3rem;
-        padding: 0 1.6rem;
-        text-align: center;
-        text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
-        transition: all .5s;
-        user-select: none;
-        -webkit-user-select: none;
-        touch-action: manipulation;
-    }
-
-    #cancelBtn:hover {
-        box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
-        transition-duration: .1s;
-    }
-</style>

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/menu/SideMenu.svelte

@@ -1,8 +1,32 @@
 <script>
-    import {deleteCookie} from "svelte-cookie";
+    import { onMount } from 'svelte';
-    import {isAdmin, username} from "../stores.js";
+    import axios from 'axios';
+    import {deleteCookie, getCookie} from "svelte-cookie";
+
     export let onTabClick;
 
+    let username;
+    let isAdmin = true;
+
+    onMount(async () => {
+        const token = getCookie('access_token');
+
+        const config = {
+            headers: {
+                'Authorization': `Bearer ${token}`
+            }
+        };
+
+        try {
+            const response = await axios.get('https://trackio.online:8081/users/get-user-data', config);
+            const data = response.data;
+            username = data.username;
+
+        } catch (error) {
+            console.error('Error:', error);
+        }
+    });
+
     function doNothing() {
     }
 
@@ -50,7 +74,7 @@
     </div>
 
     <div id="profileSpace">
-        <div id="profileInfo">Hello, {$username}</div>
+        <div id="profileInfo">Hello, {username}</div>
         <div id="logout" role="button"
         tabindex="0"
         on:click={() => {

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/menu/StickyMenu.svelte

@@ -3,11 +3,32 @@
     import axios from 'axios';
     import {deleteCookie, getCookie} from "svelte-cookie";
     import { slide } from 'svelte/transition'
-    import {isAdmin, username} from "../stores.js";
 
     export let onTabClick;
 
     let isMenuDown = false;
+    let isAdmin = true;
+    let username;
+
+    onMount(async () => {
+        const token = getCookie('access_token');
+
+        const config = {
+            headers: {
+                'Authorization': `Bearer ${token}`
+            }
+        };
+
+        try {
+            const response = await axios.get('https://trackio.online:8081/users/get-user-data', config);
+            const data = response.data;
+            username = data.username;
+            console.log(username)
+
+        } catch (error) {
+            console.error('Error:', error);
+        }
+    });
 
     function toggleMenu() {
         isMenuDown = !isMenuDown;
@@ -60,7 +81,7 @@
             {/if}
 
             <div id="profileSpace">
-                <div id="profileInfo">Hello, {$username}</div>
+                <div id="profileInfo">Hello, {username}</div>
                 <div id="logout" role="button"
                      tabindex="0"
                      on:click={() => {

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/stores.js

@@ -1,16 +1,9 @@
 import {writable} from "svelte/store";
 
-export const isAdmin = writable(false);
-
-export const username = writable("");
 export const incomeData = writable([]);
 
 export const expenseData = writable([]);
 
-export const copyExpenseData = writable([]);
-
-export const copyIncomeData = writable([]);
-
 export const incomeTypes = writable([]);
 
 export const expenseTypes = writable([]);
@@ -31,12 +24,6 @@ export let isCategorizedExpense = writable(false);
 
 export let isCategorizedIncome = writable(false);
 
-export let expenseCategoryLabel = writable();
-
-export let incomeCategoryLabel = writable();
-
 export let selectedTab = writable('expenses');
 
 export let dateText = writable("This Month");
-
-export let currencyLabel = writable('USD');

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/main/+page.svelte

@@ -1,7 +0,0 @@
-<script>
-    import { onMount } from "svelte";
-
-    onMount(() => {
-        window.location.href = 'https://www.youtube.com/watch?v=dQw4w9WgXcQ';
-    });
-</script>

src/main/java/com/faf223/expensetrackerfaf/web/vite.config.js

@@ -12,4 +12,4 @@ export default defineConfig({
 			proxy: {}
 		}
 	},
-})
+});

src/main/resources/fullchain.pem

@@ -1,86 +0,0 @@
------BEGIN CERTIFICATE-----
-MIIEHTCCAwWgAwIBAgISBGYC3YGfvdZxQg6y2YUSjvzLMA0GCSqGSIb3DQEBCwUA
-MDIxCzAJBgNVBAYTAlVTMRYwFAYDVQQKEw1MZXQncyBFbmNyeXB0MQswCQYDVQQD
-EwJSMzAeFw0yMzEyMTIxOTAxNTVaFw0yNDAzMTExOTAxNTRaMBkxFzAVBgNVBAMT
-DnRyYWNraW8ub25saW5lMFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEirToCuVv
-qNiT3Rxqsyu2+OmD7TYBW+CV9639OW4FhwHaFxyzoCWI3/w3gZNVE/5Y1CvwHAsw
-qfuam0LjfbnKOKOCAg8wggILMA4GA1UdDwEB/wQEAwIHgDAdBgNVHSUEFjAUBggr
-BgEFBQcDAQYIKwYBBQUHAwIwDAYDVR0TAQH/BAIwADAdBgNVHQ4EFgQUmUFyQf+b
-b16jD80QRaO9ipw7h9kwHwYDVR0jBBgwFoAUFC6zF7dYVsuuUAlA5h+vnYsUwsYw
-VQYIKwYBBQUHAQEESTBHMCEGCCsGAQUFBzABhhVodHRwOi8vcjMuby5sZW5jci5v
-cmcwIgYIKwYBBQUHMAKGFmh0dHA6Ly9yMy5pLmxlbmNyLm9yZy8wGQYDVR0RBBIw
-EIIOdHJhY2tpby5vbmxpbmUwEwYDVR0gBAwwCjAIBgZngQwBAgEwggEDBgorBgEE
-AdZ5AgQCBIH0BIHxAO8AdQA7U3d1Pi25gE6LMFsG/kA7Z9hPw/THvQANLXJv4frU
-FwAAAYxfnyo6AAAEAwBGMEQCIBqYq5pa2GE7UNJHzN+1AAbw///s8PtWNkauU9UO
-igWZAiAktf1uf/O90k1l/+ihkPxJXToxcH5yeOiqATqDMol5PwB2AHb/iD8KtvuV
-UcJhzPWHujS0pM27KdxoQgqf5mdMWjp0AAABjF+fKoMAAAQDAEcwRQIgfNyTycHQ
-D1OMAOBA8vHAyu//5SjnY0BtCxOITyY/W1oCIQCCHFH+VKTFCglsqcp2hwQJHGq/
-jiSj4tR0jYIm5xMlaTANBgkqhkiG9w0BAQsFAAOCAQEAqu7cvsrkAnyrBgQHovQ4
-r+F1S/H6vu/Bvt9x+d125uDa/pT55JO/wG1IvdT9fxws2oYcc/nc8DjvW9U7+peu
-5K675kH09QTi+GhBAU4gZBhx3PohA6qG0Wm/6gC4lOq+S7o32x6RpoptcSvB3UXQ
-9BkgbO6LgDu99jPm6Acv4wre6trXAbPOpSlruSKSENnda7l/CamfiOX0cRKHjZdX
-PNpIfqWXokXNNYDAdrcXbOm7mFVMo1WcjBQM6E++IXfDRqHQ82Y94YVhEdH/hCo6
-3ce9uSrgL9+HcwhHzlZj20rTHFJ6iX/+Ffk8wbYfR4Eu7MXDg8ULT0z93yIvDxgy
-uw==
------END CERTIFICATE-----
------BEGIN CERTIFICATE-----
-MIIFFjCCAv6gAwIBAgIRAJErCErPDBinU/bWLiWnX1owDQYJKoZIhvcNAQELBQAw
-TzELMAkGA1UEBhMCVVMxKTAnBgNVBAoTIEludGVybmV0IFNlY3VyaXR5IFJlc2Vh
-cmNoIEdyb3VwMRUwEwYDVQQDEwxJU1JHIFJvb3QgWDEwHhcNMjAwOTA0MDAwMDAw
-WhcNMjUwOTE1MTYwMDAwWjAyMQswCQYDVQQGEwJVUzEWMBQGA1UEChMNTGV0J3Mg
-RW5jcnlwdDELMAkGA1UEAxMCUjMwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEK
-AoIBAQC7AhUozPaglNMPEuyNVZLD+ILxmaZ6QoinXSaqtSu5xUyxr45r+XXIo9cP
-R5QUVTVXjJ6oojkZ9YI8QqlObvU7wy7bjcCwXPNZOOftz2nwWgsbvsCUJCWH+jdx
-sxPnHKzhm+/b5DtFUkWWqcFTzjTIUu61ru2P3mBw4qVUq7ZtDpelQDRrK9O8Zutm
-NHz6a4uPVymZ+DAXXbpyb/uBxa3Shlg9F8fnCbvxK/eG3MHacV3URuPMrSXBiLxg
-Z3Vms/EY96Jc5lP/Ooi2R6X/ExjqmAl3P51T+c8B5fWmcBcUr2Ok/5mzk53cU6cG
-/kiFHaFpriV1uxPMUgP17VGhi9sVAgMBAAGjggEIMIIBBDAOBgNVHQ8BAf8EBAMC
-AYYwHQYDVR0lBBYwFAYIKwYBBQUHAwIGCCsGAQUFBwMBMBIGA1UdEwEB/wQIMAYB
-Af8CAQAwHQYDVR0OBBYEFBQusxe3WFbLrlAJQOYfr52LFMLGMB8GA1UdIwQYMBaA
-FHm0WeZ7tuXkAXOACIjIGlj26ZtuMDIGCCsGAQUFBwEBBCYwJDAiBggrBgEFBQcw
-AoYWaHR0cDovL3gxLmkubGVuY3Iub3JnLzAnBgNVHR8EIDAeMBygGqAYhhZodHRw
-Oi8veDEuYy5sZW5jci5vcmcvMCIGA1UdIAQbMBkwCAYGZ4EMAQIBMA0GCysGAQQB
-gt8TAQEBMA0GCSqGSIb3DQEBCwUAA4ICAQCFyk5HPqP3hUSFvNVneLKYY611TR6W
-PTNlclQtgaDqw+34IL9fzLdwALduO/ZelN7kIJ+m74uyA+eitRY8kc607TkC53wl
-ikfmZW4/RvTZ8M6UK+5UzhK8jCdLuMGYL6KvzXGRSgi3yLgjewQtCPkIVz6D2QQz
-CkcheAmCJ8MqyJu5zlzyZMjAvnnAT45tRAxekrsu94sQ4egdRCnbWSDtY7kh+BIm
-lJNXoB1lBMEKIq4QDUOXoRgffuDghje1WrG9ML+Hbisq/yFOGwXD9RiX8F6sw6W4
-avAuvDszue5L3sz85K+EC4Y/wFVDNvZo4TYXao6Z0f+lQKc0t8DQYzk1OXVu8rp2
-yJMC6alLbBfODALZvYH7n7do1AZls4I9d1P4jnkDrQoxB3UqQ9hVl3LEKQ73xF1O
-yK5GhDDX8oVfGKF5u+decIsH4YaTw7mP3GFxJSqv3+0lUFJoi5Lc5da149p90Ids
-hCExroL1+7mryIkXPeFM5TgO9r0rvZaBFOvV2z0gp35Z0+L4WPlbuEjN/lxPFin+
-HlUjr8gRsI3qfJOQFy/9rKIJR0Y/8Omwt/8oTWgy1mdeHmmjk7j1nYsvC9JSQ6Zv
-MldlTTKB3zhThV1+XWYp6rjd5JW1zbVWEkLNxE7GJThEUG3szgBVGP7pSWTUTsqX
-nLRbwHOoq7hHwg==
------END CERTIFICATE-----
------BEGIN CERTIFICATE-----
-MIIFYDCCBEigAwIBAgIQQAF3ITfU6UK47naqPGQKtzANBgkqhkiG9w0BAQsFADA/
-MSQwIgYDVQQKExtEaWdpdGFsIFNpZ25hdHVyZSBUcnVzdCBDby4xFzAVBgNVBAMT
-DkRTVCBSb290IENBIFgzMB4XDTIxMDEyMDE5MTQwM1oXDTI0MDkzMDE4MTQwM1ow
-TzELMAkGA1UEBhMCVVMxKTAnBgNVBAoTIEludGVybmV0IFNlY3VyaXR5IFJlc2Vh
-cmNoIEdyb3VwMRUwEwYDVQQDEwxJU1JHIFJvb3QgWDEwggIiMA0GCSqGSIb3DQEB
-AQUAA4ICDwAwggIKAoICAQCt6CRz9BQ385ueK1coHIe+3LffOJCMbjzmV6B493XC
-ov71am72AE8o295ohmxEk7axY/0UEmu/H9LqMZshftEzPLpI9d1537O4/xLxIZpL
-wYqGcWlKZmZsj348cL+tKSIG8+TA5oCu4kuPt5l+lAOf00eXfJlII1PoOK5PCm+D
-LtFJV4yAdLbaL9A4jXsDcCEbdfIwPPqPrt3aY6vrFk/CjhFLfs8L6P+1dy70sntK
-4EwSJQxwjQMpoOFTJOwT2e4ZvxCzSow/iaNhUd6shweU9GNx7C7ib1uYgeGJXDR5
-bHbvO5BieebbpJovJsXQEOEO3tkQjhb7t/eo98flAgeYjzYIlefiN5YNNnWe+w5y
-sR2bvAP5SQXYgd0FtCrWQemsAXaVCg/Y39W9Eh81LygXbNKYwagJZHduRze6zqxZ
-Xmidf3LWicUGQSk+WT7dJvUkyRGnWqNMQB9GoZm1pzpRboY7nn1ypxIFeFntPlF4
-FQsDj43QLwWyPntKHEtzBRL8xurgUBN8Q5N0s8p0544fAQjQMNRbcTa0B7rBMDBc
-SLeCO5imfWCKoqMpgsy6vYMEG6KDA0Gh1gXxG8K28Kh8hjtGqEgqiNx2mna/H2ql
-PRmP6zjzZN7IKw0KKP/32+IVQtQi0Cdd4Xn+GOdwiK1O5tmLOsbdJ1Fu/7xk9TND
-TwIDAQABo4IBRjCCAUIwDwYDVR0TAQH/BAUwAwEB/zAOBgNVHQ8BAf8EBAMCAQYw
-SwYIKwYBBQUHAQEEPzA9MDsGCCsGAQUFBzAChi9odHRwOi8vYXBwcy5pZGVudHJ1
-c3QuY29tL3Jvb3RzL2RzdHJvb3RjYXgzLnA3YzAfBgNVHSMEGDAWgBTEp7Gkeyxx
-+tvhS5B1/8QVYIWJEDBUBgNVHSAETTBLMAgGBmeBDAECATA/BgsrBgEEAYLfEwEB
-ATAwMC4GCCsGAQUFBwIBFiJodHRwOi8vY3BzLnJvb3QteDEubGV0c2VuY3J5cHQu
-b3JnMDwGA1UdHwQ1MDMwMaAvoC2GK2h0dHA6Ly9jcmwuaWRlbnRydXN0LmNvbS9E
-U1RST09UQ0FYM0NSTC5jcmwwHQYDVR0OBBYEFHm0WeZ7tuXkAXOACIjIGlj26Ztu
-MA0GCSqGSIb3DQEBCwUAA4IBAQAKcwBslm7/DlLQrt2M51oGrS+o44+/yQoDFVDC
-5WxCu2+b9LRPwkSICHXM6webFGJueN7sJ7o5XPWioW5WlHAQU7G75K/QosMrAdSW
-9MUgNTP52GE24HGNtLi1qoJFlcDyqSMo59ahy2cI2qBDLKobkx/J3vWraV0T9VuG
-WCLKTVXkcGdtwlfFRjlBz4pYg1htmf5X6DYO8A4jqv2Il9DjXA6USbW1FzXSLr9O
-he8Y4IWS6wY7bCkjCWDcRQJMEhg76fsO3txE+FiYruq9RUWhiF1myv4Q6W+CyBFC
-Dfvp7OOGAN6dEOM4+qR9sdjoSYKEBpsr6GtPAQw4dy753ec5
------END CERTIFICATE-----

src/main/resources/privkey.pem

@@ -1,5 +0,0 @@
------BEGIN PRIVATE KEY-----
-MIGHAgEAMBMGByqGSM49AgEGCCqGSM49AwEHBG0wawIBAQQg9kCIfgqNqFYgYU0Q
-HGi/jc5nLxhZxoXST5qeXBGtOAehRANCAASKtOgK5W+o2JPdHGqzK7b46YPtNgFb
-4JX3rf05bgWHAdoXHLOgJYjf/DeBk1UT/ljUK/AcCzCp+5qbQuN9uco4
------END PRIVATE KEY-----

src/test/java/com/faf223/expensetrackerfaf/repository/CredentialRepositoryTest.java

@@ -1,66 +0,0 @@
-package com.faf223.expensetrackerfaf.repository;
-
-import com.faf223.expensetrackerfaf.model.Credential;
-import com.faf223.expensetrackerfaf.model.User;
-import org.junit.jupiter.api.BeforeEach;
-import org.junit.jupiter.api.Test;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.boot.test.autoconfigure.jdbc.AutoConfigureTestDatabase;
-import org.springframework.boot.test.autoconfigure.orm.jpa.DataJpaTest;
-
-import static org.assertj.core.api.Assertions.assertThat;
-
-@DataJpaTest
-@AutoConfigureTestDatabase(replace = AutoConfigureTestDatabase.Replace.NONE)
-class CredentialRepositoryTest {
-
-    @Autowired
-    private CredentialRepository credentialRepository;
-
-    @Autowired
-    private UserRepository userRepository;
-    private User user;
-    private Credential credential;
-
-    @BeforeEach
-    void setUp() {
-        user = new User();
-        user.setFirstName("Hamon");
-        user.setLastName("User");
-        user.setUsername("UserHamon");
-
-        credential = Credential.builder()
-                .email("NewEmail@gmail.com")
-                .password("12345")
-                .user(user)
-                .build();
-
-        userRepository.save(user);
-        credentialRepository.save(credential);
-    }
-    @Test
-    void findByEmail() {
-        // when
-        boolean exists = credentialRepository.findByUser(user).isPresent();
-        // then
-        assertThat(exists).isTrue();
-    }
-
-    @Test
-    void itShouldCheckIfCredentialExistsByUser() {
-        // when
-        boolean exists = credentialRepository.findByUser(user).isPresent();
-        // then
-        assertThat(exists).isTrue();
-    }
-
-    @Test
-    void deleteByEmail() {
-        // when
-        credentialRepository.deleteByEmail(credential.getEmail());
-        boolean exists = credentialRepository.findByUser(user).isPresent();
-        // then
-        assertThat(exists).isFalse();
-
-    }
-}

src/test/java/com/faf223/expensetrackerfaf/repository/ExpenseRepositoryTest.java

@@ -2,7 +2,6 @@ package com.faf223.expensetrackerfaf.repository;
 
 import com.faf223.expensetrackerfaf.model.*;
 import org.assertj.core.api.Assertions;
-import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.boot.test.autoconfigure.jdbc.AutoConfigureTestDatabase;
@@ -14,8 +13,6 @@ import java.util.ArrayList;
 import java.util.List;
 import java.util.Optional;
 
-import static org.assertj.core.api.AssertionsForInterfaceTypes.assertThat;
-
 @DataJpaTest
 @AutoConfigureTestDatabase(replace = AutoConfigureTestDatabase.Replace.NONE)
 public class ExpenseRepositoryTest {
@@ -26,12 +23,11 @@ public class ExpenseRepositoryTest {
     private ExpenseCategoryRepository expenseCategoryRepository;
     @Autowired
     private UserRepository userRepository;
-    private User user;
-    private ExpenseCategory expenseCategory;
 
-    @BeforeEach
+    @Test
-    void setUp() {
+    public void ExpenseRepository_SaveAll_ReturnExpense() {
-        user = User.builder()
+
+        User user = User.builder()
                 .firstName("Test")
                 .lastName("TestLast")
                 .username("UserTest")
@@ -40,12 +36,7 @@ public class ExpenseRepositoryTest {
                 .build();
 
         userRepository.save(user);
-
+        ExpenseCategory expenseCategory = expenseCategoryRepository.getReferenceById(1L);
-        expenseCategory = expenseCategoryRepository.getReferenceById(1L);
-    }
-
-    @Test
-    public void ExpenseRepository_SaveAll_ReturnExpense() {
 
         Expense expense = Expense.builder()
                 .user(user)
@@ -63,6 +54,17 @@ public class ExpenseRepositoryTest {
     @Test
     public void ExpenseRepository_GateAll_ReturnsMoreThenOneExpense() {
 
+        User user = User.builder()
+                .firstName("Test")
+                .lastName("TestLast")
+                .username("UserTest")
+                .incomes(new ArrayList<>())
+                .expenses(new ArrayList<>())
+                .build();
+
+        userRepository.save(user);
+        ExpenseCategory expenseCategory = expenseCategoryRepository.getReferenceById(1L);
+
         List<Expense> expenseList = expenseRepository.findAll();
         int qtyBefore = expenseList.size();
 
@@ -85,12 +87,23 @@ public class ExpenseRepositoryTest {
         expenseList = expenseRepository.findAll();
 
         Assertions.assertThat(expenseList).isNotNull();
-        assertThat(expenseList).hasSize(qtyBefore + 2);
+        Assertions.assertThat(expenseList.size()).isEqualTo(qtyBefore + 2);
     }
 
     @Test
     public void ExpenseRepository_FindById_ReturnExpense() {
 
+        User user = User.builder()
+                .firstName("Test")
+                .lastName("TestLast")
+                .username("UserTest")
+                .incomes(new ArrayList<>())
+                .expenses(new ArrayList<>())
+                .build();
+
+        userRepository.save(user);
+        ExpenseCategory expenseCategory = expenseCategoryRepository.getReferenceById(1L);
+
         Expense expense = Expense.builder()
                 .user(user)
                 .amount(BigDecimal.valueOf(77))
@@ -107,7 +120,10 @@ public class ExpenseRepositoryTest {
     @Test
     public void ExpenseRepository_FindByUser_ReturnExpenses() {
 
-        List<Expense> expenses = expenseRepository.findByUser(user);
+        Optional<User> user = userRepository.findByUsername("Balaban");
+        Assertions.assertThat(user.isPresent()).isTrue();
+
+        List<Expense> expenses = expenseRepository.findByUser(user.get());
 
         Assertions.assertThat(expenses).isNotNull();
     }
@@ -123,10 +139,12 @@ public class ExpenseRepositoryTest {
     @Test
     public void ExpenseRepository_UpdateExpense_ReturnExpenseNotNull() {
 
+        Optional<User> user = userRepository.findByUsername("Deep Deep");
+        Assertions.assertThat(user.isPresent()).isTrue();
         ExpenseCategory expenseCategory = expenseCategoryRepository.getReferenceById(4L);
 
         Expense expense = Expense.builder()
-                .user(user)
+                .user(user.get())
                 .amount(BigDecimal.valueOf(700))
                 .category(expenseCategory)
                 .date(LocalDate.of(2023, 10, 5))
@@ -150,10 +168,12 @@ public class ExpenseRepositoryTest {
     @Test
     public void ExpenseRepository_DeleteExpense_ReturnExpenseNull() {
 
+        Optional<User> user = userRepository.findByUsername("Deep Deep");
+        Assertions.assertThat(user.isPresent()).isTrue();
         ExpenseCategory expenseCategory = expenseCategoryRepository.getReferenceById(4L);
 
         Expense expense = Expense.builder()
-                .user(user)
+                .user(user.get())
                 .amount(BigDecimal.valueOf(700))
                 .category(expenseCategory)
                 .date(LocalDate.of(2023, 10, 5))