Add save to Readwise Reader integration to Hacker News extension by russellyeo · Pull Request #16749 · raycast/extensions

russellyeo · 2025-01-31T21:51:07Z

Description

Added optional support for saving hacker news articles to Readwise Reader.

Features

Securely add your API key via preferences
A new Action "Save to Readwise Reader" becomes available after you have added your API key
Performing the action will save the URL to your Readwise Reader account via the Readwise Reader API
Previously saved articles will show up in the list with a SavedDocument icon

Screenshots

Checklist

I read the extension guidelines
I read the documentation about publishing
I ran npm run build and tested this distribution build in Raycast
I checked that files in the assets folder are used by the extension itself
I checked that assets used by the README are placed outside of the metadata folder

- Add format script - Remove force unwrap and unused imports - Lint - Add publish script - Cache saved URLs and show an accessory - Fix import - Add documentation - Only show the save to readwise reader option if the token is set - Extract readwise logic to new file - Add action to save article to readwise reader - Automated add to contributors - Initial commit

raycastbot · 2025-01-31T21:51:26Z

Thank you for your contribution! 🎉

🔔 @thomaspaulmann @GastroGeek @sxn @itsnwa @andreaselia you might want to have a look.

You can use this guide to learn how to check out the Pull Request locally in order to test it.

Due to our current reduced availability, the initial review may take up to 10-15 business days

pernielsentikaer

Looks like a nice update, could you check the suggestion I made 😊

pernielsentikaer · 2025-02-14T10:43:12Z

extensions/hacker-news/src/preferences.ts

+
+interface Preferences {
+  /** Readwise API token from https://readwise.io/access_token */
+  readwiseToken: string;
+}


You don't need to manually set preference types as this is autogenerated in raycast-env.d.tsx

Ah cool! Thanks for the feedback

pernielsentikaer · 2025-02-27T08:57:43Z

Could you look into the merge conflicts too?

Also, we're testing @greptileai which also wants to do a review, could you look into that it finds if it makes sense?

greptile-apps

PR Summary

This PR adds Readwise Reader integration to the Hacker News extension, allowing users to save articles and see visual indicators for previously saved content.

Added new readwise.ts module with API integration for saving articles to Readwise Reader and caching saved URLs
Added preferences.ts with utility functions to securely handle the Readwise API token
Modified utils.ts to show a visual indicator (SaveDocument icon) for previously saved articles
Added a new preference for the Readwise API token in package.json as a password type for security
In CHANGELOG.md, the new entry is correctly placed at the top with {PR_MERGE_DATE} which will be automatically replaced with the current date upon merging

_{💡 (1/5) You can manually trigger the bot by mentioning @greptileai in a comment!}

_{6 file(s) reviewed, 2 comment(s)}
_{Edit PR Review Bot Settings | Greptile}

greptile-apps · 2025-02-27T08:58:51Z

extensions/hacker-news/src/frontpage.tsx

+          <Action
+            icon={Icon.SaveDocument}
+            title="Save to Readwise Reader"
+            onAction={() => saveToReadwise(props.item.link || "")}


style: Consider wrapping this in a try/catch block or using showFailureToast from @raycast/utils to handle errors more elegantly

Super cool that the bot knows about the components in the Raycast libraries!

The saveToReadwise function does do error handling internally and shows a success/error toast message, but I guess it would be better software design to separate the API action and the UI. I'll do that now.

greptile-apps · 2025-02-27T08:59:10Z

extensions/hacker-news/src/preferences.ts

