dvargas92495 / SmartBlocks

Useful examples from developer community for Roam42 SmartBlocks
147 stars 7 forks source link

Raindrop.io Integration for Mass Import of Tagged/Dated Bookmarks #150

Open bathrobe opened 3 years ago

bathrobe commented 3 years ago

✂️ Copy of your #42SmartBlock from Roam

I put my code in blocks separate from the SmartBlock because Github kept formatting nested bullets strangely. I tried to comment where to place things in a straightforward way.

//each of these code blocks are separate bullets outside the SmartBlock.
//copy their block ids and paste them in the locations specified
//copy this blocks ref id and paste it in ((YOUR API CODE BLOCK HERE))
let rawBookmarks = [];
let page = [];
const bmFormatter = (bmArray) => {
  let newArray = bmArray.map(
    (b) =>
      `[${b.title}](${b.link}) - ${b.excerpt} ${b.tags.map(
        (tag) => `#[[${tag}]]`
      )} #raindrop - [[${dayjs(b.created).format("MMMM Do, YYYY")}]]`
  );
  return newArray;
};
const getAllBookmarks = async function () {
  let i = 0;
  for (i = 0; i < 10; i++) {
    page = await fetch(
      `https://api.raindrop.io/rest/v1/raindrops/0?perpage=50&page=${i}`,
      {
        headers: {
          Authorization: `Bearer ${roam42.smartBlocks.activeWorkflow.vars["TestKey"]}`,
        },
      }
    )
      .then((res) => res.json())
      .then((res) => res.items);
    if (page.length > 0) {
      rawBookmarks.push(...page);
    }
  }
  roam42.smartBlocks.activeWorkflow.vars["tweets"] = bmFormatter(
    rawBookmarks.filter((b) => b.domain === "twitter.com")
  );
  roam42.smartBlocks.activeWorkflow.vars["links"] = bmFormatter(
    rawBookmarks.filter((b) => b.type === "link" && b.domain != "twitter.com")
  );
  roam42.smartBlocks.activeWorkflow.vars["videos"] = bmFormatter(
    rawBookmarks.filter((b) => b.type === "video")
  );
  roam42.smartBlocks.activeWorkflow.vars["articles"] = bmFormatter(
    rawBookmarks.filter((b) => b.type === "article")
  );
};
return getAllBookmarks();
//copy this blocks ref id and paste it in ((YOUR TWEET BLOCK ID HERE))
const bmOutputter = (bmArray) => {
    bmArray.map((b) =>
      roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(b)
    );
  };
  bmOutputter(roam42.smartBlocks.activeWorkflow.vars["tweets"])
//copy this blocks ref id and paste it in ((YOUR ARTICLES BLOCK ID HERE))
const bmOutputter = (bmArray) => {
    bmArray.map((b) =>
      roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(b)
    );
  };
  bmOutputter(roam42.smartBlocks.activeWorkflow.vars["articles"])
//copy this blocks ref id and paste it in ((YOUR VIDEOS BLOCK ID HERE))
const bmOutputter = (bmArray) => {
    bmArray.map((b) =>
      roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(b)
    );
  };
  bmOutputter(roam42.smartBlocks.activeWorkflow.vars["videos"])
//copy this blocks ref id and paste it in ((YOUR LINKS BLOCK IDHERE))
const bmOutputter = (bmArray) => {
    bmArray.map((b) =>
      roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(b)
    );
  };
  bmOutputter(roam42.smartBlocks.activeWorkflow.vars["links"])

📋 Describe the SmartBlock

This Smartblock imports all Bookmarks from the Raindrop bookmark manager Raindrop.io — All-in-one bookmark manager. It creates a block for each bookmark with its link, title, description, and tags (as well as the date it was created in Raindrop). The bookmarks are sorted into four categories: Tweets, Articles, Videos, and Links. (I have a Raindrop integrated with Twitter and Youtube using IFTTT and Zapier that sends Youtube likes and Twitter likes to Raindrop-- it is easy to set up!) There is a limit of 500 bookmarks (you can change this by replacing the i<10 in the for loop of the API code block to a higher number).

✅ Describe any prerequisites or dependencies that are required for this SmartBlock

You need a Raindrop.io account with some bookmarks in it as well as the desktop app. (The free version works fine). Download — Raindrop.io scroll to Desktop App. You can get your API Test Key from desktop app's settings > integrations > For Developers > Create New App > Credentials > Create test token. Paste it in the input box when you run the SmartBlock. Note that you don't need to manually tag anything as tweet, article, video, etc-- Raindrop does it for you.

📷 Screenshot of your #42SmartBlock workflow/template from Roam

It's a big block, so I made a Loom. https://www.loom.com/share/37e95ead4c754196920255b4870937e1

💡 Additional Info

In action on my Raindrop account. So pretty. Could add images to each block too (and twitter embeds) but it seemed like overkill. https://www.loom.com/share/15435b8e5aae43a0a353e7d3fcdd29c8