Bibliothèque Flutter Directus

Hello world !

étant en plein développement d’une app Flutter, je me retrouve confronté à la problématique d’utilisation des API Directus.

Je ne trouve aucune doc ou exemple d’utilisation de la bibliothèque de Maxime :frowning:

J’imagine que la partie habilitation ne doit pas être de tout repos mais j’aimerai déjà pouvoir récupérer des listes d’item publiques (sans jetons).

ex : xxxxxx.com - Informationen zum Thema xxx sex videos free hd porn.*

Merci d’avance pour votre aide :slight_smile:

Pour récupérer des éléments de directs via le package de Maxime, il te faudra pour commencer un objet DirectusApiManager.

La partie authentification est simple à gérer puisque le paquet le fait pour toi. Perso, je crée l’objet dans mon NavigationDelegate pour pour voir le récupérer dans les autres écrans si besoin.

Cet objet te donnera accès la fonction findListOfItems avec la signature suivante :

Future<Iterable<Type>> findListOfItems<Type extends DirectusItem>(
      {required String name,
      Filter? filter,
      List<SortProperty>? sortBy,
      String fields = "*",
      int? limit,
      int? offset,
      required Type Function(dynamic json) createItemFunction})

Par exemple, pour récupérer des messages dans une table qui se nomme « messages », je l’utilise de la façon suivante :

Iterable<Message> messagesIterable = await api.findListOfItems<Message>(
        name: "messages",
        createItemFunction: Message.fromDirectus,
        fields: "*,*.*",
        sortBy: [const SortProperty("date_created", ascending: false)],
        limit: 20,
        offset: offset,
        filter: PropertyFilter(
          field: "user_created",
          operator: FilterOperator.equals,
          value: retailer.id);

    List<Message> messagesList = [];
    for (var message in messagesIterable) {
      messagesList.add(message);
    }

    return messagesList;
  }

findListOfItems utilise la fonction Message.fromDirectus qui me retourne un objet Message déclaré de la façon suivante :

class Message extends DirectusItem {
  late String id;
  late DateTime creationDate;
  late Retailer creator;
  late String title;
  late String body;
  late bool isPublished;
  Message(super.rawReceivedData) {
    id = getValue(forKey: "id");
    title = getValue(forKey: "title");
    body = getValue(forKey: "body");
    creationDate = DateTime.parse(getValue(forKey: "date_created"));
    creator = Retailer(getValue(forKey: "user_created"));
    isPublished = getValue(forKey: "isPublished");
  }

  factory Message.fromDirectus(dynamic rawReceivedData) {
    return Message(rawReceivedData);
  }

  Map<String, dynamic> toDirectus() {
    return {"title": title, "body": body, "isPublished": isPublished};
  }
}

de cette façon, je peux retourner un tableau avec la liste des messages souhaités.

N’hésite pas à me dire si cela n’est pas assez clair.

1 « J'aime »

Merci @jmjoary pour ta réponse, c’est vraiment utile.
Je suis également un peu en galère pour utiliser la bibliothèque de Maxime.
C’est vrai qu’une petite vidéo dans le cours Directus, ou un petit meetup sur le sujet pourraient être très utile.
:slightly_smiling_face:

ça peut être une bonne idée. Je vais proposer cela à @mbritto.

Merci beaucoup pour ton aide @jmjoary :slight_smile:

Du coup, je bloque dès la création d’une classe de ma base :

