26 lines
674 B
TypeScript
26 lines
674 B
TypeScript
|
import { getShapeUtils } from "lib/shape-utils"
|
||
|
|
import { useSelector } from "state"
|
||
|
|
import { deepCompareArrays, getPage } from "utils/utils"
|
||
|
|
|
||
|
|
export default function Defs() {
|
||
|
|
const currentPageShapeIds = useSelector(({ data }) => {
|
||
|
|
return Object.values(getPage(data).shapes)
|
||
|
|
.sort((a, b) => a.childIndex - b.childIndex)
|
||
|
|
.map((shape) => shape.id)
|
||
|
|
}, deepCompareArrays)
|
||
|
|
|
||
|
|
return (
|
||
|
|
<defs>
|
||
|
|
{currentPageShapeIds.map((id) => (
|
||
|
|
<Def key={id} id={id} />
|
||
|
|
))}
|
||
|
|
</defs>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export function Def({ id }: { id: string }) {
|
||
|
|
const shape = useSelector(({ data }) => getPage(data).shapes[id])
|
||
|
|
|
||
|
|
return getShapeUtils(shape).render(shape)
|
||
|
|
}
|