+export function getReadwiseToken(): string {
+  const preferences = getPreferenceValues();
+  if (!preferences.readwiseToken) {
+    throw new Error("Readwise API token not configured");
+  }
+  return preferences.readwiseToken;


style: Consider adding a try/catch block here similar to hasReadwiseToken() to handle potential exceptions from getPreferenceValues().

You can add since we have raycast-env.d.ts available 😊

pernielsentikaer · 2025-02-27T11:31:02Z

did you add the readwiseToken in preferences?

pernielsentikaer · 2025-02-27T14:10:02Z

@greptileai can you check again 🙂

greptile-apps

PR Summary

(updates since last review)

This PR adds Readwise Reader integration to the Hacker News extension, allowing users to save articles and displaying visual indicators for previously saved content.

The launchCommand function in frontpage.tsx should be wrapped in a try/catch block for better error handling
The showToast error handling in readwise.ts could be simplified using showFailureToast from @raycast/utils
The getReadwiseToken() function in preferences.ts lacks the same try/catch error handling that hasReadwiseToken() has
Consider adding a subtitle to the command in package.json to indicate it's from Hacker News, since there are multiple commands

_{6 file(s) reviewed, no comment(s)}
_{Edit PR Review Bot Settings | Greptile}

pernielsentikaer · 2025-02-27T14:52:36Z

Can you show me a screencast of with and without the Readwise token? I don't have a token to test with 🫠

russellyeo · 2025-03-01T10:20:55Z

@pernielsentikaer Thanks for fixing the changelog and preferences!

I reviewed the feedback from the bot and made a couple of improvements to the code:

Moved the success/failure toast logic into the frontpage component for better separation of concerns (UI in one file, API request in another)
Changed getReadwiseToken() to return an optional string (string | undefined) instead of throwing an error, and updated usages to handle the undefined case appropriately

I also made an improvement to ensure the saved icon appears immediately by loading the saved URLs into useState and refreshing it after successful saves.

Overall the bot is pretty cool, but it seems to have made up some things (there's no launchCommand function in the code?) and some suggestions weren't that useful. However, it did make me think about other code smells in the same area, so it was still useful feedback!

Edit: The next batch of suggestions were great

russellyeo · 2025-03-01T10:27:15Z

Here's a screencast of the changes in action 🙂

output.mp4

russellyeo · 2025-03-01T10:28:27Z

@greptileai can you review again please? 🙂

greptile-apps

PR Summary

(updates since last review)

The PR now includes improved error handling and state management for the Readwise Reader integration in the Hacker News extension.

The frontpage.tsx now properly manages saved URLs state with useState and useEffect hooks to load cached URLs when the component mounts
Added a dedicated handleSaveToReadwise function that handles API responses and updates the UI accordingly
The StoryListItem component now accepts savedUrls and onSave props to properly display saved status and handle save actions
The getAccessories function in utils.ts has been enhanced with an optional isSaved parameter for more flexible saved status display

_{4 file(s) reviewed, 2 comment(s)}
_{Edit PR Review Bot Settings | Greptile}

greptile-apps · 2025-03-01T10:30:28Z

extensions/hacker-news/src/frontpage.tsx

+  onSave: (url: string) => Promise<void>;
+}) {
+  // Check if this item is in the savedUrls array
+  const isSaved = props.item.link ? (props.savedUrls.includes(props.item.link) || isUrlSaved(props.item.link)) : false;


style: This line calls both savedUrls.includes(props.item.link) and isUrlSaved(props.item.link), which seems redundant since isUrlSaved already checks the cache. Consider simplifying this logic.

Yeah fair point, probably good enough to check the local state only

greptile-apps · 2025-03-01T10:30:41Z

extensions/hacker-news/src/readwise.ts

+  const urls = getSavedUrls();
+  if (!urls.includes(url)) {
+    urls.push(url);
+    cache.set(CACHE_KEY, JSON.stringify(urls));
+  }


style: Consider adding error handling for JSON.stringify or cache.set operations in case they fail.

Good idea, added

pernielsentikaer

Hi 👋

Looks good to me, approved 🔥

In the next version, we can always configure it to delete the oldest one when it reaches the limit, I suppose

russellyeo · 2025-03-03T18:51:17Z

Thanks for the review @pernielsentikaer 🙏🏻

Is there anything I need to do to get the PR merged?

pernielsentikaer · 2025-03-03T21:59:49Z

No 🙂

github-actions · 2025-03-03T22:00:48Z

Published to the Raycast Store:
https://raycast.com/thomas/hacker-news

raycastbot · 2025-03-03T22:00:50Z

🎉 🎉 🎉

We've rewarded your Raycast account with some credits. You will soon be able to exchange them for some swag.

russellyeo requested review from itsnwa, sxn and thomaspaulmann as code owners January 31, 2025 21:51

raycastbot added extension fix / improvement Label for PRs with extension's fix improvements extension: hacker-news Issues related to the hacker-news extension labels Jan 31, 2025

Add changelog entry

96414c8

pernielsentikaer self-assigned this Feb 14, 2025

pernielsentikaer requested changes Feb 14, 2025

View reviewed changes

Remove unnecessary explicit Preferences type

db5e88e

greptile-apps bot reviewed Feb 27, 2025

View reviewed changes

Merge branch 'main' into ext/hacker-news

10bc6c5

russellyeo and others added 3 commits February 27, 2025 14:01

Restore preferences after merge conflict

821442f

Update CHANGELOG.md

159b6e0

Update preferences.ts

21e40cf

greptile-apps bot reviewed Feb 27, 2025

View reviewed changes

russellyeo added 3 commits March 1, 2025 10:10

Refresh the save icon in the list on save action

5d08a65

Move UI updates to frontpage, for better separation of concerns

0455585

Make getReadwiseToken optional and handle undefined

f5d6973

greptile-apps bot reviewed Mar 1, 2025

View reviewed changes

russellyeo added 2 commits March 1, 2025 10:34

Simplify: check local state only to check if URL is saved

94a32bd

Handle errors from caching operations

3b23769

pernielsentikaer approved these changes Mar 2, 2025

View reviewed changes

Update CHANGELOG.md and optimise images

d0ffc99

raycastbot merged commit 83e2a36 into raycast:main Mar 3, 2025
2 checks passed

Conversation

russellyeo commented Jan 31, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Features

Screenshots

Checklist

Uh oh!

raycastbot commented Jan 31, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pernielsentikaer left a comment

Choose a reason for hiding this comment

Uh oh!

pernielsentikaer Feb 14, 2025

Choose a reason for hiding this comment

Uh oh!

russellyeo Feb 27, 2025

Choose a reason for hiding this comment

Uh oh!

pernielsentikaer commented Feb 27, 2025

Uh oh!

greptile-apps bot left a comment

Choose a reason for hiding this comment

PR Summary

Uh oh!

greptile-apps bot Feb 27, 2025

Choose a reason for hiding this comment

Uh oh!

russellyeo Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

greptile-apps bot Feb 27, 2025

Choose a reason for hiding this comment

Uh oh!

pernielsentikaer Feb 27, 2025

Choose a reason for hiding this comment

Uh oh!

pernielsentikaer commented Feb 27, 2025

Uh oh!

pernielsentikaer commented Feb 27, 2025

Uh oh!

greptile-apps bot left a comment

Choose a reason for hiding this comment

PR Summary

Uh oh!

pernielsentikaer commented Feb 27, 2025

Uh oh!

russellyeo commented Mar 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

russellyeo commented Mar 1, 2025

Uh oh!

russellyeo commented Mar 1, 2025

Uh oh!

greptile-apps bot left a comment

Choose a reason for hiding this comment

PR Summary

Uh oh!

greptile-apps bot Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

russellyeo Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

greptile-apps bot Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

russellyeo Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

pernielsentikaer left a comment

Choose a reason for hiding this comment

Uh oh!

russellyeo commented Mar 3, 2025

Uh oh!

pernielsentikaer commented Mar 3, 2025

Uh oh!

Uh oh!

github-actions bot commented Mar 3, 2025

russellyeo commented Jan 31, 2025 •

edited

Loading

raycastbot commented Jan 31, 2025 •

edited

Loading

russellyeo commented Mar 1, 2025 •

edited

Loading