New: Add Lab 3.4.0 release notes and docs update (#1331)

Author: tonilastre

pages/memgraph-lab/configuration.mdx

@@ -78,6 +78,8 @@ valid Memgraph Enterprise license are available only in a Docker environment.
 | Variable                                 | Description                                                                                                                                                             | Type       | Default            |
 |------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------|--------------------|
 | `AUTH_NATIVE_IS_DISABLED`                | Enable or disable native authentication (username, password)                                                                                                            | `boolean`  | `false`            |
+| `AUTH_SSO_STATE_SECRET`                  | Secret key used to encrypt shared state during the SSO flow; if not set, Lab generates a random one at startup                                                          | `string`   |                    |
+| `AUTH_SSO_STATE_EXPIRY_SEC`              | Duration (in seconds) for which the SSO state remains valid                                                                                                             | `number`   | `300`              |
 | `AUTH_OIDC_ENTRA_ID_IS_ENABLED`          | Enable or disable Entra ID SSO authentication via OIDC                                                                                                                  | `boolean`  | `false`            |
 | `AUTH_OIDC_ENTRA_ID_DISPLAY_NAME`        | Entra ID OIDC display name "Sign in with `<name>`"                                                                                                                      | `string`   | `"Entra ID"`       |
 | `AUTH_OIDC_ENTRA_ID_AUTHORIZATION_URL`   | Entra ID OIDC authorization URL                                                                                                                                         | `string`   |                    |
@@ -87,6 +89,7 @@ valid Memgraph Enterprise license are available only in a Docker environment.
 | `AUTH_OIDC_ENTRA_ID_CLIENT_SECRET`       | Entra ID OIDC client secret                                                                                                                                             | `string`   |                    |
 | `AUTH_OIDC_ENTRA_ID_CALLBACK_URL`        | Entra ID OIDC callback URL                                                                                                                                              | `string`   |                    |
 | `AUTH_OIDC_ENTRA_ID_SCOPE`               | Entra ID OIDC scope                                                                                                                                                     | `string`   | `"openid profile"` |
+| `AUTH_OIDC_ENTRA_ID_PKCE_IS_ENABLED`     | Enables PKCE flow for Entra ID OIDC integration                                                                                                                         | `boolean`  | `false`            |
 | `AUTH_OIDC_OKTA_IS_ENABLED`              | Enable or disable Okta SSO authentication via OIDC                                                                                                                      | `boolean`  | `false`            |
 | `AUTH_OIDC_OKTA_DISPLAY_NAME`            | Okta OIDC display name "Sign in with `<name>`"                                                                                                                          | `string`   | `"Okta"`           |
 | `AUTH_OIDC_OKTA_AUTHORIZATION_URL`       | Okta OIDC authorization URL                                                                                                                                             | `string`   |                    |
@@ -96,6 +99,7 @@ valid Memgraph Enterprise license are available only in a Docker environment.
 | `AUTH_OIDC_OKTA_CLIENT_SECRET`           | Okta OIDC client secret                                                                                                                                                 | `string`   |                    |
 | `AUTH_OIDC_OKTA_CALLBACK_URL`            | Okta OIDC callback URL                                                                                                                                                  | `string`   |                    |
 | `AUTH_OIDC_OKTA_SCOPE`                   | Okta OIDC scope                                                                                                                                                         | `string`   | `"openid profile"` |
+| `AUTH_OIDC_OKTA_PKCE_IS_ENABLED`         | Enables PKCE flow for Okta OIDC integration                                                                                                                             | `boolean`  | `false`            |
 | `AUTH_OIDC_CUSTOM_IS_ENABLED`            | Enable or disable custom SSO authentication via OIDC                                                                                                                    | `boolean`  | `false`            |
 | `AUTH_OIDC_CUSTOM_DISPLAY_NAME`          | Custom OIDC display name "Sign in with `<name>`"                                                                                                                        | `string`   | `"SSO"`            |
 | `AUTH_OIDC_CUSTOM_AUTHORIZATION_URL`     | Custom OIDC authorization URL                                                                                                                                           | `string`   |                    |
@@ -105,6 +109,7 @@ valid Memgraph Enterprise license are available only in a Docker environment.
 | `AUTH_OIDC_CUSTOM_CLIENT_SECRET`         | Custom OIDC client secret                                                                                                                                               | `string`   |                    |
 | `AUTH_OIDC_CUSTOM_CALLBACK_URL`          | Custom OIDC callback URL                                                                                                                                                | `string`   |                    |
 | `AUTH_OIDC_CUSTOM_SCOPE`                 | Custom OIDC scope                                                                                                                                                       | `string`   | `"openid profile"` |
+| `AUTH_OIDC_CUSTOM_PKCE_IS_ENABLED`       | Enables PKCE flow for custom OIDC integration                                                                                                                           | `boolean`  | `false`            |
 | `AUTH_SAML_ENTRA_ID_IS_ENABLED`          | Enable or disable Entra ID SSO authentication via SAML                                                                                                                  | `boolean`  | `false`            |
 | `AUTH_SAML_ENTRA_ID_DISPLAY_NAME`        | Entra ID SAML display name "Sign in with `<name>`"                                                                                                                      | `string`   | `"Entra ID"`       |
 | `AUTH_SAML_ENTRA_ID_ENTRY_POINT`         | Entra ID SAML entry point                                                                                                                                               | `string`   |                    |

pages/memgraph-lab/features/graph-style-script/built-in-elements.mdx

@@ -1,6 +1,6 @@
 ---
 title: Built in elements
-description: Unleash the potential of the built-in elements in Memgraph. Our documentation page offers detailed information on the different elements available, enabling you to optimize your graph computing as you move forward with your graph project. 
+description: Unleash the potential of the built-in elements in Memgraph. Our documentation page offers detailed information on the different elements available, enabling you to optimize your graph computing as you move forward with your graph project.
 ---
 
 import {CommunityLinks} from '/components/social-card/CommunityLinks'
@@ -789,6 +789,38 @@ Outputs:
 
 - `List[Relationship]`
 
+#### `InNodes(node)`
+
+Returns the list of unique inbound node from a given graph node.
+
+Example:
+
+- `size: Size(InNodes(node))` sets the size to be equal to the count of unique inbound nodes.
+
+Inputs:
+
+- `node: Node`
+
+Outputs:
+
+- `List[Node]`
+
+#### `OutNodes(node)`
+
+Returns the list of unique outbound nodes from a given graph node.
+
+Example:
+
+- `size: Size(OutNodes(node))` sets the size to be equal to the count of unique outbound nodes.
+
+Inputs:
+
+- `node: Node`
+
+Outputs:
+
+- `List[Node]`
+
 #### `Nodes(graphOrEdge)`
 
 Returns the list of start and end nodes from a given graph edge. It returns
@@ -895,6 +927,33 @@ Outputs:
 
 - `number`
 
+#### `IsTreeStructure(graph: Graph, minDepth?: number)`
+
+Determines whether the given graph is a directed tree structure,
+meaning it contains no cycles and each node has at most one inbound edge.
+By default, the graph must have a minimum depth of 2 hops to qualify
+as a tree structure. You can adjust this requirement using the optional
+`minDepth` parameter.
+
+Example:
+
+- Apply a "tree" layout to the view if the graph is a tree structure:
+
+```
+@ViewStyle IsTreeStructure(graph) {
+  view: "tree"
+}
+```
+
+Inputs:
+
+- `graph: Graph`
+- `minDepth: number?`
+
+Outputs:
+
+- `boolean`
+
 ### Map functions
 
 #### `MapKeys(map)`

pages/memgraph-lab/features/graph-style-script/directive-properties.mdx

@@ -4,17 +4,17 @@ description: Discover the properties of directives in Memgraph through our compr
 ---
 
 import {CommunityLinks} from '/components/social-card/CommunityLinks'
-
+import { Callout } from 'nextra/components'
 
 # Directive properties
 
-Graph Style Script currently has four directives:
+Graph Style Script currently has these directives:
 
 * [`@NodeStyle` directive](#nodestyle-directive) - for defining the visual style of graph nodes.
 * [`@EdgeStyle` directive](#edgestyle-directive) - for defining the visual style of graph relationships.
 * [`@ViewStyle` directive](#viewstyle-directive) - for defining the general graph style properties.
 * [`@ViewStyle.Map` directive](#viewstylemap-directive) - for defining the graph style properties when map
-  is in the background.
+  is in the background. (**DEPRECATED in Lab 3.4**)
 
 Each directive includes a set of configurable properties, along with their
 expected data types.
@@ -425,56 +425,97 @@ Example:
 ## `@ViewStyle` directive
 
 `@ViewStyle` directive is used for defining style properties of a general
-graph view: link distance, view, physics, repel force, etc. You can read more about
-each property in the following sections.
+graph view: view type, link distance, view, physics, repel force, etc. It is also
+possible to use a predicate expression which acts as a filter to apply
+the defined properties to the final directive output.
 
 Here is the list of all properties that can be defined in the `@ViewStyle` directive,
 along with their expected types.
 
-### `collision-radius: number`
+### `force-collision-radius: number`
 
 Sets the margin radius for each node from its centre. If node `size` is `10` and
-`collision-radius` is set to `20`, it means there will be `10` spaces left around each
+`force-collision-radius` is set to `20`, it means there will be `10` spaces left around each
 node. No other node can be in that space.
 
-The default `collision-radius` is `15`.
+The default `force-collision-radius` is `15`.
 
 Example:
 
-- `collision-radius: 15` sets the margin radius for each node from its centre to `15`.
+- `force-collision-radius: 15` sets the margin radius for each node from its centre to `15`.
 
-### `repel-force: number`
+### `force-repel-force: number`
 
 Sets the strength of repel force between all nodes. If positive, it adds a force that
 moves nodes away from each other, if negative, it moves nodes towards each other.
 
-The default `repel-force` is `-100`.
+The default `force-repel-force` is `-100`.
 
 Example:
 
-- `repel-force: -100` sets the repel force between all nodes to `-100`.
+- `force-repel-force: -100` sets the repel force between all nodes to `-100`.
 
-### `link-distance: number`
+### `force-link-distance: number`
 
 Sets the minimum required distance between two connected nodes from their centres.
 
-The default `link-distance` is `30`. If node sizes are `20` and link distance is `30`,
+The default `force-link-distance` is `30`. If node sizes are `20` and link distance is `30`,
 nodes might overlap because the minimum distance from one node centre to another is
 `20 + 20 = 40`.
 
 Example:
 
-- `link-distance: 30` sets the minimum required distance to `30`.
+- `force-link-distance: 30` sets the minimum required distance to `30`.
 
-### `physics-enabled: boolean`
+### `force-physics-enabled: boolean`
 
 Enables or disables physics which is a real-time simulation for graph node positions.
 When physics is enabled, the graph is not static anymore.
 
 Examples:
 
-- `physics-enabled: True` enables the physics.
-- `physics-enabled: Greater(NodeCount(graph), 100)` enables the physics for graphs with more than 100 nodes.
+- `force-physics-enabled: True` enables the physics.
+- `force-physics-enabled: Greater(NodeCount(graph), 100)` enables the physics for graphs with more than 100 nodes.
+
+### `tree-orientation: "horizontal" | "vertical"`
+
+Determines the direction in which the `"tree"` layout is rendered.
+
+- `"vertical"` (default): Renders the tree from top to bottom, with parent nodes above their children.
+- `"horizontal"`: Renders the tree from left to right, with parent nodes to the left of their children.
+
+Example:
+
+- `tree-orientation: "horizontal"` lays out the tree from left to right.
+
+### `tree-node-gap: number`
+
+Specifies the spacing between sibling nodes within the same depth
+level in the `"tree"` layout.
+This affects the horizontal or vertical distance between nodes,
+depending on the tree orientation.
+
+Example:
+
+- `tree-node-gap: 50` increases the spacing between nodes on the same level.
+
+### `tree-level-gap: number`
+
+Sets the spacing between different depth levels in the `"tree"` layout.
+This controls the vertical or horizontal distance between parent and
+child nodes based on the tree orientation.
+
+Example:
+
+- `tree-level-gap: 100` increases the space between levels in the tree.
+
+### `map-tile-layer: "detailed" | "light" | "dark" | "basic" | "satellite"`
+
+Sets the map tile for the map background. The default map tile is `"light"`.
+
+Examples:
+
+- `map-tile-layer: "dark"` sets the map tile to be type `"dark"`.
 
 ### `background-color: Color`
 
@@ -485,33 +526,116 @@ Examples:
 - `background-color: #DDDDDD` sets the background color of the canvas to light gray.
 - `background-color: black` sets the background color of the canvas to black.
 
-###  `view: string: "default" | "map"`
+###  `view: string: "default" | "map" | "force" | "tree"`
+
+Sets the current graph view.
+
+- `"default"` automatically selects between `"force"` and `"map"` views based on the available graph data.
+- `"map"` displays the graph over a geographical map. Each node must include `latitude` and `longitude` to be positioned correctly.
+- `"force"` renders a force-directed layout, placing nodes on a canvas with repelling forces between them.
+- `"tree"` arranges the nodes in a hierarchical layout, displaying the structure from root to leaf nodes.
+
+The default value of `view` is `"default"`.
+
+Examples:
+
+- `view: "default"` uses automatic view selection.
+- `view: "map"` sets the view to a map layout, which will only render if at least one node includes both `latitude` and `longitude`.
+
+### `collision-radius: number`
+
+<Callout type="warning">
+
+**DEPRECATED in Lab 3.4**: Use `force-collision-radius` instead.
+
+</Callout>
+
+Sets the margin radius for each node from its centre. If node `size` is `10` and
+`collision-radius` is set to `20`, it means there will be `10` spaces left around each
+node. No other node can be in that space.
+
+The default `collision-radius` is `15`.
+
+Example:
+
+- `collision-radius: 15` sets the margin radius for each node from its centre to `15`.
+
+### `repel-force: number`
+
+<Callout type="warning">
+
+**DEPRECATED in Lab 3.4**: Use `force-repel-force` instead.
+
+</Callout>
+
+Sets the strength of repel force between all nodes. If positive, it adds a force that
+moves nodes away from each other, if negative, it moves nodes towards each other.
+
+The default `repel-force` is `-100`.
+
+Example:
+
+- `repel-force: -100` sets the repel force between all nodes to `-100`.
+
+### `link-distance: number`
+
+<Callout type="warning">
+
+**DEPRECATED in Lab 3.4**: Use `force-link-distance` instead.
 
-Sets the current graph view that can be either `"default"` or `"map"`. The `"default"` view is
-a graph visualization on a blank background. The `"map"` view is a graph visualization with a map
-as a background where each node needs to provide `latitude` and `longitude` to be positioned
-on the map.
+</Callout>
 
-The default `view` is `"default"`.
+Sets the minimum required distance between two connected nodes from their centres.
+
+The default `link-distance` is `30`. If node sizes are `20` and link distance is `30`,
+nodes might overlap because the minimum distance from one node centre to another is
+`20 + 20 = 40`.
+
+Example:
+
+- `link-distance: 30` sets the minimum required distance to `30`.
+
+### `physics-enabled: boolean`
+
+<Callout type="warning">
+
+**DEPRECATED in Lab 3.4**: Use `force-physics-enabled` instead.
+
+</Callout>
+
+Enables or disables physics which is a real-time simulation for graph node positions.
+When physics is enabled, the graph is not static anymore.
 
 Examples:
 
-- `view: "default"` sets the view to the default view.
-- `view: "map"` sets the view to the map view that will be shown only if at least one node has
-  required geo information: `latitude` and `longitude`.
+- `physics-enabled: True` enables the physics.
+- `physics-enabled: Greater(NodeCount(graph), 100)` enables the physics for graphs with more than 100 nodes.
 
 ## `@ViewStyle.Map` directive
 
+<Callout type="warning">
+
+`@ViewStyle.Map` is deprecated in Lab 3.4. Check updated directive `@ViewStyle` to
+set up map view and map tile layer.
+
+</Callout>
+
 `@ViewStyle.Map` directive is a subset of `@ViewStyle` because it defines
-additional style properties for a graph view when there is a map background. 
-Style properties of the `@ViewStyle.Map` directive are used to style the 
+additional style properties for a graph view when there is a map background.
+Style properties of the `@ViewStyle.Map` directive are used to style the
 background map.
 
 Here is the list of all properties that can be defined in the `@ViewStyle.Map`
 directive, along with their expected types.
 
 ### `tile-layer: string: "detailed" | "light" | "dark" | "basic" | "satellite"`
 
+<Callout type="warning">
+
+**DEPRECATED in Lab 3.4**: Use `@ViewStyle { map-tile-layer }` instead.
+
+</Callout>
+
 Sets the map tile for the map background. The default map tile is `"light"`.
 
 Examples: