From 52a8b9ddd120556b72903f7bc10a1ed09727a847 Mon Sep 17 00:00:00 2001 From: "J. Matthew Pryor" Date: Thu, 7 Oct 2021 16:16:02 +1100 Subject: [PATCH] working using new API to call a named SmartBlock --- package-lock.json | 42 ++++++++++++++++---------------- package.json | 5 ++-- src/StarRating.tsx | 38 ++++++++++++++++++++++------- src/index.ts | 60 +++++++++++++++++++++++++++------------------- 4 files changed, 90 insertions(+), 55 deletions(-) diff --git a/package-lock.json b/package-lock.json index c69552e..a57dbf2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,7 @@ "eslint": "^7.32.0", "react": "^17.0.2", "react-dom": "^17.0.2", - "roam-client": "^1.90.0", + "roam-client": "^1.91.0", "roamjs-components": "^0.25.1" }, "devDependencies": { @@ -3544,9 +3544,9 @@ } }, "node_modules/core-js-pure": { - "version": "3.18.0", - "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.18.0.tgz", - "integrity": "sha512-ZnK+9vyuMhKulIGqT/7RHGRok8RtkHMEX/BGPHkHx+ouDkq+MUvf9mfIgdqhpmPDu8+V5UtRn/CbCRc9I4lX4w==", + "version": "3.18.2", + "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.18.2.tgz", + "integrity": "sha512-4hMMLUlZhKJKOWbbGD1/VDUxGPEhEoN/T01k7bx271WiBKCvCfkgPzy0IeRS4PB50p6/N1q/SZL4B/TRsTE5bA==", "hasInstallScript": true, "funding": { "type": "opencollective", @@ -8913,20 +8913,20 @@ } }, "node_modules/roam-client": { - "version": "1.90.0", - "resolved": "https://registry.npmjs.org/roam-client/-/roam-client-1.90.0.tgz", - "integrity": "sha512-IfhNwowAuAtjvV92w6Yxc+NLIQnqCqER4gQyzSjovwDHrQ+YynON2yXM1tLBn3sDRiP+r/QL11HgDtw1fYcAWQ==", + "version": "1.91.0", + "resolved": "https://registry.npmjs.org/roam-client/-/roam-client-1.91.0.tgz", + "integrity": "sha512-rtf2HzMX9fViuZVFtusw/hgPqJ75Q0yW0U8bJ6t1tzTNEXjk2EQfdvq5nwF0baA0hi5NFS0OTjnGOb3BlSn7kg==", "dependencies": { "axios": "^0.21.1", "date-fns": "^2.16.1", "randomstring": "^1.1.5", - "roam-marked": "^0.10.16" + "roam-marked": "^0.10.19" } }, "node_modules/roam-marked": { - "version": "0.10.16", - "resolved": "https://registry.npmjs.org/roam-marked/-/roam-marked-0.10.16.tgz", - "integrity": "sha512-n/1cv5b/SJqfhyh2sZYrpX2Z54OCR3wZYppRNxAG9rlNWFM10Npwg/i1OOb6ST8YtF80CcvEjbqSWYHRejIfNw==", + "version": "0.10.19", + "resolved": "https://registry.npmjs.org/roam-marked/-/roam-marked-0.10.19.tgz", + "integrity": "sha512-bk43Lbh78x2WWnaJoedBTSf2MOP2zZXtYEVWbnRzTQohbWZO/549oY0ZKA6e6/iD7xRa/R1JeqA7rUMUIR9xcQ==", "dependencies": { "hast-util-to-html": "^7.1.3", "marked": "^2.0.0", @@ -14217,9 +14217,9 @@ } }, "core-js-pure": { - "version": "3.18.0", - "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.18.0.tgz", - "integrity": "sha512-ZnK+9vyuMhKulIGqT/7RHGRok8RtkHMEX/BGPHkHx+ouDkq+MUvf9mfIgdqhpmPDu8+V5UtRn/CbCRc9I4lX4w==" + "version": "3.18.2", + "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.18.2.tgz", + "integrity": "sha512-4hMMLUlZhKJKOWbbGD1/VDUxGPEhEoN/T01k7bx271WiBKCvCfkgPzy0IeRS4PB50p6/N1q/SZL4B/TRsTE5bA==" }, "core-util-is": { "version": "1.0.3", @@ -18365,20 +18365,20 @@ } }, "roam-client": { - "version": "1.90.0", - "resolved": "https://registry.npmjs.org/roam-client/-/roam-client-1.90.0.tgz", - "integrity": "sha512-IfhNwowAuAtjvV92w6Yxc+NLIQnqCqER4gQyzSjovwDHrQ+YynON2yXM1tLBn3sDRiP+r/QL11HgDtw1fYcAWQ==", + "version": "1.91.0", + "resolved": "https://registry.npmjs.org/roam-client/-/roam-client-1.91.0.tgz", + "integrity": "sha512-rtf2HzMX9fViuZVFtusw/hgPqJ75Q0yW0U8bJ6t1tzTNEXjk2EQfdvq5nwF0baA0hi5NFS0OTjnGOb3BlSn7kg==", "requires": { "axios": "^0.21.1", "date-fns": "^2.16.1", "randomstring": "^1.1.5", - "roam-marked": "^0.10.16" + "roam-marked": "^0.10.19" } }, "roam-marked": { - "version": "0.10.16", - "resolved": "https://registry.npmjs.org/roam-marked/-/roam-marked-0.10.16.tgz", - "integrity": "sha512-n/1cv5b/SJqfhyh2sZYrpX2Z54OCR3wZYppRNxAG9rlNWFM10Npwg/i1OOb6ST8YtF80CcvEjbqSWYHRejIfNw==", + "version": "0.10.19", + "resolved": "https://registry.npmjs.org/roam-marked/-/roam-marked-0.10.19.tgz", + "integrity": "sha512-bk43Lbh78x2WWnaJoedBTSf2MOP2zZXtYEVWbnRzTQohbWZO/549oY0ZKA6e6/iD7xRa/R1JeqA7rUMUIR9xcQ==", "requires": { "hast-util-to-html": "^7.1.3", "marked": "^2.0.0", diff --git a/package.json b/package.json index e964fb2..942a02f 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,8 @@ "main": "./build/main.js", "scripts": { "build": "roamjs-scripts build", - "dev": "roamjs-scripts dev" + "dev": "roamjs-scripts dev", + "publish": "roamjs-scripts publish" }, "license": "MIT", "devDependencies": { @@ -20,7 +21,7 @@ "eslint": "^7.32.0", "react": "^17.0.2", "react-dom": "^17.0.2", - "roam-client": "^1.90.0", + "roam-client": "^1.91.0", "roamjs-components": "^0.25.1" } } diff --git a/src/StarRating.tsx b/src/StarRating.tsx index 4a77499..24c4253 100644 --- a/src/StarRating.tsx +++ b/src/StarRating.tsx @@ -12,7 +12,7 @@ function StarIcon({ className: string; }) { return ( - + ); } @@ -55,10 +55,14 @@ function StarIcon({ // This one also has an explicit return const StarRating = ({ initialValue, - blockUid + maximumStars, + blockUid, + smartBlockTemplate }: { initialValue: number; - blockUid: string + maximumStars: number; + blockUid: string; + smartBlockTemplate: string; }) : JSX.Element => { const [rating, setRating] = useState(initialValue); const [hoverRating, setHoverRating] = useState(initialValue); @@ -73,14 +77,30 @@ function StarIcon({ window.roamAlphaAPI.updateBlock({ block: { uid: blockUid, string: index.toString() }, }); - + console.log(`StarRating: blockUid ${blockUid} smartBlockTemplate ${smartBlockTemplate}`) + if( smartBlockTemplate ) { + const valueBlockUid: string = window.roamAlphaAPI.util.generateUID(); + window.roamAlphaAPI.createBlock({ + location: { "parent-uid": blockUid, order: 1000 /* at end */ }, + block: { string: '' , uid: valueBlockUid}, + }); + window.roamjs.extension.smartblocks.triggerSmartblock({ + srcName: smartBlockTemplate, + targetUid: valueBlockUid, + variables: { + 'rating': index.toString(), + 'wow': 'Wee' + } + }) + }; }; return(
- {[1, 2, 3, 4, 5].map((index) => { + {Array.from(Array(maximumStars).keys()).map((index) => { return ( ( - + ); export const renderStartRating = ( initialValue: number, + maximumStars: number, blockUid: string, + smartBlockTemplate: string, p: HTMLElement ): void => { - ReactDOM.render(, p); + ReactDOM.render(, p); } export default StarRating; diff --git a/src/index.ts b/src/index.ts index 2d9234b..c2f317b 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1,4 @@ -import { addStyle, toConfig, runExtension, createButtonObserver, getUidsFromButton, getTreeByBlockUid } from "roam-client"; +import { addStyle, toConfig, runExtension, createButtonObserver, getUidsFromButton, getTreeByBlockUid, getTreeByPageName } from "roam-client"; import { createConfigObserver } from "roamjs-components"; import { renderStartRating } from "./StarRating"; @@ -30,32 +30,20 @@ runExtension(ID, () => { config: { tabs: [ { - id: "import", + id: "rating", fields: [ { - type: "multitext", - title: "calendars", + type: "number", + title: "maximum", description: - 'The calendar ids to import events from. To find your calendar id, go to your calendar settings and scroll down to "Integrate Calendar".', - defaultValue: ["dvargas92495@gmail.com"], - }, - { - type: "flag", - title: "include event link", - description: - "Whether or not to hyperlink the summary with the event link. Ignored if 'format' is specified.", - }, - { - type: "flag", - title: "skip free", - description: - "Whether or not to filter out events marked as 'free'", + "The maximum stars in a rating", + defaultValue: 5, }, { type: "text", - title: "format", + title: "template", description: - "The format events should output in when imported into Roam", + "The template to run after a rating", }, ], }, @@ -68,14 +56,38 @@ runExtension(ID, () => { attribute: "rating-button", render: (b: HTMLButtonElement) => { const { blockUid } = getUidsFromButton(b); - const tree = getTreeByBlockUid(blockUid); - const initialValueNode = tree.children.find( + let tree = getTreeByBlockUid(blockUid); + let valueBlockUid = null; + let initialValue = 1; + let initialValueNode = tree.children.find( (c) => !isNaN(parseInt(c.text)) ); - const initialValue = initialValueNode + if (!initialValueNode) { + valueBlockUid = window.roamAlphaAPI.util.generateUID(); + window.roamAlphaAPI.createBlock({ + location: { "parent-uid": blockUid, order: 0 }, + block: { string: initialValue.toString() , uid: valueBlockUid}, + }); + } + else { + valueBlockUid = initialValueNode.uid; + initialValue = initialValueNode ? parseInt(initialValueNode.text) : 0; - renderStartRating(initialValue, initialValueNode.uid, b.parentElement); + } + + const configTree = getTreeByPageName(CONFIG); + const ratingTree = configTree.find((t) => /rating/i.test(t.text)); + + const maxSetting = ratingTree?.children + ?.find?.((t) => /maximum/i.test(t.text)) + ?.children?.[0]?.text?.trim?.(); + + const template = ratingTree?.children + ?.find?.((t) => /template/i.test(t.text)) + ?.children?.[0]?.text?.trim?.(); + + renderStartRating(initialValue, Number.parseInt(maxSetting), valueBlockUid, template, b.parentElement); }, });