mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-10-16 03:31:29 +08:00
Merge pull request #4 from pranay01/pranay
Adding signup page in frontend
This commit is contained in:
Ankit Nayan
GitHub
commit
1f0d7efae2
1
frontend/public/SigNoz-dark.svg
Normal file
1
frontend/public/SigNoz-dark.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 565.65 130.02"><defs><style>.cls-1{fill:#17181a;}.cls-2{fill:#f15931;}.cls-3{fill:#f9f2f8;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M157.17,97.54q-7.86-7.79-7.85-21.71h17.22q0,6.58,3.35,10.32t9.31,3.73h14.06a15.93,15.93,0,0,0,9.05-2.34,7.22,7.22,0,0,0,3.48-6.27V77q0-6.21-9.12-7.73l-23.29-3.92Q162,63.42,156.09,58A17.81,17.81,0,0,1,150.2,44.3V37.21a20.09,20.09,0,0,1,3.61-11.84,23.11,23.11,0,0,1,10.26-7.92,39.67,39.67,0,0,1,15.38-2.78h14.31a30.14,30.14,0,0,1,14.56,3.42,24.37,24.37,0,0,1,9.82,9.56,28.37,28.37,0,0,1,3.48,14.24H204.4a12.27,12.27,0,0,0-2.92-8.55,9.89,9.89,0,0,0-7.72-3.22H179.45a14.51,14.51,0,0,0-8.54,2.28,7.05,7.05,0,0,0-3.23,6.07v3.42q0,6.33,8.73,7.85l23.18,4q11.52,2,17.6,7.16a16.52,16.52,0,0,1,6.07,13.23v8.36a19.86,19.86,0,0,1-3.73,11.9,24.08,24.08,0,0,1-10.45,8,39.54,39.54,0,0,1-15.57,2.85H179Q165,105.33,157.17,97.54Z"/><path class="cls-1" d="M237.89,32.33a9.93,9.93,0,0,1-3-7.53,10,10,0,0,1,3-7.54,12.42,12.42,0,0,1,15.83,0,10,10,0,0,1,3,7.54,10,10,0,0,1-3,7.53,12.42,12.42,0,0,1-15.83,0Zm-.7,8.8h17.22v63.19H237.19Z"/><path class="cls-1" d="M279.1,124.26a21.43,21.43,0,0,1-7.47-15.13h17a6.41,6.41,0,0,0,2.28,4.49,7.58,7.58,0,0,0,5.06,1.71h11.4a7.65,7.65,0,0,0,6.39-3.23,13.46,13.46,0,0,0,2.47-8.42v-6a18.47,18.47,0,0,1-6.14,4.43,16.59,16.59,0,0,1-6.9,1.65h-8.74q-11.52,0-18.55-6.84t-7-18V66.08a27.41,27.41,0,0,1,3.3-13.62,22.83,22.83,0,0,1,9.24-9.11,28.27,28.27,0,0,1,13.68-3.23h7.34a18.87,18.87,0,0,1,8.42,2,18.64,18.64,0,0,1,6.65,5.31V41.13h15.95v62.55a28.43,28.43,0,0,1-3.23,13.81,22.81,22.81,0,0,1-9.18,9.24A27.79,27.79,0,0,1,307.34,130h-11.4Q285.82,130,279.1,124.26Zm25.2-35a10.11,10.11,0,0,0,8.1-4,18.2,18.2,0,0,0,3.8-10.45V66.08A13.26,13.26,0,0,0,312.78,58a9.76,9.76,0,0,0-7.34-3h-8.86a9.5,9.5,0,0,0-7.6,3.42,13.4,13.4,0,0,0-2.91,9V77.73a12.55,12.55,0,0,0,2.65,8.35,8.55,8.55,0,0,0,6.84,3.17Z"/><path class="cls-1" d="M348.62,15.68h15.57L406.73,76V15.68h17.1v88.64H408.26L365.71,44v60.28H348.62Z"/><path class="cls-1" d="M449.34,102.23a22.51,22.51,0,0,1-9.49-8.8,25.45,25.45,0,0,1-3.36-13.17V65.44a25.42,25.42,0,0,1,3.42-13.23,23.29,23.29,0,0,1,9.56-8.93,30.5,30.5,0,0,1,14.12-3.16H475a30.5,30.5,0,0,1,14.12,3.16,23.35,23.35,0,0,1,9.56,8.93,25.42,25.42,0,0,1,3.42,13.23V80.26a25.1,25.1,0,0,1-3.42,13.17,23,23,0,0,1-9.56,8.8,31.14,31.14,0,0,1-14.24,3.1h-11.4A30.86,30.86,0,0,1,449.34,102.23ZM474.6,90.52a9.37,9.37,0,0,0,7.47-3.23,12.43,12.43,0,0,0,2.79-8.42V66.58a12.43,12.43,0,0,0-2.79-8.42,9.21,9.21,0,0,0-7.34-3.23H463.84a9.21,9.21,0,0,0-7.34,3.23,12.43,12.43,0,0,0-2.79,8.42V78.87a12.43,12.43,0,0,0,2.79,8.42,9.08,9.08,0,0,0,7.21,3.23Z"/><path class="cls-1" d="M506.89,95.71l34.19-40H508.41V41.13h57.24v8.61l-34.19,40H565v14.56H506.89Z"/><path class="cls-2" d="M61.1,119.86C27.16,119.86,0,93.22,0,59.93,0,27,27.16,0,61.1,0H99.46a22.17,22.17,0,0,1,22.4,22v38C121.86,93.22,94.71,119.86,61.1,119.86Z"/><path class="cls-3" d="M60.62,34C35.27,34,21,55,20.39,55.87a6.53,6.53,0,0,0,0,7.26C21,64,35.27,85,60.62,85s39.64-21,40.23-21.89a6.51,6.51,0,0,0,0-7.25C100.26,55,86,34,60.62,34ZM23.9,60.79a2.33,2.33,0,0,1,0-2.58c.48-.72,10.65-15.65,28.83-19.24a22,22,0,0,0,0,41.05C34.55,76.44,24.38,61.5,23.9,60.79ZM50.49,59.5a2.11,2.11,0,0,1-4.22,0A14.36,14.36,0,0,1,60.62,45.15a2.11,2.11,0,1,1,0,4.21A10.14,10.14,0,0,0,50.49,59.5Zm10.13,5.13a5.13,5.13,0,1,1,5.13-5.13A5.13,5.13,0,0,1,60.62,64.63Zm36.72-3.84C96.86,61.5,86.7,76.44,68.52,80a22,22,0,0,0,0-41C86.7,42.56,96.86,57.49,97.34,58.21A2.29,2.29,0,0,1,97.34,60.79Z"/></g></g></svg>
|
||||||
|
After Width: | Height: | Size: 3.5 KiB |
1
frontend/public/SigNoz-white.svg
Normal file
1
frontend/public/SigNoz-white.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 565.65 130.02"><defs><style>.cls-1{fill:#fff;}.cls-2{fill:#f15931;}.cls-3{fill:#f9f2f8;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M157.17,97.54q-7.86-7.79-7.85-21.71h17.22q0,6.58,3.35,10.32t9.31,3.73h14.06a15.93,15.93,0,0,0,9.05-2.34,7.22,7.22,0,0,0,3.48-6.27V77q0-6.21-9.12-7.73l-23.29-3.92Q162,63.42,156.09,58A17.81,17.81,0,0,1,150.2,44.3V37.21a20.09,20.09,0,0,1,3.61-11.84,23.11,23.11,0,0,1,10.26-7.92,39.67,39.67,0,0,1,15.38-2.78h14.31a30.14,30.14,0,0,1,14.56,3.42,24.37,24.37,0,0,1,9.82,9.56,28.37,28.37,0,0,1,3.48,14.24H204.4a12.27,12.27,0,0,0-2.92-8.55,9.89,9.89,0,0,0-7.72-3.22H179.45a14.51,14.51,0,0,0-8.54,2.28,7.05,7.05,0,0,0-3.23,6.07v3.42q0,6.33,8.73,7.85l23.18,4q11.52,2,17.6,7.16a16.52,16.52,0,0,1,6.07,13.23v8.36a19.86,19.86,0,0,1-3.73,11.9,24.08,24.08,0,0,1-10.45,8,39.54,39.54,0,0,1-15.57,2.85H179Q165,105.33,157.17,97.54Z"/><path class="cls-1" d="M237.89,32.33a9.93,9.93,0,0,1-3-7.53,10,10,0,0,1,3-7.54,12.42,12.42,0,0,1,15.83,0,10,10,0,0,1,3,7.54,10,10,0,0,1-3,7.53,12.42,12.42,0,0,1-15.83,0Zm-.7,8.8h17.22v63.19H237.19Z"/><path class="cls-1" d="M279.1,124.26a21.43,21.43,0,0,1-7.47-15.13h17a6.41,6.41,0,0,0,2.28,4.49,7.58,7.58,0,0,0,5.06,1.71h11.4a7.65,7.65,0,0,0,6.39-3.23,13.46,13.46,0,0,0,2.47-8.42v-6a18.47,18.47,0,0,1-6.14,4.43,16.59,16.59,0,0,1-6.9,1.65h-8.74q-11.52,0-18.55-6.84t-7-18V66.08a27.41,27.41,0,0,1,3.3-13.62,22.83,22.83,0,0,1,9.24-9.11,28.27,28.27,0,0,1,13.68-3.23h7.34a18.87,18.87,0,0,1,8.42,2,18.64,18.64,0,0,1,6.65,5.31V41.13h15.95v62.55a28.43,28.43,0,0,1-3.23,13.81,22.81,22.81,0,0,1-9.18,9.24A27.79,27.79,0,0,1,307.34,130h-11.4Q285.82,130,279.1,124.26Zm25.2-35a10.11,10.11,0,0,0,8.1-4,18.2,18.2,0,0,0,3.8-10.45V66.08A13.26,13.26,0,0,0,312.78,58a9.76,9.76,0,0,0-7.34-3h-8.86a9.5,9.5,0,0,0-7.6,3.42,13.4,13.4,0,0,0-2.91,9V77.73a12.55,12.55,0,0,0,2.65,8.35,8.55,8.55,0,0,0,6.84,3.17Z"/><path class="cls-1" d="M348.62,15.68h15.57L406.73,76V15.68h17.1v88.64H408.26L365.71,44v60.28H348.62Z"/><path class="cls-1" d="M449.34,102.23a22.51,22.51,0,0,1-9.49-8.8,25.45,25.45,0,0,1-3.36-13.17V65.44a25.42,25.42,0,0,1,3.42-13.23,23.29,23.29,0,0,1,9.56-8.93,30.5,30.5,0,0,1,14.12-3.16H475a30.5,30.5,0,0,1,14.12,3.16,23.35,23.35,0,0,1,9.56,8.93,25.42,25.42,0,0,1,3.42,13.23V80.26a25.1,25.1,0,0,1-3.42,13.17,23,23,0,0,1-9.56,8.8,31.14,31.14,0,0,1-14.24,3.1h-11.4A30.86,30.86,0,0,1,449.34,102.23ZM474.6,90.52a9.37,9.37,0,0,0,7.47-3.23,12.43,12.43,0,0,0,2.79-8.42V66.58a12.43,12.43,0,0,0-2.79-8.42,9.21,9.21,0,0,0-7.34-3.23H463.84a9.21,9.21,0,0,0-7.34,3.23,12.43,12.43,0,0,0-2.79,8.42V78.87a12.43,12.43,0,0,0,2.79,8.42,9.08,9.08,0,0,0,7.21,3.23Z"/><path class="cls-1" d="M506.89,95.71l34.19-40H508.41V41.13h57.24v8.61l-34.19,40H565v14.56H506.89Z"/><path class="cls-2" d="M61.1,119.86C27.16,119.86,0,93.22,0,59.93,0,27,27.16,0,61.1,0H99.46a22.17,22.17,0,0,1,22.4,22v38C121.86,93.22,94.71,119.86,61.1,119.86Z"/><path class="cls-3" d="M60.62,34C35.27,34,21,55,20.39,55.87a6.53,6.53,0,0,0,0,7.26C21,64,35.27,85,60.62,85s39.64-21,40.23-21.89a6.51,6.51,0,0,0,0-7.25C100.26,55,86,34,60.62,34ZM23.9,60.79a2.33,2.33,0,0,1,0-2.58c.48-.72,10.65-15.65,28.83-19.24a22,22,0,0,0,0,41.05C34.55,76.44,24.38,61.5,23.9,60.79ZM50.49,59.5a2.11,2.11,0,0,1-4.22,0A14.36,14.36,0,0,1,60.62,45.15a2.11,2.11,0,1,1,0,4.21A10.14,10.14,0,0,0,50.49,59.5Zm10.13,5.13a5.13,5.13,0,1,1,5.13-5.13A5.13,5.13,0,0,1,60.62,64.63Zm36.72-3.84C96.86,61.5,86.7,76.44,68.52,80a22,22,0,0,0,0-41C86.7,42.56,96.86,57.49,97.34,58.21A2.29,2.29,0,0,1,97.34,60.79Z"/></g></g></svg>
|
||||||
|
After Width: | Height: | Size: 3.5 KiB |
@ -1,16 +1,10 @@
|
|||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
export default axios.create({
|
export default axios.create({
|
||||||
|
// baseURL: 'http://104.211.113.204:8080/api/v1/',
|
||||||
// baseURL: 'http://104.211.113.204:8080/api/v1/',
|
|
||||||
|
|
||||||
// baseURL: 'http://localhost:3000/api/v1/',
|
|
||||||
|
|
||||||
|
|
||||||
// baseURL: 'http://104.211.113.204:8080/api/v1/',
|
|
||||||
// baseURL: process.env.REACT_APP_QUERY_SERVICE_URL,
|
// baseURL: process.env.REACT_APP_QUERY_SERVICE_URL,
|
||||||
baseURL: '/api/v1/',
|
|
||||||
// console.log('in metrics API', process.env.QUERY_SERVICE_URL)
|
// console.log('in metrics API', process.env.QUERY_SERVICE_URL)
|
||||||
|
baseURL: '/api/v1/',
|
||||||
|
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
16
frontend/src/api/submitForm.js
Normal file
16
frontend/src/api/submitForm.js
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
export default axios.create({
|
||||||
|
// baseURL: 'https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/',
|
||||||
|
// baseURL: 'http://104.211.113.204:8080/api/v1/',
|
||||||
|
baseURL: '/api/v1/',
|
||||||
|
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/sendMessage?chat_id=351813222&text=Hello%20there
|
||||||
|
|
||||||
|
// Chat ID can be obtained from here
|
||||||
|
//https://api.telegram.org/bot1518273960:AAHcgVvym9a0Qkl-PKiCI84X1VZaVbkTud0/getUpdates
|
||||||
@ -2,13 +2,11 @@ import axios from 'axios';
|
|||||||
//import { format } from 'path';
|
//import { format } from 'path';
|
||||||
|
|
||||||
export default axios.create({
|
export default axios.create({
|
||||||
// baseURL: 'http://104.211.113.204:8080/api/v1/'
|
// baseURL: 'http://104.211.113.204:8080/api/v1/' //comment this line and remove this comment before pushing
|
||||||
|
|
||||||
// baseURL: 'http://localhost:3000/api/v1/', // toggle to this before pushing
|
|
||||||
|
|
||||||
// baseURL: process.env.QUERY_SERVICE_URL,
|
// baseURL: process.env.QUERY_SERVICE_URL,
|
||||||
// console.log('in traces API', process.env.QUERY_SERVICE_URL)
|
// console.log('in traces API', process.env.QUERY_SERVICE_URL)
|
||||||
baseURL: '/api/v1/',
|
baseURL: '/api/v1/',
|
||||||
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@ -27,6 +27,8 @@ const TraceDetail = React.lazy(() => import('./traces/TraceDetail'));
|
|||||||
const TraceGraph = React.lazy(() => import ('./traces/TraceGraphDef' ));
|
const TraceGraph = React.lazy(() => import ('./traces/TraceGraphDef' ));
|
||||||
const UsageExplorer = React.lazy(() => import ('./usage/UsageExplorerDef' ));
|
const UsageExplorer = React.lazy(() => import ('./usage/UsageExplorerDef' ));
|
||||||
const ServicesTable = React.lazy(() => import('./metrics/ServicesTableDef'));
|
const ServicesTable = React.lazy(() => import('./metrics/ServicesTableDef'));
|
||||||
|
// const Signup = React.lazy(() => import('./Signup'));
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//PNOTE
|
//PNOTE
|
||||||
@ -54,6 +56,7 @@ const App = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Router basename="/">
|
<Router basename="/">
|
||||||
|
|
||||||
<Layout style={{ minHeight: '100vh' }}>
|
<Layout style={{ minHeight: '100vh' }}>
|
||||||
<Sider collapsible collapsed={collapsed} onCollapse={onCollapse} width={160}>
|
<Sider collapsible collapsed={collapsed} onCollapse={onCollapse} width={160}>
|
||||||
<div className="logo">
|
<div className="logo">
|
||||||
@ -98,7 +101,9 @@ const App = () => {
|
|||||||
<Route path="/traces" exact component={TraceDetail}/>
|
<Route path="/traces" exact component={TraceDetail}/>
|
||||||
<Route path="/traces/:id" component={TraceGraph}/>
|
<Route path="/traces/:id" component={TraceGraph}/>
|
||||||
<Route path="/usage-explorer" component={UsageExplorer}/>
|
<Route path="/usage-explorer" component={UsageExplorer}/>
|
||||||
<Route path="/" component={ServicesTable}/>
|
<Route path="/" component={ServicesTable}/>
|
||||||
|
<Route path="/application" exact component={ServicesTable}/>
|
||||||
|
{/* <Route path="/signup" component={Signup} /> */}
|
||||||
|
|
||||||
</Switch>
|
</Switch>
|
||||||
</Suspense>
|
</Suspense>
|
||||||
|
|||||||
53
frontend/src/components/AppWrapper.tsx
Normal file
53
frontend/src/components/AppWrapper.tsx
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
import React,{Suspense, useState} from 'react';
|
||||||
|
import {Spin} from 'antd';
|
||||||
|
|
||||||
|
|
||||||
|
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
|
||||||
|
|
||||||
|
|
||||||
|
const Signup = React.lazy(() => import('./Signup'));
|
||||||
|
const App = React.lazy(() => import('./App'));
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const AppWrapper = () => {
|
||||||
|
|
||||||
|
const [isUserAuthenticated, setIsUserAuthenticated] = useState(false);
|
||||||
|
|
||||||
|
return(
|
||||||
|
|
||||||
|
<Router basename="/">
|
||||||
|
|
||||||
|
<Suspense fallback={<Spin size="large" />}>
|
||||||
|
<Switch>
|
||||||
|
<Route path="/signup" exact component={Signup} />
|
||||||
|
<Route path="/application" exact component={App} />
|
||||||
|
<Route path="/application/:servicename" component={App}/>
|
||||||
|
<Route path="/service-map" component={App}/>
|
||||||
|
<Route path="/traces" exact component={App}/>
|
||||||
|
<Route path="/traces/:id" component={App}/>
|
||||||
|
<Route path="/usage-explorer" component={App}/>
|
||||||
|
|
||||||
|
<Route path="/" exact
|
||||||
|
render={() => {
|
||||||
|
return (
|
||||||
|
localStorage.getItem('isLoggedIn')==='yes' ?
|
||||||
|
<Redirect to="/application" /> :
|
||||||
|
<Redirect to="/signup" />
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
|
||||||
|
/>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</Switch>
|
||||||
|
</Suspense>
|
||||||
|
|
||||||
|
</Router>
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AppWrapper;
|
||||||
235
frontend/src/components/Signup.tsx
Normal file
235
frontend/src/components/Signup.tsx
Normal file
@ -0,0 +1,235 @@
|
|||||||
|
import React, { useState,useRef, Suspense } from 'react';
|
||||||
|
import { Row, Space, Button, Input, Checkbox } from 'antd'
|
||||||
|
import submitForm from '../api/submitForm';
|
||||||
|
import { withRouter } from "react-router";
|
||||||
|
import { RouteComponentProps } from 'react-router-dom';
|
||||||
|
|
||||||
|
|
||||||
|
interface SignUpProps extends RouteComponentProps<any> {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
const Signup = (props:SignUpProps) => {
|
||||||
|
|
||||||
|
const [state, setState] = useState({ submitted: false })
|
||||||
|
const [formState, setFormState] = useState({
|
||||||
|
firstName: {value:''},
|
||||||
|
companyName: {value:''},
|
||||||
|
email: {value:''},
|
||||||
|
password: {value:'',valid:true},
|
||||||
|
emailOptIn: { value: true },
|
||||||
|
})
|
||||||
|
const passwordInput = useRef(null)
|
||||||
|
// const { createAccount } = useActions(signupLogic)
|
||||||
|
// const { accountLoading } = useValues(signupLogic)
|
||||||
|
// const { plan } = fromParams()
|
||||||
|
|
||||||
|
const updateForm = (name:any, target:any, valueAttr = 'value') => {
|
||||||
|
/* Validate password (if applicable) */
|
||||||
|
if (name === 'password') {
|
||||||
|
let password = target[valueAttr]
|
||||||
|
const valid = password.length >= 8
|
||||||
|
setFormState({ ...formState, password: { ...formState.password, valid, value: target[valueAttr] } })
|
||||||
|
} else
|
||||||
|
if (name === 'firstName') {
|
||||||
|
|
||||||
|
setFormState({ ...formState, firstName: { ...formState.firstName, value: target[valueAttr] } })
|
||||||
|
} else
|
||||||
|
if (name === 'companyName') {
|
||||||
|
|
||||||
|
setFormState({ ...formState, companyName: { ...formState.companyName, value: target[valueAttr] } })
|
||||||
|
} else
|
||||||
|
if (name === 'email') {
|
||||||
|
|
||||||
|
setFormState({ ...formState, email: { ...formState.email, value: target[valueAttr] } })
|
||||||
|
} else
|
||||||
|
if (name === 'emailOptIn') {
|
||||||
|
|
||||||
|
setFormState({ ...formState, emailOptIn: { ...formState.emailOptIn, value: target[valueAttr] } })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleSubmit = (e:any) => {
|
||||||
|
e.preventDefault()
|
||||||
|
|
||||||
|
console.log('in handle submit');
|
||||||
|
|
||||||
|
setState({ ...state, submitted: true })
|
||||||
|
|
||||||
|
/* Password has custom validation */
|
||||||
|
if (!formState.password.valid) {
|
||||||
|
// if (passwordInput.current){
|
||||||
|
// passwordInput.current.focus()
|
||||||
|
// }
|
||||||
|
|
||||||
|
// return
|
||||||
|
}
|
||||||
|
const payload = {
|
||||||
|
first_name: formState.firstName,
|
||||||
|
company_name: formState.companyName || undefined,
|
||||||
|
email: formState.email,
|
||||||
|
password: formState.password,
|
||||||
|
email_opt_in: formState.emailOptIn.value,
|
||||||
|
// plan, // Pass it along if on QS, won't have any effect unless on multitenancy
|
||||||
|
}
|
||||||
|
// createAccount(payload)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// axios.get(`https://jsonplaceholder.typicode.com/users`)
|
||||||
|
// .then(res => {
|
||||||
|
// console.log(res);
|
||||||
|
// console.log(res.data);
|
||||||
|
// })
|
||||||
|
|
||||||
|
let texttolog = JSON.stringify(payload)
|
||||||
|
|
||||||
|
// submitForm.get('sendMessage', {
|
||||||
|
// params: {
|
||||||
|
// chat_id: 351813222,
|
||||||
|
// text:texttolog,
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// ).then(res => {
|
||||||
|
// console.log(res);
|
||||||
|
// console.log(res.data);
|
||||||
|
// })
|
||||||
|
|
||||||
|
|
||||||
|
submitForm.post('user?email='+texttolog
|
||||||
|
).then(res => {
|
||||||
|
console.log(res);
|
||||||
|
console.log(res.data);
|
||||||
|
})
|
||||||
|
|
||||||
|
localStorage.setItem('isLoggedIn', 'yes');
|
||||||
|
props.history.push('/application')
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="signup-form">
|
||||||
|
<Space direction="vertical" className="space-top" style={{ width: '100%', paddingLeft: 32 }}>
|
||||||
|
<h1 className="title" style={{ marginBottom: 0, marginTop: 40, display: 'flex', alignItems: 'center' }}>
|
||||||
|
{/* <img src={"Signoz-white.svg"} alt="" style={{ height: 60 }} /> */}
|
||||||
|
Create your account
|
||||||
|
</h1>
|
||||||
|
<div className="page-caption">Monitor your applications. Find what is causing issues.</div>
|
||||||
|
</Space>
|
||||||
|
<Row style={{ display: 'flex', justifyContent: 'center' }}>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'center', flexDirection: 'column' }}>
|
||||||
|
<img
|
||||||
|
src={"signoz.svg"}
|
||||||
|
style={{ maxHeight: '100%', maxWidth: 300, marginTop: 64 }}
|
||||||
|
alt=""
|
||||||
|
className="main-img"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'flex-start',
|
||||||
|
margin: '0 32px',
|
||||||
|
flexDirection: 'column',
|
||||||
|
paddingTop: 32,
|
||||||
|
maxWidth: '32rem',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<form onSubmit={handleSubmit}>
|
||||||
|
<div className="input-set">
|
||||||
|
<label htmlFor="signupEmail">Email</label>
|
||||||
|
<Input
|
||||||
|
placeholder="mike@netflix.com"
|
||||||
|
type="email"
|
||||||
|
value={formState.email.value}
|
||||||
|
onChange={(e) => updateForm('email', e.target)}
|
||||||
|
required
|
||||||
|
// disabled={accountLoading}
|
||||||
|
id="signupEmail"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className={`input-set ${state.submitted && !formState.password.valid ? 'errored' : ''}`}>
|
||||||
|
<label htmlFor="signupPassword">Password</label>
|
||||||
|
<Input.Password
|
||||||
|
value={formState.password.value}
|
||||||
|
onChange={(e) => updateForm('password', e.target)}
|
||||||
|
required
|
||||||
|
ref={passwordInput}
|
||||||
|
// disabled={accountLoading}
|
||||||
|
id="signupPassword"
|
||||||
|
/>
|
||||||
|
<Suspense fallback={<span />}>
|
||||||
|
{/* <PasswordStrength password={formState.password.value} /> */}
|
||||||
|
</Suspense>
|
||||||
|
{!formState.password && (
|
||||||
|
<span className="caption">Your password must have at least 8 characters.</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="input-set">
|
||||||
|
<label htmlFor="signupFirstName">First Name</label>
|
||||||
|
<Input
|
||||||
|
placeholder="Mike"
|
||||||
|
autoFocus
|
||||||
|
value={formState.firstName.value}
|
||||||
|
onChange={(e) => updateForm('firstName', e.target)}
|
||||||
|
required
|
||||||
|
// disabled={accountLoading}
|
||||||
|
id="signupFirstName"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="input-set">
|
||||||
|
<label htmlFor="signupCompanyName">Company or Project</label>
|
||||||
|
<Input
|
||||||
|
placeholder="Netflix"
|
||||||
|
value={formState.companyName.value}
|
||||||
|
onChange={(e) => updateForm('companyName', e.target)}
|
||||||
|
// disabled={accountLoading}
|
||||||
|
id="signupCompanyName"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<Checkbox
|
||||||
|
checked={formState.emailOptIn.value}
|
||||||
|
onChange={(e) => updateForm('emailOptIn', e.target, 'checked')}
|
||||||
|
// disabled={accountLoading}
|
||||||
|
>
|
||||||
|
Send me occasional emails about security and product updates. You may unsubscribe at any
|
||||||
|
time.
|
||||||
|
</Checkbox>
|
||||||
|
</div>
|
||||||
|
<div className="text-center space-top">
|
||||||
|
<Button
|
||||||
|
type="primary"
|
||||||
|
htmlType="submit"
|
||||||
|
data-attr="signup"
|
||||||
|
disabled={state.submitted && !formState.password}
|
||||||
|
// loading={accountLoading}
|
||||||
|
>
|
||||||
|
Get Started
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <div style={{ color: '#666666', marginBottom: 60, textAlign: 'center' }} className="space-top">
|
||||||
|
By clicking the button above you agree to our{' '}
|
||||||
|
<a href="https://signoz.io" target="_blank">
|
||||||
|
Terms of Service
|
||||||
|
</a>{' '}
|
||||||
|
and{' '}
|
||||||
|
<a href="https://signoz.io" target="_blank">
|
||||||
|
Privacy Policy
|
||||||
|
</a>
|
||||||
|
.
|
||||||
|
</div> */}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default withRouter(Signup);
|
||||||
@ -48,7 +48,8 @@ const ServiceGraph = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<div> Service Graph Component</div>
|
<div> Updated Service Graph module coming soon..</div>
|
||||||
|
|
||||||
<Graph
|
<Graph
|
||||||
graph={graph}
|
graph={graph}
|
||||||
options={options}
|
options={options}
|
||||||
@ -57,6 +58,7 @@ const ServiceGraph = () => {
|
|||||||
// // if you want access to vis.js network api you can set the state in a parent component using this property
|
// // if you want access to vis.js network api you can set the state in a parent component using this property
|
||||||
// }}
|
// }}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
);
|
);
|
||||||
|
|
||||||
@ -64,4 +66,6 @@ const ServiceGraph = () => {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default ServiceGraph;
|
export default ServiceGraph;
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -5,10 +5,11 @@ const ServiceMap = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<div>
|
<div> Service Map module coming soon...
|
||||||
<ServiceGraph />
|
{/* <ServiceGraph /> */}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
);
|
);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -4,11 +4,14 @@ import { Provider } from 'react-redux';
|
|||||||
import { createStore, applyMiddleware } from 'redux';
|
import { createStore, applyMiddleware } from 'redux';
|
||||||
import { ThemeSwitcherProvider } from "react-css-theme-switcher";
|
import { ThemeSwitcherProvider } from "react-css-theme-switcher";
|
||||||
import thunk from 'redux-thunk';
|
import thunk from 'redux-thunk';
|
||||||
|
// import { NavLink, BrowserRouter as Router, Route, Switch } from 'react-router-dom';
|
||||||
|
|
||||||
|
|
||||||
import App from './components/App';
|
|
||||||
|
import AppWrapper from './components/AppWrapper';
|
||||||
import './assets/index.css';
|
import './assets/index.css';
|
||||||
import { reducers } from './reducers';
|
import { reducers } from './reducers';
|
||||||
|
// import Signup from './components/Signup';
|
||||||
|
|
||||||
const store = createStore(reducers, applyMiddleware(thunk))
|
const store = createStore(reducers, applyMiddleware(thunk))
|
||||||
|
|
||||||
@ -21,7 +24,9 @@ ReactDOM.render(
|
|||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<React.StrictMode>
|
<React.StrictMode>
|
||||||
<ThemeSwitcherProvider themeMap={themes} defaultTheme="dark">
|
<ThemeSwitcherProvider themeMap={themes} defaultTheme="dark">
|
||||||
<App />
|
|
||||||
|
<AppWrapper />
|
||||||
|
{/* <App /> */}
|
||||||
</ThemeSwitcherProvider>
|
</ThemeSwitcherProvider>
|
||||||
</React.StrictMode>
|
</React.StrictMode>
|
||||||
</Provider>,
|
</Provider>,
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user