This Chrome extension provides a browser action that simply allows the user to create a shortlink for all the selected tabs in the current window. It can be activated via a keyboard shortcut Alt + L. To use it, in the omnibar, type go then press Tab, then type the phrase you have created a shortlink for earlier & it will open the tab(s).
Currently a user can type import, and export in the text input area. Here's an example of typing export into the input area.
Desired behavior
When a user types export, in addition to copying the JSON blob of all the shortlinks to the clipboard, also save it to the downloads folder as a file. I don't think that it is necessary to allow the user to choose a filename.
When a user types import, make the text area that is shown a drop target. The user should be able to drag / drop this JSON file into the text area and it should allow the contents of the file to be put inside the text area so the user can edit it and then click on "Save shortlinks"
Introduce folders (modules) that contain domains like storage, or components
Refactor existing inline code into functions that make their arguments explicit, instead of inheriting them from the lexical scope (eg: function components can be refactored into smaller functions that take explicit arguments for variables that they were previously capturing from their lexical scope)
Where possible introduce types and provide more robust design for state data, maybe even use custom hooks
Currently the extension shows all shortlinks in the UI all at once. This works if there are 20 or 30 links. However, if there are 50 or more, then this becomes difficult to find what a user might be looking for.
It would be great to have a text field that allows the user to type a string. As they type, this can be used to filter what shortlinks are shown in the UI.
The extension features for import and export, drag and drop, and export to a file needs chrome api access. To make this extension easily portable and testable move these apis to the storage provider or equivalent and write more tests.
Currently the code is using both async / await & promises. Standardize on async / await (where possible). In some places it might still be easier to use promises.
This is an experiment to see what it would take to package this chrome extension as an electron desktop app.
Currently the extension only works on Chrome. It would be great to get it working for the other browsers. But also add the ability for the same extension to run in an electron container so that it can be run as a desktop app.
Currently, in order to edit shortlinks, the user has to use a mouse. It would be great to have a way to use keyboard shortcuts to navigate the entire editing experience.
This could look like:
The user types a keyboard shortcut to activate edit mode
Then they can press up / down to move focus between the shortlink that is selected
Maybe they press Enter and that triggers the edit button, or they press Delete and that triggers the delete button
As a bonus, if there was a way to search / filter the shortlinks in edit mode, that would be great too!
Currently storage.ts isn't well tested. It is not trivial to test the logic here since a lot of the work gets delegated to chrome.storage.
We should introduce dependency injection to solve this issue by passing something that wraps chrome.storage or whatever other storage provider we decide to use in the future. We can also introduce an interface type for this storage provider.
Provide a nice table / grid view that allows each shortlink to be seen and edited or deleted. The idea here is that you might want to merge or prune a few entries. And you don't want to do a full export to JSON, modify that, and then re-import it.
Currently all the shortlinks are saved in a key-value store in Chrome Sync for the user's logged in account. It would be useful to be able to export and import all these links.
Add an export command that simply takes the entire hashmap of shortlinks, turns them into JSON, and then copies them to the clipboard.
Add an import command that does the reverse (clipboard -> JSON text -> shortlinks).
Use case
export - When someone types export we are going to copy the shortlink JSON content into the clipboard. And the user can save it to a file or whatever they would like.
import - When someone types import we are going to display a popup in the text area where the user can paste JSON content.
Here's a user journey:
The thinking is that I have first run export, then the shortlink JSON gets copied to the clipboard.
Then I save that in a file.
Then I install shortlink extension in a different browser (with a different chrome user) and then I type import.
Then the extension can show a text area where I can paste the JSON text in there, and I have all the shortlinks imported here.
Extend the copy/c command such that you can pass in multiple arguments that are comma delimited. These should all be copied to the clipboard & joined w/ \n.
Description:
ESLint is a tool that statically analyzes JavaScript code to identify and report potential errors, enforce coding conventions, and improve code quality by applying a set of configurable rules. It helps developers catch and fix issues early in the development process, leading to cleaner and more maintainable code.
Things to Consider:
ESLint Rules should created in such a way that it insures good typescript practices in the code base.
Acceptance Criteria:
-ESLint is successfully integrated into the project.
-The project's code base is properly linted, and all existing code conforms to the linting rules.
-A README or documentation is updated to include information on how to use and configure ESLint for the project.
"You might want to mention that Firefox natively supports using the chrome.* namespace and callbacks. Thus, the easiest code-compatibility between Chrome and Firefox is to just use chrome.* in both. You only need to use the browser.* polyfill if really want to use Promises."
The chrome.storage.sync API uses call backs and it causes a lot of issues w/ writing async code easily. Replace all use of callbacks and replace with async / await and promisified storage API.
In the popup, currently all the shortlink names are displayed. But they aren't clickable. Make them clickable, so that a user can open tabs with their mouse & not have to type anything.
Optional - Further refinement would be to allow Tab focus traversal and Enter to open the tabs themselves.