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 { 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>
|
||||||
|
|||||||
Reference in New Issue
Block a user