) => {
34 | if (e.keyCode === 13) {
35 | setIsInputVisible(false);
36 | }
37 | };
38 | const handleTabButtonDoubleClick = (id: string) => {
39 | if (!isInputVisible) {
40 | setIsInputVisible(true);
41 | setTimeout(() => {
42 | document.getElementById(id.toString())?.focus();
43 | }, 200);
44 | }
45 | };
46 |
47 | return (
48 | <>
49 |
50 | {data.length !== 0 &&
51 | data.map((item) => (
52 |
57 | !Tab.eq.equals(selectedTab, item) ? handleTabButtonClickTemp(item) : ""
58 | }
59 | onDoubleClick={() => handleTabButtonDoubleClick(item["unique-id"])}
60 | className={`tab_button ${
61 | Tab.eq.equals(selectedTab, item) && "__selected_tab_button"
62 | }`}
63 | >
64 | {isInputVisible && Tab.eq.equals(selectedTab, item) ? (
65 | {item.name}
72 | )}
73 | handleDeleteTab(item)} />
74 |
75 | ))}
76 |
77 |
79 |
80 | Refresh
82 |
83 |
8 |
11 | )
12 |
13 | export default ToggleBtn;
--------------------------------------------------------------------------------
/src/components/toggleBtn/styles.scss:
--------------------------------------------------------------------------------
1 | .switch {
2 | position: relative;
3 | display: inline-block;
4 | width: 45px;
5 | height: 24px;
6 | input {
7 | opacity: 0;
8 | width: 0;
9 | height: 0!important;
10 | &:checked + .slider {
11 | background-color: rgba(58, 57, 57, 1);
12 | }
13 | &:focus + .slider {
14 | box-shadow: 0 0 1px #2196f3;
15 | }
16 | &:checked + .slider:before {
17 | background-color: #36AE7C;
18 | -webkit-transform: translateX(17px);
19 | -ms-transform: translateX(17px);
20 | transform: translateX(17px);
21 | }
22 | }
23 | .slider {
24 | position: absolute;
25 | cursor: pointer;
26 | top: 0;
27 | left: 0;
28 | right: 0;
29 | bottom: 0;
30 | background-color: rgba(58, 57, 57, 0.7);
31 | -webkit-transition: 0.4s;
32 | transition: 0.4s;
33 | }
34 |
35 | .slider:before {
36 | position: absolute;
37 | content: "";
38 | height: 18px;
39 | width: 18px;
40 | left: 5px;
41 | bottom: 3px;
42 | background-color: rgb(83, 81, 81);
43 | -webkit-transition: 0.4s;
44 | transition: 0.4s;
45 | }
46 |
47 | .slider.round {
48 | border-radius: 34px;
49 | }
50 |
51 | .slider.round:before {
52 | border-radius: 50%;
53 | }
54 | }
55 |
--------------------------------------------------------------------------------
/src/globalStyles.js:
--------------------------------------------------------------------------------
1 | import { createGlobalStyle } from "styled-components";
2 |
3 | export const GlobalStyles = createGlobalStyle`
4 | body {
5 | background: ${({ theme }) => theme.background};
6 | }
7 | .secondary_bg {
8 | background: ${({ theme }) => theme.secondaryBackground}!important;
9 | }
10 | .light_bg {
11 | background: ${({ theme }) => theme.lightBackground}!important;
12 | }
13 | `;
14 |
15 | export default {};
16 |
--------------------------------------------------------------------------------
/src/helpers/fallback-loaders.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | import { RedoOutlined } from '@ant-design/icons';
4 | import ContentLoader from "react-content-loader";
5 | import "./styles.scss";
6 |
7 | const OverviewStatsErrorFallback = ({ retry }) => (
8 |
15 |
16 |
18 | Request failed!
19 |
20 | );
21 | const StarsOvertimeErrorFallback = ({ retry }) => (
22 |
29 |
30 |
32 | Request failed!
33 |
34 | );
35 | const DailyStarsErrorFallback = ({ retry }) => (
36 |
43 |
44 |
46 | Request failed!
47 |
48 | );
49 | const FiltersErrorFallback = ({ retry }) => (
50 |
57 |
58 |
60 | Request failed!
61 |
62 | );
63 | const StargazersListErrorFallback = ({ retry }) => (
64 |
71 |
72 |
74 | Request failed!
75 |
76 | );
77 | const ContributorsListErrorFallback = ({ retry }) => (
78 |
85 |
86 |
88 | Request failed!
89 |
90 | );
91 | const RepositoriesListErrorFallback = ({ retry }) => (
92 |
99 |
100 |
102 | Request failed!
103 |
104 | );
105 | const EfficiencyStatsErrorFallback = ({ retry }) => (
106 |
113 |
114 |
116 | Request failed!
117 |
118 | );
119 | const RepoSidebarListErrorFallback = ({ retry }) => (
120 |
127 |
128 |
130 | Request failed!
131 |
132 | );
133 | const IssuesListErrorFallback = ({ retry }) => (
134 |
141 |
142 |
144 | Request failed!
145 |
146 | );
147 | const RepoStatsErrorFallback = ({ retry }) => (
148 |
155 |
156 |
158 | Request failed!
159 |
160 | );
161 |
162 | const OverviewStatsFallback = () => (
163 |
171 |
173 | );
174 | const StarsOvertimeFallback = () => (
175 |
183 |
185 | );
186 | const DailyStarsFallback = () => (
187 |
195 |
197 | );
198 | const FiltersFallback = () => (
199 |
207 |
209 | );
210 | const StargazersListFallback = () => (
211 |
219 |
229 | );
230 | const ContributorsListFallback = () => (
231 |
239 |
249 | );
250 | const RepositoriesListFallback = () => (
251 |
259 |
269 | );
270 | const EfficiencyStatsFallback = () => (
271 |
279 |
288 | );
289 | const RepoSidebarListFallback = () => (
290 |
298 |
308 | );
309 | const IssuesListFallback = () => (
310 |
318 |
328 | );
329 | const RepoStatsFallback = () => (
330 |
338 |
342 | );
343 |
344 | export {
345 | OverviewStatsErrorFallback,
346 | StarsOvertimeErrorFallback,
347 | DailyStarsErrorFallback,
348 | FiltersErrorFallback,
349 | StargazersListErrorFallback,
350 | ContributorsListErrorFallback,
351 | RepositoriesListErrorFallback,
352 | EfficiencyStatsErrorFallback,
353 | RepoSidebarListErrorFallback,
354 | IssuesListErrorFallback,
355 | RepoStatsErrorFallback,
356 | OverviewStatsFallback,
357 | StarsOvertimeFallback,
358 | DailyStarsFallback,
359 | FiltersFallback,
360 | StargazersListFallback,
361 | ContributorsListFallback,
362 | RepositoriesListFallback,
363 | EfficiencyStatsFallback,
364 | RepoSidebarListFallback,
365 | IssuesListFallback,
366 | RepoStatsFallback,
367 | };
368 |
--------------------------------------------------------------------------------
/src/helpers/styles.scss:
--------------------------------------------------------------------------------
1 | .retry_error_fallback {
2 | background: rgba(216, 216, 216, 0.03);
3 | display: flex;
4 | justify-content: center;
5 | border-radius: 0.2rem;
6 | align-items: center;
7 | flex-direction: column;
8 | .error_box {
9 | background: #ffffff;
10 | height: 5rem;
11 | width: 5rem;
12 | border-radius: 50%;
13 | display: flex;
14 | align-items: center;
15 | justify-content: center;
16 | padding: 1rem;
17 | cursor: pointer;
18 | box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.2);
19 | margin-bottom: 1.5rem;
20 | transition: 0.1s all ease-out;
21 | &:active {
22 | box-shadow: 0 0 0.5rem 0.15rem rgba(0, 0, 0, 0.2);
23 | }
24 | i {
25 | font-size: 2rem;
26 | font-weight: 600;
27 | color: #1f2239;
28 | cursor: pointer;
29 | transform: rotateX(180deg);
30 | display: flex;
31 | align-items: center;
32 | align-items: center;
33 | }
34 | }
35 | .error_msg {
36 | width: 100%;
37 | font-size: 1.8rem;
38 | text-align: center;
39 | color: #000000;
40 | line-height: 2.4rem;
41 | }
42 | }
43 |
--------------------------------------------------------------------------------
/src/index.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | import {inject} from "@vercel/analytics";
4 | import ReactDOM from "react-dom";
5 | import ReactGA from "react-ga";
6 | import { HashRouter as Router, Route, Switch, withRouter } from "react-router-dom";
7 | import "./styles.scss";
8 | import { CSSTransition, TransitionGroup } from "react-transition-group";
9 |
10 | import HomePage from "./pages/homePage";
11 | import TermsPage from "./pages/termsPage";
12 | import reportWebVitals from './reportWebVitals';
13 | import { sendToVercelAnalytics } from './vitals';
14 |
15 | const trackingId = "UA-165996103-1";
16 | ReactGA.initialize(trackingId);
17 | ReactGA.pageview(window.location.pathname + window.location.search);
18 | ReactGA.set({
19 | config: trackingId,
20 | js: new Date(),
21 | });
22 | inject()
23 |
24 | const AnimatedSwitch = withRouter(({ location }) => {
25 | window.scrollTo(0, 0);
26 | document.getElementsByTagName("html")[0].style.overflow = "visible";
27 | return (
28 |
29 |
30 |
31 |
34 |
35 |
36 | );
37 | });
38 | ReactDOM.render(
39 |
40 | ,
42 | document.getElementById("root")
43 | );
44 |
45 | reportWebVitals(sendToVercelAnalytics);
46 |
47 | if (module.hot) {
48 | module.hot.accept();
49 | }
50 |
--------------------------------------------------------------------------------
/src/lib/index.test.ts:
--------------------------------------------------------------------------------
1 | import isURL from 'validator/lib/isURL';
2 |
3 | import { generateUrl } from '.'
4 |
5 | describe("utils", () => {
6 | test("generateUrl", () => {
7 | const ret = generateUrl("id", 1, "google.com").url;
8 | expect(isURL(ret)).toBeTruthy()
9 | })
10 | })
11 |
--------------------------------------------------------------------------------
/src/lib/index.ts:
--------------------------------------------------------------------------------
1 | /* eslint-disable prefer-destructuring */
2 | import crypto from "crypto";
3 |
4 | import format from "date-fns/format";
5 | import * as E from "fp-ts/Either";
6 | import { pipe } from "fp-ts/function";
7 | import * as J from "fp-ts/Json";
8 | import * as O from "fp-ts/Option";
9 | import * as R from "fp-ts/Record";
10 | import downloadData from "js-file-download";
11 | import NodeRSA from "node-rsa";
12 | import { v4 as uuidv4 } from "uuid";
13 |
14 | import { generateRandomString } from "lib/utils";
15 |
16 | import { getStoredData, writeStoredData } from "./localStorage";
17 | import Data from "./types/data";
18 | import { defaultFilter } from "./types/filter";
19 | import { StoredData } from "./types/storedData";
20 | import Tab from "./types/tab";
21 |
22 | export const copyDataToClipboard = (data: string) => navigator.clipboard.writeText(data);
23 |
24 | export const generateUrl = (correlationId: string, correlationIdNonceLength: number, incrementNumber: number, host: string) => {
25 | const timestamp = Math.floor(Date.now() / 1000);
26 | const increment = incrementNumber;
27 | const arr = new ArrayBuffer(8);
28 | const view = new DataView(arr);
29 | view.setUint32(0, timestamp, false);
30 | view.setUint32(4, increment, false);
31 | const randomId = generateRandomString(correlationIdNonceLength);
32 | const url = `${correlationId}${randomId}.${host}`;
33 | const uniqueId = `${correlationId}${randomId}`;
34 | return { url, uniqueId };
35 | };
36 |
37 | export const clearIntervals = () => {
38 | const currentTimeoutId = setTimeout(() => {
39 | let id = Number(currentTimeoutId);
40 | for (id; id > 0; id -= 1) {
41 | window.clearInterval(id);
42 | }
43 | }, 11);
44 | };
45 |
46 | interface PolledData {
47 | error?: any;
48 | aes_key: string;
49 | data: string[];
50 | }
51 |
52 | export const decryptAESKey = (privateKey: string, aesKey: string) => {
53 | const key = new NodeRSA({ b: 2048 });
54 | key.setOptions({
55 | environment: "browser",
56 | encryptionScheme: {
57 | hash: "sha256",
58 | scheme: "pkcs1_oaep", // TODO: Ensure that this is correct.
59 | },
60 | });
61 | key.importKey(privateKey, "pkcs8-private");
62 | return key.decrypt(aesKey, "base64");
63 | };
64 |
65 | export const processData = (aesKey: string, polledData: PolledData) => {
66 | const { data } = polledData;
67 | let parsedData: Data[] = [];
68 | if (data && data.length > 0) {
69 | const decryptedData: string[] = data.map((item) => {
70 | const iv = Buffer.from(item, "base64").slice(0, 16);
71 | const key = Buffer.from(aesKey, "base64");
72 | const decipher = crypto.createDecipheriv("aes-256-cfb", key, iv);
73 | let mystr: any = decipher.update(Buffer.from(item, "base64").slice(16));
74 | mystr += decipher.final("utf8");
75 | const test: string = mystr;
76 | return test;
77 | });
78 | parsedData = decryptedData.map((item) => ({
79 | ...JSON.parse(item),
80 | id: uuidv4(),
81 | }));
82 | }
83 |
84 | return parsedData;
85 | };
86 |
87 | const getData = (key: string) =>
88 | pipe(
89 | O.tryCatch(() => localStorage.getItem(key)),
90 | O.chain(O.fromNullable)
91 | );
92 |
93 | export const handleResponseExport = (item : any) => {
94 | const fileName = `${format(Date.now(), "yyyy-MM-dd_hh:mm")}_${item.protocol}_${item['remote-address']}_${item['full-id']}_${item.id}.txt`;
95 | downloadData(item['raw-request'], fileName);
96 | }
97 |
98 | export const handleDataExport = () => {
99 | const values = pipe(
100 | R.mapWithIndex((key) => ({ key, data: getData(key) }))(localStorage),
101 | R.filterMap((x) => x.data),
102 | J.stringify,
103 | E.getOrElse(() => "An error occured") // TODO: Handle error case.
104 | );
105 |
106 | const fileName = `${format(Date.now(), "yyyy-mm-dd_hh:mm")}.json`;
107 | downloadData(values, fileName);
108 | };
109 |
110 | export const generateRegistrationParams = (correlationIdLength: number) => {
111 | const key = new NodeRSA({ b: 2048 });
112 | const pub = key.exportKey("pkcs8-public-pem");
113 | const priv = key.exportKey("pkcs8-private-pem");
114 | const correlation = generateRandomString(correlationIdLength, true);
115 | const secret = uuidv4().toString();
116 |
117 | return { pub, priv, correlation, secret };
118 | };
119 |
120 | export const deregister = (
121 | secretKey: string,
122 | correlationId: string,
123 | host: string,
124 | token?: string
125 | ) => {
126 | const registerFetcherOptions = {
127 | "secret-key": secretKey,
128 | "correlation-id": correlationId,
129 | };
130 |
131 | const headers = [
132 | { "Content-Type": "application/json" },
133 | {
134 | "Content-Type": "application/json",
135 | Authorization: token,
136 | },
137 | ] as const;
138 |
139 | return fetch(`https://${host}/deregister`, {
140 | method: "POST",
141 | cache: "no-cache",
142 | headers: token && token !== "" ? headers[1] : headers[0],
143 | referrerPolicy: "no-referrer",
144 | body: JSON.stringify(registerFetcherOptions),
145 | }).catch(() => {});
146 | };
147 |
148 | export const register = (
149 | host: string,
150 | token: string,
151 | deregisterCurrentInstance: boolean,
152 | reregister: boolean
153 | ) => {
154 | const currentData = getStoredData();
155 | const { pub, priv, correlation, secret } = generateRegistrationParams(currentData.correlationIdLength);
156 | const registerFetcherOptions = reregister
157 | ? {
158 | "public-key": btoa(currentData.publicKey),
159 | "secret-key": currentData.secretKey,
160 | "correlation-id": currentData.correlationId,
161 | }
162 | : {
163 | "public-key": btoa(pub),
164 | "secret-key": secret,
165 | "correlation-id": correlation,
166 | };
167 | const contentType = { "Content-Type": "application/json" };
168 | const authorizationHeader = { Authorization: token };
169 |
170 | return fetch(`https://${host}/register`, {
171 | method: "POST",
172 | cache: "no-cache",
173 | headers: token && token !== "" ? { ...contentType, ...authorizationHeader } : contentType,
174 | referrerPolicy: "no-referrer",
175 | body: JSON.stringify(registerFetcherOptions),
176 | }).then(async (res) => {
177 | if (res.status === 401) {
178 | throw new Error("auth failed");
179 | }
180 | if (!res.ok) {
181 | const d = await res.json();
182 | throw new Error(d.error);
183 | }
184 |
185 | const { url, uniqueId } = generateUrl(correlation, currentData.correlationIdNonceLength, 1, host);
186 | const tabData: Tab[] = [
187 | {
188 | "unique-id": uniqueId,
189 | correlationId: correlation,
190 | name: (1).toString(),
191 | url,
192 | note: "",
193 | },
194 | ];
195 |
196 | const data: StoredData = reregister
197 | ? { ...currentData, aesKey: "", token }
198 | : {
199 | privateKey: priv,
200 | publicKey: pub,
201 | correlationId: correlation,
202 | secretKey: secret,
203 | view: currentData.view,
204 | theme: currentData.theme,
205 | host,
206 | correlationIdLength: currentData.correlationIdLength,
207 | correlationIdNonceLength: currentData.correlationIdNonceLength,
208 | responseExport: false,
209 | increment: 1,
210 | token,
211 | telegram: {
212 | enabled: false,
213 | botToken: '',
214 | chatId: '',
215 | },
216 | slack: {
217 | enabled: false,
218 | hookKey: '',
219 | channel: '',
220 | },
221 | discord: {
222 | enabled: false,
223 | webhook: '',
224 | channel: '',
225 | },
226 | tabs: tabData,
227 | selectedTab: tabData[0],
228 | data: [],
229 | aesKey: "",
230 | notes: [],
231 | filter: defaultFilter,
232 | };
233 |
234 | if (!reregister) {
235 | clearIntervals();
236 | }
237 | if (deregisterCurrentInstance && res.ok) {
238 | deregister(
239 | currentData.secretKey,
240 | currentData.correlationId,
241 | currentData.host,
242 | currentData.token
243 | ).then(() => !reregister && window.location.reload());
244 | }
245 | return data;
246 | });
247 | };
248 |
249 | export const poll = (
250 | correlationId: string,
251 | secretKey: string,
252 | host: string,
253 | token: string,
254 | handleResetPopupDialogVisibility: () => void,
255 | handleCustomHostDialogVisibility: () => void
256 | ): Promise => {
257 | const headers = {
258 | Authorization: token,
259 | };
260 | return fetch(`https://${host}/poll?id=${correlationId}&secret=${secretKey}`, {
261 | method: "GET",
262 | cache: "no-cache",
263 | headers: token !== "" ? headers : {},
264 | referrerPolicy: "no-referrer",
265 | })
266 | .then(async (res: any) => {
267 | const status = res.status;
268 | const getRes = async (): Promise => {
269 | try {
270 | return await res.json();
271 | } catch {
272 | return { aes_key: "", data: [] };
273 | }
274 | };
275 | const data = await getRes();
276 | if (!res.ok) {
277 | const err = data.error;
278 | if (err === "could not get interactions: could not get correlation-id from cache") {
279 | register(host, token, false, true)
280 | .then((d) => {
281 | writeStoredData(d);
282 | })
283 | .catch((err2) => {
284 | if (
285 | err2.message !==
286 | "could not set id and public key: correlation-id provided is invalid"
287 | ) {
288 | clearIntervals();
289 | handleResetPopupDialogVisibility();
290 | }
291 | });
292 | } else if (
293 | err ===
294 | "could not set id and public key: could not read public Key: illegal base64 data at input byte 600"
295 | ) {
296 | register(host, token, false, false)
297 | .then((d) => {
298 | writeStoredData(d);
299 | })
300 | .catch((err2) => {
301 | if (
302 | err2.message !==
303 | "could not set id and public key: correlation-id provided is invalid"
304 | ) {
305 | clearIntervals();
306 | handleResetPopupDialogVisibility();
307 | }
308 | });
309 | } else if (status === 401) {
310 | handleCustomHostDialogVisibility();
311 | } else {
312 | clearIntervals();
313 | handleResetPopupDialogVisibility();
314 | }
315 | }
316 | return data;
317 | })
318 | .then((data) => data);
319 | };
320 |
--------------------------------------------------------------------------------
/src/lib/localStorage/index.test.ts:
--------------------------------------------------------------------------------
1 | import * as _ from ".";
2 | import { defaultStoredData } from ".";
3 |
4 | describe("localStorage", () => {
5 | it("writeStoredData", () => {
6 | jest.spyOn(window.localStorage.__proto__, "setItem");
7 | _.writeStoredData(defaultStoredData);
8 |
9 | // Tests that localStorage.setItem is called with the correct data.
10 | expect(localStorage.setItem).toHaveBeenCalledWith("app", JSON.stringify(defaultStoredData));
11 | });
12 |
13 | it("getStorageData", () => {
14 | _.writeStoredData(defaultStoredData); // Prep stored data.
15 | const data = _.getStoredData();
16 |
17 | jest.spyOn(window.localStorage.__proto__, "getItem");
18 | _.getStoredData();
19 |
20 | // Tests that localStorage.getItem is called with the right key.
21 | expect(localStorage.getItem).toHaveBeenCalledWith("app");
22 |
23 | // Test that data is retreived and decoded correctly.
24 | expect(data).toEqual(defaultStoredData);
25 | });
26 | });
27 |
--------------------------------------------------------------------------------
/src/lib/localStorage/index.ts:
--------------------------------------------------------------------------------
1 | import * as l from "fp-ts-local-storage";
2 | import { parseO } from "fp-ts-std/JSON";
3 | import { flow, pipe } from "fp-ts/function";
4 | import * as O from "fp-ts/Option";
5 |
6 | import { defaultFilter } from "lib/types/filter";
7 | import StoredDataS, { StoredData } from "lib/types/storedData";
8 |
9 | export const defaultStoredData: StoredData = {
10 | theme: "synth",
11 | privateKey: "",
12 | publicKey: "",
13 | correlationId: "",
14 | correlationIdLength: process.env.REACT_APP_CIDL ? +process.env.REACT_APP_CIDL : 20,
15 | correlationIdNonceLength: process.env.REACT_APP_CIDN ? +process.env.REACT_APP_CIDN : 13,
16 | responseExport: false,
17 | secretKey: "",
18 | data: [],
19 | aesKey: "",
20 | notes: [],
21 | view: "up_and_down",
22 | increment: 1,
23 | host: process.env?.REACT_APP_HOST || "oast.fun",
24 | tabs: [],
25 | token: process.env?.REACT_APP_TOKEN || "",
26 | telegram: {
27 | enabled: false,
28 | botToken: '',
29 | chatId: '',
30 | },
31 | slack: {
32 | enabled: false,
33 | hookKey: '',
34 | channel: '',
35 | },
36 | discord: {
37 | enabled: false,
38 | webhook: '',
39 | channel: '',
40 | },
41 | selectedTab: {
42 | "unique-id": "",
43 | correlationId: "",
44 | name: "1",
45 | url: "",
46 | note: "",
47 | },
48 | filter: defaultFilter,
49 | };
50 |
51 | export const writeStoredData = (data: StoredData) =>
52 | O.tryCatch(l.setItem("app", JSON.stringify(data)));
53 |
54 | export const getStoredData = () =>
55 | pipe(
56 | l.getItem("app"),
57 | O.tryCatch,
58 | O.flatten,
59 | O.chain(parseO),
60 | O.chain(flow(StoredDataS.type.decode, O.fromEither)),
61 | O.getOrElseW(() => StoredDataS.build(defaultStoredData))
62 | );
63 |
--------------------------------------------------------------------------------
/src/lib/notify/index.ts:
--------------------------------------------------------------------------------
1 | /* eslint-disable camelcase */
2 | // Notify
3 |
4 | const formatBody = (params: {[key: string]: any}) => Object.keys(params)
5 | .map((key) => `${key}=${encodeURIComponent(params[key])}`)
6 | .join('&');
7 |
8 | const headers = new Headers({
9 | 'content-type': 'application/x-www-form-urlencoded'
10 | })
11 |
12 | export const notifyTelegram = async (msg: string, token: string, target: string, mode?: string) => {
13 | if (token.trim() !== '' && target.trim() !== '') {
14 | const params: {[key: string]: string | boolean} = {
15 | chat_id : target,
16 | text: msg,
17 | }
18 | if (mode) {
19 | params.parse_mode = mode
20 | params.disable_web_page_preview = true
21 | }
22 | const body = formatBody(params)
23 | await fetch(`https://api.telegram.org/bot${token}/sendMessage`, {method: 'POST', body, headers})
24 | }
25 | }
26 |
27 | export const notifySlack = async (msg: any[], webhook: string, target: string) => {
28 | if (webhook.trim() !== '' && target.trim() !== '') {
29 | const params: {[key: string]: string} = {
30 | payload: JSON.stringify({
31 | "channel" : target,
32 | "text": '',
33 | "attachments": msg.map(m => ({"text": m.slack}))
34 | })
35 | }
36 | const body = formatBody(params)
37 | await fetch(`${webhook}`, {method: 'POST', body, headers})
38 | }
39 | }
40 |
41 | export const notifyDiscord = async (msg: any[], webhook: string) => {
42 | if (webhook.trim() !== '') {
43 | const chunkSize = 10;
44 | const chunkedData = msg.reduce((all,one,i) => {
45 | const ch = Math.floor(i/chunkSize);
46 | // eslint-disable-next-line no-param-reassign
47 | all[ch] = [].concat((all[ch]||[]),one);
48 | return all
49 | }, [])
50 | chunkedData.map(async (chunk: any) => {
51 | const params: any = {
52 | embeds: chunk.map((m: any) => ({"description": m.discord, "color":5298687}))
53 | }
54 | await fetch(`https://discordapp.com${new URL(webhook).pathname}`, {method: 'POST', body: JSON.stringify(params), headers: {"Content-Type": "application/json"}})
55 | })
56 | }
57 | }
58 |
--------------------------------------------------------------------------------
/src/lib/types/data/index.ts:
--------------------------------------------------------------------------------
1 | import { summonFor, AsOpaque } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import type { AType, EType } from "@morphic-ts/summoners";
3 | import * as A from "fp-ts/Array";
4 | import * as NEA from "fp-ts/NonEmptyArray";
5 |
6 | import { eqId } from "lib/types/id";
7 | import Protocol from "lib/types/protocol";
8 | import { createRecord } from "lib/utils";
9 |
10 | const { summon } = summonFor<{}>({});
11 |
12 | // Must include "as const" to capture type information.
13 | const dnsRecordTypes = ["A", "AAAA", "ALIAS", "CNAME", "MX", "NS", "PTR", "SOA", "TXT"] as const;
14 |
15 | export const Data_ = summon((F) =>
16 | F.intersection(
17 | // Required
18 | F.interface(
19 | {
20 | id: F.string(),
21 | "full-id": F.string(),
22 | protocol: Protocol(F),
23 | "raw-request": F.string(),
24 | "remote-address": F.string(),
25 | timestamp: F.string(), // TODO: Convert to ISODate
26 | "unique-id": F.string(),
27 | },
28 | ""
29 | ),
30 | // Optional
31 | F.partial(
32 | {
33 | "raw-response": F.string(),
34 | "q-type": F.keysOf(createRecord(dnsRecordTypes)),
35 | "smtp-from": F.string(),
36 | },
37 | ""
38 | )
39 | )("Data", { EqURI: () => eqId })
40 | );
41 | interface Data extends AType {}
42 | interface DataRaw extends EType {}
43 | const Data = AsOpaque()(Data_);
44 |
45 | export const groupByTabId = NEA.groupBy(Data.lensFromProp("unique-id").get);
46 |
47 | // filterByProtocols : Protocal[] -> Data[] -> Data[]
48 | export const filterByProtocols = (ps: Protocol[]) =>
49 | A.filter((d) => A.elem(Protocol.eq)(Data.lensFromProp("protocol").get(d), ps));
50 |
51 | export default Data;
52 |
--------------------------------------------------------------------------------
/src/lib/types/discord.ts:
--------------------------------------------------------------------------------
1 | import { AsOpaque, summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import type { AType, EType } from "@morphic-ts/summoners";
3 |
4 | const { summon } = summonFor<{}>({});
5 |
6 | const Discord_ = summon((F) =>
7 | F.interface(
8 | {
9 | enabled: F.boolean(),
10 | webhook: F.string(),
11 | channel: F.string(),
12 | },
13 | "Discord"
14 | )
15 | );
16 |
17 | export interface Discord extends AType {}
18 | export interface DiscordRaw extends EType {}
19 | export const Discord = AsOpaque()(Discord_);
20 |
21 | export default Discord;
22 |
--------------------------------------------------------------------------------
/src/lib/types/filter.ts:
--------------------------------------------------------------------------------
1 | import { summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import * as t from "io-ts";
3 |
4 | import Protocol from "lib/types/protocol";
5 |
6 | const { summon } = summonFor<{}>({});
7 |
8 | const Filter = summon((F) => F.record(Protocol(F), F.boolean()));
9 |
10 | type Filter = t.TypeOf;
11 |
12 | export const defaultFilter: Filter = {
13 | dns: true,
14 | http: true,
15 | smtp: true,
16 | };
17 |
18 | export default Filter;
19 |
--------------------------------------------------------------------------------
/src/lib/types/id.ts:
--------------------------------------------------------------------------------
1 | import * as Eq from "fp-ts/Eq";
2 | import { pipe } from "fp-ts/function";
3 | import * as s from "fp-ts/string";
4 | import { Lens } from "monocle-ts";
5 |
6 | export interface ID { id: string };
7 |
8 | export const id = Lens.fromProp()("id").get;
9 | export const eqId = pipe(s.Eq, Eq.contramap(id));
--------------------------------------------------------------------------------
/src/lib/types/protocol/index.ts:
--------------------------------------------------------------------------------
1 | import { summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import * as Eq from "fp-ts/Eq";
3 | import { pipe } from "fp-ts/function";
4 | import * as s from "fp-ts/string";
5 | import * as t from "io-ts";
6 |
7 | import { createRecord } from "lib/utils";
8 |
9 | const { summon } = summonFor<{}>({});
10 |
11 | const eqByView = pipe(
12 | s.Eq,
13 | Eq.contramap((p: string) => p)
14 | );
15 |
16 | export const protocols = ["dns", "http", "smtp"] as const;
17 |
18 | const Protocol = summon((F) =>
19 | F.keysOf(createRecord(protocols), {
20 | ShowURI: () => ({
21 | show: s.toUpperCase,
22 | }),
23 | EqURI: () => eqByView,
24 | })
25 | );
26 |
27 | type Protocol = t.TypeOf;
28 |
29 | export default Protocol;
30 |
--------------------------------------------------------------------------------
/src/lib/types/slack.ts:
--------------------------------------------------------------------------------
1 | import { AsOpaque, summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import type { AType, EType } from "@morphic-ts/summoners";
3 |
4 | const { summon } = summonFor<{}>({});
5 |
6 | const Slack_ = summon((F) =>
7 | F.interface(
8 | {
9 | enabled: F.boolean(),
10 | hookKey: F.string(),
11 | channel: F.string(),
12 | },
13 | "Slack"
14 | )
15 | );
16 |
17 | export interface Slack extends AType {}
18 | export interface SlackRaw extends EType {}
19 | export const Slack = AsOpaque()(Slack_);
20 |
21 | export default Slack;
22 |
--------------------------------------------------------------------------------
/src/lib/types/storedData.ts:
--------------------------------------------------------------------------------
1 | import { summonFor, AsOpaque } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import type { AType, EType } from "@morphic-ts/summoners";
3 |
4 | import { ThemeName } from "theme";
5 |
6 | import Data from "./data";
7 | import Discord from "./discord";
8 | import Filter from "./filter";
9 | import Slack from "./slack";
10 | import Tab from "./tab";
11 | import Telegram from "./telegram";
12 | import View from "./view";
13 |
14 | const { summon } = summonFor<{}>({});
15 |
16 | // Data structure of localStorage
17 | export const StoredData_ = summon((F) =>
18 | F.interface(
19 | {
20 | view: View(F),
21 | increment: F.number(),
22 | correlationId: F.string(),
23 | correlationIdLength: F.number(),
24 | correlationIdNonceLength: F.number(),
25 | responseExport: F.boolean(),
26 | theme: ThemeName(F),
27 |
28 | publicKey: F.string(),
29 | privateKey: F.string(),
30 | secretKey: F.string(),
31 |
32 | host: F.string(),
33 | token: F.string(),
34 | telegram: Telegram(F),
35 | slack: Slack(F),
36 | discord: Discord(F),
37 | selectedTab: Tab(F),
38 | tabs: F.array(Tab(F)),
39 | data: F.array(Data(F)),
40 | notes: F.array(F.string()),
41 | aesKey: F.string(),
42 | filter: Filter(F),
43 | },
44 | "StoredData"
45 | )
46 | );
47 |
48 | export interface StoredData extends AType {}
49 | export interface StoredDataRaw extends EType {}
50 | export default AsOpaque()(StoredData_);
51 |
--------------------------------------------------------------------------------
/src/lib/types/tab.ts:
--------------------------------------------------------------------------------
1 | import { AsOpaque, summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import type { AType, EType } from "@morphic-ts/summoners";
3 | import * as Eq from 'fp-ts/Eq';
4 | import { pipe } from "fp-ts/function";
5 | import * as s from 'fp-ts/string';
6 |
7 | const eqByUniqueId = pipe(
8 | s.Eq,
9 | Eq.contramap((t: { "unique-id": string }) => t["unique-id"])
10 | );
11 |
12 |
13 | const { summon } = summonFor<{}>({});
14 |
15 | const Tab_ = summon((F) =>
16 | F.interface(
17 | {
18 | correlationId: F.string(),
19 | "unique-id": F.string(),
20 | name: F.string(),
21 | note: F.string(),
22 | url: F.string(),
23 | },
24 | "Tab",
25 | { EqURI: () => eqByUniqueId }
26 | )
27 | );
28 |
29 | export interface Tab extends AType {}
30 | export interface TabRaw extends EType {}
31 | export const Tab = AsOpaque()(Tab_);
32 |
33 | export default Tab;
34 |
--------------------------------------------------------------------------------
/src/lib/types/telegram.ts:
--------------------------------------------------------------------------------
1 | import { AsOpaque, summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import type { AType, EType } from "@morphic-ts/summoners";
3 |
4 | const { summon } = summonFor<{}>({});
5 |
6 | const Telegram_ = summon((F) =>
7 | F.interface(
8 | {
9 | enabled: F.boolean(),
10 | botToken: F.string(),
11 | chatId: F.string(),
12 | },
13 | "Telegram"
14 | )
15 | );
16 |
17 | export interface Telegram extends AType {}
18 | export interface TelegramRaw extends EType {}
19 | export const Telegram = AsOpaque()(Telegram_);
20 |
21 | export default Telegram;
22 |
--------------------------------------------------------------------------------
/src/lib/types/view.ts:
--------------------------------------------------------------------------------
1 | import { summonFor } from "@morphic-ts/batteries/lib/summoner-ESBST";
2 | import * as Eq from "fp-ts/Eq";
3 | import { pipe } from "fp-ts/function";
4 | import * as s from "fp-ts/string";
5 | import * as t from "io-ts";
6 |
7 | const { summon } = summonFor<{}>({});
8 |
9 | const eqByView = pipe(
10 | s.Eq,
11 | Eq.contramap((v: string) => v)
12 | );
13 |
14 | const View = summon((F) =>
15 | F.keysOf(
16 | { request: null, response: null, up_and_down: null, side_by_side: null },
17 | { EqURI: () => eqByView }
18 | )
19 | );
20 | type View = t.TypeOf;
21 |
22 | export default View;
23 |
--------------------------------------------------------------------------------
/src/lib/utils/index.test.ts:
--------------------------------------------------------------------------------
1 | import { createRecord, trueKeys } from '.';
2 |
3 | describe("utils", () => {
4 | test("createRecord", () => {
5 | expect(createRecord(["a", "b"])).toEqual({ a: null, b: null });
6 | });
7 |
8 | test("trueKeys", () => {
9 | expect(trueKeys({ a: true, b: false, c: true })).toEqual(["a", "c"]);
10 | });
11 |
12 | })
13 |
--------------------------------------------------------------------------------
/src/lib/utils/index.ts:
--------------------------------------------------------------------------------
1 | import * as f from "fp-ts-std/Function";
2 | import * as ss from "fp-ts-std/String";
3 | import { pipe, flow } from "fp-ts/function";
4 | import * as O from "fp-ts/Option";
5 | import * as RA from "fp-ts/ReadonlyArray";
6 | import * as R from "fp-ts/Record";
7 | import * as S from "fp-ts/string";
8 | import * as T from "fp-ts/Tuple";
9 |
10 |
11 |
12 | export type TupleToRecord = {
13 | [K in X[number]]: null;
14 | };
15 |
16 | /*
17 | * @example
18 | *
19 | * createRecord(
20 | * ["dns", "http", "https"] as const // Must include "as const"
21 | * )
22 | */
23 | export const createRecord = (arr: X): TupleToRecord =>
24 | pipe(
25 | arr,
26 | RA.reduce({ [arr[0]]: null }, (a, b) => ({ ...a, [b]: null })),
27 | (x) => x as TupleToRecord
28 | );
29 |
30 |
31 | /**
32 | * trueKeys : Record string boolean -> string[]
33 | *
34 | * Returns a list of "true" keys in a record
35 | */
36 | export const trueKeys = (r: Record) => pipe(
37 | r,
38 | R.map>(O.fromPredicate(x => !!x)),
39 | R.compact, // Removes false keys
40 | R.keys, // Converts to array of keys.
41 | x => x as K[]
42 | )
43 |
44 | export const capitalize = flow(
45 | ss.splitAt(1),
46 | T.bimap(S.toLowerCase, S.toUpperCase), // snd, first
47 | pipe(
48 | // ((T, T) -> T) -> ([T, T] -> T)
49 | S.Semigroup.concat,
50 | f.curry2,
51 | f.uncurry2
52 | )
53 | );
54 |
55 | export const generateRandomString = (length: number, lettersOnly: boolean = false) => {
56 | let characters = '';
57 | if (lettersOnly) {
58 | characters = 'abcdefghijklmnopqrstuvwxyz';
59 | } else {
60 | characters = 'abcdefghijklmnopqrstuvwxyz0123456789';
61 | }
62 | let result = '';
63 | for (let i = 0; i < length; i+=1) {
64 | result += characters.charAt(Math.floor(Math.random() * characters.length));
65 | }
66 | return result;
67 | };
--------------------------------------------------------------------------------
/src/pages/homePage/index.tsx:
--------------------------------------------------------------------------------
1 | /* eslint-disable no-unused-expressions */
2 | /* eslint-disable camelcase */
3 | import React, { useEffect, useState } from "react";
4 |
5 | import format from "date-fns/format";
6 | import { ThemeProvider } from "styled-components";
7 |
8 | import "./styles.scss";
9 | // Icons
10 | import { ReactComponent as ChevronUpIcon } from "assets/svg/chevron_up.svg";
11 | import { ReactComponent as ClearIcon } from "assets/svg/clear.svg";
12 | import { ReactComponent as CloseIcon } from "assets/svg/close.svg";
13 | import { ReactComponent as CopyIcon } from "assets/svg/copy.svg";
14 | import { ReactComponent as SideBySideIcon } from "assets/svg/side_by_side.svg";
15 | import { ReactComponent as UpDownIcon } from "assets/svg/up_down.svg";
16 | import AppLoader from "components/appLoader";
17 | import { GlobalStyles } from "globalStyles";
18 | import {
19 | generateUrl,
20 | poll,
21 | decryptAESKey,
22 | processData,
23 | handleResponseExport,
24 | copyDataToClipboard,
25 | clearIntervals,
26 | register,
27 | } from "lib";
28 | import { notifyTelegram, notifySlack, notifyDiscord } from "lib/notify";
29 | import Data from "lib/types/data";
30 | import { StoredData } from "lib/types/storedData";
31 | import Tab from "lib/types/tab";
32 | import View from "lib/types/view";
33 | import { ThemeName, getTheme } from "theme";
34 |
35 | import Header from "../../components/header";
36 | import TabSwitcher from "../../components/tabSwitcher";
37 | import { writeStoredData, getStoredData, defaultStoredData } from "../../lib/localStorage";
38 | import RequestDetailsWrapper from "./requestDetailsWrapper";
39 | import RequestsTableWrapper from "./requestsTableWrapper";
40 |
41 |
42 | const HomePage = () => {
43 | const [aboutPopupVisibility, setAboutPopupVisibility] = useState(false);
44 | const [filteredData, setFilteredData] = useState>([]);
45 | const [isNotesOpen, setIsNotesOpen] = useState(false);
46 | const [isRegistered, setIsRegistered] = useState(false);
47 | const [isResetPopupDialogVisible, setIsResetPopupDialogVisible] = useState(false);
48 | const [isNotificationsDialogVisible, setIsNotificationsDialogVisible] = useState(false);
49 | const [loaderAnimationMode, setLoaderAnimationMode] = useState("loading");
50 | const [selectedInteraction, setSelectedInteraction] = useState(null);
51 | const [selectedInteractionData, setSelectedInteractionData] = useState(null);
52 | const [storedData, setStoredData] = useState(getStoredData());
53 | const [isCustomHostDialogVisible, setIsCustomHostDialogVisible] = useState(false);
54 |
55 | const handleResetPopupDialogVisibility = () => {
56 | setIsResetPopupDialogVisible(!isResetPopupDialogVisible);
57 | };
58 |
59 | const handleNotificationsDialogVisibility = () => {
60 | setIsNotificationsDialogVisible(!isNotificationsDialogVisible);
61 | };
62 |
63 | const handleCustomHostDialogVisibility = () => {
64 | setIsCustomHostDialogVisible(!isCustomHostDialogVisible);
65 | };
66 |
67 | // "Switch theme" function
68 | const handleThemeSelection = (value: ThemeName) => {
69 | setStoredData({
70 | ...storedData,
71 | theme: value,
72 | });
73 | };
74 |
75 | // "Select a tab" function
76 | const handleTabButtonClick = (tab: Tab) => {
77 | setStoredData({
78 | ...storedData,
79 | selectedTab: tab,
80 | });
81 | setSelectedInteraction(null);
82 | };
83 |
84 | // " Add new tab" function
85 | const handleAddNewTab = () => {
86 | const { increment, host, correlationId, correlationIdNonceLength } = storedData;
87 | const newIncrement = increment + 1;
88 | const { url, uniqueId } = generateUrl(correlationId, correlationIdNonceLength, newIncrement, host);
89 | const tabData: Tab = {
90 | "unique-id": uniqueId,
91 | correlationId,
92 | name: newIncrement.toString(),
93 | url,
94 | note: "",
95 | };
96 | setStoredData({
97 | ...storedData,
98 | tabs: storedData.tabs.concat([tabData]),
99 | selectedTab: tabData,
100 | increment: newIncrement,
101 | });
102 | setSelectedInteraction(null);
103 | };
104 |
105 | // "Show or hide notes" function
106 | const handleNotesVisibility = () => {
107 | setTimeout(() => {
108 | document.getElementById("notes_textarea")?.focus();
109 | }, 200);
110 | setIsNotesOpen(!isNotesOpen);
111 | };
112 |
113 | // "Notes input change handler" function
114 | const handleNoteInputChange: React.ChangeEventHandler = (e) => {
115 | const { selectedTab, tabs } = storedData;
116 | const index = tabs.findIndex((item) => Tab.eq.equals(item, selectedTab));
117 | const currentTab = tabs[index];
118 | const filteredTabList = tabs.filter((item) => !Tab.eq.equals(item, selectedTab));
119 | filteredTabList.push({ ...currentTab, note: e.target.value });
120 | setStoredData({
121 | ...storedData,
122 | tabs: filteredTabList,
123 | });
124 | };
125 |
126 | // "Selecting a specific interaction" function
127 | const handleRowClick = (id: string) => {
128 | setSelectedInteraction(id);
129 | const reqDetails =
130 | filteredData && filteredData[filteredData.findIndex((item) => item.id === id)];
131 | setSelectedInteractionData(reqDetails);
132 | };
133 |
134 | // "Deleting a tab" function
135 | const handleDeleteTab = (tab: Tab) => {
136 | const { tabs } = storedData;
137 | const index = tabs.findIndex((value) => Tab.eq.equals(value, tab));
138 | const filteredTempTabsList = tabs.filter((value) => !Tab.eq.equals(value, tab));
139 | const tempTabsData = storedData.data;
140 | const filteredTempTabsData = tempTabsData.filter(
141 | (value) => value["unique-id"] !== tab["unique-id"]
142 | );
143 | setStoredData({
144 | ...storedData,
145 | tabs: [...filteredTempTabsList],
146 | selectedTab: {
147 | ...filteredTempTabsList[filteredTempTabsList.length <= index ? index - 1 : index],
148 | },
149 | data: filteredTempTabsData,
150 | });
151 | };
152 |
153 | // "Renaming a tab" function
154 | const handleTabRename: React.ChangeEventHandler = (e) => {
155 | const tempTabsList = storedData.tabs;
156 | const index = tempTabsList.findIndex((item) => Tab.eq.equals(item, storedData.selectedTab));
157 | const filteredTabList = tempTabsList.filter(
158 | (item) => !Tab.eq.equals(item, storedData.selectedTab)
159 | );
160 | const tempTab = { ...tempTabsList[index], name: e.target.value };
161 |
162 | setStoredData({
163 | ...storedData,
164 | tabs: filteredTabList.concat(tempTab),
165 | });
166 | };
167 |
168 | // "View selector" function
169 | const handleChangeView = (value: View) => {
170 | setStoredData({
171 | ...storedData,
172 | view: value,
173 | });
174 | };
175 |
176 | // "Show or hide about popup" function
177 | const handleAboutPopupVisibility = () => {
178 | setAboutPopupVisibility(!aboutPopupVisibility);
179 | };
180 |
181 | // "Clear interactions of a tab" function
182 | const clearInteractions = () => {
183 | const { selectedTab, data } = storedData;
184 | const tempData = data.filter((item) => item["unique-id"] !== selectedTab["unique-id"]);
185 | setStoredData({
186 | ...storedData,
187 | data: tempData,
188 | });
189 | setFilteredData([]);
190 | };
191 |
192 | const processPolledData = () => {
193 | const dataFromLocalStorage = getStoredData();
194 | const { privateKey, aesKey, host, token, data, correlationId, secretKey } =
195 | dataFromLocalStorage;
196 |
197 | let decryptedAESKey = aesKey;
198 |
199 | poll(
200 | correlationId,
201 | secretKey,
202 | host,
203 | token,
204 | handleResetPopupDialogVisibility,
205 | handleCustomHostDialogVisibility
206 | )
207 | .then((pollData) => {
208 | setIsRegistered(true);
209 | if (pollData?.data?.length !== 0 && !pollData.error) {
210 | if (aesKey === "" && pollData.aes_key) {
211 | decryptedAESKey = decryptAESKey(privateKey, pollData.aes_key);
212 | }
213 | const processedData = processData(decryptedAESKey, pollData);
214 |
215 | // eslint-disable-next-line array-callback-return
216 | const formattedString = processedData.map((item: any) => {
217 |
218 | storedData.responseExport && handleResponseExport(item)
219 |
220 | const telegramMsg = `[${item['full-id']}] Received ${item.protocol.toUpperCase()} interaction from ${item['remote-address']} ${format(new Date(item.timestamp), "yyyy-mm-dd_hh:mm:ss")} `
221 | storedData.telegram.enabled && notifyTelegram(telegramMsg, storedData.telegram.botToken, storedData.telegram.chatId, 'HTML')
222 | return {
223 | slack: `[${item['full-id']}] Received ${item.protocol.toUpperCase()} interaction from \n at ${format(new Date(item.timestamp), "yyyy-mm-dd_hh:mm:ss")}`,
224 | discord: `[${item['full-id']}] Received ${item.protocol.toUpperCase()} interaction from \n [${item['remote-address']}](https://ipinfo.io/${item['remote-address']}) at ${format(new Date(item.timestamp), "yyyy-mm-dd_hh:mm:ss")}`,
225 | }
226 | })
227 | storedData.slack.enabled && notifySlack(formattedString, storedData.slack.hookKey, storedData.slack.channel)
228 | storedData.discord.enabled && notifyDiscord(formattedString, storedData.discord.webhook)
229 |
230 | const combinedData: Data[] = data.concat(processedData);
231 |
232 | setStoredData({
233 | ...dataFromLocalStorage,
234 | data: combinedData,
235 | aesKey: decryptedAESKey,
236 | });
237 |
238 | const newData = combinedData
239 | .filter((item) => item["unique-id"] === dataFromLocalStorage.selectedTab["unique-id"])
240 | .map((item) => item);
241 | setFilteredData([...newData]);
242 | }
243 | })
244 | .catch(() => {
245 | setLoaderAnimationMode("server_error");
246 | setIsRegistered(false);
247 | });
248 | };
249 |
250 | useEffect(() => {
251 | writeStoredData(storedData);
252 | }, [storedData]);
253 |
254 | useEffect(() => {
255 | window.addEventListener("storage", () => {
256 | setStoredData(getStoredData());
257 | });
258 | setIsRegistered(true);
259 | if (storedData.correlationId === "") {
260 | setLoaderAnimationMode("loading");
261 | setIsRegistered(false);
262 | setTimeout(() => {
263 | register(storedData.host, storedData.token, false, false)
264 | .then((data) => {
265 | setStoredData(data);
266 | window.setInterval(() => {
267 | processPolledData();
268 | }, 4000);
269 | setIsRegistered(true);
270 | })
271 | .catch(() => {
272 | localStorage.clear();
273 | setStoredData(defaultStoredData);
274 | setLoaderAnimationMode("server_error");
275 | setIsRegistered(false);
276 | });
277 | }, 1500);
278 | }
279 | }, []);
280 |
281 | // Recalculate data when a tab is selected
282 | useEffect(() => {
283 | if (storedData.tabs.length > 0) {
284 | clearIntervals();
285 | window.setInterval(() => {
286 | processPolledData();
287 | }, 4000);
288 | const tempFilteredData = storedData.data
289 | .filter((item) => item["unique-id"] === storedData.selectedTab["unique-id"])
290 | .map((item) => item);
291 | setFilteredData(tempFilteredData);
292 | }
293 | }, [storedData.selectedTab]);
294 |
295 | const selectedTabsIndex = storedData.tabs.findIndex((item) =>
296 | Tab.eq.equals(item, storedData.selectedTab)
297 | );
298 |
299 | return (
300 |
301 |
303 |
304 | {aboutPopupVisibility && (
305 |
306 |
307 |
308 | About
309 |
311 |
312 | Interactsh is an Open-Source solution for Out of band Data Extraction, A tool
313 | designed to detect bugs that cause external interactions, For example - Blind SQLi,
314 | Blind CMDi, SSRF, etc.
315 |
316 |
317 | If you find communications or exchanges with the Interactsh.com server in your logs, it
318 | is possible that someone has been testing your applications using our hosted
319 | service,
320 |
321 | {` app.interactsh.com `}
322 |
323 | You should review the time when these interactions were initiated to identify the
324 | person responsible for this testing.
325 |
326 |
327 | For further details about Interactsh.com,
328 |
329 | {` checkout opensource code.`}
330 |
331 |
332 |
333 |
334 | )}
335 |
347 |
356 |
357 |
358 |
359 |
360 | {storedData.selectedTab && storedData.selectedTab.url}
361 |
362 |
copyDataToClipboard(storedData.selectedTab.url)} />
363 |
364 |
371 |
377 |
378 |
379 | {/* */}
380 | {/* {tabs[selectedTabsIndex].note} */}
381 |
390 | {/* */}
391 |
392 |
393 | Notes
394 |
400 |
401 |
402 | {selectedInteraction !== null && selectedInteractionData !== null && (
403 |
404 |
405 | {selectedInteractionData.protocol !== "smtp" && (
406 | <>
407 |
408 | handleChangeView("request")}
416 | >
417 | Request
418 |
419 | handleChangeView("response")}
427 | >
428 | Response
429 |
430 |
431 |
handleChangeView("side_by_side")}
438 | />
439 | handleChangeView("up_and_down")}
446 | />
447 |
448 | )}
449 |
457 |
458 |
462 |
463 | )}
464 |
465 |
467 | );
468 | };
469 |
470 | export default HomePage;
471 |
--------------------------------------------------------------------------------
/src/pages/homePage/requestDetailsWrapper.tsx:
--------------------------------------------------------------------------------
1 | import React, { Suspense } from "react";
2 |
3 | import { ErrorBoundary } from "react-error-boundary";
4 |
5 | import Data from "lib/types/data";
6 | import Protocol from "lib/types/protocol";
7 | import View from "lib/types/view";
8 |
9 | import DetailedRequest from "../../components/detailedRequest";
10 | import { IssuesListFallback, IssuesListErrorFallback } from "../../helpers/fallback-loaders";
11 | import "./styles.scss";
12 |
13 | interface RequestDetailsWrapperP {
14 | view: View;
15 | selectedInteractionData: Data;
16 | }
17 |
18 | const RequestDetailsWrapper = (props: RequestDetailsWrapperP) => {
19 | const { selectedInteractionData, view } = props;
20 |
21 | return (
22 |
26 | (
28 |
65 |
66 | );
67 | };
68 |
69 | export default RequestDetailsWrapper;
70 |
--------------------------------------------------------------------------------
/src/pages/homePage/requestsTableWrapper.tsx:
--------------------------------------------------------------------------------
1 | import React, { Suspense } from "react";
2 |
3 | import { ErrorBoundary } from "react-error-boundary";
4 |
5 | import Data from "lib/types/data";
6 | import Filter from "lib/types/filter";
7 |
8 | import RequestsTable from "../../components/requestsTable";
9 | import {
10 | RepoSidebarListFallback,
11 | RepoSidebarListErrorFallback,
12 | } from "../../helpers/fallback-loaders";
13 | import "./styles.scss";
14 |
15 | interface RequestsTableWrapperP {
16 | data: Data[];
17 | handleRowClick: (id: string) => void;
18 | selectedInteraction: string;
19 | filter: Filter;
20 | }
21 |
22 | const RequestsTableWrapper = ({
23 | data,
24 | handleRowClick,
25 | selectedInteraction,
26 | filter,
27 | }: RequestsTableWrapperP): JSX.Element => (
28 |
29 | (
31 |
43 |
44 | );
45 |
46 | export default RequestsTableWrapper;
47 |
--------------------------------------------------------------------------------
/src/pages/homePage/styles.scss:
--------------------------------------------------------------------------------
1 | @import "../../breakpoints.scss";
2 | @include for-size(xsmall) {
3 | }
4 |
5 | @include for-size(small) {
6 | }
7 |
8 | @include for-size(medium) {
9 | }
10 |
11 | @include for-size(large) {
12 | }
13 |
14 | @include for-size(xlarge) {
15 | }
16 |
17 | .main {
18 | width: 100vw;
19 | height: 100vh;
20 | display: flex;
21 | flex-direction: column;
22 | position: relative;
23 | .about_popup_wrapper {
24 | display: flex;
25 | align-items: center;
26 | justify-content: center;
27 | position: fixed;
28 | height: 100vh;
29 | z-index: 100;
30 | width: 100vw;
31 | background: rgba(0, 0, 0, 0.4);
32 | .about_popup {
33 | display: flex;
34 | padding: 3.4rem 3rem;
35 | flex-direction: column;
36 | background: #000000;
37 | border-radius: 0.6rem;
38 | color: #ffffff;
39 | transform: translateY(-7);
40 | width: 40%;
41 | font-size: 1.5rem;
42 | .about_popup_body {
43 | & > a {
44 | color: #32aaee;
45 | }
46 | }
47 | .about_popup_header {
48 | display: flex;
49 | font-size: 2rem;
50 | margin-bottom: 3rem;
51 | & > svg {
52 | height: 2rem;
53 | cursor: pointer;
54 | margin-left: auto;
55 | }
56 | }
57 | }
58 | }
59 | .body {
60 | width: 100%;
61 | display: flex;
62 | height: calc(100% - 9rem);
63 |
64 | .left_section {
65 | width: 30%;
66 | box-sizing: border-box;
67 | height: 100%;
68 | overflow: hidden;
69 | display: flex;
70 | flex-direction: column;
71 | border-right: 1px solid rgba(151, 151, 151, 0.25);
72 |
73 | .url_container {
74 | width: 100%;
75 | height: 13.5rem;
76 | padding: 0 1.5rem;
77 | display: flex;
78 | align-items: center;
79 | .vertical_bar {
80 | border-right: 1px solid rgba(151, 151, 151, 0.5);
81 | height: 4.2rem;
82 | width: 1px;
83 | margin: 0 1.5rem;
84 | }
85 | .clear_button__disabled {
86 | pointer-events: none;
87 | g g {
88 | fill: #979797;
89 | }
90 | }
91 | & > div {
92 | font-size: 1.5rem;
93 | color: #ffffff;
94 | text-align: left;
95 | padding-bottom: 1.5rem;
96 | overflow: hidden;
97 | text-overflow: ellipsis;
98 | white-space: nowrap;
99 | border-bottom: 1px solid rgba(255, 255, 255, 0.3);
100 | }
101 | & > svg {
102 | margin: -0.5rem 0 0 1.5rem;
103 | cursor: pointer;
104 | height: 2.2rem;
105 | width: 1.8rem;
106 | transition: all 0.1s linear;
107 | &:nth-of-type(2) {
108 | height: 2.2rem;
109 | width: 2.2rem;
110 | margin: -0.4rem 0 0 0;
111 | }
112 | &:active {
113 | g g {
114 | fill: #979797;
115 | }
116 | }
117 | }
118 | }
119 | .requests_table_container {
120 | width: 100%;
121 | height: calc(100% - 18rem);
122 | overflow-y: scroll;
123 | }
124 | .notes {
125 | width: 100%;
126 | display: flex;
127 | flex-direction: column;
128 | max-height: calc(100% - 18.5rem);
129 | position: relative;
130 | .detailed_notes {
131 | display: none;
132 | position: absolute;
133 | bottom: 6.3rem;
134 | width: 100%;
135 | height: 40rem;
136 | & > textarea {
137 | padding: 1.5rem 2rem;
138 | height: 100%;
139 | background: transparent;
140 | overflow-y: scroll;
141 | width: 100%;
142 | border: none;
143 | color: #fcc28c;
144 | font-size: 1.6rem;
145 | &:focus {
146 | outline: none !important;
147 | box-shadow: none !important;
148 | }
149 | &::placeholder {
150 | color: #fcc28c;
151 | }
152 | }
153 | }
154 | .notes_footer {
155 | height: 6.3rem;
156 | cursor: pointer;
157 | display: flex;
158 | align-items: center;
159 | padding: 0 2rem;
160 | & > span {
161 | font-size: 1.6rem;
162 | color: #ffffff;
163 | }
164 | & > svg {
165 | margin-left: auto;
166 | transition: all 0.1s linear;
167 | }
168 | }
169 | }
170 | }
171 | .right_section {
172 | width: 70%;
173 | height: 100%;
174 |
175 | .result_header {
176 | height: 7.5rem;
177 | display: flex;
178 | align-items: center;
179 | padding: 0 1.6rem 0 3.4rem;
180 | color: #ffffff;
181 | margin-bottom: 1.5rem;
182 | .__selected_req_res_button {
183 | background: rgba(216, 216, 216, 0.2);
184 | }
185 | & > svg {
186 | margin-left: 1rem;
187 | cursor: pointer;
188 | fill: #ffffff;
189 | }
190 | .req_res_buttons {
191 | height: 3.5rem;
192 | border: 1px solid #979797;
193 | overflow: hidden;
194 | border-radius: 0.6rem;
195 | font-size: 1.4rem;
196 | color: #ffffff;
197 | display: flex;
198 | align-items: center;
199 | margin-right: 1rem;
200 | cursor: pointer;
201 | & > button {
202 | height: 100%;
203 | display: flex;
204 | align-items: center;
205 | padding: 0 1.1rem;
206 | }
207 | }
208 | .result_info {
209 | margin-left: auto;
210 | font-size: 1.6rem;
211 | color: #ffffff;
212 | & > span {
213 | padding-bottom: 0.2rem;
214 | border-bottom: 1px solid rgba(151, 151, 151, 0.6);
215 | }
216 | }
217 | }
218 | .detailed_request {
219 | display: flex;
220 | flex-direction: column;
221 | padding: 0 3.4rem;
222 | overflow-y: scroll;
223 | height: calc(100% - 9rem);
224 | justify-content: space-between;
225 | align-items: stretch;
226 | }
227 | }
228 | }
229 | }
230 |
--------------------------------------------------------------------------------
/src/pages/termsPage/index.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | export default () => (
4 |
9 | Privacy Policy
10 |
11 | );
12 |
--------------------------------------------------------------------------------
/src/react-app-env.d.ts:
--------------------------------------------------------------------------------
1 | /// ;
21 |
22 | export interface Theme {
23 | background: string;
24 | secondaryBackground: string;
25 | lightBackground: string;
26 | }
27 |
28 | export const showThemeName: Show = { show: capitalize };
29 |
30 | export const darkTheme: Theme = {
31 | background: "#03030d",
32 | secondaryBackground: "#101624",
33 | lightBackground: "#192030",
34 | };
35 | export const synthTheme: Theme = {
36 | background: "#240d2c",
37 | secondaryBackground: "#15071a",
38 | lightBackground: "#341D3B",
39 | };
40 | export const blueTheme: Theme = {
41 | background: "#001729",
42 | secondaryBackground: "#001123",
43 | lightBackground: "#192030",
44 | };
45 |
46 | export const getTheme = (theme: ThemeName): Theme =>
47 | match(theme)
48 | .with("blue", () => blueTheme)
49 | .with("dark", () => darkTheme)
50 | .with("synth", () => synthTheme)
51 | .exhaustive();
52 |
--------------------------------------------------------------------------------
/src/vitals.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable import/prefer-default-export */
2 | const vitalsUrl = 'https://vitals.vercel-analytics.com/v1/vitals';
3 |
4 | function getConnectionSpeed() {
5 | return 'connection' in navigator &&
6 | navigator.connection &&
7 | 'effectiveType' in navigator.connection
8 | ? navigator.connection.effectiveType
9 | : '';
10 | }
11 |
12 | export function sendToVercelAnalytics(metric) {
13 | const analyticsId = process.env.REACT_APP_VERCEL_ANALYTICS_ID;
14 | if (!analyticsId) {
15 | return;
16 | }
17 |
18 | const body = {
19 | dsn: analyticsId,
20 | id: metric.id,
21 | page: window.location.pathname,
22 | href: window.location.href,
23 | // eslint-disable-next-line camelcase
24 | event_name: metric.name,
25 | value: metric.value.toString(),
26 | speed: getConnectionSpeed(),
27 | };
28 |
29 | const blob = new Blob([new URLSearchParams(body).toString()], {
30 | // This content type is necessary for `sendBeacon`
31 | type: 'application/x-www-form-urlencoded',
32 | });
33 | if (navigator.sendBeacon) {
34 | navigator.sendBeacon(vitalsUrl, blob);
35 | } else
36 | fetch(vitalsUrl, {
37 | body: blob,
38 | method: 'POST',
39 | credentials: 'omit',
40 | keepalive: true,
41 | });
42 | }
--------------------------------------------------------------------------------
/src/xid-js.d.ts:
--------------------------------------------------------------------------------
1 | declare module 'xid-js' {
2 | export declare const next: () => string;
3 | }
4 |
--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
1 | const colors = require("tailwindcss/colors");
2 |
3 | const keyframes = {
4 | width: {
5 | "0%": { width: "0%" },
6 | "100%": { transform: "100%" },
7 | },
8 | };
9 |
10 | module.exports = {
11 | important: true,
12 | purge: ["./src/**/*.{js,jsx,ts,tsx}", "./public/index.html"],
13 | darkMode: "media",
14 | theme: {
15 | extend: {
16 | flex: {
17 | auto: "2 1 auto",
18 | },
19 | keyframes,
20 | animation: {
21 | width: "width 2s ease-out infinite",
22 | },
23 | },
24 | transitionDuration: {
25 | fast: "300ms",
26 | DEFAULT: "500ms",
27 | slow: "700ms",
28 | },
29 | fontFamily: {
30 | primary: ["Nunito Sans", "sans-serif"],
31 | },
32 | boxShadow: {
33 | DEFAULT: "0 -2px 10px rgba(0, 0, 0, 1)",
34 | none: "none",
35 | },
36 | fontWeight: {
37 | light: 300,
38 | normal: 400,
39 | bold: 600,
40 | },
41 | colors: {
42 | transparent: "transparent",
43 | current: "currentColor",
44 |
45 | white: "#FFF",
46 | black: "#121212",
47 | accent: "rgba(149,90,231,100)",
48 | gray: {
49 | light: "#979797",
50 | DEFAULT: "rgba(216, 216, 216, 0.17)",
51 | dark: "#202020",
52 | },
53 | success: {
54 | light: "rgba(61,255,206,.19)",
55 | DEFAULT: "#3DFFCE",
56 | },
57 | danger: {
58 | light: "rgba(207,87,87,.17)",
59 | DEFAULT: "#FF7777",
60 | },
61 | info: {
62 | DEFAULT: "#5A52FF",
63 | },
64 | },
65 | },
66 | variants: {
67 | extend: {
68 | visibility: ["group-hover"],
69 | },
70 | },
71 | plugins: [require("@tailwindcss/forms"), require("@tailwindcss/typography")],
72 | };
73 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es5",
4 | "baseUrl": "src",
5 | "lib": ["dom", "dom.iterable", "esnext"],
6 | "allowJs": true,
7 | "skipLibCheck": true,
8 | "esModuleInterop": true,
9 | "allowSyntheticDefaultImports": true,
10 | "strict": true,
11 | "forceConsistentCasingInFileNames": true,
12 | "noFallthroughCasesInSwitch": true,
13 | "module": "esnext",
14 | "moduleResolution": "node",
15 | "resolveJsonModule": true,
16 | "isolatedModules": true,
17 | "noEmit": true,
18 | "jsx": "react-jsx"
19 | },
20 | "include": ["src"]
21 | }
22 |
--------------------------------------------------------------------------------
8 |
9 | ## Configuring Self-Hosted Interactsh Server
10 |
11 | - Navigate to hosted interactsh-web client at https://app.interactsh.com
12 | - Click on `oast.fun` link at top bar
13 | - Submit domain name running self-hosted interactsh server, optionally token (for protected server)
14 |
15 | Here is an example configuring self-hosted interactsh server with web-client:
16 |
17 | https://user-images.githubusercontent.com/8293321/163819390-b2677f3b-4c31-4439-b258-33b8bee87bf1.mp4
18 |
19 | ## Build from Source
20 |
21 |
22 |