Document some GraphQL changes between 3.3 and 4.x (#2595)

---------

Co-authored-by: Marek Nocoń <[email protected]>
(cherry picked from commit f21a29c)

Author: adriendupuis

docs/css/custom.css

@@ -379,6 +379,10 @@ ul li li li {
     background-color: var(--table-header);
 }
 
+.md-typeset table td.compare {
+    border: 0.05rem solid var(--md-typeset-table-color)
+}
+
 .md-nav__link[data-md-state=blur] {
     color: rgb(19, 28, 38);
 }

docs/update_and_migration/from_3.3/to_4.0.md

@@ -144,6 +144,56 @@ php bin/console ibexa:migrations:migrate
 
 ## Update your custom code
 
+### GraphQL
+
+Some GraphQL names have changed. Adapt your queries according to the table below.
+
+| 3.3 name                                          | 4.0 name                                    |
+|:--------------------------------------------------|:--------------------------------------------|
+| `id` argument                                     | `contentId` argument                        |
+| `_info` content item property                     | `_contentInfo` content item property        |
+| `<ContentType>Content` (example: `FolderContent`) | `<ContentType>Item` (example: `FolderItem`) |
+
+Example of an updated query:
+
+<table>
+<thead><tr><th scope="col">3.3</th><th scope="col">4.0</th></tr></thead>
+<tbody>
+<tr><td class="compare">
+```graphql
+{
+  content {
+    folder(id: 1) {
+      _info {
+        id
+        name
+      }
+    }
+  }
+}
+```
+</td><td class="compare">
+```graphql
+{
+  content {
+    folder(contentId: 1) {
+       _contentInfo{
+        id
+        name
+      }
+    }
+  }
+}
+```
+</td></tr>
+</tbody></table>
+
+Notice that the argument have been updated to `contentId` while the `id` property keeps its name.
+
+While revisiting GraphQL queries, you may consider the new feature `item`
+allowing to fetch a content item without knowing its content type.
+For more information, see [Get a content item](https://doc.ibexa.co/en/4.6/api/graphql/graphql_queries/#get-a-content-item).
+
 ### Back Office customization
 
 The v4 version of [[= product_name =]] is using Bootstrap 5 in the Back Office. If you were using Bootstrap 4 for styling, you need to update and adjust all custom Back Office components [following the migration guide from Bootstrap 4](https://getbootstrap.com/docs/5.0/migration/).