Transaction: EubfYVA...qLcb

{ "data": { "idknwhoru.near": { "component_alpha": { "Components": { "": "import { socialDb } from \"@bos-web-engine/social-db-plugin\";\nimport { useState, useEffect, Suspense } from \"react\";\nimport ps from \"./styles.module.css\"\n\nconst UserComponentList = ({ id, components }) => {\n return <article className={ps.profile}>\n <ul>\n {Object.keys(components).map(component => {\n return <li>\n <a className={ps.link} href={`https://bwe.near.dev/${id}/${component}`}>\n <h3 className={ps.h3}>\n {component}\n </h3>\n </a>\n </li>\n }\n )}\n </ul>\n </article>\n}\n\nexport default function Components({ id = \"idknwhoru.near\" }) {\n const [data, setData] = useState(null);\n const components = data?.[id]?.component_alpha;\n\n const loadData = async () => {\n const res = await socialDb.get({\n key: `${id}/component_alpha/**`\n });\n\n setData(res);\n }\n\n useEffect(() => {\n loadData();\n }, []);\n\n return (\n <section>\n <>\n <h2 className={ps.h2}>Components</h2>\n {\n !components ? <p>pending...</p> : <UserComponentList id={id} components={components} />\n }\n </>\n </section>\n );\n}\n\nexport default Components as BWEComponent;", "css": "@import url(\"https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css\");\n\n.profile {\n display: flex;\n}\n\n.avatar {\n --avatar-size: 60px;\n\n width: var(--avatar-size);\n height: var(--avatar-size);\n border-radius: 50%;\n}\n\n.h2 {\n --font-family: Pretendard Variable;\n --font-style: normal;\n --h2-font-size: 28px;\n --h2-line-height: 33px;\n\n font-family: var(--font-family);\n font-style: var(--font-style);\n font-size: var(--h2-font-size);\n line-height: var(--h2-line-height);\n}\n\n.h3 {\n --font-family: Pretendard Variable;\n --font-style: normal;\n --h3-font-weight: 700;\n --h3-font-size: 24px;\n --h3-line-height: 29px;\n --h3-letter-spacing: -0.003em;\n\n font-weight: var(--h3-font-weight);\n font-size: var(--h3-font-size);\n line-height: var(--h3-line-height);\n letter-spacing: var(--h3-letter-spacing);\n}\n\n.link {\n --link-color: #1a0dab;\n\n color: var(--link-color);\n text-decoration: unset;\n\n &:hover {\n text-decoration: underline;\n }\n\n &:visited {\n color: #681da8;\n }\n}" } } } } }