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:
Julien Calixte
2026-06-21 15:28:42 +02:00
parent 26d3c4493a
commit 889c7361ed

View File

@@ -14,9 +14,7 @@ import { useVueFlow } from "@vue-flow/core"
import { computed } from "vue" import { computed } from "vue"
import { type GlossEntry, INFO_LINK_GLOSS, NODE_GLOSSARY } from "@/model/glossary" import { type GlossEntry, INFO_LINK_GLOSS, NODE_GLOSSARY } from "@/model/glossary"
import type { EdgeData, NodeData } from "@/model/projection" import type { EdgeData, NodeData } from "@/model/projection"
import { useModelStore } from "@/store/model"
const store = useModelStore()
const { getSelectedNodes, getSelectedEdges } = useVueFlow("meadows") const { getSelectedNodes, getSelectedEdges } = useVueFlow("meadows")
const gloss = computed<GlossEntry | null>(() => { const gloss = computed<GlossEntry | null>(() => {
@@ -34,33 +32,6 @@ const gloss = computed<GlossEntry | null>(() => {
} }
return 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> </script>
<template> <template>
@@ -70,13 +41,5 @@ const description = computed<string | null>(() => {
> >
<div class="text-sm font-semibold">{{ gloss.term }}</div> <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> <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> </div>
</template> </template>