Skip to content

Release v0.1.0

Compare
Choose a tag to compare
@github-actions github-actions released this 23 Oct 15:11

Themes are here!

Themes have been one of the most requested features of UnTab. With this update, themes are now available simply via /themes in UnTab search. (Yep, themes are also a plugin!)


A look at available themes

All the themes in their full glory!

Group 12

Addings new themes

While the themes added right now would fairly meet the need for many users, new themes can be easily contributed by the community because all the colors are used in UnTab are extracted as CSS variables in a single file. Hence adding a new theme is just following two steps!

  • Add an entry in the 'themes' plugin in src/background/plugins.js with the name of the theme defined as by theme property.
  • Open src/themes/themes.css file and define the colors for your new theme similar to how other themes are defined using the .theme-<theme value in plugins> CSS class.

Fixes #9

Updates in Plugins API

Implementing themes as a plugin allowed me to add a few new options to the Plugins API for even better integration with the underlying extension!

  • It is now possible to make use of the extension storage API to store small pieces of data that might be required by a plugin. These small pieces of data are passed straight to the UnTab interface(when opened next time) which can make use of the data in some way or another.
    Example from theme plugin below
{
'themes': {
    displayName: 'Themes',
    item: [
      {
        title: 'Dark',
        theme: 'dark',
      },
    ],
    handler(item, sendResponse) {
      chrome.storage.local.set({ theme: item.theme });
    }
}
  • Support for emojis as a fallback when favicons are not available: Emojis can be defined via the emoji property in every item to denote an emoji that can be used when favicons are not available(either not defined in the favicon property or problem in loading the favicon). This is better than showing just a simple circle in most cases if a suitable emoji can represent a plugin item correctly.
{
  'themes': {
    displayName: 'themes',
    item: {
      title: 'Dark',
      emoji: '馃寬',
    },
  }
}
  • Second argument in handler method - 'sendResponse': sendResponse method is passed to handler method of the plugin which must be called exactly once in the handler method to indicate that the handler terminated (either successfully or error). Again, it is mandatory to call this method right now, but I'm figuring out ways to improve this behavior.
    What's the use of sendResponse? Well, it can be used to send a small response from the plugin to the UnTab interface after it has finished its task. It can be used to send arbitrary data or maybe in some ways control how UnTab interface behaves with some plugin interactions.
    • A standard property autoClose is available here right now that can be used to indicate whether UnTab should close itself after the plugin is selected or not. Setting it to false would keep the UnTab interface open, it's default value is set to true.
      This property is used in the themes plugin to prevent the automatic closing of UnTab interface when a theme is selected by the user.

Tab Searching is now a plugin on its own! 馃挴

This was more of a surprise when I first tried this, but the entire Tab searching and switching functionality could be simply extracted as a plugin similar to the History searching and Bookmarks searching plugins. This goes to show how far the plugins system of UnTab has come already. UnTab on its own is just a barebones tool now which can run a bunch of plugins to improve your productivity!

Other minor improvements

  • The color of the circle shown in place of favicons(when they aren't available) now get different colors instead of just orange.
  • All of the tab searching and switching logic was removed from the background/index.js file as they are now a part of the tabs plugin.
  • Minor changes in the displayName of tab actions. Previously it was just "Tab", now it is updated to "Tab actions"
  • All plugins have been refactored to make use of the sendResponse argument in the handler method as it is mandatory to be called.
  • src/fonts.css file is moved to src/themes/fonts.css