refactor(editor): drop duplicate description from gloss card
The Inspector already shows the selected element's description as an editable field, and it co-renders with the gloss card on selection. Showing the same text read-only in the gloss card was redundant, so the card returns to its single job: defining the element's kind.
This commit is contained in:
@@ -14,9 +14,7 @@ import { useVueFlow } from "@vue-flow/core"
|
||||
import { computed } from "vue"
|
||||
import { type GlossEntry, INFO_LINK_GLOSS, NODE_GLOSSARY } from "@/model/glossary"
|
||||
import type { EdgeData, NodeData } from "@/model/projection"
|
||||
import { useModelStore } from "@/store/model"
|
||||
|
||||
const store = useModelStore()
|
||||
const { getSelectedNodes, getSelectedEdges } = useVueFlow("meadows")
|
||||
|
||||
const gloss = computed<GlossEntry | null>(() => {
|
||||
@@ -34,33 +32,6 @@ const gloss = computed<GlossEntry | null>(() => {
|
||||
}
|
||||
return null
|
||||
})
|
||||
|
||||
/**
|
||||
* The selected element's own "why it's here" note (G4) — distinct from the
|
||||
* generic `gloss` above, which defines the *kind*. Read live from the store so
|
||||
* it tracks edits, and resolves the same selection a pipe/info edge stands in for.
|
||||
*/
|
||||
const description = computed<string | null>(() => {
|
||||
const nodes = getSelectedNodes.value
|
||||
const edges = getSelectedEdges.value
|
||||
|
||||
if (nodes.length === 1 && edges.length === 0) {
|
||||
const node = store.model.nodes.find((n) => n.id === nodes[0].id)
|
||||
return node && node.kind !== "cloud" ? (node.description ?? null) : null
|
||||
}
|
||||
if (edges.length === 1 && nodes.length === 0) {
|
||||
const edge = edges[0]
|
||||
const kind = (edge.data as EdgeData | undefined)?.kind
|
||||
if (kind === "pipe") {
|
||||
const flow = store.model.nodes.find((n) => n.id === edge.id.split("::")[0])
|
||||
return flow && flow.kind !== "cloud" ? (flow.description ?? null) : null
|
||||
}
|
||||
if (kind === "info") {
|
||||
return store.model.infoLinks.find((l) => l.id === edge.id)?.description ?? null
|
||||
}
|
||||
}
|
||||
return null
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -70,13 +41,5 @@ const description = computed<string | null>(() => {
|
||||
>
|
||||
<div class="text-sm font-semibold">{{ gloss.term }}</div>
|
||||
<p class="mt-0.5 text-xs leading-snug text-base-content/70">{{ gloss.short }}</p>
|
||||
<!-- This element's own rationale, below a divider so it reads apart from the
|
||||
generic definition above (the "tour" note for the loaded sample). -->
|
||||
<p
|
||||
v-if="description"
|
||||
class="mt-2 border-t border-base-300 pt-2 text-xs leading-snug text-base-content/80"
|
||||
>
|
||||
{{ description }}
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user