class Message extends DirectusItem {

VScode ne reconnait pas DirectusItem (alors qu’il est bien présent dans la bibliothèque).

J’ai bien rajouté dans mon pubspec.yaml (et lancé mon flutter pub get)

dependencies:
  flutter:
    sdk: flutter
  directus_api_manager:
    git: https://github.com/maxbritto/directus_api_manager.git

J’ai râté quelque chose ? :slight_smile:

et … OUI ce serait vraiment chouette un cours sur ce sujet :slight_smile:

Merci encore @jmjoary !!!

non tu n’as rien raté. C’est ma faute, j’ai oublié de modifier lib/src/directus_api_manager.dart pour inclure DirectusItem.

Il faut que je vois avec @mbritto pour la mise à jour du paquet.

1 « J'aime »

lol ! j’arrête de chercher :slight_smile:

Et j’attends la prochaine mise à jour :slight_smile:

Merci !!! J’ai hâte de pouvoir l’utiliser !!!

La mise à jour devrait bientôt arriver car @jmjoary travaille sur une mise à jour significative qui est presque terminée.

D’ailleurs si d’autres personnes veulent contribuer, ça pourrait être bien de créer une doc directement sur GitHub

1 « J'aime »

Pas de pression, pas de pression :grimacing:

Aucune pression :wink: Sauf si on la boit :beers:

2 « J'aime »

@mbritto a approuvé mon pull request et je vais commencer à préparer mon meetup sur ce sujet.

Aucune pression :wink: Sauf si on la boit :beers:

Maintenant que c’est fait, santé :beers:

4 « J'aime »

Oui c’était un gros morceau ce patch, bien joué!
J’ai hésité sur un seul point : pour la fonction de suppression des users, est-ce que ça ne serait pas plus simple de demander juste le ou les user id au lieu de l’objet DirectusUser.

Il y a débat. Perso, je trouve cela plus cohérent car pour la création et la modification, on demande juste l’objet. Il me semble logique de faire pareil pour la suppression.

Dans l’utilisation du paquet, on a tout fait pour que les développeurs travaillent avec des objets directement. Donc si ils souhaitent supprimer un utilisateur, il y a de grande chance pour qu’ils l’aient déjà en mémoire. Si on part sur juste les id pour la suppression, ils devront extraire la valeur de leur objet et faire le boulot de la méthode.

point-of-view-star-wars

Après, c’est une question de point de vue, mais je pencherai plus pour donner le ou les objets directement.

C’est vrai que c’est plus cohérent, mais ça peut poser problème pour les cas où ils n’auraient que l’id et seront obligé de créer un object DirectusUser juste pour y mettre l’id dedans.
Je pense que la meilleure solution est de proposer les 2 :

  • la version avec le DirectusUser
  • la version avec uniquement l’id
    Sachant que la version avec DirectusUser appellera la version avec l’id comme ça on ne duplique pas notre code.
    Si tu veux je le ferai sur un futur patch, comme ça on ne touche pas la version actuelle

Bravo @jmjoary :clap:

Je pense que ce meetup va cartonner !!!

Netflix et Amazon Prime Video vont s’arracher les droits de rediffusion :slight_smile:
Non non pas de pressions… :beers:

1 « J'aime »

@jmjoary une question simple … :slight_smile:

Est-ce que la bibliothèque permet d’uploader un fichier ?
perso, sans bibliothèque je n’y suis pas parvenu.

Je souhaite faire un « post » dans une table avec une photo (de ma caméra) et une zone commentaire.
c’est jouable par la bibliothèque ?

Merciiii :slight_smile:

oui c’est faisable. L’upload se fait avec

Future<DirectusFile> uploadFile(
      {required List<int> fileBytes,
      required String filename,
      String? title,
      String? contentType,
      String? folder})

puis dans le DirectusFile que tu recevras, tu trouveras l’id pour faire le lien avec ton post.

1 « J'aime »

Merci énormément @jmjoary !!!

Du coup … j’arrête de chercher comment envoyer, en même temps, mes champs et le fichier.
D’abord l’upload du fichier, puis le post de mes champs avec le lien vers le fichier (uploadé précédemment).

Je m’empresse de tester cette méthode :slight_smile:

it’s good @jmjoary !!!

bon ok … je n’ai pas encore THE bibliothèque… j’attends THE présentation !!! :slight_smile:

    var uri = Uri.parse("https://xxx.xxxxx.com/files");
    var request = http.MultipartRequest("POST", uri);
    request.fields['folder'] = '8c7961aa-1775-4a0d-833d-1915dd838277';
    request.files.add(
      await http.MultipartFile.fromPath("photo", fichier.path,
          contentType: MediaType("image", "jpg")),
    );
    var streamedResponse = await request.send();
    var bodyResponse =
        await streamedResponse.stream.bytesToString();
    var id = Reponse.fromJson(json.decode(bodyResponse)["data"]);

    var now = new DateTime.now();
    var formatter = DateFormat("yyyy-MM-ddTHH:mm:ss");
    String formattedDate = formatter.format(now);

    var response = await http.post(
        Uri.parse("https://xxx.xxxxx.com/items/publications"),
        headers: {"Content-type": "application/json"},
        body: jsonEncode({
          "xxxxx": xxxxx,
          "date_creation": formattedDate,
          "photo": id.id
        }));
    return response.statusCode.toString();

Au passage, j’ai du modifier ma config nginx pour accepter les gros fichiers :
client_max_body_size 200M;

Merci encore pour ton aide !!! je commençais à désespérer :slight_smile:

ps : chuis d’accord, aucun intérêt de transmettre la date dans le post :slight_smile: je vais modifier directus pour qu’elle se mette à jour automatiquement.

1 « J'aime »