Test ac/samy

[ikrash3d]

Voici le dernier résultat. Cela m'a pris environ 2h30-3h.

Je n'ai pas fait le dernier requis étant donné que je n'étais pas certain s'il fallait lourdement modifier tout ce qui est en lien avec UserProfile étant donné que selon le code de base le couplage entre un User et un Flight n'existe pas.

Bref, dans tous les cas merci pour le challenge. Ça m'a bien fait sortir de ma zone de confort.

[jonmassot]

Any reason to why no go the easy way:

return this._flights.filter((flight) => {
  return flight.flightNumber.toLowerCase().includes(this.flightSearch.toLowerCase()) &&
    flight.departure.toLowerCase().includes(this.flightSearch.toLowerCase());
});

so that it's easy to set which column to filter on?

[ikrash3d]

Tu as raison, de cette façon il est plus facile préciser sur quelle colonne le filtrage doit se faire.

J'ai opté pour ma solution car j'ai assumé que peu importe la string choisie, je cherche un match.

J'ai en revanche appliqué la même logique que tu proposes lors de la recherche d'un utilisateur puiqu'il a été spécifié que la recherche doit se faire sur le username, le firstName ou le lastName

get users(): UserProfile[] {
    const search = this.userSearch.toLowerCase();

    return this._users.filter((user) =>
      [user.username, user.firstName, user.lastName].some((value) =>
        value.toLowerCase().includes(search)
      )
    );
  }

[ikrash3d]

I found why the theming was not being displayed. Should have risen a bell that no theme.scss was created.

// Custom Theming for Angular Material
// For more information: https://material.angular.io/guide/theming
@use "@angular/material" as mat;
// Plus imports for other components in your app.

// Include the common styles for Angular Material. We include this here so that you only
// have to load a single css file for Angular Material in your app.
// Be sure that you only ever include this mixin once!
@include mat.core();

// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://material.io/design/color/
$theme-primary: mat.define-palette(mat.$indigo-palette);
$theme-accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);

// The warn palette is optional (defaults to red).
$theme-warn: mat.define-palette(mat.$red-palette);

// Create the theme object. A theme consists of configurations for individual
// theming systems such as "color" or "typography".
$theme: mat.define-light-theme(
  (
    color: (
      primary: $theme-primary,
      accent: $theme-accent,
      warn: $theme-warn,
    ),
  )
);

@include mat.all-component-themes($theme);

And then in the angular.json

I simply need to reference the file in :

 "styles": [
              "./node_modules/@angular/material/prebuilt-themes/purple-green.css",
              "src/styles.scss",
              "src/theme.scss"
            ],