Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kiprasmel/refined-gitlab
🏷 Make your GitLab experience better! read-only mirror from https://gitlab.com/kiprasmel/refined-gitlab
https://github.com/kiprasmel/refined-gitlab
extension git gitlab mirror refined refined-gitlab
Last synced: about 1 month ago
JSON representation
🏷 Make your GitLab experience better! read-only mirror from https://gitlab.com/kiprasmel/refined-gitlab
- Host: GitHub
- URL: https://github.com/kiprasmel/refined-gitlab
- Owner: kiprasmel
- License: mit
- Created: 2020-08-09T23:10:31.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-02-23T21:29:49.000Z (10 months ago)
- Last Synced: 2024-05-01T15:38:42.713Z (8 months ago)
- Topics: extension, git, gitlab, mirror, refined, refined-gitlab
- Language: TypeScript
- Homepage: https://gitlab.com/kiprasmel/refined-gitlab
- Size: 621 KB
- Stars: 4
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# refined-gitlab
Much like [refined-github](https://github.com/sindresorhus/refined-github), but for gitlab!
## Install
- [**Chrome** extension 
](https://chrome.google.com/webstore/detail/refined-gitlab/jaafoplpaafgeeclnaakkimfgajikgba/)
- [**Firefox** add-on 
](https://addons.mozilla.org/en-US/firefox/addon/refined-gitlab/)
### Verify integrity
works for versions >= 0.9.1
```sh
PATH_TO_XPI="$HOME/Library/Application Support/Firefox/Profiles//extensions/[email protected]"
VERSION="0.9.0"
./verify.sh "$PATH_TO_XPI" "$VERSION"
```
## Try it from a local build
Note - downloading a `.zip` won't work - do exactly as described below (you'll need `git` and `yarn`).
Inside your terminal:
```sh
git clone https://github.com/kiprasmel/refined-gitlab.git
# or: git clone [email protected]:kiprasmel/refined-gitlab.git
cd refined-gitlab/
yarn install
```
> wait a bit. This will install the dependencies & clone git submodules
Some features need the API. Either
a) be logged-in to gitlab, or
b) provider a custom API token - inside [./source/utils/config.ts](./source/utils/config.ts) add your gitlab's `host URL` & `API token` (found at `/profile/personal_access_tokens`) with scopes `api` & `read_api`);
then:
```sh
yarn build # you need to do this every time you update something inside this repository
```
And then load up the built extension:
### chrome:
navigate to
```
chrome://extensions
```
1. enable "Developer mode" (toggle @ top right)
1. click "Load unpacked" (top left)
1. navigate to the path where you cloned the repository at first step
1. navigate to the `distribution/` folder & click "Select"
done! Note that after shutting down the browser, you'll need to load the extension from the `distribution/` folder again (begin @ [#chrome](#ii.1-chrome))
### firefox:
navigate to
```
about:debugging#/runtime/this-firefox
```
1. click "Load Temporary Add-on..."
1. navigate to the path where you cloned the repository at first step
1. navigate to the `distribution/` folder
1. select any file & double-click it
done! Note that after shutting down the browser, you'll need to load the extension from the `distribution/` folder again (begin @ [#firefox](#ii.2-firefox))
## Contributing
Here is a short overview to get your familiar with how the project works.
In essence, this extension isn't that different from a regular react application 🤷♀️ (except it isn't as complex ☠️☠️)
We use `react` to render components and handle state logic (hooks included!).
The `source/` directory contains a few core folders - react's `components/`, the extension's `features/`, their `styles/`, `utils/` and other necessary files.
There are also the `background-scripts/` and `content-scripts/` directories - they hold & import their respective scripts, which are later loaded by the browser, as defined in the `manifest.json` file (which is essential to web extensions - that's where you configure stuff (though you'll rarely touch it, if so)).
The extension is compiled via webpack into an IIFE, ready for browsers to execute. It's source is imported in [source/scripts-content/refined-gitlab.ts](source/scripts-content/refined-gitlab.ts) and loaded inside [source/utils/globalInit.ts](source/utils/globalInit.ts), where all features get loaded by [source/Features.ts](source/Features.ts). The features end up there by adding themselves into the `Features` array, where, once loaded, get their necessary data and render the resulting JSX.
We'll provide some examples soon™️. For now - feel free to explore the source, especially `features/`, `components/` and `utils/`
## Permission explanations
Permissions can be seen in [./source/manifest.json](./source/manifest.json)
- `cookies`: required for 0-config authentication (the other option is an API token, but that's for power users who want to customize it that way).
- `tabs`: required to retrieve the current tab and send over the cookie from the background to content script (see [./source/scripts-background/gitlab-session-cookie-sync.ts](./source/scripts-background/gitlab-session-cookie-sync.ts))
- ``: required since you have your own self-hosted gitlab instance and the `gitlab.com` url won't work
## Auto authentication
It works like magic -- both for local development (auto sign-in by borrowing your session from another browser), and for production (0-config API auth - just be signed in to GitLab, and all features that require the API will work automatically).
## Meta
- [refined-gitlab](https://gitlab.com/kiprasmel/refined-gitlab) project ID on gitlab: `20434942`
- [refined-gitlab-playground](https://gitlab.com/kiprasmel/refined-gitlab-playground) project ID on gitlab: `20690630`
## See also
- [Gitbeaker](https://github.com/jdalrymple/gitbeaker/) - GitLab's API wrapper we use here & often contribute to.
- [Figma assets](https://www.figma.com/file/PyOJIJOClNV2dZs4QWU7Pa/Refined-GitLab) - icons, feature screenshots etc.
## License
MIT © [Kipras Melnikovas](https://gitlab.com/kiprasmel)