Modularisation et utilisation d'un fichier GraphQL pour composer la liste des articles #703

thom4parisot · 2022-12-21T15:15:07Z

~~C'est un peu un proof of concept, pour voir si c'est intéressant à appliquer sur le reste de l'appli front.~~ Toutes les requêtes GraphQL ont été extraites. Ça a permis de virer pas mal de services, qui n'ajoutaient plus grand chose depuis qu'il y a le hook useGraphQL (sessionToken et graphqlEndpoint y sont récupérés depuis le store).

Ça demanderait encore à retravailler certaines requêtes (passer par des mutations imbriquées plutôt que des rootMutations) mais ça commence à faire un changement assez épais 😅

Todo

vérifier chaque *Service car y'a des chances que les requêtes GraphQL ne fonctionnent pas (mauvais paramètres passés au service, et impossibilité d'utiliser le "hook" dans le store)
tous les trucs de Preview HTML + bibliographie basée sur Pandoc Export 🎁 🎄 #707
vérifier l'accès à l'API et la récupération des données en fonction du jeton, des ressources demandées et des permissions en action
- articles(user)

Suites

Tester avec swr (comme dans Utilisation du service d'export Pandoc (ecrinum/stylo/stylo-export) pour les articles #676, cf Simplification du code d'accès aux données via l'API GraphQL #704) pour réduire encore l'encombrement de la récupération de données dans l'interface (exit useEffect, gestion des erreurs intégrée, etc.)
Réduire le nombre de RootQuery et RootMutation
Basculer la vérification des permissions dans les objets de modèle (genre article.isSharedWith(user), user.hasGrantedAccessTo(anotherUser) etc.) vs. les vérifications difficiles à tester dans les resolvers GraphQL

netlify · 2022-12-21T15:15:55Z

✅ Deploy Preview for stylo-dev ready!

Name	Link
🔨 Latest commit	`c774a52`
🔍 Latest deploy log	https://app.netlify.com/sites/stylo-dev/deploys/63b9877223962b000860ca5f
😎 Deploy Preview	https://deploy-preview-703--stylo-dev.netlify.app/
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

front/package.json

ggrossetie · 2022-12-21T20:15:15Z

front/src/components/Articles.graphql

@@ -0,0 +1,58 @@
+query ($user: ID!) {


Oui c'est clairement mieux d'avoir la requête à part 👍🏻
Surtout qu'il doit y avoir des outils permettant de faciliter l'édition via un IDE.

thom4parisot · 2022-12-23T03:55:10Z

@Mogztter Le commit le plus intéressant est f1eda5f : je déplace la RootMutation deleteArticle() vers un resolver. Ce qui veut dire que la vérification et d'utilisateur et d'existence de l'article ont déjà eu lieu.

En déplaçant la logique 1) dans un hook pré-suppression, 2) dans une transaction, on va aussi pouvoir écrire des tests tout en réduisant la complexité du backend.

ggrossetie · 2022-12-23T09:36:07Z

Le commit le plus intéressant est f1eda5f : je déplace la RootMutation deleteArticle() vers un resolver. Ce qui veut dire que la vérification et d'utilisateur et d'existence de l'article ont déjà eu lieu.

Oui j'utilise la même stratégie sur les "groups" (teams) pour ajouter un article ou supprimer un membre. Cela rends le code tout de suite plus simple car on évite de dupliquer la logique de contrôle 💯

ggrossetie · 2022-12-23T09:37:41Z

En déplaçant la logique 1) dans un hook pré-suppression, 2) dans une transaction, on va aussi pouvoir écrire des tests tout en réduisant la complexité du backend.

Intéressant 🤔
Je serais curieux de voir un test "unitaire" sur la partie GraphQL 🙌🏻

thom4parisot · 2022-12-23T16:21:25Z

Je serais curieux de voir un test "unitaire" sur la partie GraphQL

Et bien… c'est dur sans monter de base de données :-(
J'ai tenté de mocker différents objects mais les références internes de Mongoose rendent l'opération compliquée 😅

thom4parisot · 2022-12-23T18:31:02Z

Avec les derniers commits, j'ai :

résolu un bug lors de la création d'un article (ça n'ajoutait pas correctement les tags sélectionnés à l'article)
factorisé ça avec des les mutations imbriquées (et en plus, ça bouge la logique au bon endroit, hors du tagResolver)

