Building an app with JHipster

<div class="form-group" *jhiHasAnyAuthority="'ROLE_ADMIN'">
  <label class="form-label" jhiTranslate="twentyOnePointsApp.points.user"
         for="field_user">User</label>
  <select class="form-control" id="field_user" data-cy="user" name="user"
          formControlName="user" [compareWith]="compareUser">
    <option [ngValue]="null"></option>
    <option [ngValue]="userOption"
            *ngFor="let userOption of usersSharedCollection">{{userOption.login}}</option>
  </select>
</div>

+import org.jhipster.health.repository.UserRepository;
+import org.jhipster.health.security.AuthoritiesConstants;
+import org.jhipster.health.security.SecurityUtils;

public class PointsResource {

     private final PointsSearchRepository pointsSearchRepository;

-    public PointsResource(PointsRepository pointsRepository, PointsSearchRepository pointsSearchRepository) {
+    private final UserRepository userRepository;
+
+    public PointsResource(PointsRepository pointsRepository, PointsSearchRepository pointsSearchRepository,
+                          UserRepository userRepository) {
         this.pointsRepository = pointsRepository;
         this.pointsSearchRepository = pointsSearchRepository;
+        this.userRepository = userRepository;
     }

     @PostMapping("/points")
     public ResponseEntity<Points> createPoints(@Valid @RequestBody Points points) throws URISyntaxException {
         log.debug("REST request to save Points : {}", points);
         if (points.getId() != null) {
             throw new BadRequestAlertException("A new points cannot already have an ID", ENTITY_NAME, "idexists");
         }
+        if (!SecurityUtils.hasCurrentUserThisAuthority(AuthoritiesConstants.ADMIN)) {
+            log.debug("No user passed in, using current user: {}", SecurityUtils.getCurrentUserLogin().get());
+            String username = SecurityUtils.getCurrentUserLogin().get();
+            points.setUser(userRepository.findOneByLogin(username).get());
+        }
         Points result = pointsRepository.save(points);
         pointsSearchRepository.index(result);
         return ResponseEntity
             .created(new URI("/api/points/" + result.getId()))
             .headers(HeaderUtil.createEntityCreationAlert(applicationName, true, ENTITY_NAME, result.getId().toString()))
             .body(result);
     }
}

@GetMapping("/points")
public ResponseEntity<List<Points>> getAllPoints(
    @org.springdoc.api.annotations.ParameterObject Pageable pageable,
    @RequestParam(required = false, defaultValue = "false") boolean eagerload
) {
    log.debug("REST request to get a page of Points");
    Page<Points> page;
    if (SecurityUtils.hasCurrentUserThisAuthority(AuthoritiesConstants.ADMIN)) {
        page = pointsRepository.findAllByOrderByDateDesc(pageable);
    } else {
        page = pointsRepository.findByUserIsCurrentUser(pageable);
    }
    HttpHeaders headers = PaginationUtil.generatePaginationHttpHeaders(
        ServletUriComponentsBuilder.fromCurrentRequest(), page);
    return ResponseEntity.ok().headers(headers).body(page.getContent());
}

@Query("select points from Points points where points.user.login = ?#{principal.username}")
Page<Points> findByUserIsCurrentUser(Pageable pageable);

@Test
@Transactional
@WithMockUser(authorities = AuthoritiesConstants.ADMIN)
void getAllPoints() throws Exception { ... }

private void createPointsByWeek(LocalDate thisMonday, LocalDate lastMonday) {
    User user = userRepository.findOneByLogin("user").get();
    // Create points in two separate weeks
    points = new Points(thisMonday.plusDays(2), 1, 1, 1, user); (1)
    pointsRepository.saveAndFlush(points);

    points = new Points(thisMonday.plusDays(3), 1, 1, 0, user);
    pointsRepository.saveAndFlush(points);

    points = new Points(lastMonday.plusDays(3), 0, 0, 1, user);
    pointsRepository.saveAndFlush(points);

    points = new Points(lastMonday.plusDays(4), 1, 1, 0, user);
    pointsRepository.saveAndFlush(points);
}

@Test
@Transactional
public void getPointsThisWeek() throws Exception {
    LocalDate today = LocalDate.now();
    LocalDate thisMonday = today.with(DayOfWeek.MONDAY);
    LocalDate lastMonday = thisMonday.minusWeeks(1);
    createPointsByWeek(thisMonday, lastMonday);

    // create security-aware mockMvc
    restPointsMockMvc = MockMvcBuilders
        .webAppContextSetup(context)
        .apply(springSecurity())
        .build();

    // Get all the points
    restPointsMockMvc.perform(get("/api/points")
        .with(user("user").roles("USER")))
        .andExpect(status().isOk())
        .andExpect(content().contentTypeCompatibleWith(MediaType.APPLICATION_JSON))
        .andExpect(jsonPath("$", hasSize(4)));

    // Get the points for this week only
    restPointsMockMvc.perform(get("/api/points-this-week")
        .with(user("user").roles("USER")))
        .andExpect(status().isOk())
        .andExpect(content().contentTypeCompatibleWith(MediaType.APPLICATION_JSON))
        .andExpect(jsonPath("$.week").value(thisMonday.toString()))
        .andExpect(jsonPath("$.points").value(5));
}

package org.jhipster.health.web.rest.vm;

import java.time.LocalDate;

public class PointsPerWeek {
    private LocalDate week;
    private Integer points;

