Skip to content

Commit 18d8c97

Browse files
aashutoshrathiaashutoshrathi
authored
Merge pull request #1 from aashutoshrathi/v0.1.0
⚡ feat(v0.1.0): new design and allow updating custom IP
2 parents b4433f2 + 5af6722 commit 18d8c97

File tree

6 files changed

+266
-63
lines changed

6 files changed

+266
-63
lines changed

‎README.md‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
11
# Mongo NAL Upsert
22

3-
This is a simple extension to upsert your IP addresses into a [MongoDB NAL](https://www.mongodb.com/docs/atlas/security/ip-access-list/).
3+
This is a simple extension to add or update your IP addresses into a [MongoDB Access List](https://www.mongodb.com/docs/atlas/security/ip-access-list/).
4+
5+
> **Note**
6+
> This is for very very lazy and my kinda people, who don't want to do anything manually.
47
58
## Motivation 🤔
69

7-
Unstable internet connection is pain and when you have to access some database from local, but your IP changes very often, it becomes a pain to update the NAL to whitelist your IP.
10+
Unstable internet connection is already a pain, when you have to access some remote database from local setup, and your IP changes very often, it becomes a pain in the arse to update the MongoDB's allowed list of IP addresses.
811

9-
This extension will help you to update your IP address in the NAL with one click.
12+
This extension will help you to update your IP address in the access list with just one click.
1013

1114
## Demo 📺
1215

13-
[![Mongo NAL Upsert Demo](https://s3.ap-south-1.amazonaws.com/shared.aashutosh.dev/mongo_nal.gif)](https://s3.ap-south-1.amazonaws.com/shared.aashutosh.dev/mongo_nal.gif)
16+
[![Mongo NAL Upsert Demo](https://s3.ap-south-1.amazonaws.com/shared.aashutosh.dev/mongo_nal.gif)](https://s3.ap-south-1.amazonaws.com/shared.aashutosh.dev/mongo_nal.gif?date=20220122)

‎manifest.json‎

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
2-
"name": "Mongo NAL Updater",
2+
"name": "Mongo IP Updater",
33
"author": "Aashutosh Rathi",
4-
"version": "0.0.1",
4+
"version": "0.1.0",
55
"manifest_version": 3,
6-
"description": "Adds or update Mongo NAL Whitelist entry",
6+
"description": "Adds or updates Mongo Network access allowed list entry",
77
"icons": {
88
"16": "icons/icon16.png",
99
"48": "icons/icon48.png",
@@ -12,20 +12,29 @@
1212
"default_locale": "en",
1313
"action": {
1414
"default_icon": "icons/icon19.png",
15-
"default_title": "Upsert Mongo NAL",
15+
"default_title": "Mongo IP Updater",
1616
"default_popup": "src/options/index.html"
1717
},
1818
"permissions": [
19+
"activeTab",
1920
"storage"
2021
],
22+
"host_permissions": [
23+
"https://*.mongodb.com/*"
24+
],
2125
"content_scripts": [
2226
{
2327
"matches": [
24-
"https://cloud.mongodb.com/*"
28+
"https://*.mongodb.com/*"
2529
],
2630
"js": [
2731
"src/content.js"
2832
]
2933
}
30-
]
31-
}
34+
],
35+
"externally_connectable": {
36+
"matches": [
37+
"*://www.cloudflare.com/*"
38+
]
39+
}
40+
}

‎src/content.js‎

Lines changed: 32 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,35 @@
1-
const sleep = (milliseconds) => {
2-
return new Promise((resolve) => setTimeout(resolve, milliseconds));
1+
const sleep = (ms) => {
2+
return new Promise((resolve) => setTimeout(resolve, ms));
33
};
44

5-
const clickOnAddCurrentIP = async () => {
6-
const addCurrentButton = document.querySelector(
7-
"button[name='addCurrentIpAddress']"
8-
);
9-
if (addCurrentButton) {
10-
addCurrentButton.click();
11-
await sleep(1000);
5+
const fillIP = async (ip) => {
6+
if (!ip) {
7+
const addCurrentButton = document.querySelector(
8+
"button[name='addCurrentIpAddress']"
9+
);
10+
11+
if (addCurrentButton) {
12+
addCurrentButton.click();
13+
await sleep(1000);
14+
}
15+
return;
16+
}
17+
const ipField = document.querySelector('[name="networkPermissionEntry"]');
18+
19+
if (ipField) {
20+
ipField.value = ip;
1221
}
1322
};
1423

15-
const clickOnSaveButton = async () => {
24+
const clickSaveButton = async () => {
1625
const submitButton = document.querySelector(
1726
"button.button-is-primary[name='confirm']"
1827
);
1928
if (!submitButton) return;
2029
submitButton.click();
2130
};
2231

23-
const addNewEntry = async (name) => {
32+
const addNewEntry = async (name, ip) => {
2433
const allSectionControls = document.querySelector(
2534
".section-controls-is-end-justified"
2635
).children;
@@ -31,22 +40,23 @@ const addNewEntry = async (name) => {
3140
}
3241
}
3342
await sleep(1000);
34-
await clickOnAddCurrentIP();
43+
await fillIP(ip);
3544

3645
// Add Comment as entry name
3746
document.querySelector('[name="comment"]').value = name;
3847

3948
// save
40-
await clickOnSaveButton();
49+
await clickSaveButton();
4150
};
4251

43-
const updateIpAddress = async () => {
52+
const updateIpAddress = async (ip) => {
4453
await sleep(2000);
45-
await clickOnAddCurrentIP();
46-
await clickOnSaveButton();
54+
await fillIP(ip);
55+
await clickSaveButton();
4756
};
4857

49-
const runIt = async (name) => {
58+
const runIt = async (values) => {
59+
const { name, ip, isCurrentIp } = values;
5060
// Go to NAL Page
5161
if (window.location.hash !== "#/security/network/accessList") {
5262
window.location.hash = "#/security/network/accessList";
@@ -65,20 +75,21 @@ const runIt = async (name) => {
6575
}
6676
}
6777

68-
console.log("NAL Entry found?", found);
78+
console.info("IP entry found =>", found);
6979
if (!found) {
70-
await addNewEntry(name);
80+
await addNewEntry(name, isCurrentIp ? undefined : ip);
7181
} else {
72-
await updateIpAddress();
82+
await updateIpAddress(isCurrentIp ? undefined : ip);
7383
}
7484
};
7585

7686
window.onload = () => {
7787
chrome.runtime.onMessage.addListener(
7888
async (request, sender, sendResponse) => {
7989
if (request.action === "upsert") {
80-
await runIt(request.value);
90+
await runIt(request.values);
8191
}
92+
return;
8293
}
8394
);
8495
};

‎src/options/index.css‎

Lines changed: 120 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,124 @@
1-
#main {
2-
padding: 10px;
3-
height: 100px;
4-
width: 150px;
5-
font-family: Helvetica, Ubuntu, Arial, sans-serif;
1+
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap");
2+
3+
html {
4+
background-color: #1e1e1e;
5+
color: white;
6+
font-family: Manrope, Arial, Helvetica, sans-serif;
7+
}
8+
9+
body {
10+
width: 356px;
11+
height: 372px;
12+
padding-left: 16px;
13+
padding-right: 16px;
14+
padding-top: 8px;
15+
padding-bottom: 8px;
16+
margin: 0;
17+
}
18+
19+
label {
20+
color: #B2B1B1;
21+
font-size: 14px;
622
}
723

8-
#main > * {
24+
input {
25+
background-color: #e6e6e6;
26+
height: 40px;
927
display: block;
10-
margin: 5px 0;
28+
padding-left: 12px;
29+
padding-right: 12px;
30+
border-radius: 12px;
31+
border: none;
32+
font-size: 18px;
33+
margin-bottom: 16px;
34+
margin-top: 8px;
35+
}
36+
37+
.hflex {
38+
display: flex;
39+
flex-direction: row;
40+
}
41+
42+
43+
.f-1 {
44+
flex: 1;
45+
}
46+
47+
.align-center {
48+
align-items: center;
49+
}
50+
51+
.vflex {
52+
display: flex;
53+
flex-direction: column;
54+
}
55+
56+
.text-center {
57+
text-align: center;
58+
}
59+
60+
.header {
61+
margin-bottom: 12px;
62+
}
63+
64+
.icon-container {
65+
width: 46px;
66+
height: 46px;
67+
background-color: rgba(217, 217, 217, 1);
68+
border-radius: 9999px;
69+
margin-right: 8px;
70+
padding: 8px;
71+
text-align: center;
72+
}
73+
74+
.icon {
75+
width: 40px;
76+
height: 40px;
77+
}
78+
79+
.heading {
80+
font-size: 24px;
81+
font-weight: 600;
82+
margin-bottom: 0;
83+
}
84+
85+
.lazy {
86+
font-size: 12px;
87+
align-self: flex-end;
88+
margin-bottom: 20px;
89+
}
90+
91+
.full-w {
92+
width: 100%;
93+
}
94+
95+
.btn {
96+
background-color: #4856BA;
97+
height: 42px;
98+
font-size: 18px;
99+
border-radius: 12px;
100+
font-weight: 500;
101+
text-align: center;
102+
cursor: pointer;
103+
display: flex;
104+
justify-content: center;
105+
align-items: center;
106+
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
107+
}
108+
109+
.btn:hover {
110+
background-color: #5464db;
111+
}
112+
113+
.submit {
114+
margin-top: 10px;
115+
letter-spacing: 1.2px;
116+
font-size: 16px;
117+
}
118+
119+
.tip {
120+
color: #E5E8CB;
121+
margin-top: 20px;
122+
margin-bottom: 16px;
123+
font-size: 12px;
11124
}

‎src/options/index.html‎

Lines changed: 35 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,39 @@
11
<!DOCTYPE html>
2-
<link rel="stylesheet" href="./index.css" />
2+
<html>
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="stylesheet" href="./index.css" />
6+
</head>
37

4-
<div id="main">
5-
<label for="name">Your Entry Name</label>
6-
<input name="name" type="text" />
7-
<button id="save">Save</button>
8+
<body class="vflex">
9+
<div class="header hflex align-center">
10+
<div class="icon-container">
11+
<img class="icon" src="../../icons/icon.png" />
12+
</div>
13+
<div class="vflex f-1 text-center">
14+
<p class="heading">MONGO IP UPDATER</p>
15+
<i class="lazy">&nbsp;&nbsp;&nbsp;for the supa hackas</i>
16+
</div>
17+
</div>
18+
<div>
19+
<div class="vflex">
20+
<label for="ip">Your IP address</label>
21+
<input name="ip" id="ip" type="text" />
22+
</div>
823

9-
<button id="upsert">Upsert NAL</button>
10-
</div>
24+
<div class="vflex">
25+
<label for="name">Name for entry</label>
26+
<input name="name" type="text" />
27+
</div>
1128

12-
<script src="./index.js"></script>
29+
<div class="btn submit" id="upsert">
30+
<p>Add to access list</p>
31+
</div>
32+
</div>
33+
<div class="tip">
34+
💡 Tip: This can be done from any page on <b>MongoDB Cloud</b>
35+
</div>
36+
<div id="error"></div>
37+
</body>
38+
</html>
39+
<script src="./index.js"></script>

0 commit comments

Comments
 (0)