frikky
735 lines
21 KiB
React
Executable File
735 lines
21 KiB
React
Executable File
import React, { useState, useEffect } from "react";
|
|
|
|
import { Route, Routes, BrowserRouter } from "react-router-dom";
|
|
import { CookiesProvider } from "react-cookie";
|
|
import { removeCookies, useCookies } from "react-cookie";
|
|
|
|
import Workflows from "./views/Workflows";
|
|
import GettingStarted from "./views/GettingStarted";
|
|
import EditWebhook from "./views/EditWebhook";
|
|
import AngularWorkflow from "./views/AngularWorkflow";
|
|
|
|
import Header from "./components/Header.jsx";
|
|
import theme from "./theme";
|
|
import Apps from "./views/Apps";
|
|
import AppCreator from "./views/AppCreator";
|
|
|
|
import Welcome from "./views/Welcome.jsx";
|
|
import Dashboard from "./views/Dashboard.jsx";
|
|
import DashboardView from "./views/DashboardViews.jsx";
|
|
import AdminSetup from "./views/AdminSetup";
|
|
import Admin from "./views/Admin";
|
|
import Docs from "./views/Docs";
|
|
import Introduction from "./views/Introduction";
|
|
import SetAuthentication from "./views/SetAuthentication";
|
|
import SetAuthenticationSSO from "./views/SetAuthenticationSSO";
|
|
import Search from "./views/Search.jsx";
|
|
import RunWorkflow from "./views/RunWorkflow.jsx";
|
|
|
|
import LandingPageNew from "./views/LandingpageNew";
|
|
import LoginPage from "./views/LoginPage";
|
|
import SettingsPage from "./views/SettingsPage";
|
|
import KeepAlive from "./views/KeepAlive.jsx";
|
|
|
|
import MyView from "./views/MyView";
|
|
|
|
import { createMuiTheme, MuiThemeProvider } from "@material-ui/core/styles";
|
|
|
|
import FrameworkWrapper from "./views/FrameworkWrapper.jsx";
|
|
import ScrollToTop from "./components/ScrollToTop";
|
|
import AlertTemplate from "./components/AlertTemplate";
|
|
import { useAlert, positions, Provider } from "react-alert";
|
|
import { isMobile } from "react-device-detect";
|
|
|
|
import detectEthereumProvider from "@metamask/detect-provider";
|
|
import Drift from "react-driftjs";
|
|
import DashboardPage from "./views/TempDashboard.jsx";
|
|
|
|
// Production - backend proxy forwarding in nginx
|
|
var globalUrl = window.location.origin;
|
|
|
|
// CORS used for testing purposes. Should only happen with specific port and http
|
|
if (window.location.port === "3000") {
|
|
globalUrl = "http://localhost:5001";
|
|
//globalUrl = "http://localhost:5002"
|
|
}
|
|
|
|
// Development on Github Codespaces
|
|
if (globalUrl.includes("app.github.dev")) {
|
|
//globalUrl = globalUrl.replace("3000", "5001")
|
|
globalUrl = "https://frikky-shuffle-5gvr4xx62w64-5001.preview.app.github.dev"
|
|
}
|
|
//console.log("global: ", globalUrl)
|
|
|
|
const App = (message, props) => {
|
|
|
|
const [userdata, setUserData] = useState({});
|
|
const [notifications, setNotifications] = useState([])
|
|
const [cookies, setCookie, removeCookie] = useCookies([])
|
|
const [isLoggedIn, setIsLoggedIn] = useState(false)
|
|
const [dataset, setDataset] = useState(false)
|
|
const [isLoaded, setIsLoaded] = useState(false)
|
|
const [curpath, setCurpath] = useState(typeof window === "undefined" || window.location === undefined ? "" : window.location.pathname)
|
|
|
|
|
|
useEffect(() => {
|
|
if (dataset === false) {
|
|
getUserNotifications();
|
|
checkLogin();
|
|
setDataset(true);
|
|
}
|
|
}, []);
|
|
|
|
if (
|
|
isLoaded &&
|
|
!isLoggedIn &&
|
|
!window.location.pathname.startsWith("/login") &&
|
|
!window.location.pathname.startsWith("/docs") &&
|
|
!window.location.pathname.startsWith("/support") &&
|
|
!window.location.pathname.startsWith("/detectionframework") &&
|
|
!window.location.pathname.startsWith("/appframework") &&
|
|
!window.location.pathname.startsWith("/adminsetup") &&
|
|
!window.location.pathname.startsWith("/usecases")
|
|
) {
|
|
window.location = "/login";
|
|
}
|
|
|
|
const getUserNotifications = () => {
|
|
fetch(`${globalUrl}/api/v1/users/notifications`, {
|
|
credentials: "include",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
cors: "cors",
|
|
})
|
|
.then((response) => response.json())
|
|
.then((responseJson) => {
|
|
if (
|
|
responseJson.success === true &&
|
|
responseJson.notifications !== null &&
|
|
responseJson.notifications !== undefined &&
|
|
responseJson.notifications.length > 0
|
|
) {
|
|
//console.log("RESP: ", responseJson)
|
|
setNotifications(responseJson.notifications);
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log("Failed getting notifications for user: ", error);
|
|
});
|
|
};
|
|
|
|
const checkLogin = () => {
|
|
var baseurl = globalUrl;
|
|
fetch(`${globalUrl}/api/v1/getinfo`, {
|
|
credentials: "include",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
})
|
|
.then((response) => response.json())
|
|
.then((responseJson) => {
|
|
var userInfo = {};
|
|
if (responseJson.success === true) {
|
|
//console.log("USER: ", responseJson);
|
|
|
|
userInfo = responseJson;
|
|
setIsLoggedIn(true);
|
|
//console.log("Cookies: ", cookies)
|
|
// Updating cookie every request
|
|
for (var key in responseJson["cookies"]) {
|
|
setCookie(
|
|
responseJson["cookies"][key].key,
|
|
responseJson["cookies"][key].value,
|
|
{ path: "/" }
|
|
);
|
|
}
|
|
}
|
|
|
|
// Handling Ethereum update
|
|
{/*
|
|
detectEthereumProvider().then((provider) => {
|
|
if (
|
|
provider &&
|
|
userInfo.eth_info !== undefined &&
|
|
userInfo.eth_info !== null
|
|
) {
|
|
if (
|
|
userInfo.eth_info.account !== undefined &&
|
|
userInfo.eth_info.account !== null &&
|
|
userInfo.eth_info.account.length === 0
|
|
) {
|
|
userInfo.eth_info = {};
|
|
var method = "eth_requestAccounts";
|
|
var params = [];
|
|
provider
|
|
.request({
|
|
method: method,
|
|
params,
|
|
})
|
|
.then((result) => {
|
|
if (
|
|
result !== undefined &&
|
|
result !== null &&
|
|
result.length > 0
|
|
) {
|
|
userInfo.eth_info.account = result[0];
|
|
|
|
// Getting and setting balance for the current user
|
|
method = "eth_getBalance";
|
|
params = [userInfo.eth_info.account, "latest"];
|
|
provider
|
|
.request({
|
|
method: method,
|
|
params,
|
|
})
|
|
.then((result) => {
|
|
if (
|
|
result !== undefined &&
|
|
result !== null &&
|
|
result.length > 0
|
|
) {
|
|
userInfo.parsed_balance =
|
|
result / 1000000000000000000;
|
|
} else {
|
|
alert.error("Couldn't find balance: ", result);
|
|
}
|
|
// The result varies by RPC method.
|
|
// For example, this method will return a transaction hash hexadecimal string on success.
|
|
})
|
|
.catch((error) => {
|
|
// If the request fails, the Promise will reject with an error.
|
|
alert.error(
|
|
"Failed getting info from ethereum API: " + error
|
|
);
|
|
});
|
|
} else {
|
|
alert.error("Couldn't find any user: ", result);
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
// If the request fails, the Promise will reject with an error.
|
|
alert.error(
|
|
"Failed getting info from ethereum API: " + error
|
|
);
|
|
});
|
|
}
|
|
|
|
// Register hooks here
|
|
provider.on("message", (event) => {
|
|
alert.info("Message from MetaMask: ", event);
|
|
});
|
|
|
|
provider.on("chainChanged", (chainId) => {
|
|
console.log("Changed chain to: ", chainId);
|
|
|
|
method = "eth_getBalance";
|
|
params = [userInfo.eth_info.account, "latest"];
|
|
provider
|
|
.request({
|
|
method: method,
|
|
params,
|
|
})
|
|
.then((result) => {
|
|
console.log("Got result: ", result);
|
|
if (result !== undefined && result !== null) {
|
|
userInfo.eth_info.balance = result;
|
|
userInfo.eth_info.parsed_balance =
|
|
result / 1000000000000000000;
|
|
console.log("INFO: ", userInfo);
|
|
setUserData(userInfo);
|
|
} else {
|
|
alert.error("Couldn't find balance: ", result);
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
// If the request fails, the Promise will reject with an error.
|
|
alert.error(
|
|
"Failed getting info from ethereum API: " + error
|
|
);
|
|
});
|
|
});
|
|
}
|
|
});
|
|
|
|
if (
|
|
userInfo.eth_info !== undefined &&
|
|
userInfo.eth_info.balance !== undefined
|
|
) {
|
|
//console.log(userInfo.eth_info.balance)
|
|
userInfo.eth_info.parsed_balance =
|
|
userInfo.eth_info.balance / 1000000000000000000;
|
|
}
|
|
*/}
|
|
|
|
//console.log("USER: ", userInfo)
|
|
setUserData(userInfo);
|
|
setIsLoaded(true);
|
|
})
|
|
.catch((error) => {
|
|
setIsLoaded(true);
|
|
});
|
|
};
|
|
|
|
// Dumb for content load (per now), but good for making the site not suddenly reload parts (ajax thingies)
|
|
|
|
const options = {
|
|
timeout: 9000,
|
|
position: positions.BOTTOM_LEFT,
|
|
};
|
|
|
|
const handleFirstInteraction = (event) => {
|
|
console.log("First interaction: ", event)
|
|
}
|
|
|
|
const includedData =
|
|
window.location.pathname === "/home" ||
|
|
window.location.pathname === "/features" ? (
|
|
<div>
|
|
<Routes>
|
|
<Route
|
|
exact
|
|
path="/home"
|
|
render={(props) => <LandingPageNew isLoaded={isLoaded} {...props} />}
|
|
/>
|
|
</Routes>
|
|
</div>
|
|
) : (
|
|
<div
|
|
style={{
|
|
backgroundColor: "#1F2023",
|
|
color: "rgba(255, 255, 255, 0.65)",
|
|
minHeight: "100vh",
|
|
}}
|
|
>
|
|
<ScrollToTop
|
|
getUserNotifications={getUserNotifications}
|
|
curpath={curpath}
|
|
setCurpath={setCurpath}
|
|
/>
|
|
{!isLoaded ? null :
|
|
userdata.chat_disabled === true ? null :
|
|
<Drift
|
|
appId="zfk9i7w3yizf"
|
|
attributes={{
|
|
name: userdata.username === undefined || userdata.username === null ? "OSS user" : `OSS ${userdata.username}`,
|
|
}}
|
|
eventHandlers={[
|
|
{
|
|
event: "conversation:firstInteraction",
|
|
function: handleFirstInteraction
|
|
},
|
|
]}
|
|
/>
|
|
}
|
|
<Header
|
|
notifications={notifications}
|
|
setNotifications={setNotifications}
|
|
checkLogin={checkLogin}
|
|
cookies={cookies}
|
|
removeCookie={removeCookie}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
isLoggedIn={isLoggedIn}
|
|
userdata={userdata}
|
|
{...props}
|
|
/>
|
|
{/*
|
|
<div style={{ height: 60 }} />
|
|
*/}
|
|
<Routes>
|
|
<Route
|
|
exact
|
|
path="/login"
|
|
element={
|
|
<LoginPage
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
checkLogin={checkLogin}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/admin"
|
|
element={
|
|
<Admin
|
|
userdata={userdata}
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
checkLogin={checkLogin}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route exact path="/search" element={<Search serverside={false} isLoaded={isLoaded} userdata={userdata} globalUrl={globalUrl} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor} {...props} /> } />
|
|
<Route
|
|
exact
|
|
path="/admin/:key"
|
|
element={
|
|
<Admin
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
{userdata.id !== undefined ? (
|
|
<Route
|
|
exact
|
|
path="/settings"
|
|
element={
|
|
<SettingsPage
|
|
isLoaded={isLoaded}
|
|
setUserData={setUserData}
|
|
userdata={userdata}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
) : null}
|
|
<Route
|
|
exact
|
|
path="/AdminSetup"
|
|
element={
|
|
<AdminSetup
|
|
isLoaded={isLoaded}
|
|
userdata={userdata}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/detectionframework"
|
|
element={
|
|
<FrameworkWrapper
|
|
selectedOption={"Draw"}
|
|
showOptions={false}
|
|
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/app"
|
|
element={
|
|
<FrameworkWrapper
|
|
selectedOption={"Draw"}
|
|
showOptions={false}
|
|
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/usecases"
|
|
element={
|
|
<Dashboard
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/apps/new"
|
|
element={
|
|
<AppCreator
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/apps"
|
|
element={
|
|
<Apps
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
userdata={userdata}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/apps/edit/:appid"
|
|
element={
|
|
<AppCreator
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/workflows"
|
|
element={
|
|
<Workflows
|
|
checkLogin={checkLogin}
|
|
cookies={cookies}
|
|
removeCookie={removeCookie}
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
cookies={cookies}
|
|
userdata={userdata}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/getting-started"
|
|
element={
|
|
<GettingStarted
|
|
cookies={cookies}
|
|
removeCookie={removeCookie}
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
cookies={cookies}
|
|
userdata={userdata}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/workflows/:key"
|
|
element={
|
|
<AngularWorkflow
|
|
alert={alert}
|
|
userdata={userdata}
|
|
globalUrl={globalUrl}
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route exact path="/workflows/:key/run" element={<RunWorkflow userdata={userdata} globalUrl={globalUrl} isLoaded={isLoaded} isLoggedIn={isLoggedIn} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor}{...props} /> } />
|
|
<Route exact path="/workflows/:key/execute" element={<RunWorkflow userdata={userdata} globalUrl={globalUrl} isLoaded={isLoaded} isLoggedIn={isLoggedIn} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor}{...props} /> } />
|
|
<Route
|
|
exact
|
|
path="/docs/:key"
|
|
element={
|
|
<Docs
|
|
isMobile={isMobile}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/docs"
|
|
element={
|
|
//navigate(`/docs/about`)
|
|
<Docs
|
|
isMobile={isMobile}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/support"
|
|
element={
|
|
//navigate(`/docs/about`)
|
|
<Docs
|
|
isMobile={isMobile}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/introduction"
|
|
element={
|
|
<Introduction
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/introduction/:key"
|
|
element={
|
|
<Introduction
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/set_authentication"
|
|
element={
|
|
<SetAuthentication
|
|
userdata={userdata}
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/login_sso"
|
|
element={
|
|
<SetAuthenticationSSO
|
|
userdata={userdata}
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/keepalive"
|
|
element={
|
|
<KeepAlive
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/testdashboard"
|
|
element={
|
|
<DashboardPage
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/dashboards"
|
|
element={
|
|
<DashboardView
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/welcome"
|
|
element={
|
|
<Welcome
|
|
cookies={cookies}
|
|
removeCookie={removeCookie}
|
|
isLoaded={isLoaded}
|
|
isLoggedIn={isLoggedIn}
|
|
globalUrl={globalUrl}
|
|
cookies={cookies}
|
|
userdata={userdata}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
<Route
|
|
exact
|
|
path="/"
|
|
element={
|
|
<LoginPage
|
|
isLoggedIn={isLoggedIn}
|
|
setIsLoggedIn={setIsLoggedIn}
|
|
register={true}
|
|
isLoaded={isLoaded}
|
|
globalUrl={globalUrl}
|
|
setCookie={setCookie}
|
|
cookies={cookies}
|
|
{...props}
|
|
/>
|
|
}
|
|
/>
|
|
</Routes>
|
|
</div>
|
|
);
|
|
|
|
// <div style={{backgroundColor: "rgba(21, 32, 43, 1)", color: "#fffff", minHeight: "100vh"}}>
|
|
// backgroundColor: "#213243",
|
|
// This is a mess hahahah
|
|
return (
|
|
<MuiThemeProvider theme={theme}>
|
|
<CookiesProvider>
|
|
<BrowserRouter>
|
|
<Provider template={AlertTemplate} {...options}>
|
|
{includedData}
|
|
</Provider>
|
|
</BrowserRouter>
|
|
</CookiesProvider>
|
|
</MuiThemeProvider>
|
|
);
|
|
};
|
|
|
|
export default App;
|