    public PointsPerWeek(LocalDate week, Integer points) {
        this.week = week;
        this.points = points;
    }

    public Integer getPoints() {
        return points;
    }

    public void setPoints(Integer points) {
        this.points = points;
    }

    public LocalDate getWeek() {
        return week;
    }

    public void setWeek(LocalDate week) {
        this.week = week;
    }

    @Override
    public String toString() {
        return "PointsThisWeek{" +
            "points=" + points +
            ", week=" + week +
            '}';
    }
}

List<Points> findAllByDateBetweenAndUserLogin(LocalDate firstDate,
                                              LocalDate secondDate, String login);

/**
 * {@code GET  /points-this-week} : get all the points for the current week
 *
 * @param timezone the user's timezone
 * @return the {@link ResponseEntity} with status {@code 200 (OK)}
*          and a count of points in body.
 */
@GetMapping("/points-this-week")
public ResponseEntity<PointsPerWeek> getPointsThisWeek(@RequestParam(value = "tz", required = false) String timezone) {
    // Get current date (with timezone if passed in)
    LocalDate now = LocalDate.now();
    if (timezone != null) {
        now = LocalDate.now(ZoneId.of(timezone));
    }

    // Get first day of week
    LocalDate startOfWeek = now.with(DayOfWeek.MONDAY);
    // Get last day of week
    LocalDate endOfWeek = now.with(DayOfWeek.SUNDAY);
    log.debug("Looking for points between: {} and {}", startOfWeek, endOfWeek);

    List<Points> points = pointsRepository.findAllByDateBetweenAndUserLogin(
        startOfWeek,
        endOfWeek,
        SecurityUtils.getCurrentUserLogin().get()
    );
    return calculatePoints(startOfWeek, points);
}

private ResponseEntity<PointsPerWeek> calculatePoints(LocalDate startOfWeek, List<Points> points) {
    Integer numPoints = points.stream().mapToInt(p -> p.getExercise() + p.getMeals() + p.getAlcohol()).sum();

    PointsPerWeek count = new PointsPerWeek(startOfWeek, numPoints);
    return new ResponseEntity<>(count, HttpStatus.OK);
}

export interface IPointsPerWeek {
  week?: dayjs.Dayjs;
  points: number;
}

thisWeek(): Observable<HttpResponse<IPointsPerWeek>> {
  const tz = Intl.DateTimeFormat().resolvedOptions().timeZone;
  return this.http.get<IPointsPerWeek>(`api/points-this-week?tz=${tz}`,
    { observe: 'response' })
    .pipe(map(res => this.convertWeekResponseFromServer(res)));
}

protected convertWeekResponseFromServer(res: HttpResponse<IPointsPerWeek>):
  HttpResponse<IPointsPerWeek> {
  return res.clone({
    body: res.body ? this.convertWeekDateFromServer(res.body) : null,
  });
}

protected convertWeekDateFromServer(pointsPerWeek: IPointsPerWeek):
  IPointsPerWeek {
  return {
    ...pointsPerWeek,
    week: dayjs(pointsPerWeek.week),
  };
}

import { PointsService } from '../entities/points/service/points.service';
import { IPointsPerWeek } from '../entities/points/points.model';

...
export class HomeComponent implements OnInit, OnDestroy {
  account: Account | null = null;
  pointsThisWeek: IPointsPerWeek = { points: 0 };
  pointsPercentage?: number;

