feat: big rewrite (#6)

- use tailwind for styles
- use swr for data fetching
- update dependencies
- add github actions

.eslintrc.json

@@ -1,32 +1,32 @@
 {
-  "env": {
-    "browser": true
-  },
   "extends": [
     "eslint:recommended",
-    "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:@typescript-eslint/recommended-requiring-type-checking",
-    "prettier",
-    "prettier/@typescript-eslint"
+    "plugin:@typescript-eslint/strict",
+    "plugin:@typescript-eslint/stylistic",
+    "plugin:@typescript-eslint/strict-type-checked",
+    "plugin:@typescript-eslint/stylistic-type-checked",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended"
   ],
   "parserOptions": {
     "project": "./tsconfig.json"
   },
   "rules": {
-    "@typescript-eslint/camelcase": "off",
-    "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/no-empty-function": "off",
-    "@typescript-eslint/no-unused-vars": "off",
-    "@typescript-eslint/no-use-before-define": "off",
-    "@typescript-eslint/require-await": "off",
-    "@typescript-eslint/unbound-method": "off",
-    "eqeqeq": ["error", "smart"],
+    "@typescript-eslint/method-signature-style": "warn",
+    "@typescript-eslint/strict-boolean-expressions": "warn",
+    "eqeqeq": ["warn", "smart"],
+    "no-console": "warn",
     "no-else-return": "warn",
     "no-implicit-coercion": "warn",
     "object-shorthand": "warn",
-    "prefer-arrow-callback": "warn",
-    "prefer-template": "warn",
-    "yoda": "warn"
+    "react/destructuring-assignment": "warn",
+    "react/jsx-no-useless-fragment": "warn",
+    "react/self-closing-comp": "warn"
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
   }
 }

.github/dependabot.yml

@@ -0,0 +1,13 @@
+version: 2
+updates:
+  - package-ecosystem: npm
+    directory: /
+    schedule:
+      interval: monthly
+    groups:
+      dev:
+        dependency-type: development
+  - package-ecosystem: github-actions
+    directory: /
+    schedule:
+      interval: monthly

.github/workflows/npm-test.yml

@@ -0,0 +1,21 @@
+name: Run tests
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: latest
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm test

.github/workflows/release-please.yml

@@ -0,0 +1,18 @@
+name: Release Please
+
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: write
+  pull-requests: write
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: google-github-actions/release-please-action@v4
+        with:
+          release-type: node

.gitignore

@@ -1,5 +1,7 @@
-/node_modules
-/dist
-/.cache
-/.parcel-cache
-/web-ext-artifacts
+/node_modules/
+/dist/
+/build/
+/.cache/
+/.parcel-cache/
+/parcel-bundle-reports/
+/web-ext-artifacts/

.postcssrc.json

@@ -0,0 +1,5 @@
+{
+  "plugins": {
+    "tailwindcss": {}
+  }
+}

.vscode/settings.json

@@ -1,5 +1,6 @@
 {
   "editor.defaultFormatter": "esbenp.prettier-vscode",
-  "typescript.tsdk": "node_modules/typescript/lib",
-  "eslint.options": { "ignorePath": ".gitignore" }
+  "eslint.options": {
+    "ignorePath": ".gitignore"
+  }
 }

README.md

@@ -4,33 +4,28 @@
 [![Codecov](https://img.shields.io/codecov/c/gh/phaux/telegram-send)](https://codecov.io/gh/phaux/telegram-send)
 [![Mozilla Add-on](https://img.shields.io/amo/users/telegram-send?color=orange&logo=mozilla-firefox)](https://addons.mozilla.org/en-US/firefox/addon/telegram-send/)
 
-[![Firefox Download](./firefox-badge.png)](https://addons.mozilla.org/en-US/firefox/addon/telegram-send/)
+[![Firefox Download](./src/images/firefox-badge.png)](https://addons.mozilla.org/en-US/firefox/addon/telegram-send/)
 
-## 💡 Developing
+## Building
 
-System requirements:
+Requirements:
 
-- **node.js** v10
+- **node.js** v16
 
-Get the source code:
+First, run `npm install` to install the dependencies and build the extension.
+The built extension will be output to `dist/`.
 
-```sh
-git clone [email protected]:phaux/telegram-send.git
-cd telegram-send
-```
+Then you can use `npm run prepare` to rebuild the extension again once,
+or `npm run watch` to automatically rebuild on change.
 
-Then run `npm install` to install the dependencies.
+## Running
 
-To run the development server, run `npm start`. This will start the bundler and the web-ext tool in watch mode.
+To load the built extension in the browser:
 
-## 🔧 Building
+- **Firefox**: Go to [`about:debugging`](about:debugging#/runtime/this-firefox), click "Load temporary Add-on" and select `dist/manifest.json` file.
+- **Chrome**: Go to [`chrome://extensions`](chrome://extensions/), click "Load unpacked" and select the `dist/` folder
 
-Run `npm run build` to create bundle and package the extension.
+## Contributing
 
-## 🔎 Testing
-
-Run `npm test` to check the code with formatter, linter and type checker.
-
-## 💅 Formatting
-
-Run `npm run format` To format and fix all source files.
+Before commit, run `npm test` to check the code for errors.
+You can use `npm run format` to automatically fix format and linter errors.