feat: Profile basic information

[apomalyn]

As a user, I want to see my basic profile information on the Profile tab

Requirements

• On the profile view, add a way to:
  • access the settings
  • see the current streak count
  • see the current total number of words known
  • see the current avatar
  • see the user display name
  • see when the user joined

What needs to be done

In src/profile/profile_view, update the UI as follows:

• AppBar.actions:
  • IconButton (icon: Icons.settings_outlined)
• body:
  • add avatar circle (using fluttermoji)
  • under the avatar:
  • display name of the user
  • member since (month and year)
  • Under the joined date in a single row:
  • a card indicating the streak count, using StatCard
  • a card indicating the total number of known words (total of kana, kanji and vocabulary) using StatCard

Create the view model (ReactiveViewModel)

• to retrieve the user from the UserRepository.user
• to retrieve the number of known words from the kana, kanji and knowledge repository
• listen to changes on UserRepository and known words
• redirect to the settings view when settings IconButton is pressed

Design

Wireframe

⚠️ Be reminded that this is a wireframe, it shows the minimum required to fulfill the task but you can be creative for the rest of the page 

Dependencies

Child of #130

Depends on:

• 136

• 144

• 211

Dev notes

• Fluttermoji package for the avatar

[Adaendra]

@apomalyn pour information la librairie fluttermoji n'a pas été mise à jour depuis plus d'un an

[Adaendra]

@apomalyn question con, vis à vis de fluttermoji, je n'ai pas vu d'endroit où définir une string pour afficher l'avatar de l'utilisateur qui a été enregistré. As-tu vu où est-ce que c'est fait ?

[Adaendra]

@apomalyn Autre question, qu'est-ce qu'on affiche dans le champ du nom de l'utilisateur quand il est anonyme ? ou quand il est connecté avec un email/password ? (car le display name côté firebase est une chaîne de caractères vide)

[apomalyn]

pour information la librairie fluttermoji n'a pas été mise à jour depuis plus d'un an

Damn...la majorité de leur code c'est des SVG fait que je te dirais pour le moment, c'est correct. On trouvera une autre solution plus tard ou bien on fera notre propre package si c'est plus simple!

je n'ai pas vu d'endroit où définir une string pour afficher l'avatar de l'utilisateur qui a été enregistré. As-tu vu où est-ce que c'est fait ?

Fluttermoji sauvegarde en local automatiquement, cependant on ne va pas utiliser cette feature. L'User a le champ avatar pour ça!

Autre question, qu'est-ce qu'on affiche dans le champ du nom de l'utilisateur quand il est anonyme ? ou quand il est connecté avec un email/password ? (car le display name côté firebase est une chaîne de caractères vide)

Pour l'instant est-ce que tu peux initialiser l'utilisateur avec Anonyme (ou Anonymous en anglais). Dans le processus d'on boarding on va demander le nom pour remplir le champ

[Adaendra]

1 - Ok

2 - Si on utilise l'avatar qui est défini dans le User, pourquoi utiliser Fluttermoji alors ?

3 - Et pour ceux qui se connectent via email ?