Merge pull request #140 from abhijithvijayan/master

[REFACTOR] Minor enhancements
This commit is contained in:
Abhijith Vijayan
2026-01-04 04:34:48 +05:30
committed by GitHub
7 changed files with 133 additions and 124 deletions

View File

@@ -51,12 +51,6 @@ jobs:
name: firefox-extension
path: extension/firefox.xpi
- name: Upload Opera extension artifact
uses: actions/upload-artifact@v4
with:
name: opera-extension
path: extension/opera.crx
deploy:
needs: build
runs-on: ubuntu-latest

View File

@@ -13,8 +13,6 @@
- `npm run dev:chrome`
- Firefox
- `npm run dev:firefox`
- Opera
- `npm run dev:opera`
(Reload Extension Manually in the browser)
@@ -36,13 +34,6 @@
<img width="400" src="https://i.imgur.com/aAL5dQg.png" />
- ### Opera
- Load the extension via `opera:extensions`
- Check the `Developer Mode` and load as unpacked from extensions extracted directory.
<img width="400" src="https://i.imgur.com/qUwfSNJ.png" />
- Generate an API Key from <a href="https://kutt.it">`https://kutt.it/`</a> (Settings page)
- Paste and Save the `Key` in extension's `options page`.
@@ -63,12 +54,3 @@ height="50">](https://github.com/thedevs-network/kutt-extension/releases)
- **Enable Developer Options** to use with self-hosted kutt
- Save the self hosted domain in the input (eg: https://mykutt.it)
- **Note**: the api endpoint is automatically appended during the api call.
### For Opera Users
In order to install this extension from Chrome Web Store, another opera extension called **Install Chrome Extension** should be installed first.
- [Opera addon :: Install Chrome Extension](https://addons.opera.com/en/extensions/details/install-chrome-extensions/)
- [Opera addon :: Kutt](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd)
![](https://i.imgur.com/TJTisdC.png)

213
README.md
View File

@@ -1,85 +1,128 @@
<div align="center"><img width="150" src="source/public/assets/logo.png" /></div>
<h1 align="center">kutt-extension</h1>
<p align="center">Browser extension for <a href="https://kutt.it">Kutt.it</a></p>
<div align="center">
<a href="https://github.com/thedevs-network/kutt-extension/actions/workflows/build.yml">
<img src="https://github.com/thedevs-network/kutt-extension/actions/workflows/build.yml/badge.svg?branch=master" alt="Build" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/releases/latest">
<img src="https://img.shields.io/github/release/thedevs-network/kutt-extension.svg?colorB=blue" alt="Releases" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/issues?q=is%3Aopen+is%3Aissue">
<img src="https://img.shields.io/github/issues-raw/thedevs-network/kutt-extension.svg?colorB=lightgrey" alt="Open Issues" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/issues?q=is%3Aissue+is%3Aclosed">
<img src="https://img.shields.io/github/issues-closed-raw/thedevs-network/kutt-extension.svg?colorB=red" alt="Closed Issues" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/blob/master/license">
<img src="https://img.shields.io/github/license/thedevs-network/kutt-extension.svg" alt="LICENSE" />
</a>
</div>
<hr />
❤️ it? ⭐️ it on [GitHub](https://github.com/thedevs-network/kutt-extension/stargazers)
## Features
- Minimal UI
- Instant QR Code
- Cross Browser Support
- Supports Secure Passwords for URLs
- History & Incognito Feature
- Auto Copy Feature
- Free and Open Source
- Uses WebExtensions API
## Browser Support
| [![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)](https://addons.mozilla.org/firefox/addon/kutt/) | [![Opera](https://raw.github.com/alrra/browser-logos/master/src/opera/opera_48x48.png)](CONTRIBUTING.md#for-opera-users) | [![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![Yandex](https://raw.github.com/alrra/browser-logos/master/src/yandex/yandex_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![Brave](https://raw.github.com/alrra/browser-logos/master/src/brave/brave_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![vivaldi](https://raw.github.com/alrra/browser-logos/master/src/vivaldi/vivaldi_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) |
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| 49 & later ✔ | 52 & later ✔ | 36 & later ✔ | 79 & later ✔ | Latest ✔ | Latest ✔ | Latest ✔
## How to use
- Download for browser(s)
- Chrome: [Kutt :: Chrome Web Store](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd)
- Firefox: [Kutt :: Add-ons for Firefox](https://addons.mozilla.org/firefox/addon/kutt/)
- Opera [Kutt :: Opera addons](CONTRIBUTING.md#for-opera-users)
- Edge: [Kutt :: Chrome Web Store](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd)
- Generate an API Key from <a href="https://kutt.it">`https://kutt.it/`</a> after signing up. (Settings page)
<img width="400" src="https://i.imgur.com/qQwqeH5.png" />
- Paste and Save this `Key` in extension's `options page` when asked.
<hr />
## Screenshots
<div>
<img width="250" src="./.github/assets/popup-v4-1.png" alt="popup" />
<div>_</div>
<img width="330" src="./.github/assets/options-v4-1.png" alt="options" />
</div>
<br />
## Note
- <a href="https://kutt.it">Kutt.it</a> API permits **50** URLs shortening per day using the API Key.
- **Enable Custom Host** option to use with self-hosted kutt
- Save the self hosted domain in the input (eg: <https://mykutt.it>)
- **Note**: the api endpoint is automatically appended during the api call.
- _Delay at times while shortening might be the issue with Kutt.it API and not with the extension's._
## Contributing and Support
View the Contributing guidelines [here](CONTRIBUTING.md).
Original Repo: [thedevs-network/kutt](https://github.com/thedevs-network/kutt)
## Licence
Code released under the [MIT License](license).
<div align="center"><img width="150" src="source/public/assets/logo.png" /></div>
<h1 align="center">kutt-extension</h1>
<p align="center">Browser extension for <a href="https://kutt.it">Kutt.it</a> URL shortener</p>
<div align="center">
<a href="https://github.com/thedevs-network/kutt-extension/actions/workflows/build.yml">
<img src="https://github.com/thedevs-network/kutt-extension/actions/workflows/build.yml/badge.svg?branch=master" alt="Build" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/releases/latest">
<img src="https://img.shields.io/github/release/thedevs-network/kutt-extension.svg?colorB=blue" alt="Releases" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/issues?q=is%3Aopen+is%3Aissue">
<img src="https://img.shields.io/github/issues-raw/thedevs-network/kutt-extension.svg?colorB=lightgrey" alt="Open Issues" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/issues?q=is%3Aissue+is%3Aclosed">
<img src="https://img.shields.io/github/issues-closed-raw/thedevs-network/kutt-extension.svg?colorB=red" alt="Closed Issues" />
</a>
<a href="https://github.com/thedevs-network/kutt-extension/blob/master/license">
<img src="https://img.shields.io/github/license/thedevs-network/kutt-extension.svg" alt="LICENSE" />
</a>
</div>
<hr />
❤️ it? ⭐️ it on [GitHub](https://github.com/thedevs-network/kutt-extension/stargazers)
## Features
- Minimal UI
- Instant QR Code
- Cross Browser Support
- Supports Secure Passwords for URLs
- History & Incognito Feature
- Auto Copy Feature
- Free and Open Source
- Uses WebExtensions API
## Tech Stack
- **Bundler**: [Vite](https://vitejs.dev/) 6
- **UI**: [React](https://react.dev/) 19
- **Language**: [TypeScript](https://www.typescriptlang.org/) 5.7
- **Styling**: SCSS with CSS Modules
- **Linting**: ESLint 9 (flat config) + Prettier
## Browser Support
This extension uses **Manifest V3**.
| [![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)](https://addons.mozilla.org/firefox/addon/kutt/) | [![Opera](https://raw.github.com/alrra/browser-logos/master/src/opera/opera_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) | [![Brave](https://raw.github.com/alrra/browser-logos/master/src/brave/brave_48x48.png)](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd) |
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| 88+ | 109+ | 74+ | 88+ | 1.21+ |
## Installation
- **Chrome**: [Kutt :: Chrome Web Store](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd)
- **Firefox**: [Kutt :: Add-ons for Firefox](https://addons.mozilla.org/firefox/addon/kutt/)
- **Edge**: [Kutt :: Chrome Web Store](https://chrome.google.com/webstore/detail/kutt/pklakpjfiegjacoppcodencchehlfnpd)
## How to Use
1. Generate an API Key from <a href="https://kutt.it">`https://kutt.it/`</a> after signing up (Settings page)
<img width="400" src="https://i.imgur.com/qQwqeH5.png" />
2. Paste and Save this `Key` in extension's `options page` when asked
## Screenshots
<div>
<img width="250" src="./.github/assets/popup-v4-1.png" alt="popup" />
<div>_</div>
<img width="330" src="./.github/assets/options-v4-1.png" alt="options" />
</div>
## Development
Ensure you have [Node.js](https://nodejs.org) 20 or later installed.
```bash
# Install dependencies
npm install
# Start development server
npm run dev:chrome # For Chrome
npm run dev:firefox # For Firefox
# Build for production
npm run build:chrome # Build Chrome extension
npm run build:firefox # Build Firefox addon
npm run build # Build for all browsers
# Linting
npm run lint # Run ESLint
npm run lint:fix # Run ESLint with auto-fix
```
### Loading the Extension
#### Chrome
1. Navigate to `chrome://extensions`
2. Enable "Developer mode"
3. Click "Load unpacked"
4. Select `extension/chrome` directory
#### Firefox
1. Navigate to `about:debugging`
2. Click "This Firefox"
3. Click "Load Temporary Add-on"
4. Select `extension/firefox/manifest.json`
## Note
- <a href="https://kutt.it">Kutt.it</a> API permits **50** URLs shortening per day using the API Key
- **Enable Custom Host** option to use with self-hosted kutt
- Save the self hosted domain in the input (eg: `https://mykutt.it`)
- **Note**: the api endpoint is automatically appended during the api call
- _Delay at times while shortening might be the issue with Kutt.it API and not with the extension's_
## Contributing and Support
View the Contributing guidelines [here](CONTRIBUTING.md).
Original Repo: [thedevs-network/kutt](https://github.com/thedevs-network/kutt)
## License
Code released under the [MIT License](license).

View File

@@ -16,11 +16,9 @@
"scripts": {
"dev:chrome": "cross-env TARGET_BROWSER=chrome vite build --config vite.config.ts --mode development --watch",
"dev:firefox": "cross-env TARGET_BROWSER=firefox vite build --config vite.config.ts --mode development --watch",
"dev:opera": "cross-env TARGET_BROWSER=opera vite build --config vite.config.ts --mode development --watch",
"build:chrome": "cross-env TARGET_BROWSER=chrome vite build --config vite.config.ts",
"build:firefox": "cross-env TARGET_BROWSER=firefox vite build --config vite.config.ts",
"build:opera": "cross-env TARGET_BROWSER=opera vite build --config vite.config.ts",
"build": "npm run build:chrome && npm run build:firefox && npm run build:opera",
"build": "npm run build:chrome && npm run build:firefox",
"lint": "eslint .",
"lint:fix": "eslint . --fix"
},

2
source/globals.d.ts vendored
View File

@@ -1,5 +1,5 @@
declare const __DEV__: boolean;
declare const __TARGET_BROWSER__: 'chrome' | 'firefox' | 'opera';
declare const __TARGET_BROWSER__: 'chrome' | 'firefox';
declare module '*.module.scss' {
const classes: {readonly [key: string]: string};

View File

@@ -18,9 +18,6 @@
}
},
"__chrome|firefox__author": "abhijithvijayan",
"__opera__developer": {
"name": "abhijithvijayan"
},
"action": {
"default_popup": "Popup/popup.html",
"default_icon": {
@@ -32,13 +29,12 @@
"default_title": "Shorten this URL"
},
"background": {
"__chrome|opera__service_worker": "assets/js/background.bundle.js",
"__chrome|opera__type": "module",
"__chrome__service_worker": "assets/js/background.bundle.js",
"__chrome__type": "module",
"__firefox__scripts": ["assets/js/background.bundle.js"],
"__firefox__type": "module"
},
"__chrome__minimum_chrome_version": "88",
"__opera__minimum_opera_version": "74",
"permissions": [
"activeTab",
"storage"
@@ -50,7 +46,7 @@
"content_security_policy": {
"extension_pages": "script-src 'self'; object-src 'self';"
},
"__chrome|opera__options_page": "Options/options.html",
"__chrome__options_page": "Options/options.html",
"options_ui": {
"page": "Options/options.html",
"open_in_tab": true

View File

@@ -16,10 +16,6 @@ export default defineConfig(({mode}) => {
const getExtensionZipFileName = () => {
switch (targetBrowser) {
case 'opera': {
return `${targetBrowser}.crx`;
}
case 'firefox': {
return `${targetBrowser}.xpi`;
}