@likec4/language-server 1.4.0 → 1.6.0

package/src/model-graph/compute-view/__test__/fixture.ts

@@ -1,6 +1,7 @@
 import type {
   BorderStyle,
   ComputedView,
+  CustomRelationExpr as C4CustomRelationExpr,
   Element,
   ElementExpression as C4ElementExpression,
   ElementKind,
@@ -9,15 +10,16 @@ import type {
   Fqn,
   Relation,
   RelationID,
+  RelationshipArrowType,
+  RelationshipLineType,
   Tag,
   ThemeColor,
   ViewID,
   ViewRule,
-  ViewRuleExpression,
+  ViewRulePredicate,
   ViewRuleStyle
 } from '@likec4/core'
-import { pluck } from 'rambdax'
-import { indexBy, isString, pick } from 'remeda'
+import { indexBy, isString, map, prop } from 'remeda'
 import { LikeC4ModelGraph } from '../../LikeC4ModelGraph'
 import { computeElementView } from '../index'
 
@@ -195,16 +197,23 @@ export type FakeElementIds = keyof typeof fakeElements
 const rel = ({
   source,
   target,
-  title
+  title,
+  ...props
 }: {
   source: FakeElementIds
   target: FakeElementIds
   title?: string
+  kind?: string
+  color?: ThemeColor
+  line?: RelationshipLineType
+  head?: RelationshipArrowType
+  tail?: RelationshipArrowType
 }): Relation => ({
   id: `${source}:${target}` as RelationID,
   title: title ?? '',
   source: source as Fqn,
-  target: target as Fqn
+  target: target as Fqn,
+  ...(props as any)
 })
 
 export const fakeRelations = [
@@ -251,17 +260,24 @@ export const fakeRelations = [
   rel({
     source: 'cloud.frontend.dashboard',
     target: 'cloud.backend.graphql',
-    title: 'requests'
+    kind: 'graphlql',
+    title: 'requests',
+    line: 'solid'
   }),
   rel({
     source: 'cloud.frontend.adminPanel',
     target: 'cloud.backend.graphql',
-    title: 'fetches'
+    kind: 'graphlql',
+    title: 'fetches',
+    line: 'dashed',
+    tail: 'odiamond'
   }),
   rel({
     source: 'cloud',
     target: 'amazon',
-    title: 'uses'
+    title: 'uses',
+    head: 'diamond',
+    tail: 'odiamond'
   }),
   rel({
     source: 'cloud.backend',
@@ -328,7 +344,7 @@ type CustomExpr = {
   }
 }
 
-type Expression =
+export type Expression =
   | ElementRefExpr
   | InOutExpr
   | IncomingExpr
@@ -336,7 +352,19 @@ type Expression =
   | RelationExpr
   | CustomExpr
 
-function toExpression(expr: Expression): C4Expression {
+export function $customRelation(
+  relation: RelationExpr,
+  props: Omit<C4CustomRelationExpr['customRelation'], 'relation'>
+): C4CustomRelationExpr {
+  return {
+    customRelation: {
+      relation: $expr(relation) as any,
+      ...props
+    }
+  }
+}
+
+export function $expr(expr: Expression | C4Expression): C4Expression {
   if (!isString(expr)) {
     return expr as C4Expression
   }
@@ -346,31 +374,31 @@ function toExpression(expr: Expression): C4Expression {
   if (expr.startsWith('->')) {
     if (expr.endsWith('->')) {
       return {
-        inout: toExpression(expr.replace(/->/g, '').trim() as ElementRefExpr) as any
+        inout: $expr(expr.replace(/->/g, '').trim() as ElementRefExpr) as any
       }
     }
     return {
-      incoming: toExpression(expr.replace('-> ', '') as ElementRefExpr) as any
+      incoming: $expr(expr.replace('-> ', '') as ElementRefExpr) as any
     }
   }
   if (expr.endsWith(' ->')) {
     return {
-      outgoing: toExpression(expr.replace(' ->', '') as ElementRefExpr) as any
+      outgoing: $expr(expr.replace(' ->', '') as ElementRefExpr) as any
     }
   }
   if (expr.includes(' <-> ')) {
     const [source, target] = expr.split(' <-> ')
     return {
-      source: toExpression(source as ElementRefExpr) as any,
-      target: toExpression(target as ElementRefExpr) as any,
+      source: $expr(source as ElementRefExpr) as any,
+      target: $expr(target as ElementRefExpr) as any,
       isBidirectional: true
     }
   }
   if (expr.includes(' -> ')) {
     const [source, target] = expr.split(' -> ')
     return {
-      source: toExpression(source as ElementRefExpr) as any,
-      target: toExpression(target as ElementRefExpr) as any
+      source: $expr(source as ElementRefExpr) as any,
+      target: $expr(target as ElementRefExpr) as any
     }
   }
   if (expr.endsWith('._')) {
@@ -390,20 +418,20 @@ function toExpression(expr: Expression): C4Expression {
   }
 }
 
-export function $include(expr: Expression): ViewRuleExpression {
+export function $include(expr: Expression | C4Expression): ViewRulePredicate {
   return {
-    include: [toExpression(expr)]
+    include: [$expr(expr)]
   }
 }
-export function $exclude(expr: Expression): ViewRuleExpression {
+export function $exclude(expr: Expression | C4Expression): ViewRulePredicate {
   return {
-    exclude: [toExpression(expr)]
+    exclude: [$expr(expr)]
   }
 }
 
 export function $style(element: ElementRefExpr, style: ViewRuleStyle['style']): ViewRuleStyle {
   return {
-    targets: [toExpression(element) as C4ElementExpression],
+    targets: [$expr(element) as C4ElementExpression],
     style: Object.assign({}, style)
   }
 }
@@ -432,7 +460,7 @@ export function computeView(
     )
   }
   return Object.assign(result, {
-    nodeIds: pluck('id', result.nodes) as string[],
-    edgeIds: pluck('id', result.edges) as string[]
+    nodeIds: map(result.nodes, prop('id')) as string[],
+    edgeIds: map(result.edges, prop('id')) as string[]
   })
 }

package/src/model-graph/compute-view/compute.ts

@@ -5,7 +5,7 @@ import type {
   Element,
   ElementView,
   Relation,
-  ViewRuleExpression
+  ViewRulePredicate
 } from '@likec4/core'
 import {
   ancestorsFqn,
@@ -14,15 +14,16 @@ import {
   Expr,
   invariant,
   isAncestor,
-  isStrictElementView,
+  isScopedElementView,
   isViewRuleAutoLayout,
-  isViewRuleExpression,
+  isViewRulePredicate,
   nonexhaustive,
   parentFqn
 } from '@likec4/core'
-import { hasAtLeast, isTruthy, unique } from 'remeda'
+import { first, flatMap, hasAtLeast, isTruthy, unique } from 'remeda'
 import type { LikeC4ModelGraph } from '../LikeC4ModelGraph'
-import { applyElementCustomProperties } from '../utils/applyElementCustomProperties'
+import { applyCustomElementProperties } from '../utils/applyCustomElementProperties'
+import { applyCustomRelationProperties } from '../utils/applyCustomRelationProperties'
 import { applyViewRuleStyles } from '../utils/applyViewRuleStyles'
 import { buildComputeNodes } from '../utils/buildComputeNodes'
 import { sortNodes } from '../utils/sortNodes'
@@ -35,6 +36,7 @@ import {
   excludeRelationExpr,
   excludeWildcardRef,
   includeCustomElement,
+  includeCustomRelation,
   includeElementKindOrTag,
   includeElementRef,
   includeExpandedElementExpr,
@@ -90,7 +92,7 @@ export class ComputeCtx {
     this.reset()
     const { rules, ...view } = this.view
 
-    const viewPredicates = rules.filter(isViewRuleExpression)
+    const viewPredicates = rules.filter(isViewRulePredicate)
     if (this.root && viewPredicates.length == 0) {
       this.addElement(this.graph.element(this.root))
     }
@@ -132,7 +134,7 @@ export class ComputeCtx {
     // but we need to keep the initial sort
     const initialSort = elements.flatMap(e => nodesMap.get(e.id) ?? [])
 
-    const nodes = applyElementCustomProperties(
+    const nodes = applyCustomElementProperties(
       rules,
       applyViewRuleStyles(
         rules,
@@ -156,18 +158,18 @@ export class ComputeCtx {
       ...view,
       autoLayout: autoLayoutRule?.autoLayout ?? 'TB',
       nodes,
-      edges: [...sortedEdges]
+      edges: applyCustomRelationProperties(rules, nodes, sortedEdges)
     }
   }
 
   protected get root() {
-    return isStrictElementView(this.view) ? this.view.viewOf : null
+    return isScopedElementView(this.view) ? this.view.viewOf : null
   }
 
   protected get computedEdges(): ComputedEdge[] {
     return this.ctxEdges.map((e): ComputedEdge => {
       invariant(hasAtLeast(e.relations, 1), 'Edge must have at least one relation')
-      const relations = [...e.relations].sort(compareRelations)
+      const relations = e.relations.toSorted(compareRelations)
       const source = e.source.id
       const target = e.target.id
 
@@ -185,21 +187,44 @@ export class ComputeCtx {
         relation = relations[0]
       } else {
         relation = relations.find(r => r.source === source && r.target === target)
-        relation ??= relations.find(r => r.source === source || r.target === target)
+        // relation ??= relations.toReversed().find(r => r.source === source || r.target === target)
       }
 
       // This edge represents mutliple relations
       // We use label if only it is the same for all relations
       if (!relation) {
-        const labels = unique(relations.flatMap(r => (isTruthy(r.title) ? r.title : [])))
-        if (hasAtLeast(labels, 1)) {
-          if (labels.length === 1) {
-            edge.label = labels[0]
-          } else {
-            edge.label = '[...]'
+        const shared = relations.reduce((acc, r) => {
+          if (r.color && acc.color !== r.color) {
+            acc.color = undefined
           }
-        }
-        return edge
+          if (r.head && acc.head !== r.kind) {
+            acc.head = undefined
+          }
+          if (r.tail && acc.tail !== r.kind) {
+            acc.tail = undefined
+          }
+          if (r.line && acc.line !== r.line) {
+            acc.line = undefined
+          }
+          if (isTruthy(r.title) && acc.title !== r.title) {
+            acc.title = '[...]'
+          }
+          return acc
+        }, {
+          title: first(flatMap(relations, r => isTruthy(r.title) ? r.title : [])),
+          head: first(flatMap(relations, r => isTruthy(r.head) ? r.head : [])),
+          tail: first(flatMap(relations, r => isTruthy(r.tail) ? r.tail : [])),
+          color: first(flatMap(relations, r => isTruthy(r.color) ? r.color : [])),
+          line: first(flatMap(relations, r => isTruthy(r.line) ? r.line : []))
+        })
+        return Object.assign(
+          edge,
+          isTruthy(shared.title) && { label: shared.title },
+          shared.color && { color: shared.color },
+          shared.line && { line: shared.line },
+          shared.head && { head: shared.head },
+          shared.tail && { tail: shared.tail }
+        )
       }
 
       return Object.assign(
@@ -374,7 +399,7 @@ export class ComputeCtx {
     }, [] as ComputeCtx.Edge[])
   }
 
-  protected processPredicates(viewRules: ViewRuleExpression[]): this {
+  protected processPredicates(viewRules: ViewRulePredicate[]): this {
     // eslint-disable-next-line @typescript-eslint/no-this-alias
     for (const rule of viewRules) {
       const isInclude = 'include' in rule
@@ -386,6 +411,12 @@ export class ComputeCtx {
           }
           continue
         }
+        if (Expr.isCustomRelationExpr(expr)) {
+          if (isInclude) {
+            includeCustomRelation.call(this, expr)
+          }
+          continue
+        }
         if (Expr.isExpandedElementExpr(expr)) {
           if (isInclude) {
             includeExpandedElementExpr.call(this, expr)

package/src/model-graph/compute-view/predicates.ts

@@ -1,9 +1,10 @@
 import type { Element } from '@likec4/core'
 import { Expr, invariant, nonexhaustive, parentFqn } from '@likec4/core'
-import type { Predicate } from 'rambdax'
 import { isNullish as isNil } from 'remeda'
 import type { ComputeCtx } from './compute'
 
+type Predicate<T> = (x: T) => boolean
+
 export function includeElementRef(this: ComputeCtx, expr: Expr.ElementRefExpr) {
   // Get the elements that are already in the Ctx before any mutations
   // Because we need to add edges between them and the new elements
@@ -402,3 +403,7 @@ export function includeCustomElement(this: ComputeCtx, expr: Expr.CustomElementE
     this.addEdges(this.graph.anyEdgesBetween(el, currentElements))
   }
 }
+
+export function includeCustomRelation(this: ComputeCtx, expr: Expr.CustomRelationExpr) {
+  includeRelationExpr.call(this, expr.customRelation.relation)
+}

package/src/model-graph/dynamic-view/__test__/fixture.ts

@@ -1,4 +1,4 @@
-import type { DynamicViewRule, DynamicViewStep, Fqn, ViewID, ViewRuleExpression } from '@likec4/core'
+import type { DynamicViewRule, DynamicViewStep, Fqn, ViewID, ViewRulePredicate } from '@likec4/core'
 import { partition } from 'remeda'
 import { type FakeElementIds, fakeModel } from '../../compute-view/__test__/fixture'
 import { computeDynamicView } from '../index'
@@ -36,7 +36,7 @@ export function $step(expr: StepExpr, title?: string): DynamicViewStep {
   throw new Error(`Invalid step expression: ${expr}`)
 }
 
-export function compute(stepsAndRules: (DynamicViewStep | ViewRuleExpression)[]) {
+export function compute(stepsAndRules: (DynamicViewStep | ViewRulePredicate)[]) {
   const [steps, rules] = partition(stepsAndRules, (s): s is DynamicViewStep => 'source' in s)
   const result = computeDynamicView(
     {

package/src/model-graph/dynamic-view/compute.ts

@@ -17,7 +17,7 @@ import {
 } from '@likec4/core'
 import { isTruthy, unique } from 'remeda'
 import type { LikeC4ModelGraph } from '../LikeC4ModelGraph'
-import { applyElementCustomProperties } from '../utils/applyElementCustomProperties'
+import { applyCustomElementProperties } from '../utils/applyCustomElementProperties'
 import { applyViewRuleStyles } from '../utils/applyViewRuleStyles'
 import { buildComputeNodes } from '../utils/buildComputeNodes'
 
@@ -138,7 +138,7 @@ export class DynamicViewComputeCtx {
       return edge
     })
 
-    const nodes = applyElementCustomProperties(
+    const nodes = applyCustomElementProperties(
       rules,
       applyViewRuleStyles(
         rules,

package/src/model-graph/utils/{applyElementCustomProperties.ts → applyCustomElementProperties.ts}

@@ -1,8 +1,8 @@
 import type { ComputedNode, ViewRule } from '@likec4/core'
 import { Expr, nonNullable } from '@likec4/core'
-import { isEmpty, isNullish as isNil, omitBy } from 'remeda'
+import { isEmpty, isNonNullish, pickBy } from 'remeda'
 
-export function applyElementCustomProperties(_rules: ViewRule[], _nodes: ComputedNode[]) {
+export function applyCustomElementProperties(_rules: ViewRule[], _nodes: ComputedNode[]) {
   const rules = _rules.flatMap(r => ('include' in r ? r.include.filter(Expr.isCustomElement) : []))
   if (rules.length === 0) {
     return _nodes
@@ -18,10 +18,11 @@ export function applyElementCustomProperties(_rules: ViewRule[], _nodes: Compute
       continue
     }
     let node = nonNullable(nodes[nodeIdx])
-    const { border, opacity, ...rest } = omitBy(props, isNil)
+    const { border, opacity, ...rest } = pickBy(props, isNonNullish)
     if (!isEmpty(rest)) {
       node = {
         ...node,
+        isCustomized: true,
         ...rest
       }
     }
@@ -36,6 +37,7 @@ export function applyElementCustomProperties(_rules: ViewRule[], _nodes: Compute
     if (styleOverride) {
       node = {
         ...node,
+        isCustomized: true,
         style: {
           ...node.style,
           ...styleOverride

package/src/model-graph/utils/applyCustomRelationProperties.ts

@@ -0,0 +1,50 @@
+import type { ComputedEdge, ComputedNode, ViewRule } from '@likec4/core'
+import { Expr } from '@likec4/core'
+import { isEmpty } from 'remeda'
+import { elementExprToPredicate } from './elementExpressionToPredicate'
+
+export function applyCustomRelationProperties(
+  _rules: ViewRule[],
+  nodes: ComputedNode[],
+  _edges: Iterable<ComputedEdge>
+): ComputedEdge[] {
+  const rules = _rules.flatMap(r => ('include' in r ? r.include.filter(Expr.isCustomRelationExpr) : []))
+  const edges = Array.from(_edges)
+  if (rules.length === 0) {
+    return edges
+  }
+  for (
+    const {
+      customRelation: { relation, title, ...props }
+    } of rules
+  ) {
+    if (isEmpty(props) && !title) {
+      continue
+    }
+    const isSource = elementExprToPredicate(relation.source)
+    const isTarget = elementExprToPredicate(relation.target)
+    const satisfies = (edge: ComputedEdge) => {
+      const source = nodes.find(n => n.id === edge.source)
+      const target = nodes.find(n => n.id === edge.target)
+      if (!source || !target) {
+        return false
+      }
+      let result = isSource(source) && isTarget(target)
+      if (!result && relation.isBidirectional) {
+        result = isSource(target) && isTarget(source)
+      }
+      return result
+    }
+    edges.forEach((edge, i) => {
+      if (satisfies(edge)) {
+        edges[i] = {
+          ...edge,
+          label: title ?? edge.label,
+          isCustomized: true,
+          ...props
+        }
+      }
+    })
+  }
+  return edges
+}

package/src/model-graph/utils/applyViewRuleStyles.ts

@@ -1,7 +1,9 @@
 import type { ComputedNode, ViewRule } from '@likec4/core'
-import { Expr, isViewRuleStyle, nonexhaustive, parentFqn } from '@likec4/core'
-import { anyPass, filter, type Predicate } from 'rambdax'
-import { isDefined, isNullish } from 'remeda'
+import { Expr, isViewRuleStyle } from '@likec4/core'
+import { anyPass, filter, isDefined } from 'remeda'
+import { elementExprToPredicate } from './elementExpressionToPredicate'
+
+type Predicate<T> = (x: T) => boolean
 
 export function applyViewRuleStyles(_rules: ViewRule[], nodes: ComputedNode[]) {
   const rules = _rules.filter(isViewRuleStyle)
@@ -15,44 +17,19 @@ export function applyViewRuleStyles(_rules: ViewRule[], nodes: ComputedNode[]) {
         predicates.push(() => true)
         break
       }
-      if (Expr.isElementKindExpr(target)) {
-        predicates.push(
-          target.isEqual ? n => n.kind === target.elementKind : n => n.kind !== target.elementKind
-        )
-        continue
-      }
-      if (Expr.isElementTagExpr(target)) {
-        predicates.push(
-          target.isEqual
-            ? ({ tags }) => !!tags && tags.includes(target.elementTag)
-            : ({ tags }) => isNullish(tags) || !tags.includes(target.elementTag)
-        )
-        continue
-      }
-      if (Expr.isExpandedElementExpr(target)) {
-        predicates.push(n => n.id === target.expanded || parentFqn(n.id) === target.expanded)
-        continue
-      }
-      if (Expr.isElementRef(target)) {
-        const { element, isDescedants } = target
-        predicates.push(
-          isDescedants ? n => n.id.startsWith(element + '.') : n => (n.id as string) === element
-        )
-        continue
-      }
-      nonexhaustive(target)
+      predicates.push(elementExprToPredicate(target))
     }
-    filter(anyPass(predicates), nodes).forEach(n => {
+    filter(nodes, anyPass(predicates)).forEach(n => {
       n.shape = rule.style.shape ?? n.shape
       n.color = rule.style.color ?? n.color
-      if (isDefined.strict(rule.style.icon)) {
+      if (isDefined(rule.style.icon)) {
         n.icon = rule.style.icon
       }
       let styleOverride: ComputedNode['style'] | undefined
-      if (isDefined.strict(rule.style.border)) {
-        styleOverride = { ...styleOverride, border: rule.style.border }
+      if (isDefined(rule.style.border)) {
+        styleOverride = { border: rule.style.border }
       }
-      if (isDefined.strict(rule.style.opacity)) {
+      if (isDefined(rule.style.opacity)) {
         styleOverride = { ...styleOverride, opacity: rule.style.opacity }
       }
       if (styleOverride) {

package/src/model-graph/utils/elementExpressionToPredicate.ts

@@ -0,0 +1,32 @@
+import type { ComputedNode } from '@likec4/core'
+import { Expr, nonexhaustive, parentFqn } from '@likec4/core'
+import { isNullish } from 'remeda'
+
+type Predicate<T> = (x: T) => boolean
+
+export function elementExprToPredicate(target: Expr.ElementPredicateExpression): Predicate<ComputedNode> {
+  if (Expr.isWildcard(target)) {
+    return () => true
+  }
+  if (Expr.isElementKindExpr(target)) {
+    return target.isEqual ? n => n.kind === target.elementKind : n => n.kind !== target.elementKind
+  }
+  if (Expr.isElementTagExpr(target)) {
+    return target.isEqual
+      ? ({ tags }) => !!tags && tags.includes(target.elementTag)
+      : ({ tags }) => isNullish(tags) || !tags.includes(target.elementTag)
+  }
+  if (Expr.isExpandedElementExpr(target)) {
+    return n => n.id === target.expanded || parentFqn(n.id) === target.expanded
+  }
+  if (Expr.isElementRef(target)) {
+    const { element, isDescedants } = target
+    return isDescedants
+      ? n => n.id.startsWith(element + '.')
+      : n => (n.id as string) === element
+  }
+  if (Expr.isCustomElement(target)) {
+    return n => (n.id as string) === target.custom.element
+  }
+  nonexhaustive(target)
+}