  private readonly destroy$ = new Subject<void>();

  constructor(private accountService: AccountService, private router: Router,
              private pointsService: PointsService) {
  }

  ngOnInit(): void {
    this.accountService
      .getAuthenticationState()
      .pipe(takeUntil(this.destroy$))
      .subscribe(account => {
        this.account = account;
        this.getUserData(); // this line is new
      });
  }

  getUserData(): void {
    // Get points for the current week
    this.pointsService.thisWeek().subscribe(response => {
        if (response.body) {
          this.pointsThisWeek = response.body;
          this.pointsPercentage = (this.pointsThisWeek.points / 21) * 100;
        }
      }
    );
  }
  ...
}

<div class="row">
  <div class="col-md-11 col-xs-12 mt-1">
    <ngb-progressbar [max]="21" [value]="pointsThisWeek.points"
                     [hidden]="!pointsThisWeek.points" [striped]="true">
      <span *ngIf="pointsThisWeek.points" class="fw-bolder">
          {{pointsThisWeek.points}} / Goal: 10
      </span>
    </ngb-progressbar>
    <ngb-alert [dismissible]="false" [hidden]="pointsThisWeek.points">
      <span jhiTranslate="home.points.getMoving">
        No points yet this week, better get moving!</span>
    </ngb-alert>
  </div>
</div>

public interface PreferencesRepository extends JpaRepository<Preferences, Long> {
    ...

    Optional<Preferences> findOneByUserLogin(String login);
}

/**
 * {@code GET  /my-preferences} : get the current user's preferences
 *
 * @return the preferences or default (weeklyGoal: 10) if none exist.
 */
@GetMapping("/my-preferences")
public ResponseEntity<Preferences> getUserPreferences() {
    String username = SecurityUtils.getCurrentUserLogin().get();
    log.debug("REST request to get Preferences : {}", username);
    Optional<Preferences> preferences =
        preferencesRepository.findOneByUserLogin(username);

    if (preferences.isPresent()) {
        return new ResponseEntity<>(preferences.get(), HttpStatus.OK);
    } else {
        Preferences defaultPreferences = new Preferences();
        defaultPreferences.setWeeklyGoal(10); // default
        return new ResponseEntity<>(defaultPreferences, HttpStatus.OK);
    }
}

user(): Observable<EntityResponseType> {
  return this.http.get<IPreferences>('api/my-preferences',
                                     { observe: 'response' });
}

export class HomeComponent implements OnInit, OnDestroy {
  account: Account | null = null;
  pointsThisWeek: IPointsPerWeek = {points: 0};
  pointsPercentage?: number;
  preferences!: IPreferences;

  private readonly destroy$ = new Subject<void>();

  constructor(private accountService: AccountService, private router: Router,
              private pointsService: PointsService,
              private preferencesService: PreferencesService) {
  }

  ngOnInit(): void { ... }

  getUserData(): void {
    // Get preferences
    this.preferencesService.user().subscribe((preferences: any) => {
      this.preferences = preferences.body;

      // Get points for the current week
      this.pointsService.thisWeek().subscribe(response => {
          if (response.body) {
            this.pointsThisWeek = response.body;
            this.pointsPercentage =
              (this.pointsThisWeek.points / 21) * 100;

            // calculate success, warning, or danger
            if (this.pointsThisWeek.points >= preferences.weeklyGoal) {
              this.pointsThisWeek.progress = 'success';
            } else if (this.pointsThisWeek.points < 10) {
              this.pointsThisWeek.progress = 'danger';
            } else if (this.pointsThisWeek.points > 10 &&
              this.pointsThisWeek.points < preferences.weeklyGoal) {
              this.pointsThisWeek.progress = 'warning';
            }
          }
        }
      );
    });
  }

  ...
}

<ngb-progressbar [max]="21" [value]="pointsThisWeek.points"
                 [hidden]="!pointsThisWeek.points" [striped]="true">
  <span *ngIf="pointsThisWeek.points" class="fw-bolder">
    {{ pointsThisWeek.points }} / Goal: {{ preferences.weeklyGoal }}
  </span>
</ngb-progressbar>
<ngb-alert [dismissible]="false" [hidden]="pointsThisWeek.points">
  <span jhiTranslate="home.points.getMoving">
    No points yet this week, better get moving!</span>
</ngb-alert>

<a [routerLink]="['/preferences' +
   (preferences && preferences.id ? '/' + preferences.id + '/edit' : '/new')]"
   class="float-end" jhiTranslate="home.link.preferences">Edit Preferences</a>

private void createBloodPressureByMonth(ZonedDateTime firstDate,
                                        ZonedDateTime firstDayOfLastMonth) {
    User user = userRepository.findOneByLogin("user").get();

    bloodPressure = new BloodPressure(firstDate, 120, 80, user);
    bloodPressureRepository.saveAndFlush(bloodPressure);
    bloodPressure = new BloodPressure(firstDate.plusDays(10), 125, 75, user);
    bloodPressureRepository.saveAndFlush(bloodPressure);
    bloodPressure = new BloodPressure(firstDate.plusDays(20), 100, 69, user);
    bloodPressureRepository.saveAndFlush(bloodPressure);

    // last month
    bloodPressure = new BloodPressure(firstDayOfLastMonth, 130, 90, user);
    bloodPressureRepository.saveAndFlush(bloodPressure);
    bloodPressure = new BloodPressure(firstDayOfLastMonth.plusDays(11), 135, 85, user);
    bloodPressureRepository.saveAndFlush(bloodPressure);
    bloodPressure = new BloodPressure(firstDayOfLastMonth.plusDays(23), 130, 75, user);
    bloodPressureRepository.saveAndFlush(bloodPressure);
}

@Test
@Transactional
public void getBloodPressureForLast30Days() throws Exception {
    ZonedDateTime now = ZonedDateTime.now();
    ZonedDateTime twentyNineDaysAgo = now.minusDays(29);
    ZonedDateTime firstDayOfLastMonth = now.withDayOfMonth(1).minusMonths(1);
    createBloodPressureByMonth(twentyNineDaysAgo, firstDayOfLastMonth);

    // Get all the blood pressure readings
    restBloodPressureMockMvc.perform(get("/api/blood-pressures"))
        .andExpect(status().isOk())
        .andExpect(content().contentTypeCompatibleWith(MediaType.APPLICATION_JSON))
        .andExpect(jsonPath("$", hasSize(6)));

    // Get the blood pressure readings for the last 30 days
    restBloodPressureMockMvc.perform(get("/api/bp-by-days/{days}", 30))
        .andDo(print())
        .andExpect(status().isOk())
        .andExpect(content().contentTypeCompatibleWith(MediaType.APPLICATION_JSON))
        .andExpect(jsonPath("$.period").value("Last 30 Days"))
        .andExpect(jsonPath("$.readings.[*].systolic").value(hasItem(120)))
        .andExpect(jsonPath("$.readings.[*].diastolic").value(hasItem(69)));
}

public class BloodPressureByPeriod {
    private String period;
    private List<BloodPressure> readings;

    public BloodPressureByPeriod(String period, List<BloodPressure> readings) {
        this.period = period;
        this.readings = readings;
    }

    // getters and setters and toString() generated by IntelliJ
}

List<BloodPressure> findAllByTimestampBetweenOrderByTimestampDesc(
    ZonedDateTime firstDate, ZonedDateTime secondDate);