Je m'arrête là sur ce sujet, mais c'est très marrant !

Also, move deletion logic to a pre.remove hook within a transaction.

Let's regroup the logic at the model level

When primary and tertiary are empty then.

Also, add EmailAddress scalar

…y against

graphql/package.json

ggrossetie · 2023-01-06T20:21:20Z

front/src/components/Tag.graphql

  $user: ID!
  $tag: ID!
-  $color: String!
+  $color: HexColorCode!


c'est un type par défaut de GraphQL ?? 🤯

Non j'ai ajouté le module graphql-scalars pour gagner en finesse dessus. Ce qui a permis de typer les dates d'ailleurs !

ggrossetie · 2023-01-06T20:22:55Z

graphql/models/article.js

@@ -131,7 +131,7 @@ articleSchema.methods.addTags = async function addTags (...tagIds) {
    { safe: true }
  )

-  return this.save()
+  return this.save({ timestamps: false })


on mettait à jour la date de dernière modification sur le tag alors qu'on associe le tag à un article c'est ça ? si c'est le cas bien vu 👀

Exactement mais sur l'article (ajouter/enlever un tag faisait que l'article était considéré comme modifié).

ggrossetie · 2023-01-06T20:25:29Z

front/src/components/Write/WorkingVersion.jsx

@@ -49,7 +49,7 @@ export function ArticleSaveState ({ state, updatedAt, stateMessage }) {

  const [savedAgo, isoString] = useMemo(() => ([
    formatTimeAgo(updatedAt),
-    new Date(parseInt(updatedAt, 10)).toISOString()
+    new Date(updatedAt).toISOString()


ggrossetie · 2023-01-06T20:29:54Z

Comme j'ai pas mal touché à GraphQL pour l'implémentation des "workspaces", je pense que c'est mieux que ce changement passe en premier car il y a plus de changements que sur ma branche.

J'ai fais une revue par commit mais c'est effectivement assez dense car il y a pas mal de choses : resolutions d'anomalies, améliorations, changements sur l'UI... tu as été prolifique !

Otherwise an undefined version would appear as undefined

Essentially to speed up the 19 seconds install time of the frontend

It also solves a regression introduction in #458, specifically in e3de56a fixes #639 fixes #688

Also, derives sommaire from markdown content on assignment

refs #710

thom4parisot requested a review from ggrossetie December 21, 2022 15:15

thom4parisot added dependencies 🔗 Pull requests that update a dependency file [domain] user interface 🎨 labels Dec 21, 2022

thom4parisot commented Dec 21, 2022

View reviewed changes

front/package.json Outdated Show resolved Hide resolved

ggrossetie reviewed Dec 21, 2022

View reviewed changes

thom4parisot force-pushed the feature/better-article-graphql-query branch from f1eda5f to a5e0bcc Compare December 23, 2022 04:08

thom4parisot force-pushed the feature/better-article-graphql-query branch from 80e09ae to 316e068 Compare January 5, 2023 17:12

thom4parisot added 17 commits January 5, 2023 23:51

Parse .graphql files as import()

396b718

Use external, and leaner GraphQL query to read user articles

1e8a8c9

Use named export for GraphQL query files

e6ad17d

Name 404 Component

93189e4

Move deleteArticle to a nested mutation

98a4a96

Also, move deletion logic to a pre.remove hook within a transaction.

We can add tag as we create an article

dc7bf1a

Let's regroup the logic at the model level

Create an article with nested mutation query

189458a

Also, toggle an article tag via the same nested query

ff0f3ab

And do the same with article tag removal

3ba289e

Aaand remove the now unused resolvers

7e74c93

Replace AcquintanceService with runQuery and plain graphl queries

69032eb

Factor workingVersion methods in one service

801af74

Use external GraphQL query for createNewArticleVersion

b712312

Default button state is secondary

2f10a1c

When primary and tertiary are empty then.

Refactor Credentials and Register GraphQL queries

ca0fa78

Also, add EmailAddress scalar

Merge VersionService and ArticleService

e0feb2e

Express more GraphQL fields as DateTime, JWT and HexColorCode scalars

d220878

thom4parisot added 3 commits January 6, 2023 14:35

Remove isemail as EmailAddress supersedes it at the API level

d313872

Strongly test isUser, expand it to resolve appropriate userId to quer…

27d14aa

…y against

Breaking Change: distinguish user and token from GraphQL context

464a693

ggrossetie reviewed Jan 6, 2023

View reviewed changes

graphql/package.json Show resolved Hide resolved

ggrossetie reviewed Jan 6, 2023

View reviewed changes

thom4parisot added 11 commits January 6, 2023 22:16

Parallelize build matrix

de14df7

Document how to pass SE_GRAPHQL_TOKEN to both export and stylo-export

2fc6ab0

Move rename and zoteroLink to nested resolvers

6fa5920

Harden versionId and articleId with Export component

c774a52

Otherwise an undefined version would appear as undefined

Migrate to resolved userId

ae3d581

Cache npm dependencies

0cb8c0b

Essentially to speed up the 19 seconds install time of the frontend

Remove unused helper

43f06bf

Use Mongoose set() model method to avoid object-injection

08f812d

Parallelize docker build matrix

98a63fc

Refactor default article creation as a Model method

a28fa7c

It also solves a regression introduction in #458, specifically in e3de56a fixes #639 fixes #688

Abstract sharing/unsharing as Model methods

d66e70b

thom4parisot force-pushed the feature/better-article-graphql-query branch from ced6840 to d66e70b Compare January 7, 2023 18:07

thom4parisot added 6 commits January 7, 2023 14:01

Move Tag deletion in its Model middleware

0ce7597

Save tag owner at once

1eb4db3

Add Markdown and Version — tested — helpers

fd107b2

Abstract createVersion as an Article Model method

4bbeaaa

Also, derives sommaire from markdown content on assignment

Fix race condition in User and Article creation

0f721d5

Remove referrer ending slash

c9e8e43

refs #710

thom4parisot merged commit 9b929c7 into master Jan 7, 2023

thom4parisot deleted the feature/better-article-graphql-query branch January 7, 2023 19:16

thom4parisot added this to the v1.8 milestone Jan 11, 2023

thom4parisot mentioned this pull request Jan 11, 2023

Expose les objets tags lors d'une requête GraphQL user { articles } et user { article(id) } #725

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Modularisation et utilisation d'un fichier GraphQL pour composer la liste des articles #703

Modularisation et utilisation d'un fichier GraphQL pour composer la liste des articles #703

thom4parisot commented Dec 21, 2022 •

edited

Loading

netlify bot commented Dec 21, 2022 •

edited

Loading

ggrossetie Dec 21, 2022

thom4parisot commented Dec 23, 2022 •

edited

Loading

ggrossetie commented Dec 23, 2022

ggrossetie commented Dec 23, 2022

thom4parisot commented Dec 23, 2022 •

edited

Loading

thom4parisot commented Dec 23, 2022

ggrossetie Jan 6, 2023

thom4parisot Jan 6, 2023

ggrossetie Jan 6, 2023

thom4parisot Jan 6, 2023 •

edited

Loading

ggrossetie Jan 6, 2023

ggrossetie commented Jan 6, 2023

Modularisation et utilisation d'un fichier GraphQL pour composer la liste des articles #703

Modularisation et utilisation d'un fichier GraphQL pour composer la liste des articles #703

Conversation

thom4parisot commented Dec 21, 2022 • edited Loading

Todo

Suites

netlify bot commented Dec 21, 2022 • edited Loading

✅ Deploy Preview for stylo-dev ready!

ggrossetie Dec 21, 2022

Choose a reason for hiding this comment

thom4parisot commented Dec 23, 2022 • edited Loading

ggrossetie commented Dec 23, 2022

ggrossetie commented Dec 23, 2022

thom4parisot commented Dec 23, 2022 • edited Loading

thom4parisot commented Dec 23, 2022

ggrossetie Jan 6, 2023

Choose a reason for hiding this comment

thom4parisot Jan 6, 2023

Choose a reason for hiding this comment

ggrossetie Jan 6, 2023

Choose a reason for hiding this comment

thom4parisot Jan 6, 2023 • edited Loading

Choose a reason for hiding this comment

ggrossetie Jan 6, 2023

Choose a reason for hiding this comment

ggrossetie commented Jan 6, 2023

thom4parisot commented Dec 21, 2022 •

edited

Loading

netlify bot commented Dec 21, 2022 •

edited

Loading

thom4parisot commented Dec 23, 2022 •

edited

Loading

thom4parisot commented Dec 23, 2022 •

edited

Loading

thom4parisot Jan 6, 2023 •

edited

Loading