/**
 * {@code GET  /bp-by-days/:days} : get all the blood pressure readings by last x days.
 *
 * @param days the number of days.
 * @return the {@link ResponseEntity} with status {@code 200 (OK)}
 *         and with body the {@link BloodPressureByPeriod}.
 */
@RequestMapping(value = "/bp-by-days/{days}")
public ResponseEntity<BloodPressureByPeriod> getByDays(@PathVariable int days) {
    ZonedDateTime rightNow = ZonedDateTime.now(ZoneOffset.UTC);
    ZonedDateTime daysAgo = rightNow.minusDays(days);

    List<BloodPressure> readings =
        bloodPressureRepository.findAllByTimestampBetweenOrderByTimestampDesc(daysAgo, rightNow);
    BloodPressureByPeriod response =
        new BloodPressureByPeriod("Last " + days + " Days", filterByUser(readings));
    return new ResponseEntity<>(response, HttpStatus.OK);
}

private List<BloodPressure> filterByUser(List<BloodPressure> readings) {
    Stream<BloodPressure> userReadings = readings.stream()
        .filter(bp -> bp.getUser().getLogin().equals(SecurityUtils.getCurrentUserLogin().get()));
    return userReadings.collect(Collectors.toList());
}

last30Days(): Observable<HttpResponse<IBloodPressureByPeriod>> {
  return this.http.get<IBloodPressureByPeriod>('api/bp-by-days/30',
                                               { observe: 'response' });
}

export interface IBloodPressureByPeriod {
  period: string;
  readings: Array<IBloodPressure>;
}

npm install -E ng2-charts@4.0.0

import { NgChartsModule } from 'ng2-charts';

@NgModule({
  imports: [..., NgChartsModule],
  declarations: [HomeComponent],
})
export class HomeModule {}

// Get blood pressure readings for the last 30 days
this.bloodPressureService.last30Days().subscribe((bpReadings: any) => {
  bpReadings = bpReadings.body;
  this.bpReadings = bpReadings;

  if (bpReadings.readings.length) {
    this.bpOptions = {
      plugins: {
        legend: { display: true },
        title: {
          display: true,
          text: bpReadings.period,
        },
      },
      scales: {
        y: {
          beginAtZero: false,
        },
        x: {
          beginAtZero: false,
        },
      },
    };
    const labels: any = [];
    const systolics: any = [];
    const diastolics: any = [];
    const upperValues: any = [];
    const lowerValues: any = [];
    bpReadings.readings.forEach((item: IBloodPressure) => {
      const timestamp = dayjs(item.timestamp).format('MMM DD');
      labels.push(timestamp);
      systolics.push({
        x: timestamp,
        y: item.systolic,
      });
      diastolics.push({
        x: timestamp,
        y: item.diastolic,
      });
      upperValues.push(item.systolic);
      lowerValues.push(item.diastolic);
    });
    const datasets = [
      {
        data: systolics,
        label: 'Systolic',
      },
      {
        data: diastolics,
        label: 'Diastolic',
      },
    ];
    this.bpData = {
      labels,
      datasets,
    };
    // set y scale to be 10 more than max and min
    this.bpOptions.scales = {
      y: {
        max: Math.max(...upperValues) + 10,
        min: Math.min(...lowerValues) - 10,
      },
    };
    // show both systolic and diastolic on hover
    this.bpOptions.interaction = {
      mode: 'index',
      intersect: false,
    };
  } else {
    this.bpReadings.readings = [];
  }
});

<div class="row mt-1">
  <div class="col-md-11 col-xs-12">
    <canvas
      baseChart
      *ngIf="bpReadings && bpReadings.readings.length"
      height="125"
      [type]="'line'"
      [data]="bpData"
      [options]="bpOptions"
    >
    </canvas>
    <ngb-alert [dismissible]="false"
               [hidden]="bpReadings && bpReadings.readings.length">
      <span jhiTranslate="home.bloodPressure.noReadings">
        No blood pressure readings found.</span>
    </ngb-alert>
  </div